diff --git a/majak_uistyleguide/templates/patterns/molecules/navbar/additional_button.html b/majak_uistyleguide/templates/patterns/molecules/navbar/additional_button.html index ba908660189ec6b19b37561479831dbd1ba650ec..70c7b34795762cbbb69676d414385ed462f4b08e 100644 --- a/majak_uistyleguide/templates/patterns/molecules/navbar/additional_button.html +++ b/majak_uistyleguide/templates/patterns/molecules/navbar/additional_button.html @@ -1,5 +1,7 @@ <a class=" + navbar__border-button__wrapper + hover:no-underline hidden lg:inline @@ -8,7 +10,7 @@ > <div class=" - navbar__border-button + navbar__border-button {{ extra_classes }} flex items-center justify-center border-none duration-150 border-4 w-24 h-11 py-4 px-6 diff --git a/majak_uistyleguide/templates/patterns/organisms/layout/main/navbar.html b/majak_uistyleguide/templates/patterns/organisms/layout/main/navbar.html new file mode 100644 index 0000000000000000000000000000000000000000..4d370f75a3d7085aaec100e67d524e778de987f3 --- /dev/null +++ b/majak_uistyleguide/templates/patterns/organisms/layout/main/navbar.html @@ -0,0 +1,13 @@ +{% extends 'patterns/organisms/layout/navbar.html' %} + +{% block navbar_menu_button %} + {% if additional_buttons %} + <div class="flex gap-6 ml-2"> + {% block navbar_menu_button_additional_buttons %} + {% for button in additional_buttons %} + {% include 'patterns/molecules/navbar/additional_button.html' with extra_classes='navbar__border-button--main' %} + {% endfor %} + {% endblock %} + </div> + {% endif %} +{% endblock %} \ No newline at end of file diff --git a/majak_uistyleguide/templates/patterns/templates/main/article/article_detail.html b/majak_uistyleguide/templates/patterns/templates/main/article/article_detail.html index 9a29e5e78d30e6585d080b631b8ef4af6d5c4dcd..a2a890c3c501335c87c865ec5b2e2f184a728862 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/article/article_detail.html +++ b/majak_uistyleguide/templates/patterns/templates/main/article/article_detail.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Aktuality' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Aktuality' %} {% include 'patterns/organisms/header/article_header.html' with second_link=None %} <main role="main" class="mb-10 xl:mb-32"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/article/article_list.html b/majak_uistyleguide/templates/patterns/templates/main/article/article_list.html index 791c299ee25b40823749b9d1f2abc8b78f5be0e4..f036c57c25e6f0e855694439ec5575dbca6688a9 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/article/article_list.html +++ b/majak_uistyleguide/templates/patterns/templates/main/article/article_list.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Aktuality' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Aktuality' %} {% include 'patterns/organisms/header/articles_header.html' %} <main role="main"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/contact/contact.html b/majak_uistyleguide/templates/patterns/templates/main/contact/contact.html index fa7253af1fdb30d286dd91b424f2a02a3113833f..eb69d1e46fccf5d20cf6c9ed7c33d7d30d707661 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/contact/contact.html +++ b/majak_uistyleguide/templates/patterns/templates/main/contact/contact.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Kontakty' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Kontakty' %} {% include 'patterns/organisms/header/simple_header.html' with title='Kontakty' %} <main role="main"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/crossroad/crossroad.html b/majak_uistyleguide/templates/patterns/templates/main/crossroad/crossroad.html index b8583329c39b26e5f8c54137cb6f66877353515c..7954b73dfdbf954b9edfc1e9d22d2a71a69a0e30 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/crossroad/crossroad.html +++ b/majak_uistyleguide/templates/patterns/templates/main/crossroad/crossroad.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Kdo jsme' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Kdo jsme' %} {% include 'patterns/organisms/header/simple_header.html' with title='Týmy' %} <main role="main" class="mb-10 xl:mb-32"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/hoax/hoax.html b/majak_uistyleguide/templates/patterns/templates/main/hoax/hoax.html index 9111e6a43d033fcb0eb9dccab530d40bbd1529e6..fecf9903c196e501adcae67df8ad39eb9e6c51be 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/hoax/hoax.html +++ b/majak_uistyleguide/templates/patterns/templates/main/hoax/hoax.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' %} +{% include 'patterns/organisms/layout/main/navbar.html' %} {% include 'patterns/organisms/header/simple_header.html' with title="Hoaxy" %} <main role="main" class="mb-10 xl:mb-32"> <div class="container--wide mb-2 lg:mb-12"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/homepage/homepage.html b/majak_uistyleguide/templates/patterns/templates/main/homepage/homepage.html index 86eb4ce93cb09594925318756aff70e3f976bbc2..561c779e68c49762529bcefd51cdce3118fb407e 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/homepage/homepage.html +++ b/majak_uistyleguide/templates/patterns/templates/main/homepage/homepage.html @@ -2,7 +2,7 @@ {% include 'patterns/molecules/blocks/message_block.html' with is_last_child=True %} {% endif %} -{% include 'patterns/organisms/layout/navbar.html' with is_transparent=True %} +{% include 'patterns/organisms/layout/main/navbar.html' with is_transparent=True %} <main role="main"> {% include 'patterns/molecules/menus/carousel.html' %} diff --git a/majak_uistyleguide/templates/patterns/templates/main/people/people.html b/majak_uistyleguide/templates/patterns/templates/main/people/people.html index d97a02e83ae7f2f794b26b555bd99ece17c06bd9..eaf55d083cf0913e1f7e3dadb9cbdb1896910ba7 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/people/people.html +++ b/majak_uistyleguide/templates/patterns/templates/main/people/people.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Kdo jsme' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Kdo jsme' %} <div class="__js-root"> <ui-view-provider diff --git a/majak_uistyleguide/templates/patterns/templates/main/people/person.html b/majak_uistyleguide/templates/patterns/templates/main/people/person.html index 94b1d1ce4aa1c0593c8d178f0c62f93667c57a65..39a567e57791dcd136c395df88ccaad60148c0ad 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/people/person.html +++ b/majak_uistyleguide/templates/patterns/templates/main/people/person.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Kdo jsme' is_transparent=True is_on_dark_background=True %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Kdo jsme' is_transparent=True is_on_dark_background=True %} {% include 'patterns/organisms/header/photo_header.html' %} <main role="main"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/program/program.html b/majak_uistyleguide/templates/patterns/templates/main/program/program.html index d57ac5b0e43fa63ad54928cf1a93c31bc572ed58..f1915b0ec0f7d34c6c2f2ae4313e1dc35de35be8 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/program/program.html +++ b/majak_uistyleguide/templates/patterns/templates/main/program/program.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' with selected_item='Program' %} +{% include 'patterns/organisms/layout/main/navbar.html' with selected_item='Program' %} <div class="__js-root"> <ui-view-provider diff --git a/majak_uistyleguide/templates/patterns/templates/main/results/results.html b/majak_uistyleguide/templates/patterns/templates/main/results/results.html index c430a2c8ed50ed341efa06588b1e60a5ff6a535b..d17b7e04d2733da77a3e8aab287b098183d7a22e 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/results/results.html +++ b/majak_uistyleguide/templates/patterns/templates/main/results/results.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' %} +{% include 'patterns/organisms/layout/main/navbar.html' %} {% include 'patterns/organisms/header/simple_header.html' with title="Výsledky" %} <main role="main" class="mb-10 xl:mb-32"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/search/search.html b/majak_uistyleguide/templates/patterns/templates/main/search/search.html index 67f686b63f9b18ccb79d63268382d56c00cf73c2..974988c81e98d6aa906022ec63c1827295d5fadb 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/search/search.html +++ b/majak_uistyleguide/templates/patterns/templates/main/search/search.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' %} +{% include 'patterns/organisms/layout/main/navbar.html' %} {% include 'patterns/organisms/header/simple_header.html' with title="Vyhledávání" %} <main role="main" class="mb-10 xl:mb-32"> diff --git a/majak_uistyleguide/templates/patterns/templates/main/simple/simple.html b/majak_uistyleguide/templates/patterns/templates/main/simple/simple.html index 0a24658abdc413c4799de957a8a539e5f8c02338..3575678b01982e98bebaace19a196fa7f6a11910 100644 --- a/majak_uistyleguide/templates/patterns/templates/main/simple/simple.html +++ b/majak_uistyleguide/templates/patterns/templates/main/simple/simple.html @@ -1,4 +1,4 @@ -{% include 'patterns/organisms/layout/navbar.html' %} +{% include 'patterns/organisms/layout/main/navbar.html' %} {% include 'patterns/organisms/header/simple_header.html' with title='Jednoduchá stránka' %} <main role="main" class="mb-10 xl:mb-32"> diff --git a/src/css/organisms/navbar.pcss b/src/css/organisms/navbar.pcss index cb4e0a4201508010f03221e09ea0f600d3615ac5..abb8367bfb89b443fa6f62ac16a28cb0113660b9 100644 --- a/src/css/organisms/navbar.pcss +++ b/src/css/organisms/navbar.pcss @@ -16,6 +16,10 @@ @apply !text-black hidden } + .navbar__border-button__wrapper:not(:first-child) > .navbar__border-button--main { + @apply bg-white border-solid border-4 border-pirati-yellow hover:bg-pirati-yellow + } + .navbar__border-button { @apply bg-pirati-yellow text-black hover:bg-yellow-600 } diff --git a/src/js/components/CandidatePrimaryBox.vue b/src/js/components/CandidatePrimaryBox.vue index da2fd99d9f961a3830e02bd864ec774221645f51..099e80b36466fb95aa54a820a437cd39e361d0fc 100644 --- a/src/js/components/CandidatePrimaryBox.vue +++ b/src/js/components/CandidatePrimaryBox.vue @@ -65,7 +65,10 @@ xl:text-lg xl:pl-8 xl:pr-3 xl:py-4 " > - <span class="group-hover:-translate-x-2 duration-200">Zjisti více</span> + <span class="group-hover:-translate-x-2 duration-200"> + <div v-if="buttonText">{{ buttonText }}</div> + <div v-else>Zjisti více</div> + </span> <span class="opacity-0 group-hover:opacity-100 duration-200 mb-[0.03rem]"> <svg width="20" height="21" viewBox="0 0 10 20" fill="none" xmlns="http://www.w3.org/2000/svg"> @@ -103,7 +106,7 @@ <script> export default { name: "CandidatePrimaryBox", - props: ["name", "subheading", "position", "description", "url", "imageSource", "socialLinks"], + props: ["name", "subheading", "position", "description", "url", "buttonText", "imageSource", "socialLinks"], mounted () { var intersectionOptions = { rootMargin: '0px',