Merge branch 'feat/redesign' into 'master'

Feat/redesign

See merge request !29

majak_uistyleguide/settings/base.py

 from pathlib import Path
 
 import environ
-import sentry_sdk
-
-from sentry_sdk.integrations.django import DjangoIntegration
 
 
 ROOT_DIR = Path(__file__).parents[2]
@@ -86,6 +83,11 @@ TEMPLATES = [
 
 # SENTRY
 # ------------------------------------------------------------------------------
+try:
+    import sentry_sdk
+
+    from sentry_sdk.integrations.django import DjangoIntegration
+
     SENTRY_DSN = env.str("SENTRY_DSN", default="")
 
     if SENTRY_DSN != "":
@@ -96,6 +98,8 @@ if SENTRY_DSN != "":
             ],
             send_default_pii=True,
         )
+except ImportError:
+    pass
 
 
 # STATIC

majak_uistyleguide/static/images/district/logo-full-black.svg

 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
-   width="237.9003"
-   height="40.554771"
-   viewBox="0 0 237.90029 40.554772"
+   width="154.54076"
+   height="40.335541"
+   viewBox="0 0 154.54075 40.335541"
    version="1.1"
    id="svg24"
    xmlns="http://www.w3.org/2000/svg"
@@ -11,7 +11,7 @@
      id="defs28" />
   <g
      id="logo-flag-text-white"
-     transform="translate(-288.547,-170.28477)"
+     transform="translate(-288.547,-170.504)"
      style="fill:#000000">
     <g
        id="Group_11"
@@ -165,24 +165,5 @@
      width="1.1317097"
      height="40.189453"
      x="153.40904"
