From 5940f1ff1a7e63bd39a1d56f50beb718a4536301 Mon Sep 17 00:00:00 2001
From: Brian Talbot <btalbot@edx.org>
Date: Fri, 28 Mar 2014 08:03:58 -0400
Subject: [PATCH] Studio: updating Sass ui-disabled placholder syntax and
 creating utility is-disabled class

Studio: revising .fake-link utility class to use Sass placeholder and syncing commenting style

LMS: updating Sass ui-disabled placholder syntax and creating utility is-disabled class

Studio: adding in basic action Sass placeholder for use in enabling/disabling UI

Studio: applying action Sass placeholder to publish/create-draft Unit view actions

STUD-1497
---
 cms/static/sass/_base.scss              | 10 +++++++++-
 cms/static/sass/elements/_controls.scss | 15 +++++++++++++++
 cms/static/sass/views/_unit.scss        | 11 ++++++++++-
 common/static/sass/_mixins.scss         |  1 +
 lms/static/sass/base/_base.scss         | 18 +++++++++++++-----
 lms/static/sass/base/_mixins.scss       |  1 +
 6 files changed, 49 insertions(+), 7 deletions(-)

diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 55b81b55d6..2385ab7d77 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -782,12 +782,20 @@ hr.divide {
 // ====================
 
 // basic utility
+
+// UI - semantically hide text
 .sr {
   @extend %cont-text-sr;
 }
 
+// UI - faking a link's behavior
 .fake-link {
-  cursor: pointer;
+  @extend %ui-fake-link;
+}
+
+// UI - disabled
+.is-disabled {
+  @extend %ui-disabled;
 }
 
 .non-list {
diff --git a/cms/static/sass/elements/_controls.scss b/cms/static/sass/elements/_controls.scss
index f96977be71..cf8c114e49 100644
--- a/cms/static/sass/elements/_controls.scss
+++ b/cms/static/sass/elements/_controls.scss
@@ -1,6 +1,21 @@
 // studio - elements - UI controls
 // ====================
 
+// ====================
+
+// general actions
+%action {
+  @extend %ui-fake-link;
+
+  &.is-disabled {
+    @extend %ui-disabled;
+    -webkit-filter: grayscale(65%);
+    opacity: 0.65;
+  }
+}
+
+// ====================
+
 // gray primary button
 %btn-primary-gray {
   @extend %ui-btn-primary;
diff --git a/cms/static/sass/views/_unit.scss b/cms/static/sass/views/_unit.scss
index 8d438abe23..9d19cfdee0 100644
--- a/cms/static/sass/views/_unit.scss
+++ b/cms/static/sass/views/_unit.scss
@@ -1038,6 +1038,7 @@ body.unit {
     padding: $baseline/2 $baseline;
   }
 
+
   .unit-actions {
     border-bottom: none;
     padding-bottom: 0;
@@ -1055,8 +1056,16 @@ body.unit {
     div {
       margin-top: 15px;
     }
-  }
 
+    // actions - publish/edit
+    .publish-draft {
+      @extend %action;
+    }
+
+    .create-draft {
+      @extend %action;
+    }
+  }
 
 
   input[type="radio"] {
diff --git a/common/static/sass/_mixins.scss b/common/static/sass/_mixins.scss
index da4a9c19d1..69e8cc200a 100644
--- a/common/static/sass/_mixins.scss
+++ b/common/static/sass/_mixins.scss
@@ -106,6 +106,7 @@
 %ui-disabled {
   pointer-events: none;
   outline: none;
+  cursor: default;
 }
 
 // extends - UI - depth levels
diff --git a/lms/static/sass/base/_base.scss b/lms/static/sass/base/_base.scss
index 01d415e1ac..0655a9198d 100644
--- a/lms/static/sass/base/_base.scss
+++ b/lms/static/sass/base/_base.scss
@@ -222,10 +222,6 @@ mark {
   }
 }
 
-.sr {
-  @extend %text-sr;
-}
-
 .help-tab {
   @include transform(rotate(-90deg));
   @include transform-origin(0 0);
@@ -286,7 +282,19 @@ mark {
   height: 150px;
 }
 
-// ui - skipnav
+// ====================
+
+// UI - disabled state
+.is-disabled {
+  @extend %ui-disabled;
+}
+
+// UI - semantically hide text
+.sr {
+  @extend %text-sr;
+}
+
+// UI - skipnav
 .nav-skip {
   display: block;
   position: absolute;
diff --git a/lms/static/sass/base/_mixins.scss b/lms/static/sass/base/_mixins.scss
index 0205fe9875..f6cbd3ce5f 100644
--- a/lms/static/sass/base/_mixins.scss
+++ b/lms/static/sass/base/_mixins.scss
@@ -87,6 +87,7 @@
 %ui-disabled {
   pointer-events: none;
   outline: none;
+  cursor: default;
 }
 
 // extends - UI - depth levels