add socials

majak_uistyleguide/templates/patterns/molecules/candidates/candidate_primary_box.html

@@ -4,4 +4,5 @@
   description="{{ description }}"
   url="{{ url }}"
   image-source="{{ image_source }}"
+  :social-links="{{ social_links }}"
 ></ui-candidate-primary-box>

majak_uistyleguide/templates/patterns/molecules/candidates/candidate_primary_box.yaml

@@ -3,3 +3,16 @@ context:
   image_source: '../../../../../static/images/mikulas-arrow.png'
   position: 'Europoslanec'
   description: 'Mikuláš Peksa (18. 6. 1986) vystudoval fyziku na Matematicko-fyzikální fakultě Univerzity Karlovy. V Německu pracoval jako správce Linuxových serverů a programátor v C++. Po návratu do Čech byl v roce 2017 zvolen poslancem PSP ČR, následně v roce 2019 poslancem Evropského parlamentu. Věnuje se zejména tématům spojeným s fungováním společnosti v digitálním věku.'
+  social_links:
+    -
+      icon: 'ico--facebook'
+      name: 'Facebook'
+      url: 'https://example.com'
+    -
+      icon: 'ico--instagram'
+      name: 'Instagram'
+      url: 'https://example.com'
+    -
+      icon: 'ico--web'
+      name: 'Stránky'
+      url: 'https://example.com'

majak_uistyleguide/templates/patterns/templates/district/elections/elections.html

@@ -9,8 +9,8 @@
 
     <main role="main">
       <template v-if="isCurrentView('view1')">
-        {% include 'patterns/organisms/candidates/elections/candidate_primary_list.html' with id='kandidati' %}
-        {% include "patterns/organisms/candidates/district/candidate_secondary_list.html" %}
+        {% include 'patterns/organisms/candidates/candidate_primary_list.html' with id='kandidati' %}
+        {% include "patterns/organisms/candidates/candidate_secondary_list.html" %}
       </template>
       <template v-if="isCurrentView('view2')">
         <div class="container--wide my-20">

majak_uistyleguide/templates/patterns/templates/elections/candidates/candidate_list.html

@@ -2,7 +2,7 @@
 {% include 'patterns/organisms/header/elections/candidates_header.html' with title='Kandidáti' %}
 
 <main role="main">
-  {% include "patterns/organisms/candidates/elections/candidate_primary_list.html" %}
+  {% include "patterns/organisms/candidates/candidate_primary_list.html" %}
   {% include "patterns/organisms/candidates/elections/candidate_secondary_list.html" %}
 </main>
 

majak_uistyleguide/templates/patterns/templates/elections/homepage/homepage.html

@@ -7,7 +7,7 @@
 <main role="main">
   {% include 'patterns/molecules/menus/elections/carousel.html' %}
 
-  {% include 'patterns/organisms/candidates/elections/candidate_primary_list.html' with id='kandidati' %}
+  {% include 'patterns/organisms/candidates/candidate_primary_list.html' with id='kandidati' %}
 
   {% include "patterns/organisms/candidates/elections/candidate_secondary_list.html" %}
 

majak_uistyleguide/templates/patterns/templates/main/program/program.html

@@ -59,7 +59,7 @@
               <template v-if="isCurrentSecondaryView('candidates')">
                 <div>
                   {% include "patterns/organisms/candidates/candidate_primary_list.html" %}
-                  {% include "patterns/organisms/candidates/district/candidate_secondary_list.html" %}
+                  {% include "patterns/organisms/candidates/candidate_secondary_list.html" %}
                 </div>
               </template>
 

src/js/components/CandidatePrimaryBox.vue

@@ -23,10 +23,28 @@
             {{ name }}
           </h2>
 
-          <p v-if="position" class="font-bold text-lg mt-[-0.5rem] mb-8">
+          <p v-if="position" class="font-bold text-lg mt-[-0.5rem] mb-3">
             {{ position }}
           </p>
 
+          <div v-if="!socialLinks" class="mb-5"></div>
+
+          <ul
+            v-if="socialLinks"
+            class="flex gap-2 mb-6"
+          >
+            <li
+              v-for="social of socialLinks"
+            >
+              <a
+                :href="social.url"
+                target="_blank"
+              >
+                <i :class="social.icon"></i>
+              </a>
+            </li>
+          </ul>
+
           <p class="text-lg mb-8 lg:mb-16">
             {{ description }}
           </p>
@@ -81,7 +99,7 @@
 <script>
 export default {
   name: "CandidatePrimaryBox",
-  props: ["name", "position", "description", "url", "imageSource"],
+  props: ["name", "position", "description", "url", "imageSource", "socialLinks"],
   mounted () {
     var intersectionOptions = {
       rootMargin: '0px',

src/js/components/card_program/CardProgramItem.vue

@@ -47,7 +47,7 @@
             :
           'p-6 xl:p-12'
         ) + ' ' + (
-          (openPointBackgroundClass !== null) ?
+          (openPointBackgroundClass !== undefined) ?
           openPointBackgroundClass :
           'bg-white'
         )