Dmetzgar fontawesome latest (5.11.2) (#234)

* Pointing to current font awesome

* Update to latest font awesome

* Updated fa icons for example site

* Fixed all missing classes, fixed styles according new classes.

* Update head.html

* File-alt instead of file-code

README.md

@@ -200,13 +200,13 @@ The social links on the right side are configured as a top-level menu.
     weight = 1
     name = "GitHub"
     url = "https://github.com/devcows/hugo-universal-theme"
-    pre = "<i class='fa fa-github'></i>"
+    pre = "<i class='fas fa-2x fa-github'></i>"
 
 [[menu.topbar]]
     weight = 2
     name = "Facebook"
     url = "http://facebook.com"
-    pre = "<i class='fa fa-facebook'></i>"
+    pre = "<i class='fas fa-2x fa-facebook'></i>"
 ```
 
 ### Blog post thumbnails
@@ -279,7 +279,7 @@ A feature file looks like this.
 ```yaml
 weight: 4
 name: "Consulting"
-icon: "fa fa-lightbulb-o"
+icon: "fas fa-lightbulb-o"
 description: "Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring."
 ```
 
@@ -334,7 +334,7 @@ You can enable it in the configuration file.
 ```toml
 [params.see_more]
     enable = true
-    icon = "fa fa-file-code-o"
+    icon = "far fa-file-alt"
     title = "Do you want to see more?"
     subtitle = "We have prepared for you more than 40 different HTML pages, including 5 variations of homepage."
     link_url = "http://your-site.com/more"

exampleSite/config.toml

@@ -47,25 +47,25 @@ paginate = 10
     weight = 1
     name = "GitHub"
     url = "https://github.com/devcows/hugo-universal-theme"
-    pre = "<i class='fa fa-github'></i>"
+    pre = "<i class='fab fa-2x fa-github'></i>"
 
 [[menu.topbar]]
     weight = 2
     name = "Facebook"
     url = "http://facebook.com"
-    pre = "<i class='fa fa-facebook'></i>"
+    pre = "<i class='fab fa-2x fa-facebook'></i>"
 
 [[menu.topbar]]
     weight = 3
     name = "Twitter"
     url = "http://twitter.com"
-    pre = "<i class='fa fa-twitter'></i>"
+    pre = "<i class='fab fa-2x fa-twitter'></i>"
 
 [[menu.topbar]]
     weight = 4
     name = "Email"
     url = "mailto:[email protected]"
-    pre = "<i class='fa fa-envelope'></i>"
+    pre = "<i class='fas fa-2x fa-envelope'></i>"
 
 [params]
     viewMorePostLink = "/blog/"
@@ -128,8 +128,8 @@ paginate = 10
 [params.topbar]
     enable = true
     text = """<p class="hidden-sm hidden-xs">Contact us on +420 777 555 333 or [email protected].</p>
-      <p class="hidden-md hidden-lg"><a href="#" data-animate-hover="pulse"><i class="fa fa-phone"></i></a>
-      <a href="#" data-animate-hover="pulse"><i class="fa fa-envelope"></i></a>
+      <p class="hidden-md hidden-lg"><a href="#" data-animate-hover="pulse"><i class="fas fa-phone"></i></a>
+      <a href="#" data-animate-hover="pulse"><i class="fas fa-envelope"></i></a>
       </p>
       """
 
@@ -161,7 +161,7 @@ paginate = 10
 
 [params.see_more]
     enable = true
-    icon = "fa fa-file-code-o"
+    icon = "far fa-file-alt"
     title = "Do you want to see more?"
     subtitle = "We have prepared for you more than 40 different HTML pages, including 5 variations of homepage."
     link_url = "#"

exampleSite/data/features/consulting.yaml

@@ -1,4 +1,4 @@
 weight: 4
 name: "Consulting"
-icon: "fa fa-lightbulb-o"
+icon: "fas fa-lightbulb"
 description: "Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring."

exampleSite/data/features/email.yaml

@@ -1,4 +1,4 @@
 weight: 5
 name: "Email Marketing"
-icon: "fa fa-envelope-o"
+icon: "far fa-envelope"
 description: "Advantage old had otherwise sincerity dependent additions. It in adapted natural hastily is justice. Six draw you him full not mean evil."

exampleSite/data/features/print.yaml

@@ -1,4 +1,4 @@
 weight: 2
 name: "Print"
-icon: "fa fa-print"
+icon: "fas fa-print"
 description: "Advantage old had otherwise sincerity dependent additions. It in adapted natural hastily is justice. Six draw you him full not mean evil."

exampleSite/data/features/seo.yaml

@@ -1,4 +1,4 @@
 weight: 3
 name: "SEO and SEM"
-icon: "fa fa-globe"
+icon: "fas fa-globe"
 description: "Am terminated it excellence invitation projection as. She graceful shy believed distance use nay. Lively is people so basket ladies window expect."

exampleSite/data/features/uiux.yaml

@@ -1,4 +1,4 @@
 weight: 6
 name: "UI/UX"
-icon: "fa fa-user"
+icon: "fas fa-user"
 description: "Am terminated it excellence invitation projection as. She graceful shy believed distance use nay. Lively is people so basket ladies window expect."

exampleSite/data/features/webdesign.yaml

@@ -1,4 +1,4 @@
 weight: 1
 name: "Webdesign"
-icon: "fa fa-desktop"
+icon: "fas fa-desktop"
 description: "Fifth abundantly made Give sixth hath. Cattle creature i be don't them behold green moved fowl Moved life us beast good yielding. Have bring."

layouts/404.html

@@ -29,7 +29,7 @@
                         <h3>We are sorry - this page is not here anymore</h3>
                         <h4 class="text-muted">Error 404 - Page not found</h4>
 
-                        <p class="buttons"><a href="{{ .Site.BaseURL }}" class="btn btn-template-main"><i class="fa fa-home"></i> Go to Homepage</a>
+                        <p class="buttons"><a href="{{ .Site.BaseURL }}" class="btn btn-template-main"><i class="fas fa-home"></i> Go to Homepage</a>
                         </p>
                     </div>
 

layouts/_default/list.html

@@ -52,7 +52,7 @@ <h2><a href="{{ .Permalink }}">{{ .Title }}</a></h2>
 
                                         </p>
                                         <p class="date-comments">
-                                            <a href="{{ .Permalink }}"><i class="fa fa-calendar-o"></i> {{ .Date.Format .Site.Params.date_format }}</a>
+                                            <a href="{{ .Permalink }}"><i class="far fa-calendar"></i> {{ .Date.Format .Site.Params.date_format }}</a>
                                         </p>
                                     </div>
                                     <p class="intro">{{ .Summary }}</p>

layouts/partials/contact.html

@@ -37,7 +37,7 @@ <h3>{{ i18n "contactForm" }}</h3>
                         </div>
 
                         <div class="col-sm-12 text-center">
-                          <button type="submit" class="btn btn-template-main"><i class="fa fa-envelope-o"></i>{{ i18n "contactSend" }}</button>
+                          <button type="submit" class="btn btn-template-main"><i class="far fa-envelope"></i>{{ i18n "contactSend" }}</button>
 
                         </div>
                     </div>

layouts/partials/head.html

@@ -21,7 +21,7 @@
   <link href='//fonts.googleapis.com/css?family=Roboto:400,100,100italic,300,300italic,500,700,800' rel='stylesheet' type='text/css'>
 
   <!-- Bootstrap and Font Awesome CSS -->
-  <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="//use.fontawesome.com/releases/v5.11.2/css/all.css">
   <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
 
   <!-- CSS animations  -->

layouts/partials/nav.html

@@ -12,7 +12,7 @@
                 <div class="navbar-buttons">
                     <button type="button" class="navbar-toggle btn-template-main" data-toggle="collapse" data-target="#navigation">
                       <span class="sr-only">{{ i18n "navToggle" }}</span>
-                        <i class="fa fa-align-justify"></i>
+                        <i class="fas fa-align-justify"></i>
                     </button>
                 </div>
             </div>
@@ -47,7 +47,7 @@
                         <input type="text" class="form-control" placeholder="Search">
                         <span class="input-group-btn">
 
-                    <button type="submit" class="btn btn-template-main"><i class="fa fa-search"></i></button>
+                    <button type="submit" class="btn btn-template-main"><i class="fas fa-search"></i></button>
 
                 </span>
                     </div>

layouts/partials/recent_posts.html

@@ -30,7 +30,7 @@ <h2>{{ .Site.Params.recent_posts.title }}</h2>
                             <div class="bg"></div>
                             <div class="text">
                                 <p class="buttons">
-                                    <a href="{{ .Permalink }}" class="btn btn-template-transparent-primary"><i class="fa fa-link"></i> {{ i18n "readMore" }}</a>
+                                    <a href="{{ .Permalink }}" class="btn btn-template-transparent-primary"><i class="fas fa-link"></i> {{ i18n "readMore" }}</a>
                                 </p>
                             </div>
                         </div>

layouts/partials/testimonials.html

@@ -23,7 +23,7 @@ <h2>{{ .Site.Params.testimonials.title }}</h2>
                                 <p>{{ .text | markdownify }}</p>
                             </div>
                             <div class="bottom">
-                                <div class="icon"><i class="fa fa-quote-left"></i>
+                                <div class="icon"><i class="fas fa-quote-left"></i>
                                 </div>
                                 <div class="name-picture">
                                     <img class="" alt="" src="{{ .avatar | absURL }}">

layouts/partials/widgets/search.html

@@ -12,7 +12,7 @@ <h3 class="panel-title">{{ i18n "searchTitle" }}</h3>
                 <input type="search" name="q" class="form-control" placeholder="{{ i18n "searchTitle" }}">
                 <input type="hidden" name="sitesearch" value="{{ .Site.BaseURL }}">
                 <span class="input-group-btn">
-                    <button type="submit" class="btn btn-template-main"><i class="fa fa-search"></i></button>
+                    <button type="submit" class="btn btn-template-main"><i class="fas fa-search"></i></button>
                 </span>
             </div>
         </form>

layouts/partials/widgets/tags.html

@@ -9,7 +9,7 @@ <h3 class="panel-title">{{ i18n "tagsTitle" }}</h3>
     <div class="panel-body">
         <ul class="tag-cloud">
             {{ range $name, $items := .Site.Taxonomies.tags }}
-            <li><a href="{{ $.Site.BaseURL }}tags/{{ $name | urlize | lower }}"><i class="fa fa-tags"></i> {{ $name }}</a>
+            <li><a href="{{ $.Site.BaseURL }}tags/{{ $name | urlize | lower }}"><i class="fas fa-tags"></i> {{ $name }}</a>
             </li>
             {{ end }}
         </ul>

static/css/style.blue.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #467fbf;
   width: 30px;

static/css/style.default.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #38a7bb;
   width: 30px;

static/css/style.green.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #6aae7a;
   width: 30px;

static/css/style.marsala.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #955251;
   width: 30px;

static/css/style.pink.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #c27baa;
   width: 30px;

static/css/style.red.css

@@ -55,8 +55,8 @@ button {
   -moz-transition: all 0.2s ease-out;
   transition: all 0.2s ease-out;
 }
-a i.fa,
-button i.fa {
+a i[class^="fa"],
+button i[class^="fa"] {
   margin: 0 5px;
 }
 .clickable {
@@ -107,11 +107,11 @@ div.section {
   text-transform: uppercase;
   letter-spacing: 0.06em;
 }
-.heading h1 i.fa,
-.heading h2 i.fa,
-.heading h3 i.fa,
-.heading h4 i.fa,
-.heading h5 i.fa {
+.heading h1 i[class^="fa"],
+.heading h2 i[class^="fa"],
+.heading h3 i[class^="fa"],
+.heading h4 i[class^="fa"],
+.heading h5 i[class^="fa"] {
   display: inline-block;
   background: #da4d4d;
   width: 30px;