Skip to content

E
edx-platform
Commit b5b11c69 by Don Mitchell
Options

Merge branch 'feature/cas/speed-editor' of git@github.com:MITx/mitx.git into… 

Merge branch 'feature/cas/speed-editor' of git@github.com:MITx/mitx.git into feature/cas/speed-editor
parents 47ca316d 439addc1
Showing with 60 additions and 424 deletions
cms/static/sass/_assets.scss
......@@ -4,13 +4,7 @@
width: 260px;
background-color: #fff;
}
.upload-button {
@include blue-button;
float: left;
margin-right: 20px;
padding: 8px 30px 10px;
font-size: 12px;
}
.asset-library {
@include clearfix;
......
cms/static/sass/_base.scss
......@@ -34,30 +34,6 @@ h1 {
margin: 24px 6px;
}
strong {
font-weight: 700;
}
em {
font-style: italic;
}
p + p,
p + ul,
p + ol {
margin-top: 20px;
}
code {
margin: 0 2px;
padding: 0px 5px;
border-radius: 3px;
border: 1px solid #eaeaea;
font-family: Monaco, monospace;
font-size: 12px;
background-color: #f8f8f8;
}
.waiting {
opacity: 0.1;
}
......
cms/static/sass/_unit.scss
......@@ -56,106 +56,23 @@
z-index: 10;
margin: 20px 40px;
border: 1px solid #d1ddec;
border-radius: 3px;
background: #fff;
@include transition(none);
&:hover {
border-color: #6696d7;
.drag-handle,
.component-actions a {
background-color: $blue;
}
.drag-handle {
border-color: $blue;
}
}
&.editing {
border-color: #3c3c3c;
box-shadow: 0 0 30px rgba(0, 0, 0, .5);
position: relative;
z-index: 99999;
@include transition(all);
.drag-handle,
.component-actions {
display: none;
}
.html-preview {
display: none;
}
}
&.component-placeholder {
border-color: #6696d7;
}
.xmodule_display {
padding: 40px 20px 20px;
}
.component-actions {
position: absolute;
top: 4px;
right: 4px;
@include transition(opacity .15s);
}
.edit-button,
.delete-button {
float: left;
padding: 3px 10px 4px;
margin-left: 3px;
border: 1px solid #fff;
border-radius: 3px;
background: #d1ddec;
font-size: 12px;
color: #fff;
@include transition(all .15s);
&:hover {
background-color: $blue;
color: #fff;
}
.edit-icon,
.delete-icon {
margin-right: 4px;
}
}
.drag-handle {
position: absolute;
display: block;
top: -1px;
right: -16px;
z-index: -1;
width: 15px;
height: 100%;
border-radius: 0 3px 3px 0;
border: 1px solid #d1ddec;
background: url(../img/white-drag-handles.png) center no-repeat #d1ddec;
cursor: move;
@include transition(all .15s);
}
&.new-component-item {
padding: 20px;
border: none;
border-radius: 3px;
background: $lightGrey;
@include clearfix;
.new-component-button {
display: block;
padding: 20px;
text-align: center;
color: #6d788b;
}
h5 {
margin-bottom: 22px;
color: $blue;
margin-bottom: 8px;
color: #fff;
font-weight: 700;
text-align: center;
}
.rendered-component {
......@@ -164,36 +81,22 @@
border-radius: 3px 3px 0 0;
}
.new-component-type, .new-component-template {
text-align: center;
@include clearfix;
.new-component-type {
a,
li {
display: inline;
display: inline-block;
}
a {
position: relative;
display: inline-block;
width: 100px;
height: 100px;
margin-right: 10px;
margin-bottom: 10px;
border-radius: 8px;
border: 1px solid #437fbf;
background-color: $blue;
font-size: 13px;
line-height: 14px;
color: #fff;
text-align: center;
@include box-shadow(0 1px 1px rgba(0, 0, 0, .25), 0 1px 0 rgba(255, 255, 255, .4) inset);
@include transition(background-color .15s);
&:hover {
@include box-shadow(0 1px 1px rgba(0, 0, 0, .4), 0 1px 0 rgba(255, 255, 255, .4) inset, 0 0 20px rgba(255, 255, 255, .3) inset);
}
@include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset);
.name {
position: absolute;
......@@ -206,25 +109,63 @@
}
}
.new-component-type,
.new-component-template {
@include clearfix;
a {
height: 60px;
position: relative;
border: 1px solid $darkGreen;
background: $green;
color: #fff;
@include transition(background-color .15s);
&:hover {
background: $brightGreen;
}
}
}
.new-component,
.new-component-templates {
padding: 20px;
@include clearfix;
.new-component-template {
margin-bottom: 20px;
.cancel-button {
@include blue-button;
border-color: #30649c;
li:first-child {
a {
border-radius: 3px 3px 0 0;
}
}
li:last-child {
a {
border-radius: 0 0 3px 3px;
}
}
a {
display: block;
padding: 7px 20px;
border-bottom: none;
font-weight: 300;
}
}
.new-component {
text-align: center;
h5 {
color: $green;
}
}
.new-component-templates {
display: none;
padding: 20px;
@include clearfix;
.cancel-button {
@include white-button;
}
}
}
}
......@@ -286,221 +227,11 @@
overflow-x: auto;
}
.editor {
position: relative;
background: $blue;
padding: 20px;
h5 {
color: #fff;
margin-bottom: 20px;
font-weight: 700;
}
label {
display: inline-block;
width: 130px;
color: #fff;
}
input {
border-color: #3c3c3c;
}
.row {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 15px;
&:last-child {
margin-bottom: 0;
}
}
.video-id-field,
.transcript-field {
width: 300px;
}
.browse-button {
@include blue-button;
border-color: #3c3c3c;
font-size: 12px;
}
.save-button {
@include orange-button;
margin: 10px 8px 0 0;
border-color: #3c3c3c;
}
.cancel-button {
@include white-button;
border-color: #3c3c3c;
}
.problem-settings-button {
@include blue-button;
@include box-sizing(border-box);
width: 100%;
padding: 12px 0 14px;
text-align: center;
&.is-open {
border-radius: 0 0 3px 3px;
}
.settings-icon {
margin-right: 10px;
}
}
.editor-bar {
position: relative;
@include linear-gradient(top, #d4dee8, #c9d5e2);
padding: 5px;
border: 1px solid #3c3c3c;
border-radius: 3px 3px 0 0;
border-bottom-color: #a5aaaf;
@include clearfix;
a {
display: block;
float: left;
padding: 3px 10px 7px;
margin-left: 7px;
border-radius: 2px;
&:hover {
background: rgba(255, 255, 255, .5);
}
}
.editor-tabs {
position: absolute;
top: 10px;
right: 10px;
li {
float: left;
}
.tab {
height: 24px;
padding: 7px 20px 3px;
border: 1px solid #a5aaaf;
border-radius: 3px 3px 0 0;
@include linear-gradient(top, rgba(0, 0, 0, 0) 87%, rgba(0, 0, 0, .06));
background-color: #e5ecf3;
font-size: 13px;
color: #3c3c3c;
box-shadow: 1px -1px 1px rgba(0, 0, 0, .05);
&.current {
background: #fff;
border-bottom-color: #fff;
}
}
.cheatsheet-toggle {
width: 21px;
height: 21px;
padding: 0;
margin: 3px 5px 0 16px;
border-radius: 22px;
border: 1px solid #a5aaaf;
background: #e5ecf3;
font-size: 13px;
font-weight: 700;
color: #565d64;
text-align: center;
}
}
}
.problem-settings {
display: none;
padding: 20px 30px;
background: rgba(0, 0, 0, .1);
border: 1px solid #437fbf;
border-bottom: none;
border-radius: 3px 3px 0 0;
}
.CodeMirror {
font-size: 13px;
border: 1px solid #3c3c3c;
border-top: none;
background: #fff;
color: #3c3c3c;
}
}
.html-editor {
.row {
position: relative;
}
.CodeMirror {
display: none;
position: absolute;
top: 47px;
width: 100%;
height: 378px;
background: #fff;
color: #3c3c3c;
@include box-sizing(border-box);
}
.editor-tabs {
position: absolute;
top: 31px;
right: 30px;
z-index: 99;
li {
float: left;
}
.tab {
display: block;
height: 24px;
padding: 7px 20px 3px;
margin-left: 7px;
border: 1px solid #a5aaaf;
border-radius: 3px 3px 0 0;
@include linear-gradient(top, rgba(0, 0, 0, 0) 87%, rgba(0, 0, 0, .06));
background-color: #e5ecf3;
font-size: 13px;
color: #3c3c3c;
box-shadow: 1px -1px 1px rgba(0, 0, 0, .05);
&.current {
background: #fff;
border-bottom-color: #fff;
}
}
}
}
.html-preview,
.discussion-preview {
padding: 20px 30px;
}
.discussion-id-field {
width: 350px;
}
.component-editor {
@include edit-box;
display: none;
padding: 20px;
border-radius: 2px 2px 0 0;
@include linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, .1));
background-color: $blue;
color: #fff;
@include box-shadow(none);
.metadata_edit {
......@@ -517,12 +248,6 @@
}
}
.CodeMirror {
border: 1px solid #3c3c3c;
background: #fff;
color: #3c3c3c;
}
h3 {
margin-bottom: 10px;
font-size: 18px;
......@@ -762,61 +487,3 @@ body.unit {
}
}
}
.simple-editor-cheatsheet {
position: absolute;
top: 0;
left: 100%;
width: 0;
border-radius: 0 3px 3px 0;
@include linear-gradient(left, rgba(0, 0, 0, .1), rgba(0, 0, 0, 0) 15px);
background-color: #fff;
overflow: hidden;
@include transition(width .3s);
&.shown {
width: 300px;
}
.cheatsheet-wrapper {
width: 240px;
padding: 20px 30px;
}
h6 {
margin-bottom: 7px;
font-size: 15px;
font-weight: 700;
}
.row {
@include clearfix;
padding-bottom: 5px !important;
margin-bottom: 10px !important;
border-bottom: 1px solid #ddd !important;
&:last-child {
border-bottom: none !important;
margin-bottom: 0 !important;
}
}
.col {
float: left;
&.sample {
width: 60px;
margin-right: 30px;
}
}
pre {
font-size: 12px;
line-height: 18px;
}
code {
padding: 0;
background: none;
}
}
\ No newline at end of file
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