theme: fix usage of <section> in attachments matcornic#88

patrick-othmer · Sep 13, 2021 · 6d96713 · 6d96713
1 parent 03205f9
commit 6d96713
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 45 deletions.
diff --git a/layouts/shortcodes/attachments.html b/layouts/shortcodes/attachments.html
@@ -1,36 +1,33 @@
-{{ $_hugo_config := `{ "version": 1 }` }}
-{{ $style := .Get "style" | default "neutral" }}
-{{ $title := .Get "title" | default ("Attachments-label" | T) }}
-{{ $sort := .Get "sort" | default "asc" }}
-<section class="attachments {{ $style }}">
-    <div class="label">{{ $title }}</div>
-    <div class="attachments-files">
-    {{- $filesName := "files" }}
-    {{- if ne .Page.File.BaseFileName "index" }}
-        {{- $filesName = printf "%s.files" .Page.File.BaseFileName }}
-    {{- end}}
+{{- $_hugo_config := `{ "version": 1 }` }}
+{{- $style := .Get "style" | default "neutral" }}
+{{- $title := .Get "title" | default ("Attachments-label" | T) }}
+{{- $sort := .Get "sort" | default "asc" }}
+<div class="attachments {{ $style }}">
+  <div class="label">{{ $title }}</div>
+  <ul class="attachments-files">
+  {{- $filesName := "files" }}
+  {{- if ne .Page.File.BaseFileName "index" }}
+    {{- $filesName = printf "%s.files" .Page.File.BaseFileName }}
+  {{- end}}
 
-    {{- $fileDir := replace .Page.File.Dir "\\" "/" }}
-    {{- $pattern := .Get "pattern" | default "" }}
-    {{- range sort (readDir (printf "content/%s%s" .Page.File.Dir $filesName) ) "Name" $sort }}
-        {{- if findRE $pattern .Name}}
-            {{- $size := .Size }}
-            {{- $unit := "Byte-symbol" }}
-            {{- if ge $size 1024 }}
-                {{- $size = div $size 1024 }}
-                {{- $unit = "Kilobyte-symbol" }}
-            {{- end }}
-            {{- if ge $size 1024 }}
-                {{- $size = div $size 1024 }}
-                {{- $unit = "Megabyte-symbol" }}
-            {{- end }}
-            {{- $unitsymbol := $unit | T }}
-        <li>
-            <a href="{{ (printf "%s%s/%s" $fileDir $filesName .Name) | relLangURL }}">{{.Name}}</a>
-            ({{$size}} {{$unitsymbol}})
-        </li>
-        {{- end }}
+  {{- $fileDir := replace .Page.File.Dir "\\" "/" }}
+  {{- $pattern := .Get "pattern" | default "" }}
+  {{- range sort (readDir (printf "content/%s%s" .Page.File.Dir $filesName) ) "Name" $sort }}
+    {{- if findRE $pattern .Name}}
+      {{- $size := .Size }}
+      {{- $unit := "Byte-symbol" }}
+      {{- if ge $size 1024 }}
+        {{- $size = div $size 1024 }}
+        {{- $unit = "Kilobyte-symbol" }}
+      {{- end }}
+      {{- if ge $size 1024 }}
+        {{- $size = div $size 1024 }}
+        {{- $unit = "Megabyte-symbol" }}
+      {{- end }}
+      {{- $unitsymbol := $unit | T }}
+    <li><a href="{{ (printf "%s%s/%s" $fileDir $filesName .Name) | relLangURL }}">{{.Name}}</a> ({{$size}} {{$unitsymbol}})</li>
     {{- end }}
-    </div>
-    {{- .Inner }}
-</section>
+  {{- end }}
+  </ul>
+  {{- .Inner }}
+</div>
diff --git a/static/css/theme.css b/static/css/theme.css
@@ -507,7 +507,7 @@ div.notices.tip > div.label:first-child:before {
 
 /* attachments shortcode */
 
-section.attachments {
+div.attachments {
     border-top-width: 2rem;
     border-top-style: solid;
     color: #505050;
@@ -519,59 +519,59 @@ section.attachments {
     padding-bottom: .1px;
 }
 
-section.attachments > div.label {
+div.attachments > div.label {
     color: #fff;
     font-weight: normal;
     margin-bottom: 1rem;
     margin-top: -1.75rem;
 }
 
-section.attachments > div.label:first-child:before {
+div.attachments > div.label:first-child:before {
     font-family: "Font Awesome 5 Free";
     font-weight: 900;
     margin-left: -.35rem;
     margin-right: .35rem;
     content: "\f0c6";
 }
 
-section.attachments .attachments-files {
+div.attachments .attachments-files {
     padding: 1rem;
     display: block;
     font-size: 1rem;
     margin-top: -1rem;
     margin-bottom: 0rem;
 }
 
-section.attachments.orange {
+div.attachments.orange {
     border-color: #BF8B44;
     background-color: #FFF2DB;
 }
 
-section.attachments.green {
+div.attachments.green {
     border-color: #5AA55A;
     background-color: #E6F9E6;
 }
 
-section.attachments.red {
+div.attachments.red {
     border-color: #D96A68;
     background-color: #FFEBEB;
 }
 
-section.attachments.blue {
+div.attachments.blue {
     border-color: #4897CC;
     background-color: #E9F5FD;
 }
 
-section.attachments.grey {
+div.attachments.grey {
     border-color: #505D65;
     background-color: #F4F4F4;
 }
 
-section.attachments.neutral {
+div.attachments.neutral {
     border-color: transparent;
     background-color: transparent;
 }
-section.attachments.neutral > div.label {
+div.attachments.neutral > div.label {
     color: #505050;
 }