padrino-admin 0.12.2 → 0.12.3

data/lib/padrino-admin/bootstrap-less/modals.less

@@ -10,14 +10,6 @@
 // Kill the scroll on the body
 .modal-open {
   overflow: hidden;
-
-
-  // Account for hiding of scrollbar
-  body&,
-  .navbar-fixed-top,
-  .navbar-fixed-bottom {
-    margin-right: 15px
-  }
 }
 
 // Container that the modal scrolls within
@@ -30,7 +22,12 @@
   right: 0;
   bottom: 0;
   left: 0;
-  z-index: @zindex-modal-background;
+  z-index: @zindex-modal;
+  -webkit-overflow-scrolling: touch;
+
+  // Prevent Chrome on Windows from adding a focus outline. For details, see
+  // https://github.com/twbs/bootstrap/pull/10951.
+  outline: 0;
 
   // When fading in the modal, animate it to slide down
   &.fade .modal-dialog {
@@ -42,11 +39,9 @@
 
 // Shell div to position the modal with bottom padding
 .modal-dialog {
-  margin-left: auto;
-  margin-right: auto;
+  position: relative;
   width: auto;
-  padding: 10px;
-  z-index: (@zindex-modal-background + 10);
+  margin: 10px;
 }
 
 // Actual modal
@@ -69,11 +64,11 @@
   right: 0;
   bottom: 0;
   left: 0;
-  z-index: (@zindex-modal-background - 10);
+  z-index: @zindex-modal-background;
   background-color: @modal-backdrop-bg;
   // Fade for backdrop
   &.fade { .opacity(0); }
-  &.in { .opacity(.5); }
+  &.in { .opacity(@modal-backdrop-opacity); }
 }
 
 // Modal header
@@ -107,7 +102,7 @@
   padding: (@modal-inner-padding - 1) @modal-inner-padding @modal-inner-padding;
   text-align: right; // right align buttons
   border-top: 1px solid @modal-footer-border-color;
-  .clearfix(); // clear it in case folks use .pull-* classes on buttons
+  &:extend(.clearfix all); // clear it in case folks use .pull-* classes on buttons
 
   // Properly space out buttons
   .btn + .btn {
@@ -125,17 +120,19 @@
 }
 
 // Scale up the modal
