Skip to content

E
edx-platform
Commit fbd0f1be by Kevin Chugh
Options

wire up static HTML to allow panel functionality

parents 978d33ba f94ec6cf
Showing with 2412 additions and 207 deletions
lms/static/fonts/vendor/fontawesome-webfont.svg 0 → 100755
This source diff could not be displayed because it is too large. You can view the blob instead.
lms/static/sass/_discussion-old.scss
......@@ -68,7 +68,10 @@
width: 16px;
height: 17px;
margin: 7px 7px 0 0;
background: url(../images/new-post-icon.png) no-repeat;
font-size: 16px;
padding-right: $baseline/2;
vertical-align: middle;
color: $white;
}
.post-search {
......
lms/static/sass/_discussion.scss
......@@ -8,7 +8,7 @@
font-size: 13px;
font-weight: 700;
line-height: 32px;
color: #fff;
color: $white;
text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
......@@ -33,7 +33,7 @@
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
&:hover {
@include linear-gradient(top, #fff, #ddd);
@include linear-gradient(top, $white, #ddd);
}
}
......@@ -43,11 +43,11 @@
padding: 0 15px;
border-radius: 3px;
border: 1px solid #222;
background: -webkit-linear-gradient(top, #777, #555);
background: -webkit-linear-gradient(top, $gray, #555);
font-size: 13px;
font-weight: 700;
line-height: 32px;
color: #fff;
color: $white;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
......@@ -60,28 +60,28 @@
width: 100%;
height: 240px;
margin-top: 0;
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #aaa;
border-radius: 3px 3px 0 0;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px $black-t0 inset;
}
@mixin discussion-wmd-preview {
width: 100%;
min-height: 40px;
padding: 25px 20px 10px 20px;
padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box);
border: 1px solid #aaa;
border-top: none;
border-radius: 0 0 3px 3px;
background: #eee;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px $black-t0 inset;
}
@-webkit-keyframes fadeIn {
......@@ -90,10 +90,6 @@
}
body.discussion {
.new-post-form-errors {
......@@ -102,13 +98,13 @@ body.discussion {
padding: 0;
border: 1px solid #333;
list-style: none;
color: #fff;
color: $white;
line-height: 1.6;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2);
li {
padding: 10px 20px 12px 45px;
padding: $baseline/2 $baseline 12px 45px;
border-bottom: 1px solid #dc4949;
background: url(../images/white-error-icon.png) no-repeat 15px 14px;
......@@ -133,13 +129,15 @@ body.discussion {
width: 16px;
height: 17px;
margin: 8px 7px 0 0;
background: url(../images/new-post-icon.png) no-repeat;
font-size: 16px;
vertical-align: middle;
color: $white;
}
}
.new-post-article {
display: none;
margin-top: 20px;
margin-top: $baseline;
.inner-wrapper {
max-width: 1180px;
......@@ -150,13 +148,13 @@ body.discussion {
.left-column {
float: left;
width: 32%;
padding: 40px;
padding: $baseline*2;
@include box-sizing(border-box);
label {
font-size: 22px;
font-weight: 700;
color: #fff;
color: $white;
text-shadow: none;
}
......@@ -172,8 +170,8 @@ body.discussion {
.form-group-label {
display: block;
padding-top: 5px;
color:#fff;
padding-top: $baseline/4;
color: $white;
}
.topic_dropdown_button {
......@@ -195,12 +193,12 @@ body.discussion {
.topic_menu_wrapper {
display: none;
position: absolute;
top: 40px;
top: $baseline*2;
left: 0;
z-index: 9999;
width: 100%;
@include box-sizing(border-box);
background: #737373;
background: #797979;
border: 1px solid #333;
box-shadow: 0 2px 50px rgba(0, 0, 0, .4);
}
......@@ -211,7 +209,7 @@ body.discussion {
a {
display: block;
padding: 10px 15px;
padding: $baseline/2 15px;
border-top: 1px solid #5f5f5f;
font-size: 14px;
font-weight: 700;
......@@ -241,7 +239,7 @@ body.discussion {
}
.topic_menu_search {
padding: 10px;
padding: $baseline/2;
border-bottom: 1px solid black;
}
......@@ -252,8 +250,8 @@ body.discussion {
@include box-sizing(border-box);
border-radius: 30px;
border: 1px solid #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
background: -webkit-linear-gradient(top, #eee, #fff);
box-shadow: 0 1px 3px $black-t1 inset;
background: -webkit-linear-gradient(top, #eee, $white);
font-size: 11px;
line-height: 16px;
color: #333;
......@@ -263,7 +261,7 @@ body.discussion {
.right-column {
float: left;
width: 68%;
padding: 40px;
padding: $baseline*2;
@include box-sizing(border-box);
}
......@@ -278,7 +276,7 @@ body.discussion {
.edit-post-form {
width: 100%;
margin-bottom: 40px;
margin-bottom: $baseline*2;
@include clearfix;
@include box-sizing(border-box);
......@@ -287,20 +285,20 @@ body.discussion {
}
.form-row {
margin-top: 20px;
margin-top: $baseline;
}
.post-cancel {
@include white-button;
float: left;
margin: 10px 0 0 15px;
margin: $baseline/2 0 0 15px;
}
.post-update {
@include blue-button;
float: left;
height: 37px;
margin-top: 10px;
margin-top: $baseline/2;
padding-bottom: 2px;
&:hover {
......@@ -311,26 +309,26 @@ body.discussion {
.edit-post-title, .edit-post-tags {
width: 100%;
height: 40px;
padding: 0 10px;
padding: 0 $baseline/2;
@include box-sizing(border-box);
border-radius: 3px;
border: 1px solid #aaa;
font-size: 16px;
font-family: $sans-serif;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset;
box-shadow: 0 1px 3px $black-t0 inset;
}
.tagsinput {
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #aaa;
border-radius: 3px;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 3px $black-t1 inset;
span.tag {
margin-bottom: 0;
......@@ -340,15 +338,15 @@ body.discussion {
.new-post-form {
width: 100%;
margin-bottom: 20px;
margin-bottom: $baseline;
border-radius: 3px;
background: rgba(0, 0, 0, .55);
color: #fff;
box-shadow: 0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 rgba(255, 255, 255, .5);
color: $white;
box-shadow: 0 1px 2px $black-t2 inset, 0 1px 0 $white-t2;
@include clearfix;
.form-row {
margin-bottom: 20px;
margin-bottom: $baseline;
}
.new-post-body .wmd-input {
......@@ -357,27 +355,27 @@ body.discussion {
width: 100%;
height: 200px;
z-index: 1;
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 3px 3px 0 0;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 3px $black-t1 inset;
}
.tagsinput {
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 3px;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 3px $black-t1 inset;
span.tag {
margin-bottom: 0;
......@@ -390,13 +388,13 @@ body.discussion {
width: 100%;
//height: 50px;
margin-top: -1px;
padding: 25px 20px 10px 20px;
padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 0 0 3px 3px;
background: #e6e6e6;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 3px $black-t1 inset;
}
.new-post-preview-label {
......@@ -412,14 +410,14 @@ body.discussion {
.new-post-tags {
width: 100%;
height: 40px;
padding: 0 10px;
padding: 0 $baseline/2;
@include box-sizing(border-box);
border-radius: 3px;
border: 1px solid #333;
font-size: 16px;
font-family: 'Open Sans', sans-serif;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
box-shadow: 0 1px 3px $black-t1 inset;
}
.new-post-title {
......@@ -430,7 +428,7 @@ body.discussion {
@include blue-button;
float: left;
height: 37px;
margin-top: 10px;
margin-top: $baseline/2;
padding-bottom: 2px;
border-color: #333;
......@@ -443,17 +441,17 @@ body.discussion {
@include white-button;
border-color: #444;
float: left;
margin: 10px 0 0 15px;
margin: $baseline/2 0 0 15px;
}
.options {
margin-top: 40px;
margin-top: $baseline*2;
label {
display: inline;
margin-left: 8px;
font-size: 15px;
color: #fff;
color: $white;
text-shadow: none;
}
}
......@@ -462,12 +460,12 @@ body.discussion {
.thread-tags {
margin-top: 20px;
margin-top: $baseline;
}
.thread-tag {
margin-right: 5px;
padding: 3px 10px 6px;
padding: 3px $baseline/2 6px;
border-radius: 3px;
color: #333;
background: #c5eeff;
......@@ -477,7 +475,7 @@ body.discussion {
.thread-title {
display: block;
margin-bottom: 20px;
margin-bottom: $baseline;
font-size: 21px;
color: #333;
font-weight: 700;
......@@ -522,7 +520,7 @@ body.discussion {
.sidebar-toggle-moderator-button {
@include blue-button;
text-align: center;
margin-top: 20px;
margin-top: $baseline;
}
}
......@@ -558,7 +556,7 @@ body.discussion {
.wmd-preview {
position: relative;
font-family: $sans-serif;
padding: 25px 20px 10px 20px;
padding: 25px $baseline $baseline/2 $baseline;
margin-bottom: 5px;
@include box-sizing(border-box);
border: 1px solid #c8c8c8;
......@@ -587,7 +585,7 @@ body.discussion {
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: 10px;
margin-top: $baseline/2;
padding: 0px;
height: 20px;
overflow: hidden;
......@@ -642,11 +640,11 @@ body.discussion {
.wmd-prompt-dialog {
@extend .modal;
background: #fff;
background: $white;
}
.wmd-prompt-dialog {
padding: 20px;
padding: $baseline;
> div {
font-size: 0.8em;
......@@ -710,22 +708,41 @@ body.discussion {
border-radius: 3px 0 0 0;
.browse,
.home, .browse,
.search {
position: relative;
float: left;
width: 20%;
height: 100%;
@include linear-gradient(top, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
<<<<<<< HEAD
background-color: #dcdcdc;
@include transition(all .2s ease-out 0s);
=======
background-color: $gray-l4;
@include transition(all .2s ease-out);
>>>>>>> feature/marco/discussionhome
&:hover {
background-color: #e9e9e9;
background-color: $gray-l3;
}
}
&.is-open {
width: 80%;
.home {
border-radius: 3px 0 0 0;
box-shadow: -1px 0 0 #aaa inset;
cursor: pointer;
.home-icon {
display: block;
position: absolute;
top: 30%;
left: 30%;
color: $gray-l1;
font-size: 28px;
z-index: 100;
opacity: 1;
@include transition(all .2s ease-out);
}
}
......@@ -734,6 +751,7 @@ body.discussion {
box-shadow: -1px 0 0 #aaa inset;
&.is-open {
width:60%;
.browse-topic-drop-btn span {
opacity: 1.0;
}
......@@ -746,7 +764,7 @@ body.discussion {
.browse-topic-drop-btn {
span {
color: #fff;
color: $white;
text-shadow: none;
}
......@@ -774,9 +792,14 @@ body.discussion {
&.is-open {
cursor: auto;
width: 60%;
.home {
width:0%;
}
.post-search {
padding: 0 10px;
padding: 0 $baseline/2;
max-width: 1000px;
}
......@@ -796,30 +819,34 @@ body.discussion {
.browse-topic-drop-btn {
display: block;
position: absolute;
padding-top: 10%;
top: -1px;
left: -1px;
z-index: 50;
width: 100%;
height: 100%;
border-radius: 3px 0 0 0;
border: 1px solid transparent;
text-align: center;
overflow: hidden;
@include transition(none);
.current-board {
white-space: nowrap;
white-space: normal;
}
span {
font-size: 14px;
font-weight: 700;
line-height: 58px;
font-weight: 400;
line-height: 1.2;
color: #333;
text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
text-shadow: 0 1px 0 $white-t3;
opacity: 0.0;
@include transition(opacity .2s linear 0s);
}
.drop-arrow {
font-size: 16px;
}
}
.browse-topic-drop-icon {
......@@ -843,7 +870,7 @@ body.discussion {
left: -1px;
z-index: 9999;
width: 100%;
background: #737373;
background: #797979;
border: 1px solid #4b4b4b;
border-left: none;
border-radius: 0 0 3px 3px;
......@@ -854,6 +881,7 @@ body.discussion {
overflow-y: scroll;
}
ul {
position: inline;
}
......@@ -864,12 +892,12 @@ body.discussion {
a {
display: block;
padding: 0 20px;
padding: 0 $baseline;
border-top: 1px solid #5f5f5f;
font-size: 14px;
font-size: 12px;
font-weight: 700;
line-height: 22px;
color: #fff;
color: $white;
@include clearfix;
@include transition(none);
......@@ -886,7 +914,7 @@ body.discussion {
float: left;
width: 80%;
margin: 13px 0;
color: #fff;
color: $white;
}
.unread {
......@@ -916,7 +944,7 @@ body.discussion {
}
.browse-topic-drop-search {
padding: 10px;
padding: $baseline/2;
}
.browse-topic-drop-search-input {
......@@ -927,7 +955,7 @@ body.discussion {
border-radius: 30px;
border: 1px solid #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset;
background: -webkit-linear-gradient(top, #eee, #fff);
background: -webkit-linear-gradient(top, #eee, $white);
font-size: 11px;
line-height: 16px;
color: #333;
......@@ -950,8 +978,8 @@ body.discussion {
@include box-sizing(border-box);
border: 1px solid #acacac;
border-radius: 30px;
box-shadow: 0 1px 3px rgba(0, 0, 0, .1) inset, 0 1px 0 rgba(255, 255, 255, .5);
background: url(../images/search-icon.png) no-repeat 7px center #fff;
box-shadow: 0 1px 3px $white-t0 inset, 0 1px 0 $white-t2;
background: url(../images/search-icon.png) no-repeat 7px center $white;
font-family: 'Open Sans', sans-serif;
font-weight: 400;
font-size: 13px;
......@@ -977,17 +1005,17 @@ body.discussion {
.sort-bar {
height: auto;
min-height: 27px;
border-bottom: 1px solid #a3a3a3;
border-bottom: 1px solid $gray-l3;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
background-color: #aeaeae;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset;
background-color: $gray-l2;
box-shadow: 0 1px 0 $white-t1 inset;
span,
a {
font-size: 9px;
font-weight: bold;
line-height: 25px;
color: #333;
color: $gray-d3;
text-transform: uppercase;
text-shadow: 0 1px 0 rgba(255, 255, 255, .4);
}
......@@ -995,7 +1023,7 @@ body.discussion {
.sort-label {
display: block;
float: left;
margin: 0 10px;
margin: 0 $baseline/2;
}
li {
......@@ -1008,18 +1036,18 @@ body.discussion {
height: 18px;
padding: 0 9px;
border-radius: 19px;
color: #333;
color: $gray-d3;
line-height: 17px;
&:hover {
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, .2));
color: #333;
color: $gray-d3;
}
&.active {
@include linear-gradient(top, rgba(0, 0, 0, .3), rgba(0, 0, 0, 0));
background-color: #999;
color: #fff;
color: $white;
text-shadow: 0 -1px 0 rgba(0, 0, 0, .3);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 1px rgba(0, 0, 0, .2) inset;
}
......@@ -1027,7 +1055,7 @@ body.discussion {
}
.group-filter-label {
width: 40px;
margin-left:10px;
margin-left: $baseline/2;
}
.group-filter-select {
......@@ -1042,7 +1070,7 @@ body.discussion {
.post-list-wrapper {
overflow-y: scroll;
overflow-x: hidden;
border-right: 1px solid transparent;
//border-right: 1px solid transparent;
}
.post-list {
......@@ -1075,11 +1103,11 @@ body.discussion {
float: left;
clear: both;
width: 100%;
padding: 0 10px 0 18px;
padding: 0 $baseline/2 0 18px;
margin-bottom: 1px;
margin-right: -1px;
@include linear-gradient(top, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0));
background-color: #fff;
background-color: $white;
@include clearfix;
&:hover {
......@@ -1120,7 +1148,7 @@ body.discussion {
display: block;
float: left;
width: 70%;
margin: 8px 0 10px;
margin: 8px 0 $baseline/2;
font-size: 13px;
font-weight: 700;
line-height: 1.4;
......@@ -1176,7 +1204,7 @@ body.discussion {
.votes-count,
.comments-count {
@include linear-gradient(top, #3994c7, #4da7d3);
color: #fff;
color: $white;
&:after {
background-position: 0 0;
......@@ -1238,9 +1266,6 @@ body.discussion {
}
}
.bottom-post-status {
padding: 30px;
font-size: 20px;
......@@ -1249,9 +1274,6 @@ body.discussion {
text-align: center;
}
.discussion-column {
float: right;
@include box-sizing(border-box);
......@@ -1260,7 +1282,7 @@ body.discussion {
min-height: 500px;
border: 1px solid #aaa;
border-radius: 3px;
background: #fff;
background: $white;
box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
&.sidebar-fixed {
......@@ -1268,24 +1290,163 @@ body.discussion {
}
}
.blank-slate h1 {
margin-top: 195px;
text-align: center;
color: #ccc;
.blank-slate {
section {
border-bottom: 1px solid #ccc;
}
.label {
display: block;
font-size: 12px;
}
.label-settings {
padding-top: $baseline;
padding-bottom: $baseline/2;
}
.home-header {
margin: 0;
}
.home-title {
font-size: 18px;
color: $black;
margin-bottom: 5px;
}
.home-description {
font-size: 12px;
line-height: 1;
margin-bottom: $baseline/2;
}
.home-stats {
padding: $baseline 0;
.label-area {
display: inline-block;
min-width: $baseline*5;
width: 25%;
vertical-align: middle;
.profile-link {
font-weight: 700;
}
}
.stats-grouping {
display: inline-block;
width: 70%;
padding-left: $baseline;
.profile-stat {
display: inline-block;
width: 32.5%;
vertical-align: middle;
font-size: 12px;
.count {
display: inline-block;
font-size: 28px;
padding: 0 $baseline/2;
vertical-align: middle;
}
.profile-stat-label{
vertical-align: middle;
}
}
}
}
.home-helpgrid {
border-bottom: none;
border-radius: 3px;
border: 1px solid #b2b2b2;
box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
}
}
.helpgrid-row {
border-bottom: 1px solid #b2b2b2;
.row-title {
padding: 30px $baseline;
//width: 15%;
background-color: $gray-l4;
font-size: 12px;
}
.row-item-full, .row-item {
font-size: 12px;
padding-left: $baseline/2;
width: 30%;
vertical-align: middle;
.icon {
padding: 0 $baseline/2;
font-size: 24px;
vertical-align: middle;
display: table-cell;
}
.icon-stack i {
padding: 0 $baseline/2;
}
.row-description {
vertical-align: middle;
display: table-cell;
}
}
.row-item-full {
.row-setting {
display: table-cell;
vertical-align: middle;
}
.row-description {
padding-left: 15px;
}
}
}
.helpgrid-row-navigation {
.icon-reorder {color: $light-gray;}
.icon-search {color: $light-gray;}
.icon-sort {color: $light-gray;}
}
.helpgrid-row-participation {
.icon-plus {color: $green;}
.icon-flag {color: $pink;}
.icon-star {color: $blue;}
}
.helpgrid-row-notification {
.icon-sign-blank {color: $green;}
.icon-envelope {color: $gray;}
}
.blank-slate,
.discussion-article {
position: relative;
<<<<<<< HEAD
padding: 40px;
min-height: 468px;
=======
padding: $baseline*2;
min-height: 468px;
>>>>>>> feature/marco/discussionhome
a {
word-wrap: break-word;
}
h1 {
margin-bottom: 10px;
margin-bottom: $baseline/2;
font-size: 28px;
font-weight: 700;
letter-spacing: 0;
......@@ -1309,13 +1470,13 @@ body.discussion {
}
.post-context{
margin-top: 20px;
margin-top: $baseline;
font-size: 12px;
color: #888;
}
p + p {
margin-top: 20px;
margin-top: $baseline;
}
.dogear {
......@@ -1338,13 +1499,13 @@ body.discussion {
}
.discussion-post {
padding: 10px 20px;
padding: $baseline/2 $baseline;
> header .vote-btn {
position: relative;
z-index: 100;
margin-top: 5px;
margin-left: 40px;
margin-left: $baseline*2;
}
......@@ -1376,20 +1537,20 @@ body.discussion {
.discussion-post header,
.responses li header {
margin-bottom: 20px;
margin-bottom: $baseline;
}
.responses {
list-style: none;
margin-top: 40px;
margin-top: $baseline;
padding: 0;
> li {
position: relative;
margin: 0 -10px 30px;
padding: 26px 30px 20px;
padding: 26px 30px $baseline;
border-radius: 3px;
border: 1px solid #b2b2b2;
box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
......@@ -1417,7 +1578,7 @@ body.discussion {
background: #009fe2;
font-size: 9px;
font-weight: 700;
color: #fff;
color: $white;
text-transform: uppercase;
}
......@@ -1433,7 +1594,7 @@ body.discussion {
background: #449944;
font-size: 9px;
font-weight: 700;
color: #fff;
color: $white;
text-transform: uppercase;
}
......@@ -1461,7 +1622,7 @@ body.discussion {
padding: 0 8px;
border-radius: 5px;
border: 1px solid #b2b2b2;
@include linear-gradient(top, #fff 35%, #ebebeb);
@include linear-gradient(top, $white 35%, #ebebeb);
box-shadow: 0 1px 1px rgba(0, 0, 0, .15);
font-size: 12px;
font-weight: 700;
......@@ -1483,7 +1644,7 @@ body.discussion {
&.is-cast {
border-color: #379a42;
@include linear-gradient(top, #50cc5e, #3db84b);
color: #fff;
color: $white;
text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
box-shadow: 0 1px 0 rgba(255, 255, 255, .4) inset, 0 1px 2px rgba(0, 0, 0, .2);
......@@ -1500,10 +1661,10 @@ body.discussion {
float: right;
width: 27px;
height: 27px;
margin-right: 10px;
margin-right: $baseline/2;
border-radius: 27px;
border: 1px solid #a0a0a0;
@include linear-gradient(top, #fff 35%, #ebebeb);
@include linear-gradient(top, $white 35%, #ebebeb);
box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
.check-icon {
......@@ -1528,13 +1689,13 @@ body.discussion {
blockquote {
background: #f6f6f6;
border-radius: 3px;
padding: 5px 10px;
padding: 5px $baseline/2;
font-size: 14px;
}
.comments {
list-style: none;
margin-top: 20px;
margin-top: $baseline;
padding: 0;
border-top: 1px solid #ddd;
......@@ -1546,7 +1707,7 @@ body.discussion {
blockquote {
background: #e6e6e6;
border-radius: 3px;
padding: 5px 10px;
padding: 5px $baseline/2;
font-size: 14px;
}
......@@ -1555,8 +1716,8 @@ body.discussion {
@include clearfix;
.comment-form-input {
padding: 5px 10px;
background-color: #fff;
padding: 5px $baseline/2;
background-color: $white;
font-size: 14px;
}
......@@ -1577,7 +1738,7 @@ body.discussion {
.response-body {
font-size: 13px;
padding: 10px 20px;
padding: $baseline/2 $baseline;
p + p {
margin-top: 12px;
......@@ -1585,7 +1746,7 @@ body.discussion {
}
.posted-details {
margin: 0 20px 10px;
margin: 0 $baseline $baseline/2;
font-size: 11px;
}
......@@ -1615,7 +1776,7 @@ body.discussion {
}
.comment-form {
padding: 8px 20px;
padding: 8px $baseline;
.wmd-input {
@include transition(all .2s linear 0s);
......@@ -1633,7 +1794,7 @@ body.discussion {
.comment-form-input {
width: 100%;
height: 31px;
padding: 0 10px;
padding: 0 $baseline/2;
@include box-sizing(border-box);
border: 1px solid #b2b2b2;
border-radius: 3px;
......@@ -1647,7 +1808,7 @@ body.discussion {
.moderator-actions {
margin: 0;
margin-top: 20px;
margin-top: $baseline;
padding: 0;
@include clearfix;
......@@ -1663,7 +1824,7 @@ body.discussion {
padding: 0 12px;
border-radius: 3px;
border: 1px solid #b2b2b2;
@include linear-gradient(top, #fff 35%, #ebebeb);
@include linear-gradient(top, $white 35%, #ebebeb);
font-size: 13px;
line-height: 24px;
color: #737373;
......@@ -1698,20 +1859,20 @@ body.discussion {
}
.new-post-form {
margin-top: 20px;
margin-top: $baseline;
@include clearfix;
}
.new-post-form .submit {
@include blue-button;
float: left;
margin-top: 10px;
margin-top: $baseline/2;
padding-bottom: 2px;
}
.new-post-form .options {
float: right;
margin-top: 20px;
margin-top: $baseline;
font-size: 14px;
label {
......@@ -1724,7 +1885,7 @@ body.discussion {
.discussion-reply-new {
padding: 20px;
padding: $baseline;
@include clearfix;
@include transition(opacity .2s linear 0s);
......@@ -1747,7 +1908,7 @@ body.discussion {
}
.reply-post-control {
margin-top: 20px;
margin-top: $baseline;
}
.discussion-submit-post {
......@@ -1774,8 +1935,8 @@ body.discussion {
.discussion-module {
@extend .discussion-body;
position: relative;
margin: 20px 0;
padding: 20px;
margin: $baseline 0;
padding: $baseline;
background: #f6f6f6 !important;
border-radius: 3px;
......@@ -1786,11 +1947,11 @@ body.discussion {
}
.responses {
margin-top: 40px;
margin-top: $baseline*2;
> li {
margin: 0 20px 20px !important;
padding: 26px 30px 20px !important;
margin: 0 $baseline $baseline !important;
padding: 26px 30px $baseline !important;
}
}
......@@ -1831,7 +1992,7 @@ body.discussion {
margin-top: 30px;
.threads {
margin-top: 20px;
margin-top: $baseline;
}
/* Course content p has a default margin-bottom of 1.416em, this is just to reset that */
......@@ -1844,7 +2005,7 @@ body.discussion {
}
&.expanded {
padding: 20px 0;
padding: $baseline 0;
.dogear{
display: block;
......@@ -1864,14 +2025,14 @@ body.discussion {
.discussion-article {
border: 1px solid #ddd;
border-bottom-width: 0;
background: #fff;
background: $white;
min-height: 0;
padding: 10px 10px 15px 10px;
padding: $baseline/2 $baseline/2 15px $baseline/2;
box-shadow: 0 1px 0 #ddd;
@include transition(all .2s linear 0s);
.discussion-post {
padding: 12px 20px 0 20px;
padding: 12px $baseline 0 $baseline;
@include clearfix;
.inline-comment-count {
......@@ -1922,7 +2083,7 @@ body.discussion {
}
.post-tools {
margin-left: 20px;
margin-left: $baseline;
margin-top: 5px;
a {
......@@ -1945,7 +2106,7 @@ body.discussion {
}
.responses {
margin-top: 10px;
margin-top: $baseline/2;
header {
padding-bottom: 0;
......@@ -1982,7 +2143,7 @@ body.discussion {
.new-post-article {
display: none;
margin-top: 20px;
margin-top: $baseline;
.inner-wrapper {
max-width: 1180px;
......@@ -1992,17 +2153,17 @@ body.discussion {
.new-post-form {
width: 100%;
margin-bottom: 20px;
margin-bottom: $baseline;
padding: 30px;
border-radius: 3px;
background: rgba(0, 0, 0, .55);
color: #fff;
color: $white;
box-shadow: none;
@include clearfix;
@include box-sizing(border-box);
.form-row {
margin-bottom: 20px;
margin-bottom: $baseline;
}
.new-post-body .wmd-input {
......@@ -2011,11 +2172,11 @@ body.discussion {
width: 100%;
height: 200px;
z-index: 1;
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 3px 3px 0 0;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
......@@ -2028,7 +2189,7 @@ body.discussion {
width: 100%;
//height: 50px;
margin-top: -1px;
padding: 25px 20px 10px 20px;
padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 0 0 3px 3px;
......@@ -2050,7 +2211,7 @@ body.discussion {
.new-post-tags {
width: 100%;
height: 40px;
padding: 0 10px;
padding: 0 $baseline/2;
@include box-sizing(border-box);
border-radius: 3px;
border: 1px solid #333;
......@@ -2065,11 +2226,11 @@ body.discussion {
}
.tagsinput {
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #333;
border-radius: 3px;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
......@@ -2084,7 +2245,7 @@ body.discussion {
@include blue-button;
float: left;
height: 37px;
margin-top: 10px;
margin-top: $baseline/2;
padding-bottom: 2px;
border-color: #333;
......@@ -2096,7 +2257,7 @@ body.discussion {
.new-post-cancel {
@include white-button;
float: left;
margin: 10px 0 0 15px;
margin: $baseline/2 0 0 15px;
border-color: #444;
}
......@@ -2107,18 +2268,18 @@ body.discussion {
display: inline;
margin-left: 8px;
font-size: 15px;
color: #fff;
color: $white;
text-shadow: none;
}
}
}
.thread-tags {
margin: 20px 0;
margin: $baseline 0;
}
.thread-tag {
padding: 3px 10px 6px;
padding: 3px $baseline/2 6px;
margin-right: 5px;
border-radius: 3px;
color: #333;
......@@ -2129,7 +2290,7 @@ body.discussion {
.thread-title {
display: block;
margin-bottom: 20px;
margin-bottom: $baseline;
font-size: 21px;
color: #333;
font-weight: 700;
......@@ -2149,7 +2310,10 @@ body.discussion {
width: 16px;
height: 17px;
margin: 8px 7px 0 0;
background: url(../images/new-post-icon.png) no-repeat;
font-size: 16px;
padding-right: $baseline/2;
vertical-align: middle;
color: $white;
}
.moderator-actions {
......@@ -2216,7 +2380,7 @@ body.discussion {
.wmd-preview {
position: relative;
font-family: $sans-serif;
padding: 25px 20px 10px 20px;
padding: 25px $baseline $baseline/2 $baseline;
margin-bottom: 5px;
@include box-sizing(border-box);
border: 1px solid #c8c8c8;
......@@ -2245,7 +2409,7 @@ body.discussion {
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: 10px;
margin-top: $baseline/2;
padding: 0px;
height: 20px;
overflow: hidden;
......@@ -2301,11 +2465,11 @@ body.discussion {
.wmd-prompt-dialog {
@extend .modal;
background: #fff;
background: $white;
}
.wmd-prompt-dialog {
padding: 20px;
padding: $baseline;
> div {
font-size: 0.8em;
......@@ -2361,25 +2525,25 @@ body.discussion {
}
.edit-post-form {
width: 100%;
margin-bottom: 20px;
margin-bottom: $baseline;
@include clearfix;
@include box-sizing(border-box);
.form-row {
margin-top: 20px;
margin-top: $baseline;
}
.post-cancel {
@include white-button;
float: left;
margin: 10px 0 0 15px;
margin: $baseline/2 0 0 15px;
}
.post-update {
@include blue-button;
float: left;
height: 37px;
margin-top: 10px;
margin-top: $baseline/2;
padding-bottom: 2px;
&:hover {
......@@ -2390,7 +2554,7 @@ body.discussion {
.edit-post-title, .edit-post-tags {
width: 100%;
height: 40px;
padding: 0 10px;
padding: 0 $baseline/2;
@include box-sizing(border-box);
border-radius: 3px;
border: 1px solid #aaa;
......@@ -2401,11 +2565,11 @@ body.discussion {
}
.tagsinput {
padding: 10px;
padding: $baseline/2;
@include box-sizing(border-box);
border: 1px solid #aaa;
border-radius: 3px;
background: #fff;
background: $white;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
......@@ -2418,11 +2582,11 @@ body.discussion {
}
.thread-tags {
margin: 20px 0;
margin: $baseline 0;
}
.thread-tag {
padding: 3px 10px 6px;
padding: 3px $baseline/2 6px;
margin-right: 5px;
border-radius: 3px;
color: #333;
......@@ -2440,7 +2604,7 @@ body.discussion {
font-size: 12px;
color:#000;
font-style: italic;
background-color:#fff;
background-color: $white;
}
.discussion-pin {
......@@ -2448,8 +2612,13 @@ body.discussion {
float:right;
padding-right: 5px;
font-style: italic;
<<<<<<< HEAD
cursor:pointer;
margin-right: 10px;
=======
cursor:pointer;
margin-right: $baseline/2;
>>>>>>> feature/marco/discussionhome
opacity: 0.8;
span {
......@@ -2481,7 +2650,11 @@ body.discussion {
width: 10px;
height: 14px;
padding-right: 3px;
<<<<<<< HEAD
background: transparent url('../images/unpinned.png') no-repeat 0 0;
=======
color: $gray-l2;
>>>>>>> feature/marco/discussionhome
}
.pinned .icon {
......@@ -2491,7 +2664,11 @@ body.discussion {
width: 10px;
height: 14px;
padding-right: 3px;
<<<<<<< HEAD
background: transparent url('../images/pinned.png') no-repeat 0 0;
=======
color: $pink;
>>>>>>> feature/marco/discussionhome
}
.pinned span {
......@@ -2526,28 +2703,47 @@ display:none;
opacity: 1.0;
}
<<<<<<< HEAD
}
.notflagged .icon
{
display: block;
=======
}
.notflagged .icon {
display: block;
>>>>>>> feature/marco/discussionhome
float: left;
margin: 3px;
width: 10px;
height: 14px;
padding-right: 3px;
<<<<<<< HEAD
background: transparent url('../images/notflagged.png') no-repeat 0 0;
}
.flagged .icon
{
display: block;
=======
color: $gray-l2;
}
.flagged .icon {
display: block;
>>>>>>> feature/marco/discussionhome
float: left;
margin: 3px;
width: 10px;
height: 14px;
padding-right: 3px;
<<<<<<< HEAD
background: transparent url('../images/flagged.png') no-repeat 0 0;
=======
color: $pink;
>>>>>>> feature/marco/discussionhome
}
.flagged span {
......
lms/static/sass/application.scss.mako
@import 'bourbon/bourbon';
// lms - css application architecture
// ====================
// libs and resets *do not edit*
@import 'bourbon/bourbon'; // lib - bourbon
// VENDOR + REBASE *referenced/used vendor presentation and reset*
// ====================
@import 'base/reset';
@import 'base/font_face';
@import 'vendor/font-awesome';
// BASE *default edX offerings*
// ====================
// base - utilities
@import 'base/mixins';
@import 'base/variables';
......@@ -19,10 +32,16 @@
% endif
@import 'base/base';
// base - assets
@import 'base/font_face';
@import 'base/extends';
@import 'base/animations';
// Multicourse styles
// base - starter
@import 'base/base';
// shared - course
@import 'shared/forms';
@import 'shared/footer';
@import 'shared/header';
......@@ -31,6 +50,7 @@
@import 'shared/modal';
@import 'shared/activation_messages';
// shared - platform
@import 'multicourse/home';
@import 'multicourse/dashboard';
@import 'multicourse/account';
......@@ -46,7 +66,8 @@
@import 'multicourse/help';
@import 'multicourse/edge';
// applications
@import 'discussion';
@import 'news';
@import 'shame';
@import 'shame'; // shame file - used for any bad-form/orphaned scss that knowingly violate edX FED architecture/standards (see - http://csswizardry.com/2013/04/shame-css/)
lms/static/sass/base/_variables.scss
// lms - utilities - variables
// ====================
$baseline: 20px;
// grid
$gw-column: 80px;
$gw-gutter: 20px;
......@@ -9,6 +13,9 @@ $fg-max-columns: 12;
$fg-max-width: 1400px;
$fg-min-width: 810px;
// ====================
// fonts
$sans-serif: 'Open Sans', $verdana;
$monospace: Monaco, 'Bitstream Vera Sans Mono', 'Lucida Console', monospace;
$body-font-family: $sans-serif;
......@@ -22,12 +29,115 @@ $base-font-color: rgb(60,60,60);
$lighter-base-font-color: rgb(100,100,100);
$very-light-text: #fff;
$white: rgb(255,255,255);
// ====================
// colors - new reorganized colors
$black: rgb(0,0,0);
$blue: rgb(29,157,217);
$pink: rgb(182,37,104);
$yellow: rgb(255, 252, 221);
$black-t0: rgba(0,0,0,0.125);
$black-t1: rgba(0,0,0,0.25);
$black-t2: rgba(0,0,0,0.50);
$black-t3: rgba(0,0,0,0.75);
$white: rgb(255,255,255);
$white-t0: rgba(255,255,255,0.125);
$white-t1: rgba(255,255,255,0.25);
$white-t2: rgba(255,255,255,0.50);
$white-t3: rgba(255,255,255,0.75);
$gray: rgb(127,127,127);
$gray-l1: tint($gray,20%);
$gray-l2: tint($gray,40%);
$gray-l3: tint($gray,60%);
$gray-l4: tint($gray,80%);
$gray-l5: tint($gray,90%);
$gray-l6: tint($gray,95%);
$gray-d1: shade($gray,20%);
$gray-d2: shade($gray,40%);
$gray-d3: shade($gray,60%);
$gray-d4: shade($gray,80%);
//new blue
$pink: rgb(183,37,103);
$pink-l1: tint($pink,20%);
$pink-l2: tint($pink,40%);
$pink-l3: tint($pink,60%);
$pink-l4: tint($pink,80%);
$pink-l5: tint($pink,90%);
$pink-d1: shade($pink,20%);
$pink-d2: shade($pink,40%);
$pink-d3: shade($pink,60%);
$pink-d4: shade($pink,80%);
$pink-s1: saturate($pink,15%);
$pink-s2: saturate($pink,30%);
$pink-s3: saturate($pink,45%);
$pink-u1: desaturate($pink,15%);
$pink-u2: desaturate($pink,30%);
$pink-u3: desaturate($pink,45%);
$red: rgb(178, 6, 16);
$red-l1: tint($red,20%);
$red-l2: tint($red,40%);
$red-l3: tint($red,60%);
$red-l4: tint($red,80%);
$red-l5: tint($red,90%);
$red-d1: shade($red,20%);
$red-d2: shade($red,40%);
$red-d3: shade($red,60%);
$red-d4: shade($red,80%);
$red-s1: saturate($red,15%);
$red-s2: saturate($red,30%);
$red-s3: saturate($red,45%);
$red-u1: desaturate($red,15%);
$red-u2: desaturate($red,30%);
$red-u3: desaturate($red,45%);
$green: rgb(37, 184, 90);
$green-l1: tint($green,20%);
$green-l2: tint($green,40%);
$green-l3: tint($green,60%);
$green-l4: tint($green,80%);
$green-l5: tint($green,90%);
$green-d1: shade($green,20%);
$green-d2: shade($green,40%);
$green-d3: shade($green,60%);
$green-d4: shade($green,80%);
$green-s1: saturate($green,15%);
$green-s2: saturate($green,30%);
$green-s3: saturate($green,45%);
$green-u1: desaturate($green,15%);
$green-u2: desaturate($green,30%);
$green-u3: desaturate($green,45%);
//new yellow
$orange: rgb(237, 189, 60);
$orange-l1: tint($orange,20%);
$orange-l2: tint($orange,40%);
$orange-l3: tint($orange,60%);
$orange-l4: tint($orange,80%);
$orange-l5: tint($orange,90%);
$orange-d1: shade($orange,20%);
$orange-d2: shade($orange,40%);
$orange-d3: shade($orange,60%);
$orange-d4: shade($orange,80%);
$orange-s1: saturate($orange,15%);
$orange-s2: saturate($orange,30%);
$orange-s3: saturate($orange,45%);
$orange-u1: desaturate($orange,15%);
$orange-u2: desaturate($orange,30%);
$orange-u3: desaturate($orange,45%);
$shadow: rgba(0,0,0,0.2);
$shadow-l1: rgba(0,0,0,0.1);
$shadow-l2: rgba(0,0,0,0.05);
$shadow-d1: rgba(0,0,0,0.4);
// ====================
// colors - old variables
$blue: rgb(29,157,217); //old blue
$yellow: rgb(255, 252, 221); //old yellow
$error-red: rgb(253, 87, 87);
$light-gray: rgb(221, 221, 221);
$dark-gray: rgb(51, 51, 51);
......
lms/static/sass/course/_discussions-inline.scss 0 → 100644
.discussion-module {
@extend .discussion-body;
margin: 20px 0;
padding: 20px 20px 28px 20px;
background: #f6f6f6 !important;
border-radius: 3px;
.responses {
margin-top: 40px;
> li {
margin: 0 20px 30px;
}
}
.discussion-show {
display: block;
width: 200px;
margin: auto;
font-size: 14px;
text-align: center;
&.shown {
.show-hide-discussion-icon {
background-position: 0 0;
}
}
.show-hide-discussion-icon {
display: inline-block;
position: relative;
top: 5px;
margin-right: 6px;
width: 21px;
height: 19px;
background: url(../images/show-hide-discussion-icon.png) no-repeat;
background-position: -21px 0;
}
}
.new-post-btn {
display: inline-block;
}
section.discussion {
margin-top: 20px;
.threads {
margin-top: 20px;
}
/* Course content p has a default margin-bottom of 1.416em, this is just to reset that */
.discussion-thread {
padding: 0;
@include transition(all .25s);
.dogear,
.vote-btn {
display: none;
}
&.expanded {
padding: 20px 0;
.dogear,
.vote-btn {
display: block;
}
.discussion-article {
border: 1px solid #b2b2b2;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
border-radius: 3px;
}
}
p {
margin-bottom: 0em;
}
.discussion-article {
border: 1px solid #ddd;
border-bottom-width: 0;
background: #fff;
min-height: 0;
padding: 10px 10px 15px 10px;
box-shadow: 0 1px 0 #ddd;
@include transition(all .2s);
.discussion-post {
padding: 12px 20px 0 20px;
@include clearfix;
header {
padding-bottom: 0;
margin-bottom: 15px;
h3 {
font-size: 19px;
font-weight: 700;
margin-bottom: 0px;
}
h4 {
font-size: 16px;
}
}
.post-body {
font-size: 14px;
clear: both;
}
}
.post-tools {
margin-left: 20px;
a {
display: block;
font-size: 12px;
line-height: 30px;
&.expand-post:before {
content: '▾ ';
}
&.collapse-post:before {
content: '▴ ';
}
&.collapse-post {
display: none;
}
}
}
.responses {
margin-top: 10px;
header {
padding-bottom: 0em;
margin-bottom: 5px;
.posted-by {
font-size: 0.8em;
}
}
.response-body {
margin-bottom: 0.2em;
font-size: 14px;
}
}
.discussion-reply-new {
.wmd-input {
height: 120px;
}
}
// Content that is hidden by default in the inline view
.post-extended-content{
display: none;
}
}
}
}
.new-post-article {
display: none;
margin-top: 20px;
.inner-wrapper {
max-width: 1180px;
min-width: 760px;
margin: auto;
}
.new-post-form {
width: 100%;
margin-bottom: 20px;
padding: 30px;
border-radius: 3px;
background: rgba(0, 0, 0, .55);
color: #fff;
box-shadow: none;
@include clearfix;
@include box-sizing(border-box);
.form-row {
margin-bottom: 20px;
}
.new-post-body .wmd-input {
@include discussion-wmd-input;
position: relative;
width: 100%;
height: 200px;
z-index: 1;
padding: 10px;
box-sizing: border-box;
border: 1px solid #333;
border-radius: 3px 3px 0 0;
background: #fff;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
}
.new-post-body .wmd-preview {
@include discussion-wmd-preview;
position: relative;
width: 100%;
//height: 50px;
margin-top: -1px;
padding: 25px 20px 10px 20px;
box-sizing: border-box;
border: 1px solid #333;
border-radius: 0 0 3px 3px;
background: #e6e6e6;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
}
.new-post-preview-label {
position: absolute;
top: 4px;
left: 4px;
font-size: 11px;
color: #aaa;
text-transform: uppercase;
}
.new-post-title,
.new-post-tags {
width: 100%;
height: 40px;
padding: 0 10px;
box-sizing: border-box;
border-radius: 3px;
border: 1px solid #333;
font-size: 16px;
font-family: 'Open Sans', sans-serif;
color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
}
.new-post-title {
font-weight: 700;
}
.tagsinput {
padding: 10px;
box-sizing: border-box;
border: 1px solid #333;
border-radius: 3px;
background: #fff;
font-family: 'Monaco', monospace;
font-size: 13px;
line-height: 1.6;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) inset;
span.tag {
margin-bottom: 0;
}
}
.submit {
@include blue-button;
float: left;
height: 37px;
margin-top: 10px;
padding-bottom: 2px;
border-color: #333;
&:hover {
border-color: #222;
}
}
.new-post-cancel {
@include white-button;
float: left;
margin: 10px 0 0 15px;
border-color: #444;
}
.options {
margin-top: 5px;
label {
display: inline;
margin-left: 8px;
font-size: 15px;
color: #fff;
text-shadow: none;
}
}
}
.thread-tags {
margin-top: 20px;
}
.thread-tag {
padding: 3px 10px 6px;
border-radius: 3px;
color: #333;
background: #c5eeff;
border: 1px solid #90c4d7;
font-size: 13px;
}
.thread-title {
display: block;
margin-bottom: 20px;
font-size: 21px;
color: #333;
font-weight: 700;
}
}
.new-post-btn {
@include blue-button;
display: inline-block;
font-size: 13px;
margin-right: 4px;
}
.new-post-icon {
display: block;
float: left;
width: 16px;
height: 17px;
margin: 8px 7px 0 0;
font-size: 16px;
vertical-align: middle;
color: $white;
}
.moderator-actions {
padding-left: 0 !important;
}
section.pagination {
margin-top: 30px;
nav.discussion-paginator {
float: right;
ol {
li {
list-style: none;
display: inline-block;
padding-right: 0.5em;
a {
@include white-button;
}
}
li.current-page{
height: 35px;
padding: 0 15px;
border: 1px solid #ccc;
border-radius: 3px;
font-size: 13px;
font-weight: 700;
line-height: 32px;
color: #333;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
}
}
}
}
.new-post-body {
.wmd-panel {
width: 100%;
min-width: 500px;
}
.wmd-button-bar {
width: 100%;
}
.wmd-input {
height: 150px;
width: 100%;
background-color: #e9e9e9;
border: 1px solid #c8c8c8;
font-family: Monaco, 'Lucida Console', monospace;
font-style: normal;
font-size: 0.8em;
line-height: 1.6em;
@include border-radius(3px 3px 0 0);
&::-webkit-input-placeholder {
color: #888;
}
}
.wmd-preview {
position: relative;
font-family: $sans-serif;
padding: 25px 20px 10px 20px;
margin-bottom: 5px;
box-sizing: border-box;
border: 1px solid #c8c8c8;
border-top-width: 0;
@include border-radius(0 0 3px 3px);
overflow: hidden;
@include transition(all, .2s, easeOut);
&:before {
content: 'PREVIEW';
position: absolute;
top: 3px;
left: 5px;
font-size: 11px;
color: #bbb;
}
p {
font-family: $sans-serif;
}
background-color: #fafafa;
}
.wmd-button-row {
position: relative;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: 10px;
padding: 0px;
height: 20px;
overflow: hidden;
@include transition(all, .2s, easeOut);
}
.wmd-spacer {
width: 1px;
height: 20px;
margin-left: 14px;
position: absolute;
background-color: Silver;
display: inline-block;
list-style: none;
}
.wmd-button {
width: 20px;
height: 20px;
padding-left: 2px;
padding-right: 3px;
position: absolute;
display: inline-block;
list-style: none;
cursor: pointer;
background: none;
}
.wmd-button > span {
display: inline-block;
background-image: url(../images/new-post-icons-full.png);
background-repeat: no-repeat;
background-position: 0px 0px;
width: 20px;
height: 20px;
}
.wmd-spacer1 {
left: 50px;
}
.wmd-spacer2 {
left: 175px;
}
.wmd-spacer3 {
left: 300px;
}
.wmd-prompt-background {
background-color: Black;
}
.wmd-prompt-dialog {
@extend .modal;
background: #fff;
}
.wmd-prompt-dialog {
padding: 20px;
> div {
font-size: 0.8em;
font-family: arial, helvetica, sans-serif;
}
b {
font-size: 16px;
}
> form > input[type="text"] {
border-radius: 3px;
color: #333;
}
> form > input[type="button"] {
border: 1px solid #888;
font-family: $sans-serif;
font-size: 14px;
}
> form > input[type="file"] {
margin-bottom: 18px;
}
}
}
.wmd-button-row {
// this is being hidden now because the inline styles to position the icons are not being written
display: none;
position: relative;
height: 12px;
}
.wmd-button {
span {
background-image: url("/static/images/wmd-buttons.png");
display: inline-block;
}
}
}
\ No newline at end of file
lms/static/sass/vendor/_font-awesome.scss 0 → 100644
/*!
* Font Awesome 3.1.0
* the iconic font designed for Bootstrap
* -------------------------------------------------------
* The full suite of pictographic icons, examples, and documentation
* can be found at: http://fontawesome.io
*
* License
* -------------------------------------------------------
* - The Font Awesome font is licensed under the SIL Open Font License v1.1 -
* http://scripts.sil.org/OFL
* - Font Awesome CSS, LESS, and SASS files are licensed under the MIT License -
* http://opensource.org/licenses/mit-license.html
* - Font Awesome documentation licensed under CC BY 3.0 License -
* http://creativecommons.org/licenses/by/3.0/
* - Attribution is no longer required in Font Awesome 3.0, but much appreciated:
* "Font Awesome by Dave Gandy - http://fontawesome.io"
* Contact
* -------------------------------------------------------
* Email: dave@fontawesome.io
* Twitter: http://twitter.com/fortaweso_me
* Work: Lead Product Designer @ http://kyruus.com
*/
/* FONT PATH
* -------------------------- */
@font-face {
font-family: 'FontAwesome';
src: url('../fonts/vendor/fontawesome-webfont.eot?v=3.1.0');
src: url('../fonts/vendor/fontawesome-webfont.eot?#iefix&v=3.1.0') format('embedded-opentype'), url('../fonts/vendor/fontawesome-webfont.woff?v=3.1.0') format('woff'), url('../fonts/vendor/fontawesome-webfont.ttf?v=3.1.0') format('truetype'), url('../fonts/vendor/fontawesome-webfont.svg#fontawesomeregular?v=3.1.0') format('svg');
font-weight: normal;
font-style: normal;
}
/* FONT AWESOME CORE
* -------------------------- */
[class^="icon-"],
[class*=" icon-"] {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;
*margin-right: .3em;
}
[class^="icon-"]:before,
[class*=" icon-"]:before {
text-decoration: inherit;
display: inline-block;
speak: none;
}
/* makes the font 33% larger relative to the icon container */
.icon-large:before {
vertical-align: -10%;
font-size: 1.3333333333333333em;
}
/* makes sure icons active on rollover in links */
a [class^="icon-"],
a [class*=" icon-"],
a [class^="icon-"]:before,
a [class*=" icon-"]:before {
display: inline;
}
/* increased font size for icon-large */
[class^="icon-"].icon-fixed-width,
[class*=" icon-"].icon-fixed-width {
display: inline-block;
width: 1.2857142857142858em;
text-align: center;
}
[class^="icon-"].icon-fixed-width.icon-large,
[class*=" icon-"].icon-fixed-width.icon-large {
width: 1.5714285714285714em;
}
ul.icons-ul {
list-style-type: none;
text-indent: -0.7142857142857143em;
margin-left: 2.142857142857143em;
}
ul.icons-ul > li .icon-li {
width: 0.7142857142857143em;
display: inline-block;
text-align: center;
}
[class^="icon-"].hide,
[class*=" icon-"].hide {
display: none;
}
.icon-muted {
color: #eeeeee;
}
.icon-light {
color: #ffffff;
}
.icon-dark {
color: #333333;
}
.icon-border {
border: solid 1px #eeeeee;
padding: .2em .25em .15em;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.icon-2x {
font-size: 2em;
}
.icon-2x.icon-border {
border-width: 2px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.icon-3x {
font-size: 3em;
}
.icon-3x.icon-border {
border-width: 3px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.icon-4x {
font-size: 4em;
}
.icon-4x.icon-border {
border-width: 4px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
}
.icon-5x {
font-size: 5em;
}
.icon-5x.icon-border {
border-width: 5px;
-webkit-border-radius: 7px;
-moz-border-radius: 7px;
border-radius: 7px;
}
.pull-right {
float: right;
}
.pull-left {
float: left;
}
[class^="icon-"].pull-left,
[class*=" icon-"].pull-left {
margin-right: .3em;
}
[class^="icon-"].pull-right,
[class*=" icon-"].pull-right {
margin-left: .3em;
}
/* BOOTSTRAP SPECIFIC CLASSES
* -------------------------- */
/* Bootstrap 2.0 sprites.less reset */
[class^="icon-"],
[class*=" icon-"] {
display: inline;
width: auto;
height: auto;
line-height: normal;
vertical-align: baseline;
background-image: none;
background-position: 0% 0%;
background-repeat: repeat;
margin-top: 0;
}
/* more sprites.less reset */
.icon-white,
.nav-pills > .active > a > [class^="icon-"],
.nav-pills > .active > a > [class*=" icon-"],
.nav-list > .active > a > [class^="icon-"],
.nav-list > .active > a > [class*=" icon-"],
.navbar-inverse .nav > .active > a > [class^="icon-"],
.navbar-inverse .nav > .active > a > [class*=" icon-"],
.dropdown-menu > li > a:hover > [class^="icon-"],
.dropdown-menu > li > a:hover > [class*=" icon-"],
.dropdown-menu > .active > a > [class^="icon-"],
.dropdown-menu > .active > a > [class*=" icon-"],
.dropdown-submenu:hover > a > [class^="icon-"],
.dropdown-submenu:hover > a > [class*=" icon-"] {
background-image: none;
}
/* keeps Bootstrap styles with and without icons the same */
.btn [class^="icon-"].icon-large,
.nav [class^="icon-"].icon-large,
.btn [class*=" icon-"].icon-large,
.nav [class*=" icon-"].icon-large {
line-height: .9em;
}
.btn [class^="icon-"].icon-spin,
.nav [class^="icon-"].icon-spin,
.btn [class*=" icon-"].icon-spin,
.nav [class*=" icon-"].icon-spin {
display: inline-block;
}
.nav-tabs [class^="icon-"],
.nav-pills [class^="icon-"],
.nav-tabs [class*=" icon-"],
.nav-pills [class*=" icon-"],
.nav-tabs [class^="icon-"].icon-large,
.nav-pills [class^="icon-"].icon-large,
.nav-tabs [class*=" icon-"].icon-large,
.nav-pills [class*=" icon-"].icon-large {
line-height: .9em;
}
.btn [class^="icon-"].pull-left.icon-2x,
.btn [class*=" icon-"].pull-left.icon-2x,
.btn [class^="icon-"].pull-right.icon-2x,
.btn [class*=" icon-"].pull-right.icon-2x {
margin-top: .18em;
}
.btn [class^="icon-"].icon-spin.icon-large,
.btn [class*=" icon-"].icon-spin.icon-large {
line-height: .8em;
}
.btn.btn-small [class^="icon-"].pull-left.icon-2x,
.btn.btn-small [class*=" icon-"].pull-left.icon-2x,
.btn.btn-small [class^="icon-"].pull-right.icon-2x,
.btn.btn-small [class*=" icon-"].pull-right.icon-2x {
margin-top: .25em;
}
.btn.btn-large [class^="icon-"],
.btn.btn-large [class*=" icon-"] {
margin-top: 0;
}
.btn.btn-large [class^="icon-"].pull-left.icon-2x,
.btn.btn-large [class*=" icon-"].pull-left.icon-2x,
.btn.btn-large [class^="icon-"].pull-right.icon-2x,
.btn.btn-large [class*=" icon-"].pull-right.icon-2x {
margin-top: .05em;
}
.btn.btn-large [class^="icon-"].pull-left.icon-2x,
.btn.btn-large [class*=" icon-"].pull-left.icon-2x {
margin-right: .2em;
}
.btn.btn-large [class^="icon-"].pull-right.icon-2x,
.btn.btn-large [class*=" icon-"].pull-right.icon-2x {
margin-left: .2em;
}
/* EXTRAS
* -------------------------- */
/* Stacked and layered icon */
.icon-stack {
position: relative;
display: inline-block;
width: 2em;
height: 2em;
line-height: 2em;
vertical-align: -35%;
}
.icon-stack [class^="icon-"],
.icon-stack [class*=" icon-"] {
display: block;
text-align: center;
position: absolute;
width: 100%;
height: 100%;
font-size: 1em;
line-height: inherit;
*line-height: 2em;
}
.icon-stack .icon-stack-base {
font-size: 2em;
*line-height: 1em;
}
/* Animated rotating icon */
.icon-spin {
display: inline-block;
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
-webkit-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
0% {
-moz-transform: rotate(0deg);
}
100% {
-moz-transform: rotate(359deg);
}
}
@-webkit-keyframes spin {
0% {
-webkit-transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(359deg);
}
}
@-o-keyframes spin {
0% {
-o-transform: rotate(0deg);
}
100% {
-o-transform: rotate(359deg);
}
}
@-ms-keyframes spin {
0% {
-ms-transform: rotate(0deg);
}
100% {
-ms-transform: rotate(359deg);
}
}
@keyframes spin {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(359deg);
}
}
/* Icon rotations and mirroring */
.icon-rotate-90:before {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-ms-transform: rotate(90deg);
-o-transform: rotate(90deg);
transform: rotate(90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
}
.icon-rotate-180:before {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}
.icon-rotate-270:before {
-webkit-transform: rotate(270deg);
-moz-transform: rotate(270deg);
-ms-transform: rotate(270deg);
-o-transform: rotate(270deg);
transform: rotate(270deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
.icon-flip-horizontal:before {
-webkit-transform: scale(-1, 1);
-moz-transform: scale(-1, 1);
-ms-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
transform: scale(-1, 1);
}
.icon-flip-vertical:before {
-webkit-transform: scale(1, -1);
-moz-transform: scale(1, -1);
-ms-transform: scale(1, -1);
-o-transform: scale(1, -1);
transform: scale(1, -1);
}
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.icon-glass:before {
content: "\f000";
}
.icon-music:before {
content: "\f001";
}
.icon-search:before {
content: "\f002";
}
.icon-envelope:before {
content: "\f003";
}
.icon-heart:before {
content: "\f004";
}
.icon-star:before {
content: "\f005";
}
.icon-star-empty:before {
content: "\f006";
}
.icon-user:before {
content: "\f007";
}
.icon-film:before {
content: "\f008";
}
.icon-th-large:before {
content: "\f009";
}
.icon-th:before {
content: "\f00a";
}
.icon-th-list:before {
content: "\f00b";
}
.icon-ok:before {
content: "\f00c";
}
.icon-remove:before {
content: "\f00d";
}
.icon-zoom-in:before {
content: "\f00e";
}
.icon-zoom-out:before {
content: "\f010";
}
.icon-off:before {
content: "\f011";
}
.icon-signal:before {
content: "\f012";
}
.icon-cog:before {
content: "\f013";
}
.icon-trash:before {
content: "\f014";
}
.icon-home:before {
content: "\f015";
}
.icon-file:before {
content: "\f016";
}
.icon-time:before {
content: "\f017";
}
.icon-road:before {
content: "\f018";
}
.icon-download-alt:before {
content: "\f019";
}
.icon-download:before {
content: "\f01a";
}
.icon-upload:before {
content: "\f01b";
}
.icon-inbox:before {
content: "\f01c";
}
.icon-play-circle:before {
content: "\f01d";
}
.icon-repeat:before,
.icon-rotate-right:before {
content: "\f01e";
}
/* F020 doesn't work in Safari. all shifted one down */
.icon-refresh:before {
content: "\f021";
}
.icon-list-alt:before {
content: "\f022";
}
.icon-lock:before {
content: "\f023";
}
.icon-flag:before {
content: "\f024";
}
.icon-headphones:before {
content: "\f025";
}
.icon-volume-off:before {
content: "\f026";
}
.icon-volume-down:before {
content: "\f027";
}
.icon-volume-up:before {
content: "\f028";
}
.icon-qrcode:before {
content: "\f029";
}
.icon-barcode:before {
content: "\f02a";
}
.icon-tag:before {
content: "\f02b";
}
.icon-tags:before {
content: "\f02c";
}
.icon-book:before {
content: "\f02d";
}
.icon-bookmark:before {
content: "\f02e";
}
.icon-print:before {
content: "\f02f";
}
.icon-camera:before {
content: "\f030";
}
.icon-font:before {
content: "\f031";
}
.icon-bold:before {
content: "\f032";
}
.icon-italic:before {
content: "\f033";
}
.icon-text-height:before {
content: "\f034";
}
.icon-text-width:before {
content: "\f035";
}
.icon-align-left:before {
content: "\f036";
}
.icon-align-center:before {
content: "\f037";
}
.icon-align-right:before {
content: "\f038";
}
.icon-align-justify:before {
content: "\f039";
}
.icon-list:before {
content: "\f03a";
}
.icon-indent-left:before {
content: "\f03b";
}
.icon-indent-right:before {
content: "\f03c";
}
.icon-facetime-video:before {
content: "\f03d";
}
.icon-picture:before {
content: "\f03e";
}
.icon-pencil:before {
content: "\f040";
}
.icon-map-marker:before {
content: "\f041";
}
.icon-adjust:before {
content: "\f042";
}
.icon-tint:before {
content: "\f043";
}
.icon-edit:before {
content: "\f044";
}
.icon-share:before {
content: "\f045";
}
.icon-check:before {
content: "\f046";
}
.icon-move:before {
content: "\f047";
}
.icon-step-backward:before {
content: "\f048";
}
.icon-fast-backward:before {
content: "\f049";
}
.icon-backward:before {
content: "\f04a";
}
.icon-play:before {
content: "\f04b";
}
.icon-pause:before {
content: "\f04c";
}
.icon-stop:before {
content: "\f04d";
}
.icon-forward:before {
content: "\f04e";
}
.icon-fast-forward:before {
content: "\f050";
}
.icon-step-forward:before {
content: "\f051";
}
.icon-eject:before {
content: "\f052";
}
.icon-chevron-left:before {
content: "\f053";
}
.icon-chevron-right:before {
content: "\f054";
}
.icon-plus-sign:before {
content: "\f055";
}
.icon-minus-sign:before {
content: "\f056";
}
.icon-remove-sign:before {
content: "\f057";
}
.icon-ok-sign:before {
content: "\f058";
}
.icon-question-sign:before {
content: "\f059";
}
.icon-info-sign:before {
content: "\f05a";
}
.icon-screenshot:before {
content: "\f05b";
}
.icon-remove-circle:before {
content: "\f05c";
}
.icon-ok-circle:before {
content: "\f05d";
}
.icon-ban-circle:before {
content: "\f05e";
}
.icon-arrow-left:before {
content: "\f060";
}
.icon-arrow-right:before {
content: "\f061";
}
.icon-arrow-up:before {
content: "\f062";
}
.icon-arrow-down:before {
content: "\f063";
}
.icon-share-alt:before,
.icon-mail-forward:before {
content: "\f064";
}
.icon-resize-full:before {
content: "\f065";
}
.icon-resize-small:before {
content: "\f066";
}
.icon-plus:before {
content: "\f067";
}
.icon-minus:before {
content: "\f068";
}
.icon-asterisk:before {
content: "\f069";
}
.icon-exclamation-sign:before {
content: "\f06a";
}
.icon-gift:before {
content: "\f06b";
}
.icon-leaf:before {
content: "\f06c";
}
.icon-fire:before {
content: "\f06d";
}
.icon-eye-open:before {
content: "\f06e";
}
.icon-eye-close:before {
content: "\f070";
}
.icon-warning-sign:before {
content: "\f071";
}
.icon-plane:before {
content: "\f072";
}
.icon-calendar:before {
content: "\f073";
}
.icon-random:before {
content: "\f074";
}
.icon-comment:before {
content: "\f075";
}
.icon-magnet:before {
content: "\f076";
}
.icon-chevron-up:before {
content: "\f077";
}
.icon-chevron-down:before {
content: "\f078";
}
.icon-retweet:before {
content: "\f079";
}
.icon-shopping-cart:before {
content: "\f07a";
}
.icon-folder-close:before {
content: "\f07b";
}
.icon-folder-open:before {
content: "\f07c";
}
.icon-resize-vertical:before {
content: "\f07d";
}
.icon-resize-horizontal:before {
content: "\f07e";
}
.icon-bar-chart:before {
content: "\f080";
}
.icon-twitter-sign:before {
content: "\f081";
}
.icon-facebook-sign:before {
content: "\f082";
}
.icon-camera-retro:before {
content: "\f083";
}
.icon-key:before {
content: "\f084";
}
.icon-cogs:before {
content: "\f085";
}
.icon-comments:before {
content: "\f086";
}
.icon-thumbs-up:before {
content: "\f087";
}
.icon-thumbs-down:before {
content: "\f088";
}
.icon-star-half:before {
content: "\f089";
}
.icon-heart-empty:before {
content: "\f08a";
}
.icon-signout:before {
content: "\f08b";
}
.icon-linkedin-sign:before {
content: "\f08c";
}
.icon-pushpin:before {
content: "\f08d";
}
.icon-external-link:before {
content: "\f08e";
}
.icon-signin:before {
content: "\f090";
}
.icon-trophy:before {
content: "\f091";
}
.icon-github-sign:before {
content: "\f092";
}
.icon-upload-alt:before {
content: "\f093";
}
.icon-lemon:before {
content: "\f094";
}
.icon-phone:before {
content: "\f095";
}
.icon-check-empty:before {
content: "\f096";
}
.icon-bookmark-empty:before {
content: "\f097";
}
.icon-phone-sign:before {
content: "\f098";
}
.icon-twitter:before {
content: "\f099";
}
.icon-facebook:before {
content: "\f09a";
}
.icon-github:before {
content: "\f09b";
}
.icon-unlock:before {
content: "\f09c";
}
.icon-credit-card:before {
content: "\f09d";
}
.icon-rss:before {
content: "\f09e";
}
.icon-hdd:before {
content: "\f0a0";
}
.icon-bullhorn:before {
content: "\f0a1";
}
.icon-bell:before {
content: "\f0a2";
}
.icon-certificate:before {
content: "\f0a3";
}
.icon-hand-right:before {
content: "\f0a4";
}
.icon-hand-left:before {
content: "\f0a5";
}
.icon-hand-up:before {
content: "\f0a6";
}
.icon-hand-down:before {
content: "\f0a7";
}
.icon-circle-arrow-left:before {
content: "\f0a8";
}
.icon-circle-arrow-right:before {
content: "\f0a9";
}
.icon-circle-arrow-up:before {
content: "\f0aa";
}
.icon-circle-arrow-down:before {
content: "\f0ab";
}
.icon-globe:before {
content: "\f0ac";
}
.icon-wrench:before {
content: "\f0ad";
}
.icon-tasks:before {
content: "\f0ae";
}
.icon-filter:before {
content: "\f0b0";
}
.icon-briefcase:before {
content: "\f0b1";
}
.icon-fullscreen:before {
content: "\f0b2";
}
.icon-group:before {
content: "\f0c0";
}
.icon-link:before {
content: "\f0c1";
}
.icon-cloud:before {
content: "\f0c2";
}
.icon-beaker:before {
content: "\f0c3";
}
.icon-cut:before {
content: "\f0c4";
}
.icon-copy:before {
content: "\f0c5";
}
.icon-paper-clip:before {
content: "\f0c6";
}
.icon-save:before {
content: "\f0c7";
}
.icon-sign-blank:before {
content: "\f0c8";
}
.icon-reorder:before {
content: "\f0c9";
}
.icon-list-ul:before {
content: "\f0ca";
}
.icon-list-ol:before {
content: "\f0cb";
}
.icon-strikethrough:before {
content: "\f0cc";
}
.icon-underline:before {
content: "\f0cd";
}
.icon-table:before {
content: "\f0ce";
}
.icon-magic:before {
content: "\f0d0";
}
.icon-truck:before {
content: "\f0d1";
}
.icon-pinterest:before {
content: "\f0d2";
}
.icon-pinterest-sign:before {
content: "\f0d3";
}
.icon-google-plus-sign:before {
content: "\f0d4";
}
.icon-google-plus:before {
content: "\f0d5";
}
.icon-money:before {
content: "\f0d6";
}
.icon-caret-down:before {
content: "\f0d7";
}
.icon-caret-up:before {
content: "\f0d8";
}
.icon-caret-left:before {
content: "\f0d9";
}
.icon-caret-right:before {
content: "\f0da";
}
.icon-columns:before {
content: "\f0db";
}
.icon-sort:before {
content: "\f0dc";
}
.icon-sort-down:before {
content: "\f0dd";
}
.icon-sort-up:before {
content: "\f0de";
}
.icon-envelope-alt:before {
content: "\f0e0";
}
.icon-linkedin:before {
content: "\f0e1";
}
.icon-undo:before,
.icon-rotate-left:before {
content: "\f0e2";
}
.icon-legal:before {
content: "\f0e3";
}
.icon-dashboard:before {
content: "\f0e4";
}
.icon-comment-alt:before {
content: "\f0e5";
}
.icon-comments-alt:before {
content: "\f0e6";
}
.icon-bolt:before {
content: "\f0e7";
}
.icon-sitemap:before {
content: "\f0e8";
}
.icon-umbrella:before {
content: "\f0e9";
}
.icon-paste:before {
content: "\f0ea";
}
.icon-lightbulb:before {
content: "\f0eb";
}
.icon-exchange:before {
content: "\f0ec";
}
.icon-cloud-download:before {
content: "\f0ed";
}
.icon-cloud-upload:before {
content: "\f0ee";
}
.icon-user-md:before {
content: "\f0f0";
}
.icon-stethoscope:before {
content: "\f0f1";
}
.icon-suitcase:before {
content: "\f0f2";
}
.icon-bell-alt:before {
content: "\f0f3";
}
.icon-coffee:before {
content: "\f0f4";
}
.icon-food:before {
content: "\f0f5";
}
.icon-file-alt:before {
content: "\f0f6";
}
.icon-building:before {
content: "\f0f7";
}
.icon-hospital:before {
content: "\f0f8";
}
.icon-ambulance:before {
content: "\f0f9";
}
.icon-medkit:before {
content: "\f0fa";
}
.icon-fighter-jet:before {
content: "\f0fb";
}
.icon-beer:before {
content: "\f0fc";
}
.icon-h-sign:before {
content: "\f0fd";
}
.icon-plus-sign-alt:before {
content: "\f0fe";
}
.icon-double-angle-left:before {
content: "\f100";
}
.icon-double-angle-right:before {
content: "\f101";
}
.icon-double-angle-up:before {
content: "\f102";
}
.icon-double-angle-down:before {
content: "\f103";
}
.icon-angle-left:before {
content: "\f104";
}
.icon-angle-right:before {
content: "\f105";
}
.icon-angle-up:before {
content: "\f106";
}
.icon-angle-down:before {
content: "\f107";
}
.icon-desktop:before {
content: "\f108";
}
.icon-laptop:before {
content: "\f109";
}
.icon-tablet:before {
content: "\f10a";
}
.icon-mobile-phone:before {
content: "\f10b";
}
.icon-circle-blank:before {
content: "\f10c";
}
.icon-quote-left:before {
content: "\f10d";
}
.icon-quote-right:before {
content: "\f10e";
}
.icon-spinner:before {
content: "\f110";
}
.icon-circle:before {
content: "\f111";
}
.icon-reply:before,
.icon-mail-reply:before {
content: "\f112";
}
.icon-folder-close-alt:before {
content: "\f114";
}
.icon-folder-open-alt:before {
content: "\f115";
}
.icon-expand-alt:before {
content: "\f116";
}
.icon-collapse-alt:before {
content: "\f117";
}
.icon-smile:before {
content: "\f118";
}
.icon-frown:before {
content: "\f119";
}
.icon-meh:before {
content: "\f11a";
}
.icon-gamepad:before {
content: "\f11b";
}
.icon-keyboard:before {
content: "\f11c";
}
.icon-flag-alt:before {
content: "\f11d";
}
.icon-flag-checkered:before {
content: "\f11e";
}
.icon-terminal:before {
content: "\f120";
}
.icon-code:before {
content: "\f121";
}
.icon-reply-all:before {
content: "\f122";
}
.icon-mail-reply-all:before {
content: "\f122";
}
.icon-star-half-full:before,
.icon-star-half-empty:before {
content: "\f123";
}
.icon-location-arrow:before {
content: "\f124";
}
.icon-crop:before {
content: "\f125";
}
.icon-code-fork:before {
content: "\f126";
}
.icon-unlink:before {
content: "\f127";
}
.icon-question:before {
content: "\f128";
}
.icon-info:before {
content: "\f129";
}
.icon-exclamation:before {
content: "\f12a";
}
.icon-superscript:before {
content: "\f12b";
}
.icon-subscript:before {
content: "\f12c";
}
.icon-eraser:before {
content: "\f12d";
}
.icon-puzzle-piece:before {
content: "\f12e";
}
.icon-microphone:before {
content: "\f130";
}
.icon-microphone-off:before {
content: "\f131";
}
.icon-shield:before {
content: "\f132";
}
.icon-calendar-empty:before {
content: "\f133";
}
.icon-fire-extinguisher:before {
content: "\f134";
}
.icon-rocket:before {
content: "\f135";
}
.icon-maxcdn:before {
content: "\f136";
}
.icon-chevron-sign-left:before {
content: "\f137";
}
.icon-chevron-sign-right:before {
content: "\f138";
}
.icon-chevron-sign-up:before {
content: "\f139";
}
.icon-chevron-sign-down:before {
content: "\f13a";
}
.icon-html5:before {
content: "\f13b";
}
.icon-css3:before {
content: "\f13c";
}
.icon-anchor:before {
content: "\f13d";
}
.icon-unlock-alt:before {
content: "\f13e";
}
.icon-bullseye:before {
content: "\f140";
}
.icon-ellipsis-horizontal:before {
content: "\f141";
}
.icon-ellipsis-vertical:before {
content: "\f142";
}
.icon-rss-sign:before {
content: "\f143";
}
.icon-play-sign:before {
content: "\f144";
}
.icon-ticket:before {
content: "\f145";
}
.icon-minus-sign-alt:before {
content: "\f146";
}
.icon-check-minus:before {
content: "\f147";
}
.icon-level-up:before {
content: "\f148";
}
.icon-level-down:before {
content: "\f149";
}
.icon-check-sign:before {
content: "\f14a";
}
.icon-edit-sign:before {
content: "\f14b";
}
.icon-external-link-sign:before {
content: "\f14c";
}
.icon-share-sign:before {
content: "\f14d";
}
lms/templates/discussion/_discussion_course_navigation.html
......@@ -3,6 +3,6 @@
<%block name="extratabs">
% if has_permission(user, 'create_thread', course.id):
<li class="right"><a href="#" class="new-post-btn"><span class="new-post-icon"></span>New Post</a></li>
<li class="right"><a href="#" class="new-post-btn"><span class="icon icon-edit new-post-icon"></span>New Post</a></li>
% endif
</%block>
\ No newline at end of file
lms/templates/discussion/_discussion_module.html
......@@ -2,7 +2,7 @@
<div class="discussion-module" data-discussion-id="${discussion_id | h}">
<a class="discussion-show control-button" href="javascript:void(0)" data-discussion-id="${discussion_id | h}"><span class="show-hide-discussion-icon"></span><span class="button-text">Show Discussion</span></a>
<a href="#" class="new-post-btn"><span class="new-post-icon"></span>New Post</a>
<a href="#" class="new-post-btn"><span class="icon icon-edit new-post-icon"></span>New Post</a>
</div>
lms/templates/discussion/_filter_dropdown.html
......@@ -11,12 +11,12 @@
</%def>
<%def name="render_entry(entries, entry)">
<li><a href="#"><span class="board-name" data-discussion_id='${json.dumps(entries[entry])}' cohorted = "${entries[entry]['id'] in cohorted_commentables}">${entry}</span></a></li>
<li><a href="#" class="drop-menu-entry"><span class="board-name" data-discussion_id='${json.dumps(entries[entry])}' cohorted = "${entries[entry]['id'] in cohorted_commentables}">${entry}</span></a></li>
</%def>
<%def name="render_category(categories, category)">
<li>
<a href="#"><span class="board-name">${category}</span></a>
<a href="#" class="drop-menu-parent-category"><span class="board-name">${category}</span></a>
<ul>
${render_dropdown(categories[category])}
</ul>
......@@ -29,21 +29,21 @@
</div>
<ul class="browse-topic-drop-menu">
<li>
<a href="#">
<a href="#" class="drop-menu-meta-category">
<span class="board-name" data-discussion_id='#all'>Show All Discussions</span>
</a>
</li>
%if flag_moderator:
<li>
<a href="#">
<span class="board-name" data-discussion_id='#flagged'>Show Flagged Discussions</span>
<span class="board-name" data-discussion_id='#flagged'><i class="icon-flag" style="padding-right:5px;"></i>Show Flagged Discussions</span>
</a>
</li>
%endif
<li>
<a href="#">
<span class="board-name" data-discussion_id='#following'>Following</span>
<a href="#" class="drop-menu-meta-category">
<span class="board-name" data-discussion_id='#following'><i class="icon-star" style="padding-right:5px;"></i>Posts I'm Following</span>
</a>
</li>
${render_dropdown(category_map)}
......
lms/templates/discussion/_thread_list_template.html
<script type="text/template" id="thread-list-template">
<div class="browse-search">
<div class="home">
<a href="#" class="home-icon">
<i class="icon-home"></i>
</a>
</div>
<div class="browse is-open">
<a href="#" class="browse-topic-drop-icon"></a>
<a href="#" class="browse-topic-drop-btn"><span class="current-board">Show All Discussions</span> <span class="drop-arrow">▾</span></a>
......
lms/templates/discussion/_underscore_templates.html
......@@ -48,17 +48,17 @@
<div class="post-body">${'<%- body %>'}</div>
<div class="discussion-flag-abuse notflagged" data-role="thread-flag" data-tooltip="Report Misuse">
<i class="icon"></i><span class="flag-label">Report Misuse</span></div>
<i class="icon icon-flag"></i><span class="flag-label">Report Misuse</span></div>
% if course and has_permission(user, 'openclose_thread', course.id):
<div class="admin-pin discussion-pin notpinned" data-role="thread-pin" data-tooltip="pin this thread">
<i class="icon"></i><span class="pin-label">Pin Thread</span></div>
<i class="icon icon-pushpin"></i><span class="pin-label">Pin Thread</span></div>
%else:
${"<% if (pinned) { %>"}
<div class="discussion-pin notpinned" data-role="thread-pin" data-tooltip="pin this thread">
<i class="icon"></i><span class="pin-label">Pin Thread</span></div>
<i class="icon icon-pushpin"></i><span class="pin-label">Pin Thread</span></div>
${"<% } %>"}
% endif
......@@ -126,7 +126,7 @@
</header>
<div class="response-local"><div class="response-body">${"<%- body %>"}</div>
<div class="discussion-flag-abuse notflagged" data-role="thread-flag" data-tooltip="report misuse">
<i class="icon"></i><span class="flag-label">Report Misuse</span></div>
<i class="icon icon-flag"></i><span class="flag-label">Report Misuse</span></div>
</div>
<ul class="moderator-actions response-local">
<li style="display: none"><a class="action-edit" href="javascript:void(0)"><span class="edit-icon"></span> Edit</a></li>
......@@ -150,8 +150,8 @@
<script type="text/template" id="response-comment-show-template">
<div id="comment_${'<%- id %>'}">
<div class="response-body">${'<%- body %>'}</div>
<div class="discussion-flag-abuse notflagged" data-role="thread-flag" data-tooltip="report misuse">
<i class="icon"></i><span class="flag-label"></span></div>
<div class="discussion-flag-abuse notflagged" data-role="thread-flag" data-tooltip="Report Misuse">
<i class="icon icon-flag"></i><span class="flag-label"></span></div>
<p class="posted-details">&ndash;posted <span class="timeago" title="${'<%- created_at %>'}">${'<%- created_at %>'}</span> by
${"<% if (obj.username) { %>"}
<a href="${'<%- user_url %>'}" class="profile-link">${'<%- username %>'}</a>
......
lms/templates/discussion/index.html
......@@ -26,8 +26,71 @@
<div class="sidebar"></div>
<div class="discussion-column">
<div class="discussion-article blank-slate">
<h1>${course.display_name_with_default} Discussion</h1>
<section class="home-header">
<span class="label">DISCUSSION HOME:</span>
<h1 class="home-title">${course.display_name_with_default}</h1>
</section>
<section class="home-stats">
<div class="label-area">
<span class="label"> PROFILE, PARTICIPATION</span>
<a href="#" class="profile-link">Your profile Name</a>
</div>
<div class="stats-grouping">
<div class="profile-stat profile-stat-posts">
<span class="count count-posts">5</span>
<span class="profile-stat-label">POSTS</span>
</div>
<div class="profile-stat profile-stat-comments">
<span class="count count-comments">12</span>
<span class="profile-stat-label">COMMENTS</span>
</div>
<div class="profile-stat profile-stat-following">
<span class="count count-following">9</span>
<span class="profile-stat-label">FOLLOWING</span>
</div>
</div>
</section>
<span class="label label-settings">HOW TO USE EDX DISCUSSIONS</span>
<table class="home-helpgrid">
<tr class="helpgrid-row helpgrid-row-navigation">
<td class="row-title">Find discussions</td>
<td class="row-item">
<i class="icon icon-reorder"></i>
<span class="row-description">Focus in on specific topics</span>
</td>
<td class="row-item">
<i class="icon icon-search"></i>
<span class="row-description">Search for specific posts </span>
</td>
<td class="row-item">
<i class="icon icon-sort"></i>
<span class="row-description">Sort by date, vote, or comments </span>
</td>
</tr>
<tr class="helpgrid-row helpgrid-row-participation">
<td class="row-title">Engage with posts</td>
<td class="row-item">
<i class="icon icon-plus"></i>
<span class="row-description">Upvote posts and good responses</span>
</td>
<td class="row-item">
<i class="icon icon-flag"></i>
<span class="row-description">Report Forum Misuse</span>
</td>
<td class="row-item">
<i class="icon icon-star"></i>
<span class="row-description">Follow posts for updates</span>
</td>
</tr>
<tr class="helpgrid-row helpgrid-row-notification">
<td class="row-title">Receive updates</td>
<td class="row-item-full" colspan="3">
<i class="icon icon-envelope"></i>
<span class="row-setting"><input type="checkbox" name="email-notification"></input></span>
<span class="row-description"> If enabled, you will receive an email digest once a day notifying you about new, unread activity from posts you are following. </span>
</td>
</tr>
</table>
</div>
</div>
</div>
......
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