From ce7de03b1988555d1fa7a474d9cfd1ef4c70682b Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Sun, 28 Aug 2022 21:10:42 -0700 Subject: Redesign some docs - Add sidebar of categories - Separate homepage by category - Add new baseof layout - Add new taxonomy and terms pages - Port footer from main docs --- config.yml | 10 +- docs/assets/scss/_footer.scss | 27 +--- docs/assets/scss/docs.scss | 17 ++- docs/layouts/_default/baseof.html | 18 +++ docs/layouts/_default/font.html | 34 ++--- docs/layouts/_default/home.html | 49 ++++--- docs/layouts/_default/taxonomy.html | 18 +++ docs/layouts/_default/term.html | 25 ++++ docs/layouts/icons/single.html | 266 ++++++++++++++++++------------------ docs/layouts/partials/footer.html | 65 +++++++-- docs/layouts/partials/icon.html | 17 +++ docs/layouts/partials/icons.html | 43 +++--- 12 files changed, 357 insertions(+), 232 deletions(-) create mode 100644 docs/layouts/_default/baseof.html create mode 100644 docs/layouts/_default/taxonomy.html create mode 100644 docs/layouts/_default/term.html create mode 100644 docs/layouts/partials/icon.html diff --git a/config.yml b/config.yml index 35700221a..e166d5391 100644 --- a/config.yml +++ b/config.yml @@ -4,7 +4,7 @@ baseURL: "https://icons.getbootstrap.com" enableInlineShortcodes: true enableRobotsTXT: true metaDataFormat: "yaml" -disableKinds: ["404", "taxonomy", "term", "RSS"] +disableKinds: ["404", "RSS"] publishDir: "_site" @@ -49,6 +49,14 @@ module: - source: node_modules/bootstrap/dist/js/bootstrap.min.js target: assets/js/bootstrap.min.js +taxonomies: + category: categories + tag: tags + +permalinks: + categories: "/:section/:slug" + tags: "/:section/:slug" + params: description: "Official open source SVG icon library for Bootstrap" social_image_path: /assets/img/bootstrap-icons-social.png diff --git a/docs/assets/scss/_footer.scss b/docs/assets/scss/_footer.scss index 22d20c969..87cee6d2b 100644 --- a/docs/assets/scss/_footer.scss +++ b/docs/assets/scss/_footer.scss @@ -3,33 +3,14 @@ // .bd-footer { - font-size: .875rem; - color: var(--bs-gray-600); - a { - font-weight: 600; - color: var(--bs-gray-700); + color: $gray-700; + text-decoration: none; &:hover, &:focus { - color: var(--bs-primary); - } - } - - p { - margin-bottom: 0; - } -} - -.bd-footer-links { - padding-left: 0; - margin-bottom: 1rem; - - li { - display: inline-block; - - + li { - margin-left: 1rem; + color: $link-color; + text-decoration: underline; } } } diff --git a/docs/assets/scss/docs.scss b/docs/assets/scss/docs.scss index 8ab1ed50a..e5341b0d3 100644 --- a/docs/assets/scss/docs.scss +++ b/docs/assets/scss/docs.scss @@ -21,7 +21,7 @@ // @import "bootstrap/accordion"; @import "bootstrap/breadcrumb"; // @import "bootstrap/pagination"; -// @import "bootstrap/badge"; +@import "bootstrap/badge"; // @import "bootstrap/alert"; // @import "bootstrap/progress"; // @import "bootstrap/list-group"; @@ -219,3 +219,18 @@ padding-bottom: 4.5rem !important; } // stylelint-enable declaration-no-important + +.bd-sidebar { + @include media-breakpoint-up(lg) { + position: sticky; + top: 5rem; + // Override collapse behaviors + // stylelint-disable-next-line declaration-no-important + // display: block !important; + height: subtract(100vh, 6rem); + // Prevent focus styles to be cut off: + // padding-left: .25rem; + // margin-left: -.25rem; + overflow-y: auto; + } +} diff --git a/docs/layouts/_default/baseof.html b/docs/layouts/_default/baseof.html new file mode 100644 index 000000000..5a7df61bf --- /dev/null +++ b/docs/layouts/_default/baseof.html @@ -0,0 +1,18 @@ + + + + {{ partial "head" . }} + + + {{ partialCached "skippy" . }} + {{ partialCached "navbar" . }} + {{ block "hero" . }}{{ end }} + +
+ {{ block "main" . }}{{ end }} +
+ + {{- partialCached "footer" . }} + {{- partialCached "scripts" . }} + + diff --git a/docs/layouts/_default/font.html b/docs/layouts/_default/font.html index e525458d7..010d5ff45 100644 --- a/docs/layouts/_default/font.html +++ b/docs/layouts/_default/font.html @@ -1,25 +1,9 @@ - - - - {{ partial "head" . }} - - - {{ partialCached "skippy" . }} - {{ partialCached "navbar" . }} - -
- - {{ partialCached "icons" . "fonts" }} - - {{ .Content }} -
- - {{- partialCached "footer" . }} - {{- partialCached "scripts" . "fonts" }} - - +{{ define "main" }} + + {{ partialCached "icons" . "fonts" }} +{{ end }} diff --git a/docs/layouts/_default/home.html b/docs/layouts/_default/home.html index 7c458cd7e..b7ae1ed30 100644 --- a/docs/layouts/_default/home.html +++ b/docs/layouts/_default/home.html @@ -1,19 +1,34 @@ - - - - {{ partial "head" . }} - - - {{ partialCached "skippy" . }} - {{ partialCached "navbar" . }} - {{ partialCached "home/hero" . }} +{{ define "hero" }} + {{ partialCached "home/hero" . }} +{{ end }} -
+{{ define "main" }} +
+
+
+

