Merge pull request #3007 from edx/frances/feature/ui-loading

added loading pattern to studio

cms/templates/ux/reference/container.html

@@ -35,6 +35,11 @@ from django.core.urlresolvers import reverse
     <div class="inner-wrapper">
         <section class="content-area">
             <article class="content-primary">
+
+            <div class="ui-loading">
+                <p><span class="spin"><i class="icon-refresh"></i></span> <span class="copy">Loading...</span></p>
+            </div>
+
                 <section class="wrapper-xblock level-page">
                     <header class="xblock-header">
                         <div class="header-details">

common/static/sass/_mixins.scss

@@ -265,6 +265,24 @@
   padding: ($baseline*0.75) $baseline;
 }
 
+.ui-loading {
+  @include animation(fadeIn $tmg-f2 linear 1);
+  @extend %ui-well;
+  opacity: .6;
+  background-color: $white;
+  padding: ($baseline*1.5) $baseline;
+  text-align: center;
+
+  .spin {
+    @extend %anim-rotateCW;
+    display: inline-block;
+  }
+
+  .copy {
+    padding-left: ($baseline/4);
+  }
+}
+
 // ====================
 
 // extends - content - removes list styling/spacing when using uls, ols for navigation and less content-centric cases