trestle 0.8.4 → 0.8.11

data/app/assets/stylesheets/trestle/components/_navigation.scss

@@ -38,7 +38,8 @@
     vertical-align: 0;
   }
 
-  .nav-header {
+  .nav-header a {
+    position: relative;
     color: rgba(white, 0.25);
 
     text-transform: uppercase;
@@ -46,6 +47,24 @@
     font-size: 11px;
 
     padding: 5px 20px;
+
+    &::after {
+      @extend .ion;
+      content: $ionicon-var-arrow-down-b;
+
+      float: right;
+      margin-top: 2px;
+
+      opacity: 0.75;
+    }
+
+    &:hover, &:focus {
+      background: none;
+
+      &::before, &::after {
+        opacity: 1 !important;
+      }
+    }
   }
 
   .active a {
@@ -62,50 +81,121 @@
     position: relative;
     top: 1px;
   }
+
+  .collapsed {
+    li {
+      display: none;
+
+      &.nav-header {
+        display: block;
+      }
+    }
+  }
+}
+
+.nav-tooltip {
+  display: none !important;
 }
 
 @mixin collapsed-nav-header {
-  border-bottom: 1px solid rgba(white, 0.1);
   height: 0;
-  margin: 0 15px 14px;
-  padding: 5px 0;
+  padding: 10px 15px 15px;
   text-indent: -99999px;
+
+  &::after {
+    display: none;
+
+    position: absolute;
+    top: 4px;
+    left: 50%;
+    margin-left: -3px;
+
+    text-indent: 0;
+  }
+
+  &::before {
+    content: "";
+
+    position: absolute;
+    left: 15px;
+    right: 15px;
+    top: 50%;
+    margin-top: -4px;
+
+    border-bottom: 1px solid rgba(white, 0.1);
+    opacity: 0.75;
+  }
 }
 
 @include tablet {
+  .nav-tooltip {
+    display: block !important;
+  }
+
   .app-nav {
     .nav-label, .nav-badge {
       display: none;
     }
 
-    .nav-header {
+    .nav-header a {
       @include collapsed-nav-header;
     }
 
-    .expanded & {
-      .nav-header {
+    .collapsed .nav-header a {
+      &::after {
         display: block;
-        border-bottom: none;
+      }
+    }
+  }
+
+  .sidebar-expanded {
+    .app-nav {
+      .nav-header a {
         height: auto;
-        margin: 0;
         padding: 5px 20px;
         text-indent: 0;
+
+        &::before {
+          display: none;
+        }
+
+        &::after {
+          display: block;
+          position: static;
+          margin-left: 0;
+        }
       }
 
       .nav-label  { display: inline; }
       .nav-badge  { display: block; }
     }
+
+    .nav-tooltip {
+      display: none !important;
+    }
   }
 }
 
 @include desktop {
-  .collapsed .app-nav {
-    .nav-label, .nav-badge {
-      display: none;
+  .sidebar-collapsed {
+    .app-nav {
+      .nav-label, .nav-badge {
+        display: none;
+      }
+
+      .nav-header a {
+        @include collapsed-nav-header;
+      }
+
+      .collapsed .nav-header a {
+        &::after {
+          display: block;
+        }
+      }
     }
 
-    .nav-header {
-      @include collapsed-nav-header;
+    .nav-tooltip {
+      display: block !important;
     }
   }
 }

data/app/assets/stylesheets/trestle/components/_pagination.scss

@@ -1,6 +1,5 @@
 .pagination-container {
-  margin-top: 20px;
-  margin-bottom: 20px;
+  margin-left: auto;
   text-align: right;
 
   p {
@@ -26,7 +25,8 @@
 
 @include mobile {
   .pagination-container {
-    margin-top: 10px;
+    margin-right: auto;
+
     text-align: center;
 
     display: flex;

data/app/assets/stylesheets/trestle/components/_scopes.scss

@@ -3,9 +3,17 @@
   @extend .nav-pills;
 
   display: flex;
+  flex-wrap: wrap;
 
-  > li + li {
-    margin-left: 4px;
+  margin-top: -4px;
+
+  > li {
+    margin-top: 4px;
+    margin-right: 4px;
+
+    &:last-child {
+      margin-right: 0;
+    }
   }
 
   > li > a {
@@ -14,6 +22,7 @@
 
     font-size: 11px;
     font-weight: normal;
+    white-space: nowrap;
 
     border-radius: 15px;
     padding: 2px 8px;

data/app/assets/stylesheets/trestle/components/_sidebar.scss

@@ -15,6 +15,7 @@
     display: flex;
     flex-direction: column;
 
+    overflow-x: hidden;
     overflow-y: auto;
 
     &::-webkit-scrollbar {
@@ -170,7 +171,7 @@
       content: $fa-var-angle-double-right;
     }
 
-    &.expanded {
+    .sidebar-expanded & {
       width: $sidebar-width;
 
       .app-sidebar-header {
@@ -203,7 +204,7 @@
 
 @include desktop {
   .app-sidebar {
-    &.collapsed {
+    .sidebar-collapsed & {
       width: $sidebar-width-collapsed;
 
       .app-sidebar-header {

data/app/assets/stylesheets/trestle/components/_table.scss

@@ -1,3 +1,17 @@
+@mixin table-container-background($background) {
+  background-image: linear-gradient(to right, $background 30%, rgba($background, 0)),
+                    linear-gradient(to left, $background 30%, rgba($background, 0)),
+                    radial-gradient(at 0 50%, rgba(black, 0.2), rgba(black, 0) 70%),
+                    radial-gradient(at 100% 50%, rgba(black, 0.2), rgba(black, 0) 70%);
+
+  background-color: $background;
+
+  background-position: 0 0, 100% 0, 0 0, 100% 0;
+  background-repeat: no-repeat;
+  background-size: 50px 100%, 50px 100%, 15px 100%, 15px 100%;
+  background-attachment: local, local, scroll, scroll;
+}
+
 .table-container {
   overflow-x: auto;
 
@@ -5,15 +19,11 @@
   // scrolling background hints. Must be disabled explicitly.
   -webkit-overflow-scrolling: auto;
 
-  background-image: linear-gradient(to right, white 30%, rgba(white, 0)),
-                    linear-gradient(to left, white 30%, rgba(white, 0)),
-                    radial-gradient(at 0 50%, rgba(black, 0.2), rgba(black, 0) 70%),
-                    radial-gradient(at 100% 50%, rgba(black, 0.2), rgba(black, 0) 70%);
-  background-position: 0 0, 100% 0, 0 0, 100% 0;
-  background-repeat: no-repeat;
-  background-color: white;
-  background-size: 50px 100%, 50px 100%, 15px 100%, 15px 100%;
-  background-attachment: local, local, scroll, scroll;
+  @include table-container-background(white);
+
+  .main-content-sidebar & {
+    @include table-container-background($content-sidebar-background);
+  }
 }
 
 .trestle-table {
@@ -66,10 +76,24 @@
         text-align: center;
       }
 
-      & + .btn {
+      &.has-icon .btn-label {
+        @include sr-only;
+      }
+    }
+
+    .btn,
+    .btn-group {
+      + .btn,
+      + .btn-group {
         margin-left: 4px;
       }
     }
+
+    .btn-group {
+      .btn + .btn {
+        margin-left: -1px;
+      }
+    }
   }
 
   .avatar {

data/app/assets/stylesheets/trestle/components/_tags.scss

@@ -14,6 +14,15 @@
   }
 }
 
+a.tag {
+  &:hover, &:focus {
+    text-decoration: none;
+    color: white;
+    background: $brand-primary;
+    border-left-color: darken($brand-primary, 10%);
+  }
+}
+
 .tag-select {
   &.select2-selection--multiple {
     .select2-selection__choice {

data/app/assets/stylesheets/trestle/components/_timestamp.scss

@@ -5,8 +5,11 @@
   small {
     display: block;
     color: #666;
+  }
 
-    .inline & {
+  &.timestamp-inline,
+  &.inline, {
+    small {
       display: inline;
     }
   }

data/app/assets/stylesheets/trestle/components/_toolbars.scss

@@ -0,0 +1,55 @@
+.btn-toolbar {
+  .btn,
+  .btn-group,
+  .input-group {
+    float: none;
+  }
+
+  > .btn,
+  > .btn-group,
+  > .input-group {
+    margin-left: 1px;
+  }
+
+  .btn-group {
+    .btn + .btn,
+    .btn + .btn-group,
+    .btn-group + .btn,
+    .btn-group + .btn-group {
+      margin-left: -4px;
+    }
+  }
+}
+
+.primary-toolbar {
+  .btn {
+    @extend .btn-lg;
+    font-size: 20px;
+    padding: 8px 16px;
+    border-radius: $border-radius-base;
+
+    @include mobile {
+      font-size: 18px;
+      padding: 7px 12px;
+    }
+  }
+}
+
+.secondary-toolbar {
+  .btn {
+    font-size: 12px;
+    padding: 4px 10px;
+
+    i {
+      font-size: 11px;
+    }
+
+    @include mobile {
+      font-size: 11px;
+
+      i {
+        font-size: 10px;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/trestle/components/_wells.scss

@@ -1,5 +1,5 @@
 .well {
-  padding: 20px;
+  padding: 15px;
 
   box-shadow: none;
   border-radius: 0;
@@ -13,6 +13,14 @@
   }
 }
 
+.well-lg {
+  padding: 24px;
+}
+
+.well-sm {
+  padding: 9px;
+}
+
 .main-content-sidebar .well {
   margin: 0 -20px;
   background: darken($well-bg, 3%);

data/app/assets/stylesheets/trestle/core/_defaults.scss

@@ -11,6 +11,7 @@ $theme-bg-gradient:          linear-gradient(rgba(white, $theme-bg-gradient-stre
 $theme-bg-color:             darken($brand-primary, 15%) !default;
 
 $theme-bg: $theme-bg-texture-url, $theme-bg-gradient, $theme-bg-color !default;
+$error-bg: $theme-bg-texture-url, $theme-bg-gradient, $brand-danger !default;
 
 $body-bg: #f3f3f3 !default;
 
@@ -30,8 +31,16 @@ $sidebar-toggle-color: rgba(white, 0.5) !default;
 
 $content-header-background: rgba(white, 0.6) !default;
 
-$content-sidebar-width:      275px !default;
-$content-sidebar-background: rgba(black, 0.025);
+$content-sidebar-width:      285px !default;
+$content-sidebar-background: #f9f9f9 !default;
+
+$main-content-header-background: $content-sidebar-background !default;
+$main-content-header-padding:    12px 20px !default;
+$main-content-header-border:     1px solid rgba(black, 0.1) !default;
+
+$main-content-footer-background: $content-sidebar-background !default;
+$main-content-footer-padding:    12px 20px !default;
+$main-content-footer-border:     1px solid rgba(black, 0.1) !default;
 
 $sidebar-transition-duration: 250ms !default;
 
@@ -40,12 +49,12 @@ $footer-text: #888 !default;
 
 $headings-font-weight: 400 !default;
 
-$btn-default-bg:    #dbdbdb !default;
+$btn-default-bg:    #bbb !default;
 $btn-default-color: white !default;
 
 $state-success-bg: lighten(#dff0d8, 5%) !default;
 $state-info-bg:    lighten(#d9edf7, 5%) !default;
-$state-warning-bg: lighten(#fcf8e3, 5%) !default;
+$state-warning-bg: lighten(#fcf8e3, 2.5%) !default;
 $state-danger-bg:  lighten(#f2dede, 5%) !default;
 
 $alert-padding:       20px !default;
@@ -64,9 +73,9 @@ $table-bg-accent:    rgba(black, 0.02) !default;
 $table-bg-hover:     rgba(black, 0.04) !default;
 $table-border-color: rgba(black, 0.13) !default;
 
-$well-border: transparent;
+$well-border: transparent !default;
 
-$panel-border-radius: 0;
+$panel-border-radius: 0 !default;
 
 $popover-shadow:  0 3px 6px rgba(black, .175) !default;
 $dropdown-shadow: $popover-shadow !default;
@@ -79,4 +88,10 @@ $input-border:       #ccc !default;
 $input-border-focus: mix($brand-primary, $input-border) !default;
 $input-bg-disabled:  #fafafa !default;
 
+$modal-inner-padding: 20px !default;
+$modal-title-padding: 15px 20px !default;
+
+$modal-footer-background:   $content-sidebar-background !default;
+$modal-footer-border-color: rgba(black, 0.1) !default;
+
 $s2bs-btn-default-bg: #eee !default;

data/app/assets/stylesheets/trestle/core/_layout.scss

@@ -41,6 +41,9 @@ img {
 
 .app-main {
   flex: 1 0 auto;
+
+  display: flex;
+  flex-direction: column;
 }
 
 .app-footer {
@@ -57,6 +60,11 @@ img {
   }
 }
 
+.error-iframe {
+  border: 0;
+  flex: 1;
+}
+
 @include mobile {
   body {
     height: auto;

data/app/assets/stylesheets/trestle/core/_mixins.scss

@@ -24,6 +24,17 @@
   right: 0;
 }
 
+@mixin sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  border: 0;
+}
+
 @mixin mobile {
   @media (max-width: $screen-xs-max) {
     @content;

data/app/assets/stylesheets/trestle/core/_typography.scss

@@ -19,6 +19,45 @@ a {
   border-radius: 10em !important;
 }
 
+.main-content-sidebar {
+  font-size: 13px;
+
+  h1, h2, h3, h4, h5, h6 {
+    color: #666;
+    border-bottom: 1px solid #ddd;
+
+    padding-top: 5px;
+    padding-bottom: 0.5em;
+
+    margin-top: 20px;
+    margin-bottom: 15px;
+  }
+
+  h1 {
+    font-size: 28px;
+  }
+
+  h2 {
+    font-size: 24px;
+  }
+
+  h3 {
+    font-size: 21px;
+  }
+
+  h4 {
+    font-size: 17px;
+  }
+
+  h5 {
+    font-size: 14px;
+  }
+
+  h6 {
+    font-size: 12px;
+  }
+}
+
 @include mobile {
   h1 {
     font-size: $font-size-h1 - 6px;

data/app/controllers/concerns/trestle/controller/breadcrumbs.rb

@@ -0,0 +1,21 @@
+module Trestle
+  module Controller
+    module Breadcrumbs
+      extend ActiveSupport::Concern
+
+      included do
+        helper_method :breadcrumbs
+        helper_method :breadcrumb
+      end
+
+    protected
+      def breadcrumbs
+        @breadcrumbs ||= Trestle::Breadcrumb::Trail.new(Trestle.config.root_breadcrumbs)
+      end
+
+      def breadcrumb(label, path=nil)
+        breadcrumbs.append(label, path)
+      end
+    end
+  end
+end

data/app/controllers/concerns/trestle/controller/callbacks.rb

@@ -0,0 +1,21 @@
+module Trestle
+  module Controller
+    module Callbacks
+      extend ActiveSupport::Concern
+
+      included do
+        Trestle.config.before_actions.each do |action|
+          before_action(action.options, &action.block)
+        end
+
+        Trestle.config.after_actions.each do |action|
+          after_action(action.options, &action.block)
+        end
+
+        Trestle.config.around_actions.each do |action|
+          around_action(action.options, &action.block)
+        end
+      end
+    end
+  end
+end

data/app/controllers/concerns/trestle/controller/dialog.rb

@@ -0,0 +1,16 @@
+module Trestle
+  module Controller
+    module Dialog
+      extend ActiveSupport::Concern
+
+      included do
+        helper_method :dialog_request?
+      end
+
+    protected
+      def dialog_request?
+        request.headers["X-Trestle-Dialog"]
+      end
+    end
+  end
+end

data/app/controllers/concerns/trestle/controller/helpers.rb

@@ -0,0 +1,18 @@
+module Trestle
+  module Controller
+    module Helpers
+      extend ActiveSupport::Concern
+
+      included do
+        # Allow inclusion of helpers from Rails application
+        self.helpers_path += Rails.application.helpers_paths
+
+        # Add helpers declared from configuration as blocks
+        helper Trestle.config.helper_module
+
+        # Add helpers declared from configuration as module references
+        helper *Trestle.config.helpers
+      end
+    end
+  end
+end

data/app/controllers/concerns/trestle/controller/layout.rb

@@ -0,0 +1,16 @@
+module Trestle
+  module Controller
+    module Layout
+      extend ActiveSupport::Concern
+
+      included do
+        layout :choose_layout
+      end
+
+    protected
+      def choose_layout
+        request.xhr? ? false : "trestle/admin"
+      end
+    end
+  end
+end

data/app/controllers/concerns/trestle/controller/location.rb

@@ -0,0 +1,15 @@
+module Trestle
+  module Controller
+    module Location
+      extend ActiveSupport::Concern
+
+      included do
+        after_action :set_trestle_location_header, unless: :dialog_request?
+      end
+
+      def set_trestle_location_header
+        headers["X-Trestle-Location"] = request.path
+      end
+    end
+  end
+end