Fix images for txt

3 files changed, 65 insertions, 47 deletions

diff --git a/assets/scss/_main.scss b/assets/scss/_main.scss
index b7c235a..0327543 100644
--- a/assets/scss/_main.scss
+++ b/assets/scss/_main.scss
@@ -61,9 +61,8 @@ article {
 	          img {
 		            display: block;
                 background-color: black;
-		            width: 16rem;
+		            width: 16rem; /* 16:9 for video */
 		            height: 9rem;
-                /* height: 22.55rem; */
 		            margin: 1rem auto;
 	          }
 	      }
diff --git a/assets/scss/_txt.scss b/assets/scss/_txt.scss
index de132e4..76cca30 100644
--- a/assets/scss/_txt.scss
+++ b/assets/scss/_txt.scss
@@ -25,4 +25,8 @@ body.txt {
             margin-top: auto;
         }
     }
+    article aside ul img { /* see _main */
+            height: 22.55rem; /* 1:1.41 for books */
+    }
+
 }
diff --git a/assets/scss/screen.scss b/assets/scss/screen.scss
index 6e6f060..a18c9b9 100644
--- a/assets/scss/screen.scss
+++ b/assets/scss/screen.scss
@@ -1,18 +1,70 @@
+/**
+ * Variables
+ **/
 @import 'variables';
+
+/**
+ * Fonts
+ **/
+@import 'fonts';
+
+/**
+ * Reset
+ **/
 @import 'normalize';
 @import 'skeleton';
+
+/**
+ * Defaults
+ **/
+
+a {
+    text-decoration: none;
+
+    &:link {
+	      color: $a-link;
+    }
+    &:hover {
+	      color: $a-hover;
+	      text-decoration: underline;
+    }
+    &:active {
+	      color: $a-active;
+    }
+    &:visited {
+	      color: $a-visited;
+    }
+}
+
+img {
+	  max-width: 100%;
+}
+
+@keyframes fade-in {
+    from {
+	      opacity: 0.2;
+    } to {
+	      opacity: 1;
+    }
+}
+@keyframes fade-out {
+    from {
+	      opacity: 1;
+    } to {
+	      opacity: 0.2;
+    }
+}
+
+/**
+ * Layout
+ **/
 @import 'header';
 @import 'main';
 @import 'aside';
 @import 'footer';
 
 /**
- * Fonts
- **/
-@import 'fonts';
-
-/**
- * Pages
+ * Page overrides
  **/
 @import 'gfx';
 @import 'txt';
@@ -40,27 +92,9 @@ html[lang='fr'] :lang(en) {
 }
 
 /**
- * Defaults
+ * Branding
  **/
 
-a {
-    text-decoration: none;
-
-    &:link {
-	      color: $a-link;
-    }
-    &:hover {
-	      color: $a-hover;
-	      text-decoration: underline;
-    }
-    &:active {
-	      color: $a-active;
-    }
-    &:visited {
-	      color: $a-visited;
-    }
-}
-
 span.ps {
     background: url(../img/logo-ps.svg) top left / 3rem no-repeat;
     opacity: 0.75;
@@ -74,8 +108,7 @@ body {
 
     > header, > footer {
 	      :link, :visited {
-	          color: $fg-header-h1;
-	          text-decoration: none;
+	          color: $fg-main;
 	      }
     }
 
@@ -84,21 +117,3 @@ body {
     }
 }
 
-img {
-	  max-width: 100%;
-}
-
-@keyframes fade-in {
-    from {
-	      opacity: 0.2;
-    } to {
-	      opacity: 1;
-    }
-}
-@keyframes fade-out {
-    from {
-	      opacity: 1;
-    } to {
-	      opacity: 0.2;
-    }
-}