cloud/music_library
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update colors in navigation bar

Browse Source
This commit is contained in:
Claudio Ortolina
2024-10-23 10:28:37 +01:00
parent 79edd6eade
commit c45ba43c46
3 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/music_library_web/components/layouts.ex
+12 -5
View File
@@ -12,12 +12,19 @@ defmodule MusicLibraryWeb.Layouts do
embed_templates "layouts/*" embed_templates "layouts/*"
@base_classes "inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium" @nav_base_classes "inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium"
def nav_link_class(current_section, section) when current_section == section do @nav_inactive_classes "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700 dark:text-gray-300 dark:hover:text-gray-200"
[@base_classes, "border-zinc-500 text-gray-900"] @nav_active_classes "border-zinc-500 text-gray-900 dark:text-gray-100"
def section_link_classes(current_section, section) when current_section == section do
[@nav_base_classes, @nav_active_classes]
end end
def nav_link_class(_current_section, _section) do def section_link_classes(_current_section, _section) do
[@base_classes, "border-transparent text-gray-500 hover:border-gray-300 hover:text-gray-700"] [@nav_base_classes, @nav_inactive_classes]
end
def nav_link_classes do
[@nav_base_classes, @nav_inactive_classes]
end end
end end
lib/music_library_web/components/layouts/app.html.heex
+5 -8
View File
@@ -1,24 +1,21 @@
<nav class="bg-white shadow"> <nav class="bg-white dark:bg-zinc-800 shadow">
<div class="mx-auto max-w-5xl px-4 sm:px-6 lg:px-8"> <div class="mx-auto max-w-5xl px-4 sm:px-6 lg:px-8">
<div class="flex h-16 justify-between"> <div class="flex h-16 justify-between">
<div class="flex"> <div class="flex">
<div class="flex space-x-8"> <div class="flex space-x-8">
<a href="/" class={nav_link_class(assigns[:nav_section], :stats)}> <a href="/" class={section_link_classes(assigns[:nav_section], :stats)}>
<%= gettext("Stats") %> <%= gettext("Stats") %>
</a> </a>
<a href={~p"/records"} class={nav_link_class(assigns[:nav_section], :records)}> <a href={~p"/records"} class={section_link_classes(assigns[:nav_section], :records)}>
<%= gettext("Collection") %> <%= gettext("Collection") %>
</a> </a>
<a href={~p"/wishlist"} class={nav_link_class(assigns[:nav_section], :wishlist)}> <a href={~p"/wishlist"} class={section_link_classes(assigns[:nav_section], :wishlist)}>
<%= gettext("Wishlist") %> <%= gettext("Wishlist") %>
</a> </a>
</div> </div>
</div> </div>
<div class="flex space-x-8"> <div class="flex space-x-8">
<a <a class={nav_link_classes()} } href={~p"/login"}>
class="inline-flex items-center border-b-2 px-1 pt-1 text-sm font-medium border-transparent text-gray-500 hover:text-gray-700"
href={~p"/login"}
>
<%= gettext("Logout") %> <%= gettext("Logout") %>
</a> </a>
</div> </div>
lib/music_library_web/components/layouts/root.html.heex
+1 -1
View File
@@ -13,7 +13,7 @@
<script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}> <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
</script> </script>
</head> </head>
<body class="bg-white"> <body class="bg-white dark:bg-zinc-800">
<%= @inner_content %> <%= @inner_content %>
</body> </body>
</html> </html>