-     y="0.36531809" />
-  <g
-     aria-label="Eurovolby"
-     id="text395"
-     style="font-size:21.3333px;font-family:'Roboto Condensed';-inkscape-font-specification:'Roboto Condensed, '"
-     transform="translate(-9.9142337e-8,0.2192336)">
-    <g
-       id="text1"
-       style="fill:#1a1a1a"
-       aria-label="Pardubický&#10;kraj">
-      <path
-         style="font-family:'Bebas Neue';-inkscape-font-specification:'Bebas Neue'"
-         d="m 158.96712,3.2367609 h 3.45599 q 1.74933,0 2.624,0.9386652 0.87466,0.9386652 0.87466,2.7519956 V 8.399419 q 0,1.813331 -0.87466,2.751996 -0.87467,0.938665 -2.624,0.938665 h -1.10933 v 6.079991 h -2.34666 z m 3.45599,6.7199891 q 0.576,0 0.85333,-0.319999 0.29867,-0.32 0.29867,-1.087998 V 6.7780886 q 0,-0.7679987 -0.29867,-1.0879982 -0.27733,-0.3199995 -0.85333,-0.3199995 h -1.10933 V 9.95675 Z m 5.84532,-6.7199891 h 3.17867 l 2.43199,14.9333101 h -2.34666 l -0.42667,-2.965329 v 0.04267 h -2.66666 l -0.42667,2.922662 h -2.17599 z m 2.56,9.9839841 -1.04533,-7.3813215 h -0.0427 l -1.024,7.3813215 z m 4.18131,-9.9839841 h 3.47732 q 1.81333,0 2.64533,0.853332 0.832,0.8319987 0.832,2.5813292 V 7.588754 q 0,2.32533 -1.536,2.943995 v 0.04267 q 0.85334,0.256 1.19467,1.045332 0.36267,0.789332 0.36267,2.111996 v 2.623996 q 0,0.639999 0.0427,1.045332 0.0427,0.383999 0.21333,0.767999 h -2.38932 q -0.128,-0.362666 -0.17067,-0.682666 -0.0427,-0.319999 -0.0427,-1.151998 v -2.730662 q 0,-1.023999 -0.34133,-1.429332 -0.32,-0.405332 -1.13067,-0.405332 h -0.81066 v 6.39999 h -2.34666 z m 3.19999,6.3999901 q 0.704,0 1.04533,-0.362666 0.36267,-0.362666 0.36267,-1.215998 V 6.9060884 q 0,-0.8106653 -0.29867,-1.1733314 -0.27733,-0.3626661 -0.896,-0.3626661 H 177.3564 V 9.636751 Z m 5.39732,-6.3999901 h 3.584 q 1.74933,0 2.62399,0.9386652 0.87467,0.9386652 0.87467,2.7519956 V 14.47941 q 0,1.81333 -0.87467,2.751995 -0.87466,0.938666 -2.62399,0.938666 h -3.584 z m 3.54133,12.7999801 q 0.576,0 0.87467,-0.341333 0.32,-0.341333 0.32,-1.109332 V 6.8207552 q 0,-0.7679987 -0.32,-1.1093315 -0.29867,-0.3413328 -0.87467,-0.3413328 h -1.19466 V 16.036741 Z m 8.53332,2.346663 q -1.70666,0 -2.60266,-0.959999 -0.896,-0.981332 -0.896,-2.794662 V 3.2367609 h 2.34667 V 14.799409 q 0,0.767999 0.29866,1.109332 0.32,0.341333 0.896,0.341333 0.576,0 0.87467,-0.341333 0.32,-0.341333 0.32,-1.109332 V 3.2367609 h 2.26133 V 14.628743 q 0,1.81333 -0.896,2.794662 -0.896,0.959999 -2.60267,0.959999 z m 5.16267,-15.1466431 h 3.54133 q 1.81333,0 2.64533,0.853332 0.83199,0.8319987 0.83199,2.5813292 v 0.5973324 q 0,1.1519985 -0.38399,1.8773305 -0.36267,0.725332 -1.13067,1.045332 v 0.04267 q 1.74933,0.597333 1.74933,3.114662 v 1.279998 q 0,1.727997 -0.91733,2.645329 -0.896,0.895999 -2.64533,0.895999 h -3.69066 z m 3.26399,6.0799901 q 0.704,0 1.04534,-0.362666 0.36266,-0.362666 0.36266,-1.2159979 V 6.9060884 q 0,-0.8106653 -0.29866,-1.1733314 -0.27734,-0.3626661 -0.896,-0.3626661 h -1.13067 V 9.316751 Z m 0.42667,6.71999 q 0.61867,0 0.91733,-0.32 0.29867,-0.341333 0.29867,-1.151998 v -1.301331 q 0,-1.023999 -0.36267,-1.407998 -0.34133,-0.405333 -1.152,-0.405333 h -1.04533 v 4.58666 z m 4.92798,-12.7999801 h 2.34666 V 18.170071 h -2.34666 z m 7.40264,15.1466431 q -1.68533,0 -2.58133,-0.959999 -0.87466,-0.959998 -0.87466,-2.709329 V 6.6927554 q 0,-1.7493305 0.87466,-2.709329 0.896,-0.9599985 2.58133,-0.9599985 1.68533,0 2.56,0.9599985 0.896,0.9599985 0.896,2.709329 V 8.27142 h -2.21867 V 6.5434223 q 0,-1.3866644 -1.17333,-1.3866644 -1.17333,0 -1.17333,1.3866644 v 8.3413207 q 0,1.365331 1.17333,1.365331 1.17333,0 1.17333,-1.365331 v -2.282664 h 2.21867 v 2.111997 q 0,1.749331 -0.896,2.709329 -0.87467,0.959999 -2.56,0.959999 z m 4.86398,-15.1466431 h 2.34666 V 9.530084 l 2.98667,-6.2933231 h 2.34666 l -2.79466,5.4826581 2.83732,9.450652 h -2.45332 l -1.984,-6.65599 -0.93867,1.898664 v 4.757326 h -2.34666 z m 10.98664,8.5759861 -2.83733,-8.5759861 h 2.496 l 1.6,5.4826581 h 0.0427 l 1.6,-5.4826581 h 2.28266 l -2.83733,8.5759861 v 6.357324 h -2.34666 z m 1.38667,-12.0319806 h 2.55999 l -2.28266,2.4533294 h -1.77066 z"
-         id="path2" />
-      <path
-         style="font-family:'Bebas Neue';-inkscape-font-specification:'Bebas Neue'"
-         d="m 158.96744,22.267254 h 2.34666 v 6.293324 l 2.98666,-6.293324 h 2.34667 l -2.79467,5.482658 2.83733,9.450652 h -2.45333 l -1.98399,-6.655989 -0.93867,1.898663 v 4.757326 h -2.34666 z m 8.83198,0 h 3.47732 q 1.81333,0 2.64533,0.853332 0.832,0.831999 0.832,2.58133 v 0.917332 q 0,2.325329 -1.536,2.943995 v 0.04267 q 0.85334,0.255999 1.19467,1.045331 0.36266,0.789332 0.36266,2.111997 v 2.623996 q 0,0.639999 0.0427,1.045331 0.0427,0.384 0.21333,0.767999 h -2.38933 q -0.128,-0.362666 -0.17066,-0.682665 -0.0427,-0.32 -0.0427,-1.151999 v -2.730662 q 0,-1.023998 -0.34133,-1.429331 -0.32,-0.405333 -1.13067,-0.405333 h -0.81066 v 6.39999 h -2.34666 z m 3.19999,6.39999 q 0.704,0 1.04533,-0.362666 0.36267,-0.362666 0.36267,-1.215998 v -1.151998 q 0,-0.810665 -0.29867,-1.173331 -0.27733,-0.362667 -0.896,-0.362667 h -1.06666 v 4.26666 z m 7.21065,-6.39999 h 3.17866 l 2.432,14.93331 h -2.34666 l -0.42667,-2.965328 v 0.04267 h -2.66666 l -0.42667,2.922662 h -2.17599 z m 2.56,9.983985 -1.04533,-7.381322 h -0.0427 l -1.024,7.381322 z m 4.73597,5.034658 q -0.64,0 -1.088,-0.08533 v -2.13333 q 0.34134,0.08533 0.768,0.08533 0.704,0 1.04533,-0.341332 0.34134,-0.362666 0.34134,-1.087999 V 22.267254 h 2.34666 v 11.391982 q 0,1.834664 -0.85333,2.730663 -0.832,0.895998 -2.56,0.895998 z"
-         id="path3" />
-    </g>
-  </g>
+     y="0.14608809" />
 </svg>

