Skip to content

E
edx-platform
Commit e8b4fc21 by Kyle Fiedler Committed by Matthew Mongeau
Options

Added scratch on the calendar view and added handles on the calendar view

parent 13d8b3dc
Showing with 325 additions and 171 deletions
cms/static/css/base-style.css
...@@ -256,7 +256,9 @@ section.sequence-edit > section.content > div section.scratch-pad ol li ul li.em ...@@ -256,7 +256,9 @@ section.sequence-edit > section.content > div section.scratch-pad ol li ul li.em
width: 7px; width: 7px;
min-height: 14px; min-height: 14px;
background: url("../img/drag-handle.png") no-repeat center; background: url("../img/drag-handle.png") no-repeat center;
text-indent: -9999px; } text-indent: -9999px;
display: block;
float: right; }
section.cal { section.cal {
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
...@@ -679,14 +681,27 @@ section.sequence-edit > section.content { ...@@ -679,14 +681,27 @@ section.sequence-edit > section.content {
section.week-new > section.content > div section header, section.week-new > section.content > div section header,
section.sequence-edit > section.content > div section header { section.sequence-edit > section.content > div section header {
background: #eee; background: #eee;
padding: 10px; padding: 6px;
border-bottom: 1px solid #ccc; } border-bottom: 1px solid #ccc;
zoom: 1; }
section.week-edit > section.content > div section header:before, section.week-edit > section.content > div section header:after,
section.week-new > section.content > div section header:before,
section.week-new > section.content > div section header:after,
section.sequence-edit > section.content > div section header:before,
section.sequence-edit > section.content > div section header:after {
content: "";
display: table; }
section.week-edit > section.content > div section header:after,
section.week-new > section.content > div section header:after,
section.sequence-edit > section.content > div section header:after {
clear: both; }
section.week-edit > section.content > div section header h2, section.week-edit > section.content > div section header h2,
section.week-new > section.content > div section header h2, section.week-new > section.content > div section header h2,
section.sequence-edit > section.content > div section header h2 { section.sequence-edit > section.content > div section header h2 {
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
font-size: 12px; } font-size: 12px;
float: left; }
section.week-edit > section.content > div section.modules, section.week-edit > section.content > div section.modules,
section.week-new > section.content > div section.modules, section.week-new > section.content > div section.modules,
section.sequence-edit > section.content > div section.modules { section.sequence-edit > section.content > div section.modules {
...@@ -737,26 +752,37 @@ section.sequence-edit > section.content { ...@@ -737,26 +752,37 @@ section.sequence-edit > section.content {
section.week-new > section.content > div section.modules ol li ol li, section.week-new > section.content > div section.modules ol li ol li,
section.sequence-edit > section.content > div section.modules ol li ol li { section.sequence-edit > section.content > div section.modules ol li ol li {
padding: 6px; } padding: 6px; }
section.week-edit > section.content > div section.modules ol li ol li:hover a.draggable,
section.week-new > section.content > div section.modules ol li ol li:hover a.draggable,
section.sequence-edit > section.content > div section.modules ol li ol li:hover a.draggable {
opacity: 1; }
section.week-edit > section.content > div section.modules ol li ol li a.draggable,
section.week-new > section.content > div section.modules ol li ol li a.draggable,
section.sequence-edit > section.content > div section.modules ol li ol li a.draggable {
float: right;
opacity: .5; }
section.week-edit > section.content > div section.modules ol li ol li.group, section.week-edit > section.content > div section.modules ol li ol li.group,
section.week-new > section.content > div section.modules ol li ol li.group, section.week-new > section.content > div section.modules ol li ol li.group,
section.sequence-edit > section.content > div section.modules ol li ol li.group { section.sequence-edit > section.content > div section.modules ol li ol li.group {
padding: 0; padding: 0; }
border-left: 4px solid #999; }
section.week-edit > section.content > div section.modules ol li ol li.group header, section.week-edit > section.content > div section.modules ol li ol li.group header,
section.week-new > section.content > div section.modules ol li ol li.group header, section.week-new > section.content > div section.modules ol li ol li.group header,
section.sequence-edit > section.content > div section.modules ol li ol li.group header { section.sequence-edit > section.content > div section.modules ol li ol li.group header {
padding: 3px 6px; padding: 6px;
background: none; } background: none; }
section.week-edit > section.content > div section.modules ol li ol li.group header h3, section.week-edit > section.content > div section.modules ol li ol li.group header h3,
section.week-new > section.content > div section.modules ol li ol li.group header h3, section.week-new > section.content > div section.modules ol li ol li.group header h3,
section.sequence-edit > section.content > div section.modules ol li ol li.group header h3 { section.sequence-edit > section.content > div section.modules ol li ol li.group header h3 {
text-transform: uppercase; font-size: 14px; }
letter-spacing: 1px; section.week-edit > section.content > div section.modules ol li ol li.group ol,
font-size: 12px; } section.week-new > section.content > div section.modules ol li ol li.group ol,
section.week-edit > section.content > div section.modules ol li ol li.group ol li:last-child, section.sequence-edit > section.content > div section.modules ol li ol li.group ol {
section.week-new > section.content > div section.modules ol li ol li.group ol li:last-child, border-left: 4px solid #999;
section.sequence-edit > section.content > div section.modules ol li ol li.group ol li:last-child {
border-bottom: 0; } border-bottom: 0; }
section.week-edit > section.content > div section.modules ol li ol li.group ol li:last-child,
section.week-new > section.content > div section.modules ol li ol li.group ol li:last-child,
section.sequence-edit > section.content > div section.modules ol li ol li.group ol li:last-child {
border-bottom: 0; }
section.week-edit > section.content > div section.scratch-pad, section.week-edit > section.content > div section.scratch-pad,
section.week-new > section.content > div section.scratch-pad, section.week-new > section.content > div section.scratch-pad,
section.sequence-edit > section.content > div section.scratch-pad { section.sequence-edit > section.content > div section.scratch-pad {
......
cms/static/sass/_base.scss
...@@ -108,4 +108,6 @@ input[type="submit"], .button { ...@@ -108,4 +108,6 @@ input[type="submit"], .button {
min-height: 14px; min-height: 14px;
background: url('../img/drag-handle.png') no-repeat center; background: url('../img/drag-handle.png') no-repeat center;
text-indent: -9999px; text-indent: -9999px;
display: block;
float: right;
} }
cms/static/sass/_week.scss
...@@ -67,16 +67,19 @@ section.sequence-edit { ...@@ -67,16 +67,19 @@ section.sequence-edit {
display: table; display: table;
border: 1px solid; border: 1px solid;
width: 100%; width: 100%;
section { section {
header { header {
background: #eee; background: #eee;
padding: 10px; padding: 6px;
border-bottom: 1px solid #ccc; border-bottom: 1px solid #ccc;
@include clearfix;
h2 { h2 {
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
font-size: 12px; font-size: 12px;
float: left;
} }
} }
...@@ -118,22 +121,34 @@ section.sequence-edit { ...@@ -118,22 +121,34 @@ section.sequence-edit {
li { li {
padding: 6px; padding: 6px;
&:hover {
a.draggable {
opacity: 1;
}
}
a.draggable {
float: right;
opacity: .5;
}
&.group { &.group {
padding: 0; padding: 0;
border-left: 4px solid #999;
header { header {
padding: 3px 6px; padding: 6px;
background: none; background: none;
h3 { h3 {
text-transform: uppercase; font-size: 14px;
letter-spacing: 1px;
font-size: 12px;
} }
} }
ol { ol {
border-left: 4px solid #999;
border-bottom: 0;
li { li {
&:last-child { &:last-child {
border-bottom: 0; border-bottom: 0;
...@@ -185,9 +200,9 @@ section.sequence-edit { ...@@ -185,9 +200,9 @@ section.sequence-edit {
padding: 12px; padding: 12px;
a { a {
@extend .button; @extend .button;
display: block; display: block;
text-align: center; text-align: center;
} }
} }
......
cms/templates/widgets/navigation.html
...@@ -45,10 +45,22 @@ ...@@ -45,10 +45,22 @@
</header> </header>
<ul> <ul>
<li class="seq"><a href="#" class="sequence-edit">Lecture Sequence</a></li> <li class="seq">
<li class="seq"><a href="#" class="sequence-edit">Lecture Sequence</a></li> <a href="#" class="sequence-edit">Lecture Sequence</a>
<li class="lab"><a href="#" class="lab-edit">Lab</a></li> <a href="#" class="draggable">handle</a>
<li class="hw">Homework</li> </li>
<li class="seq">
<a href="#" class="sequence-edit">Lecture Sequence
<a href="#" class="draggable">handle</a>
</a></li>
<li class="lab">
<a href="#" class="lab-edit">Lab</a>
<a href="#" class="draggable">handle</a>
</li>
<li class="hw">
<a href="#">Homework</a>
<a href="#" class="draggable">handle</a>
</li>
<%include file="module-dropdown.html"/> <%include file="module-dropdown.html"/>
</ul> </ul>
</li> </li>
...@@ -61,10 +73,22 @@ ...@@ -61,10 +73,22 @@
</header> </header>
<ul> <ul>
<li class="seq">Lecture Sequence</li> <li class="seq">
<li class="seq">Lecture Sequence</li> <a href="#" class="sequence-edit">Lecture Sequence</a>
<li class="lab">Lab</li> <a href="#" class="draggable">handle</a>
<li class="hw">Homework</li> </li>
<li class="seq">
<a href="#" class="sequence-edit">Lecture Sequence
<a href="#" class="draggable">handle</a>
</a></li>
<li class="lab">
<a href="#" class="lab-edit">Lab</a>
<a href="#" class="draggable">handle</a>
</li>
<li class="hw">
<a href="#">Homework</a>
<a href="#" class="draggable">handle</a>
</li>
<%include file="module-dropdown.html"/> <%include file="module-dropdown.html"/>
</ul> </ul>
</li> </li>
...@@ -77,9 +101,19 @@ ...@@ -77,9 +101,19 @@
</header> </header>
<ul> <ul>
<li class="lab">Lab</li> <li class="lab">
<li class="lab">Lab</li> <a href="#" class="lab-edit">Lab</a>
<li class="hw">Homework</li> <a href="#" class="draggable">handle</a>
</li>
<li class="lab">
<a href="#" class="lab-edit">Lab</a>
<a href="#" class="draggable">handle</a>
</li>
<li class="hw">
<a href="#">Homework</a>
<a href="#" class="draggable">handle</a>
</li>
<%include file="module-dropdown.html"/> <%include file="module-dropdown.html"/>
</ul> </ul>
</li> </li>
...@@ -93,10 +127,22 @@ ...@@ -93,10 +127,22 @@
</header> </header>
<ul> <ul>
<li class="seq">Lecture Sequence</li> <li class="seq">
<li class="lab">Lab</li> <a href="#" class="sequence-edit">Lecture Sequence</a>
<li class="hw">Homework</li> <a href="#" class="draggable">handle</a>
<li class="hw">Homework</li> </li>
<li class="lab">
<a href="#" class="lab-edit">Lab</a>
<a href="#" class="draggable">handle</a>
</li>
<li class="hw">
<a href="#">Homework</a>
<a href="#" class="draggable">handle</a>
</li>
<li class="hw">
<a href="#">Homework</a>
<a href="#" class="draggable">handle</a>
</li>
<%include file="module-dropdown.html"/> <%include file="module-dropdown.html"/>
</ul> </ul>
</li> </li>
...@@ -137,6 +183,30 @@ ...@@ -137,6 +183,30 @@
<%include file="module-dropdown.html"/> <%include file="module-dropdown.html"/>
</ul> </ul>
</li> </li>
<li>
<header>
<h1>Course Scratch Pad</h1>
</header>
<ul>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 13 </a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit"> Problem title 14</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ul>
</li>
</ol> </ol>
<section class="new-section"> <section class="new-section">
......
cms/templates/widgets/week-edit.html
...@@ -10,160 +10,201 @@ ...@@ -10,160 +10,201 @@
<ul> <ul>
<li> <li>
<p><strong>Goal title:</strong> This is the goal body and is wehre the goal will be further explained</p> <p><strong>Goal title:</strong> This is the goal body and is where the goal will be further explained</p>
</li> </li>
</ul> </ul>
</section> </section>
</header> </header>
<section class="content"> <section class="content">
<section class="filters"> <section class="filters">
<ul> <ul>
<li>
<label for="">Sort by</label>
<select>
<option value="">Recently Modified</option>
</select>
</li>
<li>
<label for="">Display</label>
<select>
<option value="">All content</option>
</select>
</li>
<li>
<select>
<option value="">Internal Only</option>
</select>
</li>
<li class="advanced">
<a href="#">Advanced filters</a>
</li>
<li>
<input type="search" name="" id="" value="" />
</li>
</ul>
</section>
<div>
<section class="modules">
<ol>
<li> <li>
<header> <label for="">Sort by</label>
<h2><a href="#">Lecture Sequence</a></h2> <select>
</header> <option value="">Recently Modified</option>
</select>
</li>
<ol> <li>
<li> <label for="">Display</label>
<a href="" class="problem-edit">Problem title 11</a> <select>
<a href="#" class="draggable">handle</a> <option value="">All content</option>
</li> </select>
<li>
<a href="#" class="sequence-edit">Problem Group</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 14</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ol>
</li> </li>
<li> <li>
<header> <select>
<h2><a href="#">Lecture Sequence</a></h2> <option value="">Internal Only</option>
</header> </select>
</li>
<ol> <li class="advanced">
<li class="group"> <a href="#">Advanced filters</a>
<header>
<h3>
<a href="#" class="problem-edit">Problem group</a>
</h3>
</header>
<ol>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
</li>
</ol>
</li>
<li><a href="#" class="problem-edit">Problem title 13</a></li>
<li><a href="#" class="problem-edit">Problem title 14</a></li>
<li><a href="#" class="video-edit">Video 3</a></li>
</ol>
</li> </li>
<li> <li>
<header> <input type="search" name="" id="" value="" />
<h2><a href="#">Homework 1a</a></h2> </li>
</header> </ul>
</section>
<ol> <div>
<li> <section class="modules">
<a href="" class="problem-edit">Problem title 11</a> <ol>
<li>
<header>
<h2><a href="#">Lecture Sequence</a></h2>
<a href="#" class="draggable">handle</a> <a href="#" class="draggable">handle</a>
</li> </header>
<li>
<a href="#" class="sequence-edit">Problem Group</a> <ol>
<li>
<a href="" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="sequence-edit">Problem Group</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 14</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ol>
</li>
<li>
<header>
<h2><a href="#">Lecture Sequence</a></h2>
<a href="#" class="draggable">handle</a> <a href="#" class="draggable">handle</a>
</li> </header>
<li>
<a href="#" class="problem-edit">Problem title 14</a> <ol>
<li class="group">
<header>
<h3>
<a href="#" class="problem-edit">Problem group</a>
<a href="#" class="draggable">handle</a>
</h3>
</header>
<ol>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
</ol>
</li>
<li>
<a href="#" class="problem-edit">Problem title 13</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 14</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ol>
</li>
<li>
<header>
<h2><a href="#">Homework 1a</a></h2>
</header>
<ol>
<li>
<a href="" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="sequence-edit">Problem Group</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 14</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ol>
</li>
<!-- <li class="new-module"> -->
<!-- <%include file="new-module.html"/> -->
<!-- </li> -->
</ol>
</section>
<section class="scratch-pad">
<ol>
<li>
<header>
<h2>Section Scratch</h2>
</header>
<ul>
<li>
<a href="#" class="problem-edit">Problem title 11</a>
<a href="#" class="draggable">handle</a>
</li>
<li>
<a href="#" class="problem-edit">Problem title 13 </a>
<a href="#" class="draggable">handle</a> <a href="#" class="draggable">handle</a>
</li> </li>
<li> <li>
<a href="#" class="video-edit">Video 3</a> <a href="#" class="problem-edit"> Problem title 14</a>
<a href="#" class="draggable">handle</a> <a href="#" class="draggable">handle</a>
</li> </li>
</ol> <li>
</li> <a href="" class="video-edit">Video 3</a>
<a href="#" class="draggable">handle</a>
</li>
</ul>
</li>
<li>
<header>
<h2>Course Scratch</h2>
</header>
<li class="new-module"> <ul>
<%include file="new-module.html"/> <li>
</li> <a href="#" class="problem-edit">Problem title 11</a>
</ol> <a href="#" class="draggable">handle</a>
</section> </li>
<li>
<section class="scratch-pad"> <a href="#" class="problem-edit">Problem title 13 </a>
<ol> <a href="#" class="draggable">handle</a>
<li> </li>
<header> <li>
<h2>Section Scratch</h2> <a href="#" class="problem-edit"> Problem title 14</a>
</header> <a href="#" class="draggable">handle</a>
<ul> </li>
<li>Problem title 11</li> <li>
<li>Problem title 13</li> <a href="" class="video-edit">Video 3</a>
<li>Problem title 14</li> <a href="#" class="draggable">handle</a>
<li>Video 3</li> </li>
</ul> </ul>
</li> </li>
<li>
<header>
<h2>Course Scratch</h2>
</header>
<ul>
<li>Problem title 11</li>
<li>Problem title 13</li>
<li>Problem title 14</li>
<li>Video 3</li>
</ul>
</li>
<li class="new-module"> <!-- <li class="new-module"> -->
<%include file="new-module.html"/> <!-- <%include file="new-module.html"/> -->
</li> <!-- </li> -->
</ol> </ol>
</section> </section>
</div> </div>
</section> </section>
</section> </section>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment