senat campaign: Update styles and icons

senat_campaign/templates/senat_campaign/base.html

@@ -48,11 +48,11 @@
 
   <!-- Bootstrap CSS -->
   <link rel="stylesheet" href="{% static "senat_campaign/vendor/bootstrap-4.4.1/css/bootstrap.min.css" %}">
-  <link rel="stylesheet" href="{% static "senat_campaign/vendor/fontawesome/css/all.css" %}">
   <link rel="stylesheet" href="{% static "senat_campaign/vendor/fancybox/jquery.fancybox.min.css" %}">
 
   <!-- Styles -->
-  <link href="{% static "senat_campaign/css/style.css" %}" rel="stylesheet">
+  <link href="{% static "senat_campaign/assets/css/style.css" %}" rel="stylesheet">
+  <link href="{% static "senat_campaign/assets/css/icons.css" %}" rel="stylesheet">
 
   {% if not request.is_preview and web_settings.matomo_id %}
   <!-- Matomo -->
@@ -88,7 +88,7 @@
         <div class="col-md-6 text-right">
           {% if web_settings.has_donations %}
           {# TODO #}
-          <a href="#" class="btn btn-success support_buton btn-sm">Přispěj!<i class="fal fa-heart ml-2" title="Ikona srdce"></i></a>
+          <a href="#" class="btn btn-success support_buton btn-sm">Přispěj!<i class="icon-heart ml-2" title="Ikona srdce"></i></a>
           {% endif %}
         </div>
       </div>
@@ -171,7 +171,7 @@
         </div>
         {% if web_settings.has_donations %}
         {# TODO #}
-        <a href="#" class="btn btn-success support_buton btn-sm d-xl-none mb-3">Přispěj!<i class="fal fa-heart ml-2" title="Ikona srdce"></i></a>
+        <a href="#" class="btn btn-success support_buton btn-sm d-xl-none mb-3">Přispěj!<i class="icon-heart ml-2" title="Ikona srdce"></i></a>
         {% endif %}
       </div><!-- /navigation -->
     </div><!-- /container -->
@@ -250,7 +250,7 @@
   <script src="{% static "senat_campaign/vendor/bootstrap-4.4.1/js/bootstrap.min.js" %}"></script>
   <script src="{% static "senat_campaign/vendor/lazysizes/lazysizes.min.js" %}"></script>
   <script src="{% static "senat_campaign/vendor/fancybox/jquery.fancybox.min.js" %}"></script>
-  <script src="{% static "senat_campaign/js/scripts.js" %}"></script>
+  <script src="{% static "senat_campaign/assets/js/scripts.js" %}"></script>
 
 </body>
 </html>

senat_campaign/templates/senat_campaign/senat_campaign_home_page.html

@@ -17,7 +17,7 @@
             <div class="row align-items-center">
               {% if web_settings.has_program %}
               <div class="col-12 col-lg-auto mb-4 mb-lg-0">
-                <a href="#priority" class="btn btn-dark btn-lg js-scroll-anchor">Moje priority <i class="fal fa-chevron-right ml-2"></i></a>
+                <a href="#priority" class="btn btn-dark btn-lg js-scroll-anchor">Moje priority <i class="icon-chevron-right ml-2"></i></a>
               </div><!-- /column -->
               {% endif %}
               <div class="col-12 col-lg-auto">
@@ -31,7 +31,7 @@
 
         <div class="col-12 col-md-5 offset-lg-1 col-lg-4 text-center">
           {% if page.top_photo %}
-          {% image page.top_photo original as top_photo %}
+          {% image page.top_photo width-350 as top_photo %}
           <img data-src="{{ top_photo.url }}" class="lazyload img-fluid mb-4" alt="{{ web_settings.full_name }}">
           {% endif %}
           <h3 class="lead mb-0">{% if page.claim %}„{{ page.claim }}“{% endif %}</h3>
@@ -56,7 +56,7 @@
               <ul class="priorities__list">
                 {% for item in program_page.committee_preference %}
                 <li>
-                  <span class="bullet"><i class="fal fa-check"></i></span>
+                  <span class="bullet"><i class="icon-check"></i></span>
                   <span class="text">{% include_block item %}</span>
                 </li>
                 {% endfor %}
@@ -65,7 +65,7 @@
           </div><!-- /priorities__box -->
 
           <a href="{% pageurl program_page %}" class="btn btn-dark btn-block btn-lg priorities__button d-none d-lg-block">Podrobný
-            program <i class="fal fa-chevron-right ml-2"></i></a>
+            program <i class="icon-chevron-right ml-2"></i></a>
 
         </div><!-- /column -->
         <div class="col-12 col-lg-7 offset-lg-1">
@@ -93,7 +93,7 @@
 
         <div class="col-12 d-lg-none">
           <a href="{% pageurl program_page %}" class="btn btn-dark btn-block btn-lg priorities__button mt-4 ">Podrobný program <i
-              class="fal fa-chevron-right ml-2"></i></a>
+              class="icon-chevron-right ml-2"></i></a>
         </div>
 
       </div> <!-- /row -->
@@ -142,7 +142,7 @@
         <p class="mb-0">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cum sociis natoque penatibus et magnis, nascetur ridiculus mus. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus. Pellentesque pretium lectus id turpis.</p>
         </div>
         <div class="col-md-5 col-lg-4 text-md-center">
-          <a href="#" class="btn btn-success support_buton btn-lg">Podpořte mě<i class="fal fa-heart ml-2" title="Ikona srdce"></i></a>
+          <a href="#" class="btn btn-success support_buton btn-lg">Podpořte mě<i class="icon-heart ml-2" title="Ikona srdce"></i></a>
         </div>
       </div><!-- /row -->
     </div> <!-- /container -->
@@ -177,7 +177,7 @@
       </div> <!-- /row -->
 
       <a href="{{ news_url }}" class="btn btn-dark btn-lg my-2">Všechny aktuality <i
-          class="fal fa-chevron-right ml-2"></i></a>
+          class="icon-chevron-right ml-2"></i></a>
 
     </div> <!-- /container -->
   </section>
@@ -191,12 +191,12 @@
       <div class="calendar">
         <div class="calendar__left">
           <div class="calendar__icon">
-            <i class="fal fa-calendar"></i>
+            <i class="icon-calendar"></i>
           </div><!-- /calendar__icon -->
           <div class="calendar__left-content">
             <h3 class="lead mb-3">Kalendář akcí</h3>
             <button class="btn btn-light btn-lg" data-toggle="modal" data-target="#calendarModal">Všechny akce <i
-                class="fal fa-chevron-right ml-2"></i></button>
+                class="icon-chevron-right ml-2"></i></button>
           </div><!-- /calendar__left-content -->
         </div><!-- /calendar__left -->
         <div class="calendar__right">
@@ -231,7 +231,7 @@
       <a class="finance__item" href="{{ item.value.doc.url }}" target="_blank">
       {% endif %}
         <div class="finance__icon">
-          <i class="fal fa-external-link"></i>
+          <i class="icon-external-link"></i>
         </div>
         <div class="finance__content">
           <h6>{{ item.value.label }}</h6>

senat_campaign/templates/senat_campaign/senat_campaign_news_page.html

@@ -42,14 +42,14 @@
           <div class="article__sharing-box">
             <div class="card-body">
               <div class="sharing-box__content">
-                <div class="icon"><i class="fas fa-heart"></i></div>
+                <div class="icon"><i class="icon-heart"></i></div>
                 <div class="text"><h3 class="lead">Sdílení je aktem lásky</h3></div>
               </div>
               <div class="sharing-buttons">
                 {# TODO #}
-                <a href="#" class="btn btn-facebook"><i class="fab fa-facebook-f"></i></a>
-                <a href="#" class="btn btn-twitter"><i class="fab fa-twitter"></i></a>
-                <a href="#" class="btn btn-linkedin"><i class="fab fa-linkedin"></i></a>
+                <a href="#" class="btn btn-facebook"><i class="icon-facebook-f"></i></a>
+                <a href="#" class="btn btn-twitter"><i class="icon-twitter"></i></a>
+                <a href="#" class="btn btn-linkedin"><i class="icon-linkedin"></i></a>
               </div>
             </div>
             <div class="image"><img data-src="{% static "senat_campaign/img/vlajka.jpg" %}" class="img-fluid lazyload" alt="Vlajka pirátů"></div>
@@ -85,7 +85,7 @@
 
       </div><!-- /row -->
 
-      <a href="{% pageurl page.get_parent %}" class="btn btn-dark btn-lg uvod__button my-2"><i class="fal fa-chevron-left mr-2"></i> Aktuality</a>
+      <a href="{% pageurl page.get_parent %}" class="btn btn-dark btn-lg uvod__button my-2"><i class="icon-chevron-left mr-2"></i> Aktuality</a>
 
     </div><!-- /container -->
   </section>

senat_campaign/templates/senat_campaign/senat_campaign_program_page.html

@@ -31,14 +31,14 @@
           <div class="article__sharing-box">
             <div class="card-body">
               <div class="sharing-box__content">
-                <div class="icon"><i class="fas fa-heart"></i></div>
+                <div class="icon"><i class="icon-heart"></i></div>
                 <div class="text"><h3 class="lead">Sdílení je aktem lásky</h3></div>
               </div>
               <div class="sharing-buttons">
                 {# TODO #}
-                <a href="#" class="btn btn-facebook"><i class="fab fa-facebook-f"></i></a>
-                <a href="#" class="btn btn-twitter"><i class="fab fa-twitter"></i></a>
-                <a href="#" class="btn btn-linkedin"><i class="fab fa-linkedin"></i></a>
+                <a href="#" class="btn btn-facebook"><i class="icon-facebook-f"></i></a>
+                <a href="#" class="btn btn-twitter"><i class="icon-twitter"></i></a>
+                <a href="#" class="btn btn-linkedin"><i class="icon-linkedin"></i></a>
               </div>
             </div>
             <div class="image"><img data-src="{% static "senat_campaign/img/vlajka.jpg" %}" class="img-fluid lazyload" alt="Vlajka pirátů"></div>

senat_campaign/templates/senat_campaign/socials_snippet.html

 {% if web_settings.facebook %}
-<a href="{{ web_settings.facebook }}" target="_blank"><i class="fab fa-facebook-f" title="Facebooková stránka"></i></a>
+<a href="{{ web_settings.facebook }}" target="_blank"><i class="icon-facebook-f" title="Facebooková stránka"></i></a>
 {% endif %}
 {% if web_settings.twitter %}
-<a href="{{ web_settings.twitter }}" target="_blank"><i class="fab fa-twitter" title="Profil na Twitteru"></i></a>
+<a href="{{ web_settings.twitter }}" target="_blank"><i class="icon-twitter" title="Profil na Twitteru"></i></a>
 {% endif %}
 {% if web_settings.instagram %}
-<a href="{{ web_settings.instagram }}" target="_blank"><i class="fab fa-instagram" title="Profil na Instagramu"></i></a>
+<a href="{{ web_settings.instagram }}" target="_blank"><i class="icon-instagram" title="Profil na Instagramu"></i></a>
 {% endif %}
 {% if web_settings.linkedin %}
-<a href="{{ web_settings.linkedin }}" target="_blank"><i class="fab fa-linkedin" title="Profil na LinkedIn"></i></a>
+<a href="{{ web_settings.linkedin }}" target="_blank"><i class="icon-linkedin" title="Profil na LinkedIn"></i></a>
 {% endif %}