majak_uistyleguide/static/images/district/logo-full-white.svg

 <?xml version="1.0" encoding="UTF-8" standalone="no"?>
 <svg
-   width="237.9003"
-   height="40.554771"
-   viewBox="0 0 237.90029 40.554772"
+   width="154.54076"
+   height="40.335541"
+   viewBox="0 0 154.54075 40.335541"
    version="1.1"
    id="svg24"
    xmlns="http://www.w3.org/2000/svg"
@@ -11,7 +11,7 @@
      id="defs28" />
   <g
      id="logo-flag-text-white"
-     transform="translate(-288.547,-170.28477)"
+     transform="translate(-288.547,-170.504)"
      style="fill:#ffffff">
     <g
        id="Group_11"
@@ -165,24 +165,5 @@
      width="1.1317097"
      height="40.189453"
      x="153.40904"
-     y="0.36531809" />
-  <g
-     aria-label="Eurovolby"
-     id="text395"
-     style="font-size:21.3333px;font-family:'Roboto Condensed';-inkscape-font-specification:'Roboto Condensed, ';fill:#ffffff"
-     transform="translate(-9.9142337e-8,0.2192336)">
-    <g
-       id="text1"
-       style="fill:#ffffff"
-       aria-label="Pardubický&#10;kraj">
-      <path
-         style="font-family:'Bebas Neue';-inkscape-font-specification:'Bebas Neue';fill:#ffffff"
-         d="m 158.96712,3.2367609 h 3.45599 q 1.74933,0 2.624,0.9386652 0.87466,0.9386652 0.87466,2.7519956 V 8.399419 q 0,1.813331 -0.87466,2.751996 -0.87467,0.938665 -2.624,0.938665 h -1.10933 v 6.079991 h -2.34666 z m 3.45599,6.7199891 q 0.576,0 0.85333,-0.319999 0.29867,-0.32 0.29867,-1.087998 V 6.7780886 q 0,-0.7679987 -0.29867,-1.0879982 -0.27733,-0.3199995 -0.85333,-0.3199995 h -1.10933 V 9.95675 Z m 5.84532,-6.7199891 h 3.17867 l 2.43199,14.9333101 h -2.34666 l -0.42667,-2.965329 v 0.04267 h -2.66666 l -0.42667,2.922662 h -2.17599 z m 2.56,9.9839841 -1.04533,-7.3813215 h -0.0427 l -1.024,7.3813215 z m 4.18131,-9.9839841 h 3.47732 q 1.81333,0 2.64533,0.853332 0.832,0.8319987 0.832,2.5813292 V 7.588754 q 0,2.32533 -1.536,2.943995 v 0.04267 q 0.85334,0.256 1.19467,1.045332 0.36267,0.789332 0.36267,2.111996 v 2.623996 q 0,0.639999 0.0427,1.045332 0.0427,0.383999 0.21333,0.767999 h -2.38932 q -0.128,-0.362666 -0.17067,-0.682666 -0.0427,-0.319999 -0.0427,-1.151998 v -2.730662 q 0,-1.023999 -0.34133,-1.429332 -0.32,-0.405332 -1.13067,-0.405332 h -0.81066 v 6.39999 h -2.34666 z m 3.19999,6.3999901 q 0.704,0 1.04533,-0.362666 0.36267,-0.362666 0.36267,-1.215998 V 6.9060884 q 0,-0.8106653 -0.29867,-1.1733314 -0.27733,-0.3626661 -0.896,-0.3626661 H 177.3564 V 9.636751 Z m 5.39732,-6.3999901 h 3.584 q 1.74933,0 2.62399,0.9386652 0.87467,0.9386652 0.87467,2.7519956 V 14.47941 q 0,1.81333 -0.87467,2.751995 -0.87466,0.938666 -2.62399,0.938666 h -3.584 z m 3.54133,12.7999801 q 0.576,0 0.87467,-0.341333 0.32,-0.341333 0.32,-1.109332 V 6.8207552 q 0,-0.7679987 -0.32,-1.1093315 -0.29867,-0.3413328 -0.87467,-0.3413328 h -1.19466 V 16.036741 Z m 8.53332,2.346663 q -1.70666,0 -2.60266,-0.959999 -0.896,-0.981332 -0.896,-2.794662 V 3.2367609 h 2.34667 V 14.799409 q 0,0.767999 0.29866,1.109332 0.32,0.341333 0.896,0.341333 0.576,0 0.87467,-0.341333 0.32,-0.341333 0.32,-1.109332 V 3.2367609 h 2.26133 V 14.628743 q 0,1.81333 -0.896,2.794662 -0.896,0.959999 -2.60267,0.959999 z m 5.16267,-15.1466431 h 3.54133 q 1.81333,0 2.64533,0.853332 0.83199,0.8319987 0.83199,2.5813292 v 0.5973324 q 0,1.1519985 -0.38399,1.8773305 -0.36267,0.725332 -1.13067,1.045332 v 0.04267 q 1.74933,0.597333 1.74933,3.114662 v 1.279998 q 0,1.727997 -0.91733,2.645329 -0.896,0.895999 -2.64533,0.895999 h -3.69066 z m 3.26399,6.0799901 q 0.704,0 1.04534,-0.362666 0.36266,-0.362666 0.36266,-1.2159979 V 6.9060884 q 0,-0.8106653 -0.29866,-1.1733314 -0.27734,-0.3626661 -0.896,-0.3626661 h -1.13067 V 9.316751 Z m 0.42667,6.71999 q 0.61867,0 0.91733,-0.32 0.29867,-0.341333 0.29867,-1.151998 v -1.301331 q 0,-1.023999 -0.36267,-1.407998 -0.34133,-0.405333 -1.152,-0.405333 h -1.04533 v 4.58666 z m 4.92798,-12.7999801 h 2.34666 V 18.170071 h -2.34666 z m 7.40264,15.1466431 q -1.68533,0 -2.58133,-0.959999 -0.87466,-0.959998 -0.87466,-2.709329 V 6.6927554 q 0,-1.7493305 0.87466,-2.709329 0.896,-0.9599985 2.58133,-0.9599985 1.68533,0 2.56,0.9599985 0.896,0.9599985 0.896,2.709329 V 8.27142 h -2.21867 V 6.5434223 q 0,-1.3866644 -1.17333,-1.3866644 -1.17333,0 -1.17333,1.3866644 v 8.3413207 q 0,1.365331 1.17333,1.365331 1.17333,0 1.17333,-1.365331 v -2.282664 h 2.21867 v 2.111997 q 0,1.749331 -0.896,2.709329 -0.87467,0.959999 -2.56,0.959999 z m 4.86398,-15.1466431 h 2.34666 V 9.530084 l 2.98667,-6.2933231 h 2.34666 l -2.79466,5.4826581 2.83732,9.450652 h -2.45332 l -1.984,-6.65599 -0.93867,1.898664 v 4.757326 h -2.34666 z m 10.98664,8.5759861 -2.83733,-8.5759861 h 2.496 l 1.6,5.4826581 h 0.0427 l 1.6,-5.4826581 h 2.28266 l -2.83733,8.5759861 v 6.357324 h -2.34666 z m 1.38667,-12.0319806 h 2.55999 l -2.28266,2.4533294 h -1.77066 z"
-         id="path2" />
-      <path
-         style="font-family:'Bebas Neue';-inkscape-font-specification:'Bebas Neue';fill:#ffffff"
-         d="m 158.96744,22.267254 h 2.34666 v 6.293324 l 2.98666,-6.293324 h 2.34667 l -2.79467,5.482658 2.83733,9.450652 h -2.45333 l -1.98399,-6.655989 -0.93867,1.898663 v 4.757326 h -2.34666 z m 8.83198,0 h 3.47732 q 1.81333,0 2.64533,0.853332 0.832,0.831999 0.832,2.58133 v 0.917332 q 0,2.325329 -1.536,2.943995 v 0.04267 q 0.85334,0.255999 1.19467,1.045331 0.36266,0.789332 0.36266,2.111997 v 2.623996 q 0,0.639999 0.0427,1.045331 0.0427,0.384 0.21333,0.767999 h -2.38933 q -0.128,-0.362666 -0.17066,-0.682665 -0.0427,-0.32 -0.0427,-1.151999 v -2.730662 q 0,-1.023998 -0.34133,-1.429331 -0.32,-0.405333 -1.13067,-0.405333 h -0.81066 v 6.39999 h -2.34666 z m 3.19999,6.39999 q 0.704,0 1.04533,-0.362666 0.36267,-0.362666 0.36267,-1.215998 v -1.151998 q 0,-0.810665 -0.29867,-1.173331 -0.27733,-0.362667 -0.896,-0.362667 h -1.06666 v 4.26666 z m 7.21065,-6.39999 h 3.17866 l 2.432,14.93331 h -2.34666 l -0.42667,-2.965328 v 0.04267 h -2.66666 l -0.42667,2.922662 h -2.17599 z m 2.56,9.983985 -1.04533,-7.381322 h -0.0427 l -1.024,7.381322 z m 4.73597,5.034658 q -0.64,0 -1.088,-0.08533 v -2.13333 q 0.34134,0.08533 0.768,0.08533 0.704,0 1.04533,-0.341332 0.34134,-0.362666 0.34134,-1.087999 V 22.267254 h 2.34666 v 11.391982 q 0,1.834664 -0.85333,2.730663 -0.832,0.895998 -2.56,0.895998 z"
-         id="path3" />
-    </g>
-  </g>
+     y="0.14608809" />
 </svg>

