studio - adjusts visual vertical spacing of save/cancel actions in modal editing windows on unit and page edits.

cms/static/sass/views/_static-pages.scss

@@ -2,7 +2,7 @@
 // ====================
 
 body.course.static-pages {
-  
+
   .new-static-page-button {
     @include grey-button;
     display: block;
@@ -43,8 +43,8 @@ body.course.static-pages {
       display: none;
       padding: 0;
       border-radius: 2px 2px 0 0;
-      
-      //Overrides general edit-box mixin 
+
+      //Overrides general edit-box mixin
       .row {
         margin-bottom: 0px;
       }
@@ -56,7 +56,7 @@ body.course.static-pages {
         background-color: $gray-l6;
 
         .save-button {
-        margin: 15px 8px 0 0;
+        margin: ($baseline/2) 8px 0 0;
         }
       }
     }

cms/static/sass/views/_unit.scss

@@ -80,7 +80,7 @@ body.course.unit {
       letter-spacing: 1px;
       text-transform: uppercase;
     }
-    
+
     // Component List Meta
     // ====================
     // TODO: clean up organization of this page, to many levels/duplication
@@ -457,14 +457,14 @@ body.course.unit {
         margin-bottom: 0px;
       }
 
-      // Module Actions, also used for Static Pages 
+      // Module Actions, also used for Static Pages
       .module-actions {
         @include box-shadow(inset 0 1px 1px $shadow);
         padding: 0px 0 10px 10px;
         background-color: $gray-l6;
 
         .save-button {
-        margin: 15px 8px 0 0;
+        margin: ($baseline/2) 8px 0 0;
         }
       }
 
@@ -487,11 +487,14 @@ body.course.unit {
   //Component Name
   .component-name {
     @extend .t-copy-sub1;
-    color: $white;
     width: 50%;
+    color: $white;
+    font-weight: 600;
 
     em {
-      font-weight: 600;
+      display: inline-block;
+      margin-right: ($baseline/4);
+      font-weight: 400;
       color: $white;
     }
   }
@@ -502,7 +505,7 @@ body.course.unit {
     right: 0;
     top: 0;
     position: absolute;
-    padding: 15px;
+    padding: 12px ($baseline*0.75);
 
     .mode {
       display: inline-block;
@@ -517,15 +520,15 @@ body.course.unit {
         @include blue-button;
 
         &.is-set {
+          @include transition(box-shadow 0.5 ease-in-out);
           @include linear-gradient($blue, $blue);
           color: $blue-d1;
-          box-shadow: inset 0 1px 2px 2px $shadow;
+          box-shadow: inset 0 1px 2px 1px $shadow-l1;
           background-color: $blue-d4;
           cursor: default;
 
           &:hover {
-            box-shadow: inset 0 1px 2px 2px  $shadow;
-            background-color: $blue-d4;
+            box-shadow: inset 0 1px 2px 1px  $shadow;
           }
         }
       }
@@ -553,7 +556,7 @@ body.course.unit {
   }
 
   //settings-list
-  .list-input.settings-list { 
+  .list-input.settings-list {
     margin: 0;
     padding: 0;
     list-style: none;
@@ -574,7 +577,7 @@ body.course.unit {
       background-color: rgba(0, 0, 0, .5);
     }
 
-    //component-setting-entry 
+    //component-setting-entry
     .field.comp-setting-entry {
       background-color: $white;
       padding: 20px;
@@ -612,7 +615,7 @@ body.course.unit {
         .setting-input {
           color: $blue-l1;
         }
-        
+
         //setting-clear
         .setting-clear { }
       }
@@ -675,7 +678,7 @@ body.course.unit {
 
         width: 38.5%;
         @include box-shadow(0 1px 2px $shadow-l1 inset);
-        //For webkit browsers which render number fields differently, make input wider. 
+        //For webkit browsers which render number fields differently, make input wider.
         -moz-column-width: {
           width: 32%;
         }
@@ -738,7 +741,7 @@ body.course.unit {
   }
 }
 
-// Editing Units from Courseware  
+// Editing Units from Courseware
 // ====================
 
 body.unit {
@@ -763,7 +766,7 @@ body.unit {
   }
 }
 
-// Unit Page Sidebar  
+// Unit Page Sidebar
 // ====================
 
 .unit-settings {
@@ -983,4 +986,4 @@ body.unit {
 //hides latex compiler button if settings mode is-active
 div.wrapper-comp-editor.is-inactive + div.launch-latex-compiler{
  display: none;
-}
+}