alexdbondoc17
/
cdao-pjet
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Fix UI for `sidenav`

pull/42/head
alexdbondoc17 4 years ago
parent
a0010760c4
commit
1b91b80dc9
2 changed files with 60 additions and 55 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 5
      app/components/sidenav_component.rb
  2. 110
      app/components/sidenav_component/sidenav_component.html.erb

5
app/components/sidenav_component.rb
Unescape View File

@ -1,5 +1,8 @@
class SidenavComponent < BaseComponent class SidenavComponent < BaseComponent
def initialize(current_user:) attr_reader :current_user, :opts
def initialize(current_user:, opts: {})
@current_user = current_user @current_user = current_user
@opts = opts
end end
end end

110
app/components/sidenav_component/sidenav_component.html.erb
Unescape View File

@ -1,72 +1,74 @@
<% if current_user.present? %> <% if current_user.present? %>
<div class="sidebar sidebar-body d-flex flex-column align-items-center align-items-sm-start pt-2 text-white min-vh-100"> <% if opts[:is_sidenav].present? %>
<ul class="nav flex-column text-white w-100"> <div class="sidebar sidebar-body d-flex flex-column align-items-center align-items-sm-start pt-2 text-white min-vh-100">
<a href="/" class="nav-link d-flex align-items-center h3 text-white my-2 w-100"> <ul class="nav flex-column text-white w-100">
PJET <a href="/" class="nav-link d-flex align-items-center h3 text-white my-2 w-100">
</a> PJET
<hr/> </a>
<hr/>
<li class="nav-link d-flex align-items-center d-flex align-items-center"> <li class="nav-link d-flex align-items-center d-flex align-items-center">
<i class="fas fa-home"></i> <%= link_to "Home", root_path, class: "mx-2 text-white text-decoration-none w-100" %> <i class="fas fa-home"></i> <%= link_to "Home", root_path, class: "mx-2 text-white text-decoration-none w-100" %>
</li> </li>
<li class="nav-link d-flex align-items-center"> <li class="nav-link d-flex align-items-center">
<i class="fas fa-search"></i> <%= link_to "Search", documents_path, class: "mx-2 text-white text-decoration-none w-100" %> <i class="fas fa-search"></i> <%= link_to "Search", documents_path, class: "mx-2 text-white text-decoration-none w-100" %>
</li> </li>
<li class="nav-link"> <li class="nav-link">
<div class="accordion-item accordion-body bg-transparent "> <div class="accordion-item accordion-body bg-transparent ">
<div class="accordion-header bg-transparent"> <div class="accordion-header bg-transparent">
<button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#mainSubjectIndexSubMenu"> <button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#mainSubjectIndexSubMenu">
<i class="fas fa-indent"></i> <%= link_to "Subjects", "#", class: "accordion-link text-decoration-none mx-2 text-dark text-white " %> <i class="fas fa-indent"></i> <%= link_to "Subjects", "#", class: "accordion-link text-decoration-none mx-2 text-dark text-white " %>
</button> </button>
</div>
<%= render(SubjectsSidenavSubMenuComponent.new(current_user: current_user, opts: { is_subjects_index: true, main_sub_menu: "mainSubjectIndexSubMenu", second_sub_menu: "secondSubjectIndexSubMenu", third_sub_menu: "thirdSubjectIndexSubMenu", fourth_sub_menu: "fourthSubjectIndexSubMenu", fifth_sub_menu: "fifthSubjectIndexSubMenu" })) %>
</div> </div>
</li>
<%= render(SubjectsSidenavSubMenuComponent.new(current_user: current_user, opts: { is_subjects_index: true, main_sub_menu: "mainSubjectIndexSubMenu", second_sub_menu: "secondSubjectIndexSubMenu", third_sub_menu: "thirdSubjectIndexSubMenu", fourth_sub_menu: "fourthSubjectIndexSubMenu", fifth_sub_menu: "fifthSubjectIndexSubMenu" })) %> <li class="nav-link ">
</div> <div class="accordion-item accordion-body bg-transparent">
</li> <div class="accordion-header">
<button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#mainDoctrinesSubMenu">
<i class="fas fa-book"></i> <%= link_to "Doctrines", "#", class: "accordion-link text-decoration-none mx-2 text-dark text-white " %>
</button>
</div>
<li class="nav-link "> <%= render(SubjectsSidenavSubMenuComponent.new(current_user: current_user, opts: { is_doctrines_index: true, main_sub_menu: "mainDoctrinesSubMenu", second_sub_menu: "secondDoctrinesSubMenu", third_sub_menu: "thirdDoctrinesSubMenu", fourth_sub_menu: "fourthDoctrinesSubMenu", fifth_sub_menu: "fifthDoctrinesSubMenu" })) %>
<div class="accordion-item accordion-body bg-transparent">
<div class="accordion-header">
<button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#mainDoctrinesSubMenu">
<i class="fas fa-book"></i> <%= link_to "Doctrines", "#", class: "accordion-link text-decoration-none mx-2 text-dark text-white " %>
</button>
</div> </div>
</li>
<%= render(SubjectsSidenavSubMenuComponent.new(current_user: current_user, opts: { is_doctrines_index: true, main_sub_menu: "mainDoctrinesSubMenu", second_sub_menu: "secondDoctrinesSubMenu", third_sub_menu: "thirdDoctrinesSubMenu", fourth_sub_menu: "fourthDoctrinesSubMenu", fifth_sub_menu: "fifthDoctrinesSubMenu" })) %> <li class="nav-link d-flex align-items-center">
</div> <i class="fas fa-map-signs"></i> <%= link_to "Desicions", decisions_path, class: "mx-2 text-white text-decoration-none" %>
</li> </li>
<li class="nav-link d-flex align-items-center"> <li class="nav-link">
<i class="fas fa-map-signs"></i> <%= link_to "Desicions", decisions_path, class: "mx-2 text-white text-decoration-none" %> <div class="accordion-item accordion-body bg-transparent ">
</li> <div class="accordion-header bg-transparent">
<button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#settings">
<li class="nav-link"> <i class="fas fa-cog"></i> <%= link_to "Settings", "#", class: "accordion-link text-decoration-none mx-2 text-white" %>
<div class="accordion-item accordion-body bg-transparent "> </button>
<div class="accordion-header bg-transparent"> </div>
<button class="accordion-button collapsed bg-transparent" type="button" data-bs-toggle="collapse" data-bs-target="#settings">
<i class="fas fa-cog"></i> <%= link_to "Settings", "#", class: "accordion-link text-decoration-none mx-2 text-white" %>
</button>
</div>
<div class="accordion-collapse collapse" id="settings" data-bs-parent="#sidenav"> <div class="accordion-collapse collapse" id="settings" data-bs-parent="#sidenav">
<div class="accordion-body pb-0 pe-0 pt-0"> <div class="accordion-body pb-0 pe-0 pt-0">
<div class="accordion accordion-flush ps-20" id="firstLevelSubMenu"> <div class="accordion accordion-flush ps-20" id="firstLevelSubMenu">
<div class="accordion-item bg-transparent"> <div class="accordion-item bg-transparent">
<div class="accordion-header bg-transparent"> <div class="accordion-header bg-transparent">
<%= link_to "Subjects", subject_indexes_path, class: "accordion-link text-white text-decoration-none text-dark d-block sub1 clickable-link" %> <%= link_to "Subjects", subject_indexes_path, class: "accordion-link text-white text-decoration-none text-dark d-block sub1 clickable-link" %>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </li>
</li>
<li class="nav-link d-flex align-items-center"> <li class="nav-link d-flex align-items-center">
<i class="fas fa-sign-out-alt"></i> <%= link_to "Logout", destroy_user_session_path, class: "mx-2 text-white text-decoration-none" %> <i class="fas fa-sign-out-alt"></i> <%= link_to "Logout", destroy_user_session_path, class: "mx-2 text-white text-decoration-none" %>
</li> </li>
</ul> </ul>
</div> </div>
<% end %>
<% end %> <% end %>

Write Preview
Loading…
Cancel
Save