majak_uistyleguide/templates/patterns/atoms/articles/header_author.html

+<div class="text-grey-185 mb-4 italic">
+  Autor: <span rel="author">
+    {% if author_url %}
+      <a
+        href="{{ author_url }}"
+        class="underline text-grey-100"
+      >{{ author_name }}</a>
+    {% else %}
+      {{ author_name }}
+    {% endif %}
+  </span>
+</div>
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/articles/header_author.yaml

+context:
+  author_name: 'Redakce'
+  author_url: 'https://example.com'
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/buttons/round_button.html

 <a
   href="{{ url }}"
+  id="{{ id }}"
   class="
     flex items-center group rounded-full font-condensed uppercase font-semibold tracking-normal
     hover:no-underline max-w-max
@@ -13,10 +14,14 @@
     {% block size_classes %}
       pl-8 pr-3 py-3
 
-      xl:text-lg xl:pl-8 xl:pr-3 xl:py-4
+      {% if show_arrow_on_hover %}
+        xl:pl-8 xl:pr-3
+      {% else %}
+        xl:px-8
+      {% endif %}
     {% endblock %}
   "
 >
-  <span class="group-hover:-translate-x-2 duration-200">{{ button_text }}</span>
+  <span class="group-hover:-translate-x-2 duration-200" id="{{ id }}-inner-text">{{ button_text }}</span>
   <span class="opacity-0 group-hover:opacity-100 duration-200 mb-[0.03rem]">{% include 'patterns/atoms/icons/arrow.html' %}</span>
 </a>

