diff options
author | Sami Ahmed Siddiqui <sami@trunkcode.com> | 2022-08-15 20:27:19 +0300 |
---|---|---|
committer | GitHub <noreply@github.com> | 2022-08-15 20:27:19 +0300 |
commit | e3c036026df562cbaf71899cae87771dca2be029 (patch) | |
tree | 6fbde54bbda28e577c739d0522874c8ddb9d4817 | |
parent | 1779a8ce015ed959a8ff5a7ee154c0ab82d3678c (diff) |
Upgrade to FontAwesome 6 (#1102)
-rw-r--r-- | assets/scss/_nav.scss | 36 | ||||
-rw-r--r-- | assets/scss/_search.scss | 2 | ||||
-rw-r--r-- | assets/scss/_taxonomy.scss | 8 | ||||
-rw-r--r-- | assets/scss/support/_functions.scss | 1 | ||||
-rw-r--r-- | layouts/blog/baseof.html | 2 | ||||
-rw-r--r-- | layouts/partials/page-meta-links.html | 14 | ||||
-rw-r--r-- | layouts/partials/reading-time.html | 2 | ||||
-rw-r--r-- | layouts/shortcodes/blocks/link-down.html | 2 | ||||
-rw-r--r-- | package.json | 2 | ||||
-rw-r--r-- | userguide/config.toml | 16 | ||||
-rw-r--r-- | userguide/content/en/_index.html | 8 | ||||
-rw-r--r-- | userguide/content/en/docs/adding-content/content.md | 8 | ||||
-rw-r--r-- | userguide/content/en/docs/adding-content/navigation.md | 14 | ||||
-rw-r--r-- | userguide/content/en/docs/adding-content/shortcodes/index.md | 10 |
14 files changed, 62 insertions, 63 deletions
diff --git a/assets/scss/_nav.scss b/assets/scss/_nav.scss index 1d5d41d..b603c8f 100644 --- a/assets/scss/_nav.scss +++ b/assets/scss/_nav.scss @@ -121,13 +121,13 @@ font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; - font-weight: 900; + font-family: "Font Awesome 6 Free"; + font-weight: 900; content: "\f0d9"; padding-left: 0.5em; padding-right: 0.5em; } - } + } } // Foldable sidebar menu @@ -136,18 +136,18 @@ nav.foldable-nav { &#td-section-nav { position: relative; } - + &#td-section-nav label { margin-bottom: 0; width: 100%; } - + .td-sidebar-nav__section, .with-child ul { list-style: none; padding: 0; margin: 0; } - + .ul-1 > li { padding-left: 1.5em; } @@ -162,8 +162,8 @@ nav.foldable-nav { input[type=checkbox] { display: none; } - .with-child, .without-child { - position: relative; + .with-child, .without-child { + position: relative; padding-left: 1.5em; } @@ -173,7 +173,7 @@ nav.foldable-nav { font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0da"; + font-family: "Font Awesome 6 Free"; font-weight: 900; content: "\f0da"; position: absolute; left: 0.1em; padding-left: 0.4em; @@ -186,30 +186,30 @@ nav.foldable-nav { } } - .ul-1 .with-child > input:checked ~ label:before { + .ul-1 .with-child > input:checked ~ label:before { color: $primary; transform: rotate(90deg); - transition: transform 0.5s; + transition: transform 0.5s; } .with-child ul { margin-top: 0.1em; } - -} + +} @media (hover: hover) and (pointer: fine) { - + nav.foldable-nav { - .ul-1 .with-child > label:hover:before { + .ul-1 .with-child > label:hover:before { color: $primary; transform: rotate(30deg); - transition: transform 0.5s; + transition: transform 0.5s; } - .ul-1 .with-child > input:checked ~ label:hover:before { + .ul-1 .with-child > input:checked ~ label:hover:before { color: $primary; transform: rotate(60deg) !important; - transition: transform 0.5s; + transition: transform 0.5s; } } } diff --git a/assets/scss/_search.scss b/assets/scss/_search.scss index 6fb9631..49de03d 100644 --- a/assets/scss/_search.scss +++ b/assets/scss/_search.scss @@ -14,7 +14,7 @@ border-radius: 1rem; } - font-family: "Font Awesome 5 Free", $font-family-base; + font-family: "Font Awesome 6 Free", $font-family-base; } .popover.offline-search-result { diff --git a/assets/scss/_taxonomy.scss b/assets/scss/_taxonomy.scss index 8be1f4f..32ce511 100644 --- a/assets/scss/_taxonomy.scss +++ b/assets/scss/_taxonomy.scss @@ -207,7 +207,7 @@ font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; + font-family: "Font Awesome 6 Free"; // font-weight: 900; padding-right: 0.5em; font-size: 2em; @@ -298,7 +298,7 @@ font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; + font-family: "Font Awesome 6 Free"; content: "\f02d"; padding-right: 0.5em; } @@ -309,7 +309,7 @@ font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; + font-family: "Font Awesome 6 Free"; content: "\f781"; padding-right: 0.5em; } @@ -325,7 +325,7 @@ font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; - font-family: "Font Awesome 5 Free"; + font-family: "Font Awesome 6 Free"; content: "\f122"; padding-right: 0.5em; } diff --git a/assets/scss/support/_functions.scss b/assets/scss/support/_functions.scss index 2b641f0..bb75c49 100644 --- a/assets/scss/support/_functions.scss +++ b/assets/scss/support/_functions.scss @@ -5,7 +5,6 @@ } - // See https://www.sitepoint.com/using-sass-build-color-palettes/ @function color-diff($a, $b) { $sat: saturation($a) - saturation($b); diff --git a/layouts/blog/baseof.html b/layouts/blog/baseof.html index 5f162b9..b207410 100644 --- a/layouts/blog/baseof.html +++ b/layouts/blog/baseof.html @@ -21,7 +21,7 @@ <main class="col-12 col-md-9 col-xl-8 pl-md-5 pr-md-4" role="main"> {{ with .CurrentSection.OutputFormats.Get "rss" -}} <a class="btn btn-lg -bg-orange td-rss-button d-none d-lg-block" href="{{ .Permalink | safeURL }}" target="_blank"> - RSS <i class="fa fa-rss ml-2 "></i> + RSS <i class="fa-solid fa-rss"></i> </a> {{ end -}} {{ block "main" . }}{{ end }} diff --git a/layouts/partials/page-meta-links.html b/layouts/partials/page-meta-links.html index 3ec82d8..e3561eb 100644 --- a/layouts/partials/page-meta-links.html +++ b/layouts/partials/page-meta-links.html @@ -8,7 +8,7 @@ <div class="td-page-meta ml-2 pb-1 pt-2 mb-0"> {{ if $gh_url -}} {{ warnf "Warning: use of `github_url` is deprecated. For details see https://www.docsy.dev/docs/adding-content/repository-links/#github_url-optional" -}} - <a href="{{ $gh_url }}" target="_blank"><i class="fa fa-edit fa-fw"></i> {{ T "post_edit_this" }}</a> + <a href="{{ $gh_url }}" target="_blank"><i class="fa-solid fa-pen-to-square fa-fw"></i> {{ T "post_edit_this" }}</a> {{ else if $gh_repo -}} {{ $gh_repo_path := printf "%s/content/%s" $gh_branch $pathFormatted -}} {{ if and ($gh_subdir) (.Site.Language.Lang) -}} @@ -37,18 +37,18 @@ {{ $newPageQS := querify "value" $newPageStub.Content "filename" "change-me.md" | safeURL -}} {{ $newPageURL := printf "%s/new/%s?%s" $gh_repo $gh_repo_path $newPageQS -}} - <a href="{{ $viewURL }}" class="td-page-meta--view" target="_blank" rel="noopener"><i class="fa fa-file-alt fa-fw"></i> {{ T "post_view_this" }}</a> - <a href="{{ $editURL }}" class="td-page-meta--edit" target="_blank" rel="noopener"><i class="fa fa-edit fa-fw"></i> {{ T "post_edit_this" }}</a> - <a href="{{ $newPageURL }}" class="td-page-meta--child" target="_blank" rel="noopener"><i class="fa fa-edit fa-fw"></i> {{ T "post_create_child_page" }}</a> - <a href="{{ $issuesURL }}" class="td-page-meta--issue" target="_blank" rel="noopener"><i class="fas fa-tasks fa-fw"></i> {{ T "post_create_issue" }}</a> + <a href="{{ $viewURL }}" class="td-page-meta--view" target="_blank" rel="noopener"><i class="fa-solid fa-file-lines fa-fw"></i> {{ T "post_view_this" }}</a> + <a href="{{ $editURL }}" class="td-page-meta--edit" target="_blank" rel="noopener"><i class="fa-solid fa-pen-to-square fa-fw"></i> {{ T "post_edit_this" }}</a> + <a href="{{ $newPageURL }}" class="td-page-meta--child" target="_blank" rel="noopener"><i class="fa-solid fa-pen-to-square fa-fw"></i> {{ T "post_create_child_page" }}</a> + <a href="{{ $issuesURL }}" class="td-page-meta--issue" target="_blank" rel="noopener"><i class="fa-solid fa-list-check fa-fw"></i> {{ T "post_create_issue" }}</a> {{ with $gh_project_repo -}} {{ $project_issueURL := printf "%s/issues/new" . -}} - <a href="{{ $project_issueURL }}" class="td-page-meta--project-issue" target="_blank" rel="noopener"><i class="fas fa-tasks fa-fw"></i> {{ T "post_create_project_issue" }}</a> + <a href="{{ $project_issueURL }}" class="td-page-meta--project-issue" target="_blank" rel="noopener"><i class="fa-solid fa-list-check fa-fw"></i> {{ T "post_create_project_issue" }}</a> {{ end -}} {{ end -}} {{ with .CurrentSection.AlternativeOutputFormats.Get "print" -}} - <a id="print" href="{{ .Permalink | safeURL }}"><i class="fa fa-print fa-fw"></i> {{ T "print_entire_section" }}</a> + <a id="print" href="{{ .Permalink | safeURL }}"><i class="fa-solid fa-print fa-fw"></i> {{ T "print_entire_section" }}</a> {{ end }} </div> {{ end -}} diff --git a/layouts/partials/reading-time.html b/layouts/partials/reading-time.html index 7379959..454f2f0 100644 --- a/layouts/partials/reading-time.html +++ b/layouts/partials/reading-time.html @@ -1 +1 @@ -<p class="reading-time"><i class="fa fa-clock" aria-hidden="true"></i> {{ if gt .ReadingTime 1 }} {{ .ReadingTime }} {{ T "post_reading_time" }} {{ else }} {{ T "post_less_than_a_minute_read" }} {{ end }} </p> +<p class="reading-time"><i class="fa-solid fa-clock" aria-hidden="true"></i> {{ if gt .ReadingTime 1 }} {{ .ReadingTime }} {{ T "post_reading_time" }} {{ else }} {{ T "post_less_than_a_minute_read" }} {{ end }} </p> diff --git a/layouts/shortcodes/blocks/link-down.html b/layouts/shortcodes/blocks/link-down.html index 9dd8c4c..03e3003 100644 --- a/layouts/shortcodes/blocks/link-down.html +++ b/layouts/shortcodes/blocks/link-down.html @@ -1,7 +1,7 @@ {{ with .Parent }} {{ $id := $.Get "id" | default (printf "td-block-%d" ( add .Ordinal 1 )) }} {{ $color := $.Get "color" | default "blue" }} -<a class="btn btn-link text-{{ $color }}" href="#{{ $id }}" aria-label="{{ T "ui_read_more"}}"><i class="fa fa-chevron-circle-down" style="font-size: 400%"></i></a> +<a class="btn btn-link text-{{ $color }}" href="#{{ $id }}" aria-label="{{ T "ui_read_more"}}"><i class="fa-solid fa-circle-chevron-down" style="font-size: 400%"></i></a> {{ else }} {{ errorf "The link-down shortcode is supposed to be nested inside a shortcode"}} {{ end }}
\ No newline at end of file diff --git a/package.json b/package.json index f37c23e..303b4e9 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ "proseWrap": "always" }, "dependencies": { - "@fortawesome/fontawesome-free": "^5.15.4", + "@fortawesome/fontawesome-free": "^6.1.1", "bootstrap": "^4.6.1" }, "devDependencies": { diff --git a/userguide/config.toml b/userguide/config.toml index c4421bc..ed8d083 100644 --- a/userguide/config.toml +++ b/userguide/config.toml @@ -40,7 +40,7 @@ anchor = "smart" name = "Example Site" weight = 40 url = "https://example.docsy.dev" - post = '<sup><i class="pl-1 fas fa-external-link-alt fa-xs" aria-hidden="true"></i></sup>' + post = '<sup><i class="pl-1 fa-solid fa-up-right-from-square fa-xs" aria-hidden="true"></i></sup>' [services] [services.googleAnalytics] @@ -150,38 +150,38 @@ enable = false [[params.links.user]] name ="GitHub Discussions" url = "https://github.com/google/docsy/discussions" - icon = "fab fa-github" + icon = "fa-brands fa-github" desc = "Discussion and help from your fellow users" [[params.links.user]] name = "User mailing list" url = "https://groups.google.com/forum/#!forum/docsy-users" - icon = "fa fa-envelope" + icon = "fa-solid fa-envelope" desc = "Sign up for Docsy announcements" [[params.links.user]] name ="Twitter" url = "https://twitter.com/docsydocs" - icon = "fab fa-twitter" + icon = "fa-brands fa-twitter" desc = "Follow us on Twitter to get the latest news!" [[params.links.user]] name = "Stack Overflow" url = "https://stackoverflow.com/questions/tagged/docsy" - icon = "fab fa-stack-overflow" + icon = "fa-brands fa-stack-overflow" desc = "Practical questions and curated answers" # Developer relevant links. These will show up on right side of footer and in the community page if you have one. [[params.links.developer]] name = "GitHub" url = "https://github.com/google/docsy" - icon = "fab fa-github" + icon = "fa-brands fa-github" desc = "Development takes place here!" # [[params.links.developer]] # name = "Slack" # url = "https://example.org/slack" - # icon = "fab fa-slack" + # icon = "fa-brands fa-slack" # desc = "Chat with other project developers" # [[params.links.developer]] # name = "Developer mailing list" # url = "https://example.org/mail" - # icon = "fa fa-envelope" + # icon = "fa-solid fa-envelope" # desc = "Discuss development issues around the project" [params.mermaid] diff --git a/userguide/content/en/_index.html b/userguide/content/en/_index.html index 0a711c5..58bf3c8 100644 --- a/userguide/content/en/_index.html +++ b/userguide/content/en/_index.html @@ -5,10 +5,10 @@ title: Docsy {{< blocks/cover title="Welcome to Docsy!" image_anchor="top" height="full" color="orange" >}} <div class="mx-auto"> <a class="btn btn-lg btn-primary mr-3 mb-4" href="{{< relref "/about" >}}"> - Learn More <i class="fas fa-arrow-alt-circle-right ml-2"></i> + Learn More <i class="fa-solid fa-circle-right ml-2"></i> </a> <a class="btn btn-lg btn-secondary mr-3 mb-4" href="https://github.com/google/docsy"> - Download <i class="fab fa-github ml-2 "></i> + Download <i class="fa-brands fa-github ml-2 "></i> </a> <p class="lead mt-5">A Hugo theme for creating great technical documentation sites</p> {{< blocks/link-down color="info" >}} @@ -32,12 +32,12 @@ As well as our example site, there's a growing number of projects using Docsy fo {{% /blocks/feature %}} -{{% blocks/feature icon="fab fa-github" title="Contributions welcome!" url="https://github.com/google/docsy" %}} +{{% blocks/feature icon="fa-brands fa-github" title="Contributions welcome!" url="https://github.com/google/docsy" %}} We do a [Pull Request](https://github.com/google/docsy/pulls) contributions workflow on **GitHub**. New users are always welcome! {{% /blocks/feature %}} -{{% blocks/feature icon="fab fa-twitter" title="Follow us on Twitter!" url="https://twitter.com/docsydocs" %}} +{{% blocks/feature icon="fa-brands fa-twitter" title="Follow us on Twitter!" url="https://twitter.com/docsydocs" %}} Find out about new features and how our users are using Docsy. {{% /blocks/feature %}} diff --git a/userguide/content/en/docs/adding-content/content.md b/userguide/content/en/docs/adding-content/content.md index 3324a7e..0a07002 100644 --- a/userguide/content/en/docs/adding-content/content.md +++ b/userguide/content/en/docs/adding-content/content.md @@ -561,13 +561,13 @@ params: { "name": "Twitter", "url": "https://example.org/twitter", - "icon": "fab fa-twitter", + "icon": "fa-brands fa-twitter", "desc": "Follow us on Twitter to get the latest news!" }, { "name": "Stack Overflow", "url": "https://example.org/stack", - "icon": "fab fa-stack-overflow", + "icon": "fa-brands fa-stack-overflow", "desc": "Practical questions and curated answers" } ], @@ -575,13 +575,13 @@ params: { "name": "GitHub", "url": "https://github.com/google/docsy", - "icon": "fab fa-github", + "icon": "fa-brands fa-github", "desc": "Development takes place here!" }, { "name": "Slack", "url": "https://example.org/slack", - "icon": "fab fa-slack", + "icon": "fa-brands fa-slack", "desc": "Chat with other project developers" }, { diff --git a/userguide/content/en/docs/adding-content/navigation.md b/userguide/content/en/docs/adding-content/navigation.md index 74f8d34..7ff60b1 100644 --- a/userguide/content/en/docs/adding-content/navigation.md +++ b/userguide/content/en/docs/adding-content/navigation.md @@ -21,7 +21,7 @@ linkTitle = "Documentation" [menu.main] weight = 20 -pre = "<i class='fas fa-book'></i>" +pre = "<i class='fa-solid fa-book'></i>" +++ {{< /tab >}} {{< tab header="yaml" lang="yaml" >}} @@ -31,7 +31,7 @@ linkTitle: "Documentation" menu: main: weight: 20 - pre: <i class='fas fa-book'></i> + pre: <i class='fa-solid fa-book'></i> --- {{< /tab >}} {{< tab header="json" lang="json" >}} @@ -41,7 +41,7 @@ menu: "menu": { "main": { "weight": 20, - "pre": "<i class='fas fa-book'></i>" + "pre": "<i class='fa-solid fa-book'></i>" } } } @@ -93,7 +93,7 @@ As described in the [Hugo docs](https://gohugo.io/content-management/menus/#add- name = "GitHub" weight = 50 url = "https://github.com/google/docsy/" - pre = "<i class='fab fa-github'></i>" + pre = "<i class="fa-brands fa-github"></i>" post = "<span class='alert'>New!</span>" {{< /tab >}} {{< tab header="config.yaml" lang="yaml" >}} @@ -102,7 +102,7 @@ menu: - name: GitHub weight: 50 url: 'https://github.com/google/docsy/' - pre: <i class='fab fa-github'></i> + pre: <i class="fa-brands fa-github"></i> post: <span class='alert'>New!</span> {{< /tab >}} {{< tab header="config.json" lang="json" >}} @@ -113,7 +113,7 @@ menu: "name": "GitHub", "weight": 50, "url": "https://github.com/google/docsy/", - "pre": "<i class='fab fa-github'></i>", + "pre": "<i class="fa-brands fa-github"></i>", "post": "<span class='alert'>New!</span>" } ] @@ -227,7 +227,7 @@ On large sites (default: > 2000 pages) the section menu is not generated for eac ### Add icons to the section menu -You can add icons to the section menu in the sidebar by setting the `icon` parameter in the page front matter (e.g. `icon: fas fa-tools`). +You can add icons to the section menu in the sidebar by setting the `icon` parameter in the page front matter (e.g. `icon: fa-solid fa-screwdriver-wrench`). You can find a complete list of icons to use in the [FontAwesome documentation](https://fontawesome.com/icons?d=gallery&p=2). Docsy includes the free FontAwesome icons by default. diff --git a/userguide/content/en/docs/adding-content/shortcodes/index.md b/userguide/content/en/docs/adding-content/shortcodes/index.md index 6799365..418c9b6 100644 --- a/userguide/content/en/docs/adding-content/shortcodes/index.md +++ b/userguide/content/en/docs/adding-content/shortcodes/index.md @@ -33,10 +33,10 @@ The **blocks/cover** shortcode creates a landing page type of block that fills t {{</* blocks/cover title="Welcome!" image_anchor="center" height="full" color="primary" */>}} <div class="mx-auto"> <a class="btn btn-lg btn-primary mr-3 mb-4" href="{{</* relref "/docs" */>}}"> - Learn More <i class="fas fa-arrow-alt-circle-right ml-2"></i> + Learn More <i class="fa-solid fa-circle-right ml-2"></i> </a> <a class="btn btn-lg btn-secondary mr-3 mb-4" href="https://example.org"> - Download <i class="fab fa-github ml-2 "></i> + Download <i class="fa-brands fa-github ml-2 "></i> </a> <p class="lead mt-5">This program is now available in <a href="#">AppStore!</a></p> <div class="mx-auto mt-5"> @@ -100,10 +100,10 @@ The example below shows a section wrapping 3 feature sections. The new **TechOS** operating system is an open source project. It is a new project, but with grand ambitions. Please follow this space for updates! {{%/* /blocks/feature */%}} -{{%/* blocks/feature icon="fab fa-github" title="Contributions welcome!" url="https://github.com/gohugoio/hugo" */%}} +{{%/* blocks/feature icon="fa-brands fa-github" title="Contributions welcome!" url="https://github.com/gohugoio/hugo" */%}} We do a [Pull Request](https://github.com/gohugoio/hugo/pulls) contributions workflow on **GitHub**. New users are always welcome! {{%/* /blocks/feature */%}} -{{%/* blocks/feature icon="fab fa-twitter" title="Follow us on Twitter!" url="https://twitter.com/GoHugoIO" */%}} +{{%/* blocks/feature icon="fa-brands fa-twitter" title="Follow us on Twitter!" url="https://twitter.com/GoHugoIO" */%}} For announcement of latest features etc. {{%/* /blocks/feature */%}} {{</* /blocks/section */>}} @@ -119,7 +119,7 @@ For announcement of latest features etc. ```go-html-template -{{%/* blocks/feature icon="fab fa-github" title="Contributions welcome!" url="https://github.com/gohugoio/hugo" */%}} +{{%/* blocks/feature icon="fa-brands fa-github" title="Contributions welcome!" url="https://github.com/gohugoio/hugo" */%}} We do a [Pull Request](https://github.com/gohugoio/hugo/pulls) contributions workflow on **GitHub**. New users are always welcome! {{%/* /blocks/feature */%}} |