kosmos/akkounts
kosmos/akkounts
8
1
Fork 0
Code Issues 19 Pull Requests 1 Actions Packages Releases 12 Activity

Refactor sidenav link component, allow multiple levels

Browse Source
This commit is contained in:
Râu Cao 2023-03-15 11:38:23 +07:00 committed by Gitea
parent fa07978aac
commit b947480190
1 changed files with 8 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
app/components/sidenav_link_component.rb
View File

@ -1,8 +1,9 @@
# frozen_string_literal: true # frozen_string_literal: true
class SidenavLinkComponent < ViewComponent::Base class SidenavLinkComponent < ViewComponent::Base
def initialize(name:, path:, icon:, active: false, disabled: false) def initialize(name:, level: 1, path:, icon:, active: false, disabled: false)
@name = name @name = name
@level = level
@path = path @path = path
@icon = icon @icon = icon
@active = active @active = active
@ -12,12 +13,15 @@ class SidenavLinkComponent < ViewComponent::Base
end end
def class_names_link(path) def class_names_link(path)
px = @level == 1 ? "px-4" : "pl-8 pr-4"
base = "#{px} py-2 group border-l-4 flex items-center text-base font-medium"
if @active if @active
"bg-teal-50 border-teal-500 text-teal-700 hover:bg-teal-50 hover:text-teal-700 group border-l-4 px-4 py-2 flex items-center text-base font-medium" "#{base} bg-teal-50 border-teal-500 text-teal-700 hover:bg-teal-50 hover:text-teal-700"
elsif @disabled elsif @disabled
"border-transparent text-gray-400 hover:bg-gray-50 group border-l-4 px-4 py-2 flex items-center text-base font-medium" "#{base} border-transparent text-gray-400 hover:bg-gray-50"
else else
"border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900 group border-l-4 px-4 py-2 flex items-center text-base font-medium" "#{base} border-transparent text-gray-900 hover:bg-gray-50 hover:text-gray-900"
end end
end end