From 9322e98fef4367e69e47d7c6814d7acceea90665 Mon Sep 17 00:00:00 2001 From: Adam Piontek <adam@73k.us> Date: Tue, 9 Mar 2021 20:18:56 -0500 Subject: [PATCH] added navbar link for shift templates, and button icon for new shift templates --- assets/js/app.js | 1 + .../live/shift_template_live/index.html.leex | 22 +++++++++---------- .../templates/layout/_navbar.html.eex | 7 ++++++ 3 files changed, 19 insertions(+), 11 deletions(-) diff --git a/assets/js/app.js b/assets/js/app.js index bf8c80aa..a376add3 100644 --- a/assets/js/app.js +++ b/assets/js/app.js @@ -39,6 +39,7 @@ import "../node_modules/bootstrap-icons/icons/clock-history.svg"; // brand import "../node_modules/bootstrap-icons/icons/hourglass.svg"; // brand import "../node_modules/bootstrap-icons/icons/geo.svg"; // brand import "../node_modules/bootstrap-icons/icons/justify-left.svg"; // brand +import "../node_modules/bootstrap-icons/icons/plus-circle-dotted.svg"; // brand // webpack automatically bundles all modules in your // entry points. Those entry points can be configured diff --git a/lib/shift73k_web/live/shift_template_live/index.html.leex b/lib/shift73k_web/live/shift_template_live/index.html.leex index 860b3439..a88400e2 100644 --- a/lib/shift73k_web/live/shift_template_live/index.html.leex +++ b/lib/shift73k_web/live/shift_template_live/index.html.leex @@ -8,15 +8,18 @@ <% end %> -<div class="row justify-content-center"> - <div class="col-md-12 col-lg-10 col-xl-9 "> +<div class="row justify-content-start justify-content-sm-center"> + <div class="col-md-12 col-lg-10 col-xl-9"> - <div class="d-flex justify-content-between d-flex align-items-center mb-4"> - <h2> + <div class="d-flex flex-column flex-sm-row justify-content-between align-items-start align-items-sm-center"> + <h2 class="mb-3 mb-sm-0"> <%= icon_div @socket, "bi-clock-history", [class: "icon baseline"] %> My Shift Templates </h2> - <%= live_patch "New Shift Template", to: Routes.shift_template_index_path(@socket, :new), class: "btn btn-primary" %> + <%= live_patch to: Routes.shift_template_index_path(@socket, :new), class: "btn btn-primary" do %> + <%= icon_div @socket, "bi-plus-circle-dotted", [class: "icon baseline me-1"] %> + New Shift Template + <% end %> </div> @@ -24,7 +27,7 @@ <%= for shift <- @shift_templates do %> - <div class="col-12 col-sm-11 col-md-9 col-lg-7 col-xl-6 "> + <div class="col-12 col-md-6 col-xl-4 "> <div class="card mt-4"> <h5 class="card-header"> @@ -51,9 +54,6 @@ </td> </tr> - - - <tr> <th scope="row" class="text-end"> <%= icon_div @socket, "bi-geo", [class: "icon baseline text-muted"] %> @@ -86,14 +86,14 @@ <div class="text-end"> <%= if Roles.can?(@current_user, shift, :delete) do %> - <%= link to: "#", phx_click: "delete", phx_value_id: shift.id, data: [confirm: "Are you sure?"], class: "btn btn-outline-danger" do %> + <%= link to: "#", phx_click: "delete", phx_value_id: shift.id, data: [confirm: "Are you sure?"], class: "btn btn-outline-danger btn-sm text-nowrap" do %> <%= icon_div @socket, "bi-trash", [class: "icon baseline", style: "margin-right:0.125rem;"] %> Delete <% end %> <% end %> <%= if Roles.can?(@current_user, shift, :edit) do %> - <%= live_patch to: Routes.shift_template_index_path(@socket, :edit, shift), class: "btn btn-primary" do %> + <%= live_patch to: Routes.shift_template_index_path(@socket, :edit, shift), class: "btn btn-primary btn-sm text-nowrap" do %> <%= icon_div @socket, "bi-pencil", [class: "icon baseline", style: "margin-right:0.125rem;"] %> Edit <% end %> diff --git a/lib/shift73k_web/templates/layout/_navbar.html.eex b/lib/shift73k_web/templates/layout/_navbar.html.eex index 6af6b626..0704a841 100644 --- a/lib/shift73k_web/templates/layout/_navbar.html.eex +++ b/lib/shift73k_web/templates/layout/_navbar.html.eex @@ -19,6 +19,13 @@ <%# nav LEFT items %> <ul class="navbar-nav me-auto mb-2 mb-lg-0"> + <li class="nav-item"> + <%= link nav_link_opts(@conn, to: Routes.shift_template_index_path(@conn, :index), class: "nav-link") do %> + <%= icon_div @conn, "bi-clock-history", [class: "icon baseline me-1"] %> + Templates + <% end %> + </li> + <%# normal navbar link example %> <%# <li class="nav-item"> %> <%#= link "Properties", nav_link_opts(@conn, to: Routes.property_index_path(@conn, :index), class: "nav-link") %>