-@media screen and (min-width: @screen-tablet) {
+@media (min-width: @screen-sm-min) {
 
+  // Automatically set modal's width for larger viewports
   .modal-dialog {
-    left: 50%;
-    right: auto;
-    width: 600px;
-    padding-top: 30px;
-    padding-bottom: 30px;
+    width: @modal-md;
+    margin: 30px auto;
   }
   .modal-content {
     .box-shadow(0 5px 15px rgba(0,0,0,.5));
   }
 
+  // Modal sizes
+  .modal-sm { width: @modal-sm; }
+  .modal-lg { width: @modal-lg; }
+
 }

data/lib/padrino-admin/bootstrap-less/navbar.less

@@ -10,13 +10,12 @@
 
 .navbar {
   position: relative;
-  z-index: @zindex-navbar;
   min-height: @navbar-height; // Ensure a navbar always shows (e.g., without a .navbar-brand in collapsed mode)
   margin-bottom: @navbar-margin-bottom;
   border: 1px solid transparent;
 
   // Prevent floats from breaking the navbar
-  .clearfix();
+  &:extend(.clearfix all);
 
   @media (min-width: @grid-float-breakpoint) {
     border-radius: @navbar-border-radius;
@@ -30,7 +29,7 @@
 // styling of responsive aspects.
 
 .navbar-header {
-  .clearfix();
+  &:extend(.clearfix all);
 
   @media (min-width: @grid-float-breakpoint) {
     float: left;
@@ -49,13 +48,13 @@
 // content for the user's viewport.
 
 .navbar-collapse {
-  max-height: 340px;
+  max-height: @navbar-collapse-max-height;
   overflow-x: visible;
   padding-right: @navbar-padding-horizontal;
   padding-left:  @navbar-padding-horizontal;
   border-top: 1px solid transparent;
   box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
-  .clearfix();
+  &:extend(.clearfix all);
   -webkit-overflow-scrolling: touch;
 
   &.in {
@@ -78,15 +77,13 @@
       overflow-y: visible;
     }
 
-    // Account for first and last children spacing
-    .navbar-nav.navbar-left:first-child {
-      margin-left: -@navbar-padding-horizontal;
-    }
-    .navbar-nav.navbar-right:last-child {
-      margin-right: -@navbar-padding-horizontal;
-    }
-    .navbar-text:last-child {
-      margin-right: 0;
+    // Undo the collapse side padding for navbars with containers to ensure
+    // alignment of right-aligned contents.
+    .navbar-fixed-top &,
+    .navbar-static-top &,
+    .navbar-fixed-bottom & {
+      padding-left: 0;
+      padding-right: 0;
     }
   }
 }
@@ -96,14 +93,17 @@
 //
 // When a container is present, change the behavior of the header and collapse.
 
-.container > .navbar-header,
-.container > .navbar-collapse {
-  margin-right: -@navbar-padding-horizontal;
-  margin-left:  -@navbar-padding-horizontal;
+.container,
+.container-fluid {
+  > .navbar-header,
+  > .navbar-collapse {
+    margin-right: -@navbar-padding-horizontal;
+    margin-left:  -@navbar-padding-horizontal;
 
-  @media (min-width: @grid-float-breakpoint) {
-    margin-right: 0;
-    margin-left:  0;
+    @media (min-width: @grid-float-breakpoint) {
+      margin-right: 0;
+      margin-left:  0;
+    }
   }
 }
 
@@ -111,12 +111,14 @@
 //
 // Navbar alignment options
 //
-// Display the navbar across the entirity of the page or fixed it to the top or
+// Display the navbar across the entirety of the page or fixed it to the top or
 // bottom of the page.
 
 // Static top (unfixed, but 100% wide) navbar
 .navbar-static-top {
+  z-index: @zindex-navbar;
   border-width: 0 0 1px;
+
   @media (min-width: @grid-float-breakpoint) {
     border-radius: 0;
   }
@@ -128,7 +130,7 @@
   position: fixed;
   right: 0;
   left: 0;
-  border-width: 0 0 1px;
+  z-index: @zindex-navbar-fixed;
 
   // Undo the rounded corners
   @media (min-width: @grid-float-breakpoint) {
@@ -136,12 +138,13 @@
   }
 }
 .navbar-fixed-top {
-  z-index: @zindex-navbar-fixed;
   top: 0;
+  border-width: 0 0 1px;
 }
 .navbar-fixed-bottom {
   bottom: 0;
   margin-bottom: 0; // override .navbar defaults
+  border-width: 1px 0 0;
 }
 
 
@@ -152,13 +155,16 @@
   padding: @navbar-padding-vertical @navbar-padding-horizontal;
   font-size: @font-size-large;
   line-height: @line-height-computed;
+  height: @line-height-computed;
+
   &:hover,
   &:focus {
     text-decoration: none;
   }
 
   @media (min-width: @grid-float-breakpoint) {
-    .navbar > .container & {
+    .navbar > .container &,
+    .navbar > .container-fluid & {
       margin-left: -@navbar-padding-horizontal;
     }
   }
@@ -177,9 +183,16 @@
   padding: 9px 10px;
   .navbar-vertical-align(34px);
   background-color: transparent;
+  background-image: none; // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214
   border: 1px solid transparent;
   border-radius: @border-radius-base;
 
+  // We remove the `outline` here, but later compensate by attaching `:hover`
+  // styles to `:focus`.
+  &:focus {
+    outline: none;
+  }
+
   // Bars
   .icon-bar {
     display: block;
@@ -199,7 +212,7 @@
 
 // Navbar nav links
 //
-// Builds on top of the `.nav` components with it's own modifier class to make
+// Builds on top of the `.nav` components with its own modifier class to make
 // the nav the full height of the horizontal nav (above 768px).
 
 .navbar-nav {
@@ -211,7 +224,7 @@
     line-height: @line-height-computed;
   }
 
-  @media (max-width: @screen-xs-max) {
+  @media (max-width: @grid-float-breakpoint-max) {
     // Dropdowns get custom display when collapsed
     .open .dropdown-menu {
       position: static;
@@ -243,18 +256,21 @@
     > li {
       float: left;
       > a {
-        padding-top: ((@navbar-height - @line-height-computed) / 2);
-        padding-bottom: ((@navbar-height - @line-height-computed) / 2);
+        padding-top:    @navbar-padding-vertical;
+        padding-bottom: @navbar-padding-vertical;
       }
     }
-  }
 
+    &.navbar-right:last-child {
+      margin-right: -@navbar-padding-horizontal;
+    }
+  }
 }
 
 
 // Component alignment
 //
-// Repurpose the pull utilities as their own navbar utilities to avoid specifity
+// Repurpose the pull utilities as their own navbar utilities to avoid specificity
 // issues with parents and chaining. Only do this when the navbar is uncollapsed
 // though so that navbar contents properly stack and align in mobile.
 
@@ -282,7 +298,7 @@
   .form-inline();
 
   .form-group {
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       margin-bottom: 5px;
     }
   }
@@ -299,6 +315,11 @@
     padding-top: 0;
     padding-bottom: 0;
     .box-shadow(none);
+
+    // Outdent the form if last child to line up with content down the page
+    &.navbar-right:last-child {
+      margin-right: -@navbar-padding-horizontal;
+    }
   }
 }
 
@@ -315,13 +336,6 @@
   .border-bottom-radius(0);
 }
 
-// Right aligned menus need alt position
-.navbar-nav.pull-right > li > .dropdown-menu,
-.navbar-nav > li > .dropdown-menu.pull-right {
-  left: auto;
-  right: 0;
-}
-
 
 // Buttons in navbars
 //
@@ -329,6 +343,13 @@
 
 .navbar-btn {
   .navbar-vertical-align(@input-height-base);
+
+  &.btn-sm {
+    .navbar-vertical-align(@input-height-small);
+  }
+  &.btn-xs {
+    .navbar-vertical-align(22);
+  }
 }
 
 
@@ -337,12 +358,17 @@
 // Add a class to make any element properly align itself vertically within the navbars.
 
 .navbar-text {
-  float: left;
   .navbar-vertical-align(@line-height-computed);
 
   @media (min-width: @grid-float-breakpoint) {
+    float: left;
     margin-left: @navbar-padding-horizontal;
     margin-right: @navbar-padding-horizontal;
+
+    // Outdent the form if last child to line up with content down the page
+    &.navbar-right:last-child {
+      margin-right: 0;
+    }
   }
 }
 
@@ -408,18 +434,11 @@
 
   .navbar-collapse,
   .navbar-form {
-    border-color: darken(@navbar-default-bg, 7%);
+    border-color: @navbar-default-border;
   }
 
-  // Dropdown menu items and carets
+  // Dropdown menu items
   .navbar-nav {
-    // Caret should match text color on hover
-    > .dropdown > a:hover .caret,
-    > .dropdown > a:focus .caret {
-      border-top-color: @navbar-default-link-hover-color;
-      border-bottom-color: @navbar-default-link-hover-color;
-    }
-
     // Remove background color from open dropdown
     > .open > a {
       &,
@@ -427,19 +446,10 @@
       &:focus {
         background-color: @navbar-default-link-active-bg;
         color: @navbar-default-link-active-color;
-        .caret {
-          border-top-color: @navbar-default-link-active-color;
-          border-bottom-color: @navbar-default-link-active-color;
-        }
       }
     }
-    > .dropdown > a .caret {
-      border-top-color: @navbar-default-link-color;
-      border-bottom-color: @navbar-default-link-color;
-    }
 
-
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       // Dropdowns get custom display when collapsed
       .open .dropdown-menu {
         > li > a {
@@ -558,31 +568,16 @@
         color: @navbar-inverse-link-active-color;
       }
     }
-    > .dropdown > a:hover .caret {
-      border-top-color: @navbar-inverse-link-hover-color;
-      border-bottom-color: @navbar-inverse-link-hover-color;
-    }
-    > .dropdown > a .caret {
-      border-top-color: @navbar-inverse-link-color;
-      border-bottom-color: @navbar-inverse-link-color;
-    }
-    > .open > a {
-      &,
-      &:hover,
-      &:focus {
-        .caret {
-          border-top-color: @navbar-inverse-link-active-color;
-          border-bottom-color: @navbar-inverse-link-active-color;
-        }
-      }
-    }
 
-    @media (max-width: @screen-xs-max) {
+    @media (max-width: @grid-float-breakpoint-max) {
       // Dropdowns get custom display
       .open .dropdown-menu {
         > .dropdown-header {
           border-color: @navbar-inverse-border;
         }
+        .divider {
+          background-color: @navbar-inverse-border;
+        }
         > li > a {
           color: @navbar-inverse-link-color;
           &:hover,

data/lib/padrino-admin/bootstrap-less/navs.less

@@ -10,7 +10,7 @@
   margin-bottom: 0;
   padding-left: 0; // Override default ul/ol
   list-style: none;
-  .clearfix();
+  &:extend(.clearfix all);
 
   > li {
     position: relative;
@@ -51,12 +51,17 @@
     }
   }
 
-  // Dividers (basically an hr) within the dropdown
+  // Nav dividers (deprecated with v3.0.1)
+  //
+  // This should have been removed in v3 with the dropping of `.nav-list`, but
+  // we missed it. We don't currently support this anywhere, but in the interest
+  // of maintaining backward compatibility in case you use it, it's deprecated.
   .nav-divider {
     .nav-divider();
   }
 
   // Prevent IE8 from misplacing imgs
+  //
   // See https://github.com/h5bp/html5-boilerplate/issues/984#issuecomment-3985989
   > li > a > img {
     max-width: none;
@@ -86,7 +91,7 @@
       }
     }
 
-    // Active state, and it's :hover to override normal :hover
+    // Active state, and its :hover to override normal :hover
     &.active > a {
       &,
       &:hover,
@@ -115,7 +120,7 @@
 
     // Links rendered as pills
     > a {
-      border-radius: 5px;
+      border-radius: @nav-pills-border-radius;
     }
     + li {
       margin-left: 2px;
@@ -159,28 +164,54 @@
     float: none;
      > a {
       text-align: center;
+      margin-bottom: 5px;
     }
   }
 
-  @media (min-width: @screen-sm) {
+  > .dropdown .dropdown-menu {
+    top: auto;
+    left: auto;
+  }
+
+  @media (min-width: @screen-sm-min) {
     > li {
       display: table-cell;
       width: 1%;
+      > a {
+        margin-bottom: 0;
+      }
     }
   }
 }
 
 // Move borders to anchors instead of bottom of list
+//
+// Mixin for adding on top the shared `.nav-justified` styles for our tabs
 .nav-tabs-justified {
   border-bottom: 0;
-  > li > a {
-    border-bottom: 1px solid @nav-tabs-justified-link-border-color;
 
+  > li > a {
     // Override margin from .nav-tabs
     margin-right: 0;
+    border-radius: @border-radius-base;
+  }
+
+  > .active > a,
+  > .active > a:hover,
+  > .active > a:focus {
+    border: 1px solid @nav-tabs-justified-link-border-color;
   }
-  > .active > a {
-    border-bottom-color: @nav-tabs-justified-active-link-border-color;
+
+  @media (min-width: @screen-sm-min) {
+    > li > a {
+      border-bottom: 1px solid @nav-tabs-justified-link-border-color;
+      border-radius: @border-radius-base @border-radius-base 0 0;
+    }
+    > .active > a,
+    > .active > a:hover,
+    > .active > a:focus {
+      border-bottom-color: @nav-tabs-justified-active-link-border-color;
+    }
   }
 }
 
@@ -188,38 +219,20 @@
 // Tabbable tabs
 // -------------------------
 
-// Clear any floats
-.tabbable {
-  .clearfix();
-}
-
-// Show/hide tabbable areas
-.tab-content > .tab-pane,
-.pill-content > .pill-pane {
-  display: none;
-}
-.tab-content,
-.pill-content {
+// Hide tabbable panes to start, show them when `.active`
+.tab-content {
+  > .tab-pane {
+    display: none;
+  }
   > .active {
     display: block;
   }
 }
 
 
-
 // Dropdowns
 // -------------------------
 
-// Make dropdown carets use link color in navs
-.nav .caret {
-  border-top-color: @link-color;
-  border-bottom-color: @link-color;
-}
-.nav a:hover .caret {
-  border-top-color: @link-hover-color;
-  border-bottom-color: @link-hover-color;
-}
-
 // Specific dropdowns
 .nav-tabs .dropdown-menu {
   // make dropdown border overlap tab border