diff --git a/assets/sass/_compact-list.scss b/assets/sass/_compact-list.scss new file mode 100644 index 0000000..14d76ee --- /dev/null +++ b/assets/sass/_compact-list.scss @@ -0,0 +1,34 @@ +.compact-list { + h3 {} + + .compact-list-items { + list-style: none; + + .compact-list-item { + $arrowWidth: 25px; + + display: grid; + grid-template-columns: $arrowWidth 1fr; + + &:not(:first-child) { + margin-bottom: 0.25rem; + } + + &:not(:last-child) { + margin-top: 0.25rem; + } + + .arrow { + display: flex; + flex-direction: column; + justify-content: center; + width: $arrowWidth; + } + + .link { + text-decoration: none; + font-size: 1.2rem; + } + } + } +} diff --git a/assets/sass/app.scss b/assets/sass/app.scss index b5d43e0..1285372 100644 --- a/assets/sass/app.scss +++ b/assets/sass/app.scss @@ -14,4 +14,5 @@ @import "footer"; // Component-specific styling -@import "list" +@import "compact-list"; +@import "list"; diff --git a/layouts/index.html b/layouts/index.html index 4a00120..10cabb6 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -3,29 +3,5 @@ {{ end }} {{ define "aside" }} -
-

Popular content

- -
+{{ partial "tag-compact-list" }} {{ end }} diff --git a/layouts/partials/generic-compact-list.html b/layouts/partials/generic-compact-list.html new file mode 100644 index 0000000..49f501c --- /dev/null +++ b/layouts/partials/generic-compact-list.html @@ -0,0 +1,14 @@ +{{ $title := index $ "title" }} +{{ $data := index $ "data" }} + +
+

{{ $title }}

+ +
diff --git a/layouts/partials/tag-compact-list.html b/layouts/partials/tag-compact-list.html new file mode 100644 index 0000000..9d51210 --- /dev/null +++ b/layouts/partials/tag-compact-list.html @@ -0,0 +1,8 @@ +{{ $pageType := "snippets" }} + +{{ $data := slice }} +{{ range first 5 site.Taxonomies.tags.ByCount }} +{{ $data = $data | append (dict "Label" .Name "Href" "/") }} +{{ end }} + +{{ partial "generic-compact-list" (dict "title" "Common tags" "data" $data) }} diff --git a/layouts/snippets/list.html b/layouts/snippets/list.html index fe33135..4c298f8 100644 --- a/layouts/snippets/list.html +++ b/layouts/snippets/list.html @@ -3,29 +3,5 @@ {{ end }} {{ define "aside" }} -
-

Popular content

- -
+{{ partial "tag-compact-list" }} {{ end }}