make main template's top buttons separate

majak_uistyleguide/templates/patterns/molecules/navbar/additional_button.html

 <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
 

majak_uistyleguide/templates/patterns/organisms/layout/main/navbar.html

+{% 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

majak_uistyleguide/templates/patterns/templates/main/article/article_detail.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/article/article_list.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/contact/contact.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/crossroad/crossroad.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/hoax/hoax.html

-{% 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">

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' %}

majak_uistyleguide/templates/patterns/templates/main/people/people.html

-{% 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

majak_uistyleguide/templates/patterns/templates/main/people/person.html

-{% 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">

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

-{% 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

majak_uistyleguide/templates/patterns/templates/main/results/results.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/search/search.html

-{% 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">

majak_uistyleguide/templates/patterns/templates/main/simple/simple.html

-{% 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">

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
   }

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',