fix sidebar active count stylings

This commit is contained in:
Andrew Brown 2025-06-14 23:50:14 -05:00
parent 4e4e3c7af0
commit e02f99d354

View File

@ -120,22 +120,22 @@
</svg>
</div>
<div x-show="expandedWritingSidebar" x-cloak class="pl-1 mb-2">
<%= link_to main_app.timelines_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.timelines_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons <%= Timeline.text_color %> shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= Timeline.icon %></i>
<span class="flex-grow text-sm min-w-0 truncate">Timelines</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<%= @current_user_content.fetch('Timeline', []).count %>
</span>
<% end %>
<%= link_to main_app.documents_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.documents_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons <%= Document.text_color %> shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= Document.icon %></i>
<span class="flex-grow text-sm min-w-0 truncate">Documents</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<span class="bg-gray-100 text-black rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<%= @current_user_content.fetch('Document', []).count %>
</span>
<% end %>
<%= link_to main_app.timelines_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.timelines_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons <%= Timeline.text_color %> shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= Timeline.icon %></i>
<span class="flex-grow text-sm min-w-0 truncate">Timelines</span>
<span class="bg-gray-100 text-black rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<%= @current_user_content.fetch('Timeline', []).count %>
</span>
<% end %>
<%= link_to main_app.prompts_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.prompts_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons text-orange-400 shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full">lightbulb</i>
<span class="flex-grow text-sm min-w-0 truncate">Prompts</span>
@ -172,7 +172,7 @@
<%= link_to main_app.page_collections_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.page_collections_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons <%= PageCollection.text_color %> shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full"><%= PageCollection.icon %></i>
<span class="flex-grow text-sm min-w-0 truncate">Collections</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<span class="bg-gray-100 text-black rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<%= @current_user_content.fetch('PageCollection', []).count %>
</span>
<% end %>
@ -180,7 +180,7 @@
<%= link_to main_app.thredded_path, class: "flex items-center px-2 sm:px-4 py-2 cursor-pointer group rounded-l-full transition #{'bg-notebook-blue text-white' if current_page?(main_app.thredded_path)} hover:bg-notebook-blue hover:text-white" do %>
<i class="material-icons text-blue-500 shrink-0 w-6 h-6 sm:w-7 sm:h-7 lg:w-8 lg:h-8 lg:p-1 mr-2 bg-white rounded-full">forum</i>
<span class="flex-grow text-sm min-w-0 truncate">Discussions</span>
<span class="bg-gray-100 rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
<span class="bg-gray-100 text-black rounded px-1 text-xs group-hover:text-white group-hover:bg-blue-700 shrink-0">
0
</span>
<% end %>