Categories

+
    +
  • + All +
    • + {{ range $taxonomyname, $taxonomy := .Site.Taxonomies }} + {{ if eq "categories" $taxonomyname }} + {{ range $key, $value := $taxonomy }} +
  • + {{ $key | humanize }} +
    • + {{ end }} + {{ end }} + {{ end }} +
+
+
+
{{ partialCached "icons" . "home" }} - {{ .Content }} -
- - {{- partialCached "footer" . }} - {{- partialCached "scripts" . "home" }} - - + + +{{ end }} diff --git a/docs/layouts/_default/taxonomy.html b/docs/layouts/_default/taxonomy.html new file mode 100644 index 000000000..273aa4a88 --- /dev/null +++ b/docs/layouts/_default/taxonomy.html @@ -0,0 +1,18 @@ +{{ define "main" }} + + +

All {{ .Type }}

+ +{{ end }} + diff --git a/docs/layouts/_default/term.html b/docs/layouts/_default/term.html new file mode 100644 index 000000000..f63041491 --- /dev/null +++ b/docs/layouts/_default/term.html @@ -0,0 +1,25 @@ +{{ define "main" }} + +
+
+

+ {{ .Title | humanize }} icons +

+
+ + +
+
+ +
+{{ end }} diff --git a/docs/layouts/icons/single.html b/docs/layouts/icons/single.html index 05ad5ae72..c95e1cc2d 100644 --- a/docs/layouts/icons/single.html +++ b/docs/layouts/icons/single.html @@ -1,152 +1,148 @@ - - - - {{ partial "head" . }} - - - {{ partialCached "skippy" . }} - {{ partialCached "navbar" . }} +{{ define "main" }} + -
- +
+
+

{{ .Title }}

-
-
-

{{ .Title }}

+ {{ if or .Params.tags .Params.categories -}} +
    +
  • + Category: + {{ range .Params.categories }} + {{ . }} + {{ end }} +
    • +
  • + Tags: + {{ range .Params.tags }} + {{ . }} + {{ end }} +
    • +
+ {{- end }} +
+
+ {{ partialCached "ads" . }} +
+
- {{ if or .Params.tags .Params.categories -}} -
    - {{ with .Params.tags }}
  • Tags: {{ delimit . ", " }}
    • {{ end }} - {{ with .Params.categories }}
  • Category: {{ delimit . ", " }}
    • {{ end }} -
- {{- end }} -
-
- {{ partialCached "ads" . }} -
-
+
-
+ {{- $localSvgPath := printf "/icons/%s.svg" .File.TranslationBaseName -}} + {{- $svgPath := path.Join "/assets/" $localSvgPath -}} + {{- $svgHtml := readFile $localSvgPath | chomp | safeHTML -}} - {{- $localSvgPath := printf "/icons/%s.svg" .File.TranslationBaseName -}} - {{- $svgPath := path.Join "/assets/" $localSvgPath -}} - {{- $svgHtml := readFile $localSvgPath | chomp | safeHTML -}} +
+
+ -
-
- -
+ - {{- partialCached "footer" . }} - {{- partialCached "scripts" . "default" }} - - + {{ highlight $svgHtml "html" "" }} + + +{{ end }} diff --git a/docs/layouts/partials/footer.html b/docs/layouts/partials/footer.html index fdad6d856..5c0b85678 100644 --- a/docs/layouts/partials/footer.html +++ b/docs/layouts/partials/footer.html @@ -1,10 +1,59 @@ -