Switch to breadcrumbs for nav

Dont really need tabnav since there is only one tab.
jnunemaker · Apr 20, 2015 · 29af1cd · 29af1cd
1 parent 10e3dbe
commit 29af1cd
Show file tree

Hide file tree

Showing 6 changed files with 48 additions and 13 deletions.
diff --git a/lib/flipper/ui/actions/add_actor.rb b/lib/flipper/ui/actions/add_actor.rb
@@ -12,6 +12,7 @@ def get
           feature = flipper[feature_name.to_sym]
           @feature = Decorators::Feature.new(feature)
 
+          breadcrumb "Home", "/"
           breadcrumb "Features", "/features"
           breadcrumb @feature.key, "/features/#{@feature.key}"
           breadcrumb "Add Actor"

diff --git a/lib/flipper/ui/actions/add_group.rb b/lib/flipper/ui/actions/add_group.rb
@@ -12,6 +12,7 @@ def get
           feature = flipper[feature_name.to_sym]
           @feature = Decorators::Feature.new(feature)
 
+          breadcrumb "Home", "/"
           breadcrumb "Features", "/features"
           breadcrumb @feature.key, "/features/#{@feature.key}"
           breadcrumb "Add Group"
@@ -22,18 +23,18 @@ def get
         def post
           feature_name = Rack::Utils.unescape(request.path.split('/')[-2])
           feature = flipper[feature_name.to_sym]
-          group_name = params["value"]
+          value = params["value"]
 
           case params["operation"]
           when "enable"
-            feature.enable_group group_name
+            feature.enable_group value
           when "disable"
-            feature.disable_group group_name
+            feature.disable_group value
           end
 
           redirect_to("/features/#{feature.key}")
         rescue Flipper::GroupNotRegistered => e
-          error = Rack::Utils.escape("The group named #{group_name.inspect} has not been registered.")
+          error = Rack::Utils.escape("The group named #{value.inspect} has not been registered.")
           redirect_to("/features/#{feature.key}/groups?error=#{error}")
         end
       end

diff --git a/lib/flipper/ui/actions/features.rb b/lib/flipper/ui/actions/features.rb
@@ -19,7 +19,8 @@ def get
           @conditional = Array(features[:conditional]).sort_by(&:pretty_name)
           @show_blank_slate = features.empty?
 
-          breadcrumb "Features", "/features"
+          breadcrumb "Home", "/"
+          breadcrumb "Features"
 
           view_response :features
         end

diff --git a/lib/flipper/ui/assets/stylesheets/application.scss b/lib/flipper/ui/assets/stylesheets/application.scss
@@ -9,6 +9,7 @@ body {
 @import "bootstrap/tables";
 @import "bootstrap/panels";
 @import "bootstrap/list-group";
+@import "bootstrap/breadcrumbs";
 
 .flash {
   margin-bottom:15px;
@@ -26,3 +27,8 @@ body {
   background:none;
   border:0;
 }
+
+.breadcrumb {
+  background-color: #fff;
+  border: 1px solid #ddd;
+}
diff --git a/lib/flipper/ui/public/css/application.css b/lib/flipper/ui/public/css/application.css
@@ -2551,6 +2551,21 @@ a.list-group-item-danger {
   margin-bottom: 0;
   line-height: 1.3; }
 
+.breadcrumb {
+  padding: 8px 15px;
+  margin-bottom: 20px;
+  list-style: none;
+  background-color: whitesmoke;
+  border-radius: 4px; }
+  .breadcrumb > li {
+    display: inline-block; }
+    .breadcrumb > li + li:before {
+      content: "/\00a0";
+      padding: 0 5px;
+      color: #cccccc; }
+  .breadcrumb > .active {
+    color: #777777; }
+
 .flash {
   margin-bottom: 15px; }
 
@@ -2563,3 +2578,7 @@ a.list-group-item-danger {
 .button-inv {
   background: none;
   border: 0; }
+
+.breadcrumb {
+  background-color: #fff;
+  border: 1px solid #dddddd; }
diff --git a/lib/flipper/ui/views/layout.erb b/lib/flipper/ui/views/layout.erb
@@ -17,14 +17,21 @@
   </head>
   <body>
     <div class="container">
-      <div class="tabnav">
-        <a class="btn btn-sm right" href="/features/new">Add Feature</a>
-        <nav class="tabnav-tabs">
-          <a href="<%= script_name %>/features" class="tabnav-tab selected">
-            Features
-          </a>
-        </nav>
-      </div>
+      <a class="btn btn-sm right" href="/features/new">Add Feature</a>
+
+      <% unless @breadcrumbs.empty? %>
+        <ol class="breadcrumb">
+          <% @breadcrumbs.each do |breadcrumb| %>
+            <li<% if breadcrumb.active? %> class="active"<% end %>>
+              <% if breadcrumb.active? %>
+                <%= breadcrumb.text %>
+              <% else %>
+                <a href="<%= breadcrumb.href %>"><%= breadcrumb.text %></a>
+              <% end %>
+            </li>
+          <% end %>
+        </ol>
+      <% end %>
 
       <div>
         <%== yield %>