studio - checklists: roughed out initial static design, HTML, and most CSS for checklists v0 UI

cms/djangoapps/contentstore/views.py

@@ -113,6 +113,9 @@ def howitworks(request):
     else: 
         return render_to_response('howitworks.html', {})
 
+def ux_checklists(request):
+    return render_to_response('ux-checklists.html', {})
+
 # ==== Views for any logged-in user ==================================
 
 

cms/static/sass/_base.scss

@@ -214,7 +214,7 @@ h1 {
       color: $gray-l2;
     }
 
-    .title, .title-1 {
+    .title-1 {
       @include font-size(32);
       margin: 0;
       padding: 0;
@@ -283,8 +283,8 @@ h1 {
 
   .title-3 {
     @include font-size(16);
-    margin: 0 0 ($baseline/4) 0;
-    font-weight: 500;
+    margin: 0 0 ($baseline/2) 0;
+    font-weight: 600;
   }
 
   .title-4 {
@@ -772,6 +772,10 @@ hr.divide {
   word-wrap: break-word;
 }
 
+hr.divider {
+  @extend .sr;
+}
+
 // ====================
 
 // js dependant

cms/static/sass/_variables.scss

@@ -77,6 +77,9 @@ $shadow: rgba(0,0,0,0.2);
 $shadow-l1: rgba(0,0,0,0.1);
 $shadow-d1: rgba(0,0,0,0.4);
 
+// misc.
+$elem-height-imaginary: 1000000px;
+
 // colors - inherited 
 $baseFontColor: #3c3c3c;
 $offBlack: #3c3c3c;

cms/static/sass/base-style.scss

@@ -31,6 +31,7 @@
 @import "login";
 @import "account";
 @import "index";
+@import "checklists";
 @import 'jquery-ui-calendar';
 
 @import 'content-types';

cms/templates/checklists.html

+<%inherit file="base.html" />
+<%block name="title">Course Checklists</%block>
+<%block name="bodyclass">is-signedin course checklists</%block>
+
+<%block name="jsextra">
+<script type="text/javascript">
+  // checklists - prototype/basic concept JS
+  $(document).ready(function() {
+    
+    
+  });
+</script>
+</%block>
+
+<%block name="content">
+<div class="wrapper-mast wrapper">
+  <header class="mast has-actions has-subtitle">
+    <div class="title">
+      <span class="title-sub">UX Design</span>
+      <h1 class="title-1">Alerts &amp; Notifications</h1>
+    </div>
+  </header>
+</div>
+
+<div class="wrapper-content wrapper">
+  <section class="content">
+    <article class="content-primary" role="main">
+      <section>
+        <header>
+          <h2 class="title-2">Alerts</h2>
+          <span class="tip">persistant, static messages to the user</span>
+        </header>
+
+        <p>In Studio, alerts are 1) general warnings/notes (e.g. drafts, published content, next steps) about the current view a user is interacting with or 2) notes about the status (e.g. saved confirmations, errors, next system steps) of any previous state that need to communicated to the user when arriving at the current view.</p>
+      </section>
+    </article>
+  </section>
+</div>
+</%block>
+
+<%block name="view_alerts">
+<!-- alerts, notifications, prompts here -->
+</%block>
\ No newline at end of file

cms/templates/widgets/header.html

@@ -58,6 +58,7 @@
                 <ul>
                   <li class="nav-item nav-course-tools-import"><a href="${reverse('import_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">Import</a></li>
                   <li class="nav-item nav-course-tools-export"><a href="${reverse('export_course', kwargs=dict(org=ctx_loc.org, course=ctx_loc.course, name=ctx_loc.name))}">Export</a></li>
+                  <li class="nav-item nav-course-tools-checklists"><a href="${reverse('checklists')}">Tasks &amp; Checklists</a></li>
                 </ul>
               </div>
             </div>

cms/urls.py

@@ -83,6 +83,7 @@ urlpatterns = ('',
 
 # User creation and updating views
 urlpatterns += (
+    url(r'^ux-checklists$', 'contentstore.views.ux_checklists', name='checklists'),
     url(r'^howitworks$', 'contentstore.views.howitworks', name='howitworks'),
     url(r'^signup$', 'contentstore.views.signup', name='signup'),