make nav buttons smaller on mobile screens #37

drikusroor · Aug 1, 2024 · b696445 · b696445
1 parent 95a12ec
commit b696445
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/src/brazil_blog/static/css/brazil_blog_compiled.css b/src/brazil_blog/static/css/brazil_blog_compiled.css
@@ -2289,6 +2289,11 @@ select {
   .md\:items-end {
     align-items: flex-end;
   }
+
+  .md\:text-base {
+    font-size: 1rem;
+    line-height: 1.5rem;
+  }
 }
 
 @media (min-width: 1024px) {

diff --git a/src/brazil_blog/templates/includes/header.html b/src/brazil_blog/templates/includes/header.html
@@ -19,7 +19,7 @@ <h1 class="text-3xl font-bold">{{ site_name }}</h1>
             {% for menuitem in site_root.get_children.live.in_menu %}
             <li>
                 <a href="{% pageurl menuitem %}" class="text-white hover:text-blue-800 transition-colors">
-                    {{ menuitem.title }}
+                    <span class="text-sm md:text-base"> {{ menuitem.title }} </span>
                 </a>
             </li>
             {% endfor %}