feat: refacto icons to use fontawesome 6

jgazeau · Feb 20, 2022 · 623532a · 623532a
1 parent 8dcfb9e
commit 623532a
Show file tree

Hide file tree

Showing 59 changed files with 144 additions and 151 deletions.
diff --git a/assets/js/fencedcodes/mermaid.js b/assets/js/fencedcodes/mermaid.js
@@ -35,7 +35,7 @@ function renderMermaid(mermaidId, graphDefinition) {
   const mermaidSvgExportIcon = document.createElement('i');
   mermaidContainer.classList.add('sc-mermaid-container');
   mermaidSvgExport.classList.add('is-action-button');
-  mermaidSvgExportIcon.classList.add('fas','fa-download');
+  mermaidSvgExportIcon.classList.add('fa-solid','fa-download');
   mermaidSvgExport.id = `${mermaidId}-export-svg`;
   mermaidSvgExport.title = svgDownloadLabel;
   mermaidFragment.appendChild(mermaidContainer);

diff --git a/assets/js/theme/init.js b/assets/js/theme/init.js
@@ -52,7 +52,7 @@ document.addEventListener('DOMContentLoaded', function() {
       let tdiv = document.createElement('div');
       let ti = document.createElement('i');
       tdiv.setAttribute('class', 'copy-code is-action-button');
-      ti.setAttribute('class', 'fas fa-copy');
+      ti.setAttribute('class', 'fa-solid fa-copy');
       if ((typeof codeCopyBefore !== 'undefined') && (typeof codeCopyAfter !== 'undefined')) {
         tdiv.setAttribute('title', codeCopyBefore);
         tdiv.setAttribute('title-after', codeCopyAfter);

diff --git a/assets/sass/theme/extends.sass b/assets/sass/theme/extends.sass
@@ -60,8 +60,7 @@
   .is-icon-expandable
     .icon
       &:after
-        font-family: "Font Awesome 5 Free"
-        font-weight: 900
+        font: var(--fa-font-solid)
         content: "\f107"
       &:hover:after
         content: "\f103"
@@ -159,11 +158,10 @@
 %toc-link-effect
   &:after
     transition: transform 0.3s, opacity 0.2s
-    font-family: "Font Awesome 5 Free"
     margin: 0 $theme-gap-medium-size
     transform: translateX(0.5rem)
+    font: var(--fa-font-solid)
     display: inline-block
-    font-weight: 900
     content: "\f060"
     opacity: 0
   &:hover:after
@@ -181,14 +179,13 @@
   padding-bottom: 1px
   position: relative
   &:after
+    font: var(--fa-font-solid)
     font-size: calc(#{$theme-gap-large-size} / 2)
     bottom: calc(#{$theme-gap-large-size} / 2)
     margin-left: $theme-gap-small-half-size
-    font-family: "Font Awesome 5 Free"
     color: $content-link-color
     font-style: normal
     position: absolute
-    font-weight: 900
     content: '\f35d'
   &:hover
     color: $content-link-color

diff --git a/assets/sass/theme/shortcodes/alert.sass b/assets/sass/theme/shortcodes/alert.sass
@@ -10,12 +10,11 @@
   &:before
     color: findColorInvert($theme-writing-color)
     width: $theme-gap-extra-large-size
-    font-family: "Font Awesome 5 Free"
     font-size: $theme-gap-large-size
+    font: var(--fa-font-solid)
     justify-content: center
     align-items: center
     position: absolute
-    font-weight: 900
     content: '\f05a'
     display: flex
     height: 100%

diff --git a/assets/sass/theme/shortcodes/collapsible.sass b/assets/sass/theme/shortcodes/collapsible.sass
@@ -20,10 +20,9 @@
     display: flex
     &:after
       padding-left: $theme-gap-large-size
-      font-family: "Font Awesome 5 Free"
       font-size: $theme-gap-large-size
+      font: var(--fa-font-solid)
       align-self: center
-      font-weight: 900
       content: '\f0fe'
     &:hover
       background: smooth-color($collapsible-color, 10)

diff --git a/assets/sass/theme/shortcodes/intro.sass b/assets/sass/theme/shortcodes/intro.sass
@@ -28,12 +28,11 @@
     width: calc(2 * (#{$theme-gap-extra-extra-large-size} - #{$theme-gap-large-size}))
     +responsive-size(font-size, $theme-h2-font-size, 3px)
     color: shade($content-link-color, 60)
-    font-family: "Font Awesome 5 Free"
+    font: var(--fa-font-solid)
     justify-content: center
     align-content: center
     align-items: center
     position: absolute
-    font-weight: 900
     content: "\f5b0"
     transition: 0
     display: flex

diff --git a/assets/sass/theme/shortcodes/treeview.sass b/assets/sass/theme/shortcodes/treeview.sass
@@ -55,16 +55,15 @@
       > .sc-treeview-label
         .sc-treeview-icon
           &:before
+            font: var(--fa-font-solid)
             left: calc(-1 * #{$content-font-size})
             background-color: $content-background
-            font-family: "Font Awesome 5 Free"
             font-size: $content-font-size
             height: $content-font-size
             width: $content-font-size
             justify-content: center
             align-items: center
             position: absolute
-            font-weight: 900
             content: "\f146"
             display: flex
       &.is-collapsed

diff --git a/data/themeParams.toml b/data/themeParams.toml
@@ -10,9 +10,9 @@
 # Miscellaneous sidebar parameters
 #
 [sidebar]
-  homeSectionIconDefault = "fas fa-home"
-  firstSectionIconDefault = "fas fa-ban"
-  nestedSectionIconDefault = "fas fa-level-up-alt fa-rotate-90 fa-xs"
+  homeSectionIconDefault = "fa-solid fa-house-chimney"
+  firstSectionIconDefault = "fa-solid fa-ban"
+  nestedSectionIconDefault = "fa-solid fa-turn-up fa-rotate-90 fa-xs"
 #
 # List of theme keyboard shortcuts
 # For every shortcut the following keys are sets:
@@ -122,23 +122,23 @@
 [shortcodes]
   [shortcodes.treeview]
     [shortcodes.treeview.kinds]
-      default     = "fas fa-exclamation-circle"
-      defaultDir  = "fas fa-folder"
-      defaultFile = "fas fa-file"
-      home        = "fas fa-home"
-      page        = "fas fa-file-alt"
-      section     = "fas fa-list-alt"
-      taxonomy    = "fas fa-tags"
-      term        = "fas fa-tag"
-      dir         = "fas fa-folder"
-      archive     = "fas fa-file-archive"
-      file        = "fas fa-file"
-      image       = "fas fa-file-image"
-      video       = "fas fa-file-video"
-      script      = "fas fa-file-code"
-      dockerfile  = "fab fa-docker"
-      pdf         = "fas fa-file-pdf"
-      powerpoint  = "fas fa-file-powerpoint"
-      excel       = "fas fa-file-excel"
-      csv         = "fas fa-file-csv"
-      word        = "fas fa-file-word"
+      default     = "fa-solid fa-circle-exclamation"
+      defaultDir  = "fa-solid fa-folder"
+      defaultFile = "fa-solid fa-file"
+      home        = "fa-solid fa-house-chimney"
+      page        = "fa-solid fa-file-lines"
+      section     = "fa-solid fa-folder-tree"
+      taxonomy    = "fa-solid fa-tags"
+      term        = "fa-solid fa-tag"
+      dir         = "fa-solid fa-folder"
+      archive     = "fa-solid fa-file-zipper"
+      file        = "fa-solid fa-file"
+      image       = "fa-solid fa-file-image"
+      video       = "fa-solid fa-file-video"
+      script      = "fa-solid fa-file-code"
+      dockerfile  = "fa-brands fa-docker"
+      pdf         = "fa-solid fa-file-pdf"
+      powerpoint  = "fa-solid fa-file-powerpoint"
+      excel       = "fa-solid fa-file-excel"
+      csv         = "fa-solid fa-file-csv"
+      word        = "fa-solid fa-file-word"
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
@@ -70,9 +70,9 @@ themesdir              = "../.."
       function = "scExample"
   [params.taxonomies]
     [params.taxonomies.categories]
-      icon = "fas fa-th"
+      icon = "fa-solid fa-table-cells"
     [params.taxonomies.tags]
-      icon = "fas fa-tag"
+      icon = "fa-solid fa-tag"
   [params.includes]
     jsModules = [
         "js/shortcuts.js"

diff --git a/exampleSite/content/english/functionalities/_index.md b/exampleSite/content/english/functionalities/_index.md
@@ -2,7 +2,7 @@
 weight: 3000
 title: "Functionalities"
 description: "Descriptions and examples of the theme functionalities."
-titleIcon: "fas fa-cubes"
+titleIcon: "fa-solid fa-cubes"
 categories: ["Functionalities"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/functionalities/error404.md b/exampleSite/content/english/functionalities/error404.md
@@ -2,7 +2,7 @@
 weight: 3250
 title: "404"
 description: "How to manage 404 page?"
-titleIcon: "far fa-times-circle"
+titleIcon: "fa-solid fa-circle-xmark"
 categories: ["Functionalities"]
 ---
 

diff --git a/exampleSite/content/english/functionalities/helpers_js.md b/exampleSite/content/english/functionalities/helpers_js.md
@@ -2,7 +2,7 @@
 weight: 3230
 title: "Javascript helpers functions"
 description: "How to use javascript helpers functions?"
-titleIcon: "fab fa-js-square"
+titleIcon: "fa-brands fa-js"
 categories: ["Functionalities"]
 tags: ["Configuration"]
 ---

diff --git a/exampleSite/content/english/functionalities/mermaid.md b/exampleSite/content/english/functionalities/mermaid.md
@@ -2,7 +2,7 @@
 weight: 3210
 title: "Mermaid"
 description: "How to use Mermaid?"
-titleIcon: "fas fa-chart-bar"
+titleIcon: "fa-solid fa-chart-column"
 categories: ["Functionalities"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/functionalities/multilingual.md b/exampleSite/content/english/functionalities/multilingual.md
@@ -2,7 +2,7 @@
 weight: 3160
 title: "Multilingual"
 description: "How to manage multilingual mode?"
-titleIcon: "fas fa-globe"
+titleIcon: "fa-solid fa-globe"
 categories: ["Functionalities"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/functionalities/print.md b/exampleSite/content/english/functionalities/print.md
@@ -2,7 +2,7 @@
 weight: 3240
 title: "Print"
 description: "How to manage page printing?"
-titleIcon: "fas fa-print"
+titleIcon: "fa-solid fa-print"
 categories: ["Functionalities"]
 ---
 

diff --git a/exampleSite/content/english/functionalities/qrcode.md b/exampleSite/content/english/functionalities/qrcode.md
@@ -2,7 +2,7 @@
 weight: 3250
 title: "Page QR code"
 description: "How to manage page QR code?"
-titleIcon: "fas fa-qrcode"
+titleIcon: "fa-solid fa-qrcode"
 categories: ["Functionalities"]
 ---
 

diff --git a/exampleSite/content/english/functionalities/search.md b/exampleSite/content/english/functionalities/search.md
@@ -2,7 +2,7 @@
 weight: 3200
 title: "Search"
 description: "How to manage search?"
-titleIcon: "fas fa-search"
+titleIcon: "fa-solid fa-magnifying-glass"
 categories: ["Functionalities"]
 ---
 

diff --git a/exampleSite/content/english/functionalities/shortcuts.md b/exampleSite/content/english/functionalities/shortcuts.md
@@ -2,7 +2,7 @@
 weight: 3220
 title: "Shortcuts"
 description: "How to manage keyboard shortcuts?"
-titleIcon: "fas fa-keyboard"
+titleIcon: "fa-solid fa-keyboard"
 categories: ["Functionalities"]
 tags: ["Configuration"]
 ---

diff --git a/exampleSite/content/english/functionalities/sidebar/_index.md b/exampleSite/content/english/functionalities/sidebar/_index.md
@@ -2,7 +2,7 @@
 weight: 3010
 title: "Sidebar"
 description: "How to manage the sidebar?"
-titleIcon: "fas fa-bars"
+titleIcon: "fa-solid fa-bars"
 categories: ["Functionalities"]
 ---
 

diff --git a/exampleSite/content/english/functionalities/sidebar/icon_simple_page.md b/exampleSite/content/english/functionalities/sidebar/icon_simple_page.md
@@ -2,7 +2,7 @@
 weight: 3150
 title: "Single page with icon"
 description: "Sidebar: Single page with icon"
-titleIcon: "fas fa-icons"
+titleIcon: "fa-solid fa-icons"
 categories: ["Functionalities"]
 ---
 
@@ -33,6 +33,6 @@ Two possible parametrization (with the several FontAwesome classes for each para
     codelang="md"
 >}}
 ---
-titleIcon: "fas fa-icons"
+titleIcon: "fa-solid fa-icons"
 ---
 {{< /snippet >}}
diff --git a/exampleSite/content/english/functionalities/taxonomies.md b/exampleSite/content/english/functionalities/taxonomies.md
@@ -2,7 +2,7 @@
 weight: 3170
 title: "Taxonomies"
 description: "How to manage taxonomies?"
-titleIcon: "fas fa-tags"
+titleIcon: "fa-solid fa-tags"
 categories: ["Functionalities"]
 tags: ["Configuration"]
 ---
@@ -25,5 +25,5 @@ A logo can be associated to a taxonomy, that will appear in the navigation bar m
 [params]
   [params.taxonomies]
     [params.taxonomies.categories]
-      icon = "fas fa-th"
+      icon = "fa-solid fa-table-cells"
 ```
diff --git a/exampleSite/content/english/functionalities/thirdparty_imports.md b/exampleSite/content/english/functionalities/thirdparty_imports.md
@@ -2,7 +2,7 @@
 weight: 3190
 title: "Thridparties imports"
 description: "How to manage the import of external libraries or thirdparties code?"
-titleIcon: "fas fa-sign-in-alt fa-rotate-90"
+titleIcon: "fa-solid fa-right-to-bracket fa-rotate-90"
 categories: ["Functionalities"]
 tags: ["Configuration"]
 ---

diff --git a/exampleSite/content/english/functionalities/toc.md b/exampleSite/content/english/functionalities/toc.md
@@ -2,7 +2,7 @@
 weight: 3180
 title: "Table of contents"
 description: "How to manage table of contents?"
-titleIcon: "fas fa-list-ul"
+titleIcon: "fa-solid fa-list-ul"
 categories: ["Functionalities"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/markdown/_index.md b/exampleSite/content/english/markdown/_index.md
@@ -2,7 +2,7 @@
 weight: 2000
 title: "The Markdown"
 description: "Descriptions and examples of markdown syntaxes used in Hugo."
-titleIcon: "fab fa-markdown"
+titleIcon: "fa-brands fa-markdown"
 categories: ["Markdown"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/shortcodes/_index.md b/exampleSite/content/english/shortcodes/_index.md
@@ -2,7 +2,7 @@
 weight: 4000
 title: "Shortcodes"
 description: "Descriptions and examples of the theme shortcodes."
-titleIcon: "fas fa-file-code"
+titleIcon: "fa-solid fa-file-code"
 categories: ["Shortcode"]
 tags: ["Content management"]
 ---

diff --git a/exampleSite/content/english/sitemap/_index.md b/exampleSite/content/english/sitemap/_index.md
@@ -2,7 +2,7 @@
 weight: 5000
 title: "Sitemap"
 description: "Sitemap."
-titleIcon: "fas fa-sitemap"
+titleIcon: "fa-solid fa-sitemap"
 categories: ["Miscellaneous"]
 ---
 

diff --git a/exampleSite/content/english/theme/_index.md b/exampleSite/content/english/theme/_index.md
@@ -2,7 +2,7 @@
 weight: 1000
 title: "Theme"
 description: "How to use the theme?"
-titleIcon: "fas fa-cog"
+titleIcon: "fa-solid fa-user-gear"
 categories: ["Theme"]
 ---
 

diff --git a/exampleSite/content/french/functionalities/_index.md b/exampleSite/content/french/functionalities/_index.md
@@ -2,7 +2,7 @@
 weight: 3000
 title: "Fonctionnalités"
 description: "Descriptions et exemples des fonctionnalités du thème."
-titleIcon: "fas fa-cubes"
+titleIcon: "fa-solid fa-cubes"
 categories: ["Fonctionnalités"]
 tags: ["Gestion du contenu"]
 ---

diff --git a/exampleSite/content/french/functionalities/error404.md b/exampleSite/content/french/functionalities/error404.md
@@ -2,7 +2,7 @@
 weight: 3260
 title: "404"
 description: "Comment gérér la page 404 ?"
-titleIcon: "far fa-times-circle"
+titleIcon: "fa-solid fa-circle-xmark"
 categories: ["Fonctionnalités"]
 ---
 

diff --git a/exampleSite/content/french/functionalities/helpers_js.md b/exampleSite/content/french/functionalities/helpers_js.md
@@ -2,7 +2,7 @@
 weight: 3230
 title: "Fonctions d'aide Javascript"
 description: "Comment utiliser les fonctions d'aide Javascript?"
-titleIcon: "fab fa-js-square"
+titleIcon: "fa-brands fa-js"
 categories: ["Fonctionnalités"]
 tags: ["Configuration"]
 ---

diff --git a/exampleSite/content/french/functionalities/mermaid.md b/exampleSite/content/french/functionalities/mermaid.md
@@ -2,7 +2,7 @@
 weight: 3210
 title: "Mermaid"
 description: "Comment utiliser Mermaid ?"
-titleIcon: "fas fa-chart-bar"
+titleIcon: "fa-solid fa-chart-column"
 categories: ["Fonctionnalités"]
 tags: ["Gestion du contenu"]
 ---