flip cards with icons

majak_uistyleguide/templates/patterns/molecules/boxes/flip_card_box.html

@@ -27,9 +27,25 @@
           "
         >{{ title }}</h1>
 
+        {% if icon_url %}
+          {{ icon_url }}
+          <img
+            class="
+              absolute w-32 h-32 bottom-8 right-8
+            "
+            src="{{ icon_url }}"
+          >
+        {% endif %}
+
         <div
           class="
-            absolute bottom-4 right-4 block text-white opacity-75 text-right leading-5 font-condensed
+            {% if image_url %}
+              right-4 bottom-4 text-right
+            {% elif icon_url %}
+              bottom-8 left-8 text-left
+            {% endif %}
+
+            absolute block text-white opacity-75 leading-5 font-condensed
 
             md:hidden
           "

majak_uistyleguide/templates/patterns/molecules/boxes/flip_card_box.yaml

@@ -3,6 +3,7 @@ context:
     Staň se členkou
     nebo členem
   image_url: '../../../../../static/images/onboarding/member.png'
+  icon_url: ''
   content: |-
     <h2>
       Chceš se aktivně zapojit do politiky? Rád bys byl součástí pozitivních změn? Staň se naším členem!

majak_uistyleguide/templates/patterns/organisms/cards/flip_card_list.html

 <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 content-stretch gap-4">
   {% for card in cards %}
-    {% include 'patterns/molecules/boxes/flip_card_box.html' with title=card.title image_url=card.image_url content=card.content button_text=card.button_text %}
+    {% include 'patterns/molecules/boxes/flip_card_box.html' with title=card.title image_url=card.image_url icon_url=card.icon_url content=card.content button_text=card.button_text %}
   {% endfor %}
 </div>

majak_uistyleguide/templates/patterns/organisms/cards/flip_card_list.yaml

@@ -4,7 +4,7 @@ context:
       title: |-
         Staň se členkou
         nebo členem
-      image_url: '../../../../../static/images/onboarding/member.webp'
+      icon_url: '../../../../../static/images/onboarding/member.webp'
       content: |-
         <h2>
           Chceš se aktivně zapojit do politiky? Rád bys byl součástí pozitivních změn? Staň se naším členem!