Commit 263dcac6d85effcc6f97824bc6bc03a86122b31f
Add a visually-hidden <hr> at the end of each <section>
This improves the layout's clarity in text-mode browsers that don't render sections clearly, e.g. links.Greg K Nicholson committed on 2/16/2018, 11:38:42 AM
Parent: df0e7a9773f81ffdb5ca791b59efe420377ce1bf
Files changed
| themes/ran/static/style/ran.css | ||
|---|---|---|
| @@ -62,9 +62,15 @@ | ||
| 62 | 62 … | body > * { |
| 63 | 63 … | grid-column: 3/4; |
| 64 | 64 … | } |
| 65 | 65 … | |
| 66 … | +.visuallyhidden { | |
| 67 … | + position: absolute !important; | |
| 68 … | + top: -9999em !important; | |
| 69 … | + left: -9999em !important; | |
| 70 … | +} | |
| 66 | 71 … | |
| 72 … | + | |
| 67 | 73 … | /* Top and bottom navigation, article footer */ |
| 68 | 74 … | |
| 69 | 75 … | .topnav { |
| 70 | 76 … | margin-top: 10vh; |
| @@ -144,8 +150,9 @@ | ||
| 144 | 150 … | width: auto; |
| 145 | 151 … | opacity: 1; |
| 146 | 152 … | } |
| 147 | 153 … | |
| 154 … | + | |
| 148 | 155 … | /* Nearby pages */ |
| 149 | 156 … | |
| 150 | 157 … | nav.nearby { |
| 151 | 158 … | display: block; |
| themes/ran/templates/archives.html | ||
|---|---|---|
| @@ -13,8 +13,9 @@ | ||
| 13 | 13 … | </a> |
| 14 | 14 … | </li> |
| 15 | 15 … | {%- endfor -%} |
| 16 | 16 … | </ul> |
| 17 … | + <hr class="visuallyhidden"> | |
| 17 | 18 … | </section> |
| 18 | 19 … | <section class="smalllinks"> |
| 19 | 20 … | <h2>Labels:</h2> |
| 20 | 21 … | <ul> |
| @@ -27,7 +28,8 @@ | ||
| 27 | 28 … | </li> |
| 28 | 29 … | {%- endif -%} |
| 29 | 30 … | {%- endfor -%} |
| 30 | 31 … | </ul> |
| 32 … | + <hr class="visuallyhidden"> | |
| 31 | 33 … | </section> |
| 32 | 34 … | {%- endblock -%} |
| 33 | 35 … | |
| themes/ran/templates/article.html | ||
|---|---|---|
| @@ -118,8 +118,9 @@ | ||
| 118 | 118 … | </li> |
| 119 | 119 … | {%- endfor -%} |
| 120 | 120 … | {%- endfor -%} |
| 121 | 121 … | </ul> |
| 122 … | + <hr class="visuallyhidden"> | |
| 122 | 123 … | </section> |
| 123 | 124 … | {%- endif -%} |
| 124 | 125 … | </footer> |
| 125 | 126 … | {%- endif -%} |
| themes/ran/templates/base.html | ||
|---|---|---|
| @@ -43,8 +43,9 @@ | ||
| 43 | 43 … | </a> |
| 44 | 44 … | {%- endblock -%} |
| 45 | 45 … | </nav> |
| 46 | 46 … | {%- endblock -%} |
| 47 … | + <hr class="visuallyhidden"> | |
| 47 | 48 … | </section> |
| 48 | 49 … | {%- block main -%} |
| 49 | 50 … | <header> |
| 50 | 51 … | {%- block pagetitle -%} |
| @@ -63,8 +64,9 @@ | ||
| 63 | 64 … | {{- AUTHOR -}} |
| 64 | 65 … | </a> |
| 65 | 66 … | </address> |
| 66 | 67 … | {%- endblock -%} |
| 68 … | + <hr class="visuallyhidden"> | |
| 67 | 69 … | </section> |
| 68 | 70 … | </details> |
| 69 | 71 … | {%- block maincontentintro -%} |
| 70 | 72 … | {%- endblock -%} |
| @@ -85,8 +87,9 @@ | ||
| 85 | 87 … | <nav> |
| 86 | 88 … | {{- self.logo() -}} |
| 87 | 89 … | </nav> |
| 88 | 90 … | {%- endblock -%} |
| 91 … | + <hr class="visuallyhidden"> | |
| 89 | 92 … | </section> |
| 90 | 93 … | </body> |
| 91 | 94 … | </html> |
| 92 | 95 … | |
| themes/ran/templates/period_archives.html | |||
|---|---|---|---|
| @@ -30,8 +30,9 @@ | |||
| 30 | 30 … | </a> | |
| 31 | 31 … | </li> | |
| 32 | 32 … | {%- endfor -%} | |
| 33 | 33 … | </ul> | |
| 34 … | + <hr class="visuallyhidden"> | ||
| 34 | 35 … | </section> | |
| 35 | 36 … | {%- elif period | length == 2 and | |
| 36 | 37 … | dates | unique(attribute="date.day") | list | length > 1 -%} | |
| 37 | 38 … | <section class="smalllinks"> | |
| @@ -51,8 +52,9 @@ | |||
| 51 | 52 … | </a> | |
| 52 | 53 … | </li> | |
| 53 | 54 … | {%- endfor -%} | |
| 54 | 55 … | </ul> | |
| 56 … | + <hr class="visuallyhidden"> | ||
| 55 | 57 … | </section> | |
| 56 | 58 … | {%- endif -%} | |
| 57 | 59 … | {%- endblock -%} | |
| 58 | 60 … | {%- block maincontent -%} | |
Built with git-ssb-web