majak_uistyleguide/templates/patterns/atoms/buttons/round_button.yaml

@@ -2,3 +2,4 @@ context:
   button_text: 'Další články'
   classes: ''
   url: '#'
+  show_arrow_on_hover: True

majak_uistyleguide/templates/patterns/atoms/buttons/round_button_colors.html

+<div class="flex flex-col gap-2">
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-black text-white" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-white text-black" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-pirati-yellow text-black" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-grey-125 text-black" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-blue-300 text-white" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-cyan-200 text-white" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-green-400 text-white" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-violet-400 text-white" %}
+  {% include "patterns/atoms/buttons/round_button.html" with classes="bg-red-600 text-white" %}
+</div>

majak_uistyleguide/templates/patterns/atoms/buttons/round_button_group.html

+<div class="flex gap-3 py-4">
+  {% include "patterns/atoms/buttons/round_button.html" %}
+  {% include "patterns/atoms/buttons/round_button.html" %}
+  {% include "patterns/atoms/buttons/round_button.html" %}
+  {% include "patterns/atoms/buttons/round_button.html" %}
+</div>

majak_uistyleguide/templates/patterns/atoms/dropdown/dropdown_item.html

+<li>
+  <a href="{{ url }}">
+    {{ name }}
+  </a>
+</li>
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/figure/figure.html

+<figure class="flex flex-col gap-2 max-w-max py-4">
+  <img
+    src="{{ source }}"
+    alt="{{ alt }}"
+  >
+
+  {% if caption %}
+    <figcaption
+      class="text-grey-250 italic text-sm"
+    >{{ caption }}</figcaption>
+  {% endif %}
+</figure>

majak_uistyleguide/templates/patterns/atoms/figure/figure.yaml

+context:
+  source: https://picsum.photos/536/354
+  alt: 'Picture of Elephant'
+  caption: 'Picture of Elephant'

majak_uistyleguide/templates/patterns/atoms/form_fields/form_captcha.html

+<div class="flex gap-3 w-full">
+  <img
+    src="/static/images/captcha.png"
+    alt="Captcha obrázek"
+  >
+  
+  {% include "patterns/atoms/form_fields/form_input.html" with placeholder=placeholder label='' hint='' extra_classes='lg:!w-full' %}
+</div>
\ No newline at end of file

majak_uistyleguide/templates/patterns/atoms/form_fields/form_captcha.yaml

+context:
+  placeholder: 'Kód z obrázku'
\ No newline at end of file