Index: includes/index/style.html |
=================================================================== |
new file mode 100644 |
--- /dev/null |
+++ b/includes/index/style.html |
@@ -0,0 +1,57 @@ |
+<style> |
+ |
+#media-links |
+{ |
+ text-align: center; |
+ list-style: none; |
+ padding: 0; |
+} |
+ |
+#media-links li |
+{ |
+ display: inline-block; |
+ position: relative; |
+ margin: 0px 10px 20px; |
+} |
+ |
+.publication-logo |
+{ |
+ max-height: 25px; |
+ max-width: 100%; |
+} |
+ |
+.external-link-icon |
+{ |
+ position: absolute; |
+ top: 50%; |
+ left: 50%; |
+ height: 20px; |
+ width: 20px; |
+ margin-left: -10px; |
+ margin-top: -12px; |
+ opacity: 0; |
+} |
+ |
+#media-links a:hover .external-link-icon, |
+#media-links a:focus .external-link-icon |
+{ |
+ opacity: 1; |
+} |
+ |
+#media-links a:hover .publication-logo, |
+#media-links a:focus .publication-logo |
+{ |
+ opacity: 0.2; |
+} |
+ |
+@media (max-width: 930px) and (min-width: 620px) |
+{ |
+ #media-links |
ire
2017/08/01 10:04:06
This is to force more than just one lone logo to a
juliandoucette
2017/08/02 20:31:13
NIT: Would you mind adding a comment to make this
|
+ { |
+ max-width: 600px; |
+ margin-right: auto; |
+ margin-left: auto; |
+ } |
+} |
+ |
+</style> |