Minor style edits

factore · Apr 5, 2016 · 9293733 · 9293733
1 parent c856669
commit 9293733
Show file tree

Hide file tree

Showing 9 changed files with 45 additions and 40 deletions.
diff --git a/...ts/javascripts/tenon/components/resource-index/components/custom/post-category-fields.es6 b/...ts/javascripts/tenon/components/resource-index/components/custom/post-category-fields.es6
@@ -10,7 +10,6 @@ window.ResourceIndexComponents.PostCategoryFields = (props) => {
         onChange={onChange}
         errors={currentRecordErrors.title}
         label="Title" />
-      <button type="submit" className="btn">Save</button>
     </div>
   );
 };
diff --git a/app/assets/javascripts/tenon/components/resource-index/components/default/modal-form.es6 b/app/assets/javascripts/tenon/components/resource-index/components/default/modal-form.es6
@@ -63,35 +63,41 @@
       return (
         <div>
           <div className={modalClassNames}>
-            <div className="modal__content">
-              <div
-                className={baseErrors.length && 'input-block' }>
-                {baseErrors.map((error) => {
-                  return (
-                    <label className="input-block__error-message">
-                      {error}
-                    </label>
-                  );
-                })}
-              </div>
-
-              <form
+            <form
                 onSubmit={(e) => this._onSubmit(e)}
                 ref={(f) => this._form = f}>
+              <div className="modal__content">
+                <div
+                  className={baseErrors.length && 'input-block' }>
+                  {baseErrors.map((error) => {
+                    return (
+                      <label className="input-block__error-message">
+                        {error}
+                      </label>
+                    );
+                  })}
+                </div>
+
                 <ModalFields
                   { ...this.props }
                   onChange={(e) => this._updateValue(e)} />
-              </form>
-            </div>
-
-            <div className="modal__footer">
-              <a
-                href="#!"
-                onClick={(e) => toggleModalForm(e, 'off')}
-                className="modal__action">
-                Cancel
-              </a>
-            </div>
+              </div>
+
+              <div className="modal__footer">
+                <button
+                  onClick={(e) => toggleModalForm(e, 'off')}
+                  className="modal__action">
+                  Cancel
+                </button>
+
+                <button
+                  type="submit"
+                  className="modal__action">
+                  Save
+                </button>
+              </div>
+            </form>
+
           </div>
           <div
             onClick={(e) => toggleModalForm(e, 'off')}

diff --git a/app/assets/stylesheets/tenon/mixins/z-depth.scss b/app/assets/stylesheets/tenon/mixins/z-depth.scss
@@ -4,27 +4,27 @@
 }
 
 @mixin z-depth-1 {
-  box-shadow: 0 2px 5px 0 rgba($grey, .16), 0 2px 10px 0 rgba($grey, .12);
+  box-shadow: 0 2px 5px 0 rgba($black, .16), 0 2px 10px 0 rgba($black, .12);
 }
 
 @mixin z-depth-2 {
-  box-shadow: 0 5px 11px 0 rgba($grey, .18), 0 4px 15px 0 rgba($grey, .15);
+  box-shadow: 0 5px 11px 0 rgba($black, .18), 0 4px 15px 0 rgba($black, .15);
 }
 
 @mixin z-depth-3 {
-  box-shadow: 0 8px 17px 0 rgba($grey, .2), 0 6px 20px 0 rgba($grey, .19);
+  box-shadow: 0 8px 17px 0 rgba($black, .2), 0 6px 20px 0 rgba($black, .19);
 }
 
 @mixin z-depth-4 {
-  box-shadow: 0 12px 15px 0 rgba($grey, .24), 0 17px 50px 0 rgba($grey, .19);
+  box-shadow: 0 12px 15px 0 rgba($black, .24), 0 17px 50px 0 rgba($black, .19);
 }
 
 @mixin z-depth-5 {
-  box-shadow: 0 16px 28px 0 rgba($grey, .22), 0 25px 55px 0 rgba($grey, .21);
+  box-shadow: 0 16px 28px 0 rgba($black, .22), 0 25px 55px 0 rgba($black, .21);
 }
 
 @mixin z-depth-6 {
-  box-shadow: 0 27px 24px 0 rgba($grey, .2), 0 40px 77px 0 rgba($grey, .22);
+  box-shadow: 0 27px 24px 0 rgba($black, .2), 0 40px 77px 0 rgba($black, .22);
 }
 
 %z-depth-0 {

diff --git a/app/assets/stylesheets/tenon/modules/fab.scss b/app/assets/stylesheets/tenon/modules/fab.scss
@@ -1,5 +1,5 @@
 .fab {
-  @extend %z-depth-1;
+  @extend %z-depth-2;
   @include default-transition;
   @include animation(btn-fab-intro .3s forwards .5s);
   @include transform(scale(0) rotate(-45deg));
@@ -28,7 +28,7 @@
   }
 
   &:hover {
-    @extend %z-depth-2;
+    @extend %z-depth-3;
   }
 }
 

diff --git a/app/assets/stylesheets/tenon/modules/main-nav-drawer.scss b/app/assets/stylesheets/tenon/modules/main-nav-drawer.scss
@@ -95,7 +95,7 @@
 // sub-nav toggle
 .main-nav__link-toggle {
   position: absolute;
-  top: $default-spacing / 4;
+  top: 12px;
   right: $default-spacing / 2;
 }
 

diff --git a/app/assets/stylesheets/tenon/modules/toolbar.scss b/app/assets/stylesheets/tenon/modules/toolbar.scss
@@ -1,4 +1,5 @@
 .toolbar {
+  @extend %font-n2;
   @include transition(background .25s ease);
   position: fixed;
   top: 0;

diff --git a/app/assets/stylesheets/tenon/modules/util-nav.scss b/app/assets/stylesheets/tenon/modules/util-nav.scss
@@ -26,7 +26,7 @@
 }
 
 .util-nav__action-icon {
-  @extend %z-depth-2;
+  @extend %z-depth-1;
   @include default-transition;
   display: inline-block;
   float: left;
@@ -40,8 +40,8 @@
   color: $avatar-fg-color;
 
   &:hover {
-    @extend %z-depth-0;
-    color: $avatar-fg-hover-color;
+    @extend %z-depth-2;
+    color: $avatar-fg-color;
   }
 
   > .material-icon { line-height: 32px; }

diff --git a/app/assets/stylesheets/tenon/variables/colors-named.scss b/app/assets/stylesheets/tenon/variables/colors-named.scss
@@ -75,7 +75,6 @@ $app-info-bg-color: darken($grey, 25%);
 // Account Avatar
 $avatar-bg-color: $white;
 $avatar-fg-color: $primary-fg-color;
-$avatar-fg-hover-color: $primary-color;
 
 // Toolbar
 $burger-color: $white;

diff --git a/app/helpers/tenon/nav_helper.rb b/app/helpers/tenon/nav_helper.rb
@@ -9,8 +9,8 @@ def nav_item(text, path, icon, link_opts = {}, &blk)
     private
 
     def subnav(&blk)
-      icons = content_tag(:i, 'add', class: 'main-nav__open-icon')
-      icons += content_tag(:i, 'remove', class: 'main-nav__close-icon')
+      icons = content_tag(:i, 'keyboard_arrow_down', class: 'main-nav__open-icon')
+      icons += content_tag(:i, 'keyboard_arrow_up', class: 'main-nav__close-icon')
       content = link_to(icons, '#', class: 'main-nav__link-toggle')
       content += content_tag(:ul, capture(&blk), class: 'main-nav__sub-nav')
       content