Skip to content

E
edx-platform
Commit a0f54aaf by marco
Options

cleaned up margin and padding to use baseline variable

parent b55b34ff
Showing with 152 additions and 149 deletions
lms/static/sass/_discussion.scss
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
line-height: 32px; line-height: 32px;
color: #fff; color: $white;
text-shadow: 0 1px 0 rgba(0, 0, 0, .3); 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); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
&:hover { &:hover {
@include linear-gradient(top, #fff, #ddd); @include linear-gradient(top, $white, #ddd);
} }
} }
...@@ -43,11 +43,11 @@ ...@@ -43,11 +43,11 @@
padding: 0 15px; padding: 0 15px;
border-radius: 3px; border-radius: 3px;
border: 1px solid #222; border: 1px solid #222;
background: -webkit-linear-gradient(top, #777, #555); background: -webkit-linear-gradient(top, $gray, #555);
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
line-height: 32px; line-height: 32px;
color: #fff; color: $white;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); 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); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
...@@ -60,11 +60,11 @@ ...@@ -60,11 +60,11 @@
width: 100%; width: 100%;
height: 240px; height: 240px;
margin-top: 0; margin-top: 0;
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #aaa; border: 1px solid #aaa;
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; line-height: 1.6;
...@@ -74,14 +74,14 @@ ...@@ -74,14 +74,14 @@
@mixin discussion-wmd-preview { @mixin discussion-wmd-preview {
width: 100%; width: 100%;
min-height: 40px; min-height: 40px;
padding: 25px 20px 10px 20px; padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #aaa; border: 1px solid #aaa;
border-top: none; border-top: none;
border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
background: #eee; background: #eee;
color: #333; 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 { @-webkit-keyframes fadeIn {
...@@ -98,13 +98,13 @@ body.discussion { ...@@ -98,13 +98,13 @@ body.discussion {
padding: 0; padding: 0;
border: 1px solid #333; border: 1px solid #333;
list-style: none; list-style: none;
color: #fff; color: $white;
line-height: 1.6; line-height: 1.6;
border-radius: 3px; border-radius: 3px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2);
li { li {
padding: 10px 20px 12px 45px; padding: $baseline/2 $baseline 12px 45px;
border-bottom: 1px solid #dc4949; border-bottom: 1px solid #dc4949;
background: url(../images/white-error-icon.png) no-repeat 15px 14px; background: url(../images/white-error-icon.png) no-repeat 15px 14px;
...@@ -135,7 +135,7 @@ body.discussion { ...@@ -135,7 +135,7 @@ body.discussion {
.new-post-article { .new-post-article {
display: none; display: none;
margin-top: 20px; margin-top: $baseline;
.inner-wrapper { .inner-wrapper {
max-width: 1180px; max-width: 1180px;
...@@ -146,13 +146,13 @@ body.discussion { ...@@ -146,13 +146,13 @@ body.discussion {
.left-column { .left-column {
float: left; float: left;
width: 32%; width: 32%;
padding: 40px; padding: $baseline*2;
@include box-sizing(border-box); @include box-sizing(border-box);
label { label {
font-size: 22px; font-size: 22px;
font-weight: 700; font-weight: 700;
color: #fff; color: $white;
text-shadow: none; text-shadow: none;
} }
...@@ -168,8 +168,8 @@ body.discussion { ...@@ -168,8 +168,8 @@ body.discussion {
.form-group-label { .form-group-label {
display: block; display: block;
padding-top: 5px; padding-top: $baseline/4;
color:#fff; color: $white;
} }
.topic_dropdown_button { .topic_dropdown_button {
...@@ -191,7 +191,7 @@ body.discussion { ...@@ -191,7 +191,7 @@ body.discussion {
.topic_menu_wrapper { .topic_menu_wrapper {
display: none; display: none;
position: absolute; position: absolute;
top: 40px; top: $baseline*2;
left: 0; left: 0;
z-index: 9999; z-index: 9999;
width: 100%; width: 100%;
...@@ -207,7 +207,7 @@ body.discussion { ...@@ -207,7 +207,7 @@ body.discussion {
a { a {
display: block; display: block;
padding: 10px 15px; padding: $baseline/2 15px;
border-top: 1px solid #5f5f5f; border-top: 1px solid #5f5f5f;
font-size: 14px; font-size: 14px;
font-weight: 700; font-weight: 700;
...@@ -237,7 +237,7 @@ body.discussion { ...@@ -237,7 +237,7 @@ body.discussion {
} }
.topic_menu_search { .topic_menu_search {
padding: 10px; padding: $baseline/2;
border-bottom: 1px solid black; border-bottom: 1px solid black;
} }
...@@ -248,8 +248,8 @@ body.discussion { ...@@ -248,8 +248,8 @@ body.discussion {
@include box-sizing(border-box); @include box-sizing(border-box);
border-radius: 30px; border-radius: 30px;
border: 1px solid #333; border: 1px solid #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset; box-shadow: 0 1px 3px $black-t1 inset;
background: -webkit-linear-gradient(top, #eee, #fff); background: -webkit-linear-gradient(top, #eee, $white);
font-size: 11px; font-size: 11px;
line-height: 16px; line-height: 16px;
color: #333; color: #333;
...@@ -259,7 +259,7 @@ body.discussion { ...@@ -259,7 +259,7 @@ body.discussion {
.right-column { .right-column {
float: left; float: left;
width: 68%; width: 68%;
padding: 40px; padding: $baseline*2;
@include box-sizing(border-box); @include box-sizing(border-box);
} }
...@@ -274,7 +274,7 @@ body.discussion { ...@@ -274,7 +274,7 @@ body.discussion {
.edit-post-form { .edit-post-form {
width: 100%; width: 100%;
margin-bottom: 40px; margin-bottom: $baseline*2;
@include clearfix; @include clearfix;
@include box-sizing(border-box); @include box-sizing(border-box);
...@@ -283,20 +283,20 @@ body.discussion { ...@@ -283,20 +283,20 @@ body.discussion {
} }
.form-row { .form-row {
margin-top: 20px; margin-top: $baseline;
} }
.post-cancel { .post-cancel {
@include white-button; @include white-button;
float: left; float: left;
margin: 10px 0 0 15px; margin: $baseline/2 0 0 15px;
} }
.post-update { .post-update {
@include blue-button; @include blue-button;
float: left; float: left;
height: 37px; height: 37px;
margin-top: 10px; margin-top: $baseline/2;
padding-bottom: 2px; padding-bottom: 2px;
&:hover { &:hover {
...@@ -307,26 +307,26 @@ body.discussion { ...@@ -307,26 +307,26 @@ body.discussion {
.edit-post-title, .edit-post-tags { .edit-post-title, .edit-post-tags {
width: 100%; width: 100%;
height: 40px; height: 40px;
padding: 0 10px; padding: 0 $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border-radius: 3px; border-radius: 3px;
border: 1px solid #aaa; border: 1px solid #aaa;
font-size: 16px; font-size: 16px;
font-family: $sans-serif; font-family: $sans-serif;
color: #333; color: #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15) inset; box-shadow: 0 1px 3px $black-t0 inset;
} }
.tagsinput { .tagsinput {
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #aaa; border: 1px solid #aaa;
border-radius: 3px; border-radius: 3px;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; 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 { span.tag {
margin-bottom: 0; margin-bottom: 0;
...@@ -336,15 +336,15 @@ body.discussion { ...@@ -336,15 +336,15 @@ body.discussion {
.new-post-form { .new-post-form {
width: 100%; width: 100%;
margin-bottom: 20px; margin-bottom: $baseline;
border-radius: 3px; border-radius: 3px;
background: rgba(0, 0, 0, .55); background: rgba(0, 0, 0, .55);
color: #fff; color: $white;
box-shadow: 0 1px 2px rgba(0, 0, 0, .5) inset, 0 1px 0 rgba(255, 255, 255, .5); box-shadow: 0 1px 2px $black-t2 inset, 0 1px 0 $white-t2;
@include clearfix; @include clearfix;
.form-row { .form-row {
margin-bottom: 20px; margin-bottom: $baseline;
} }
.new-post-body .wmd-input { .new-post-body .wmd-input {
...@@ -353,27 +353,27 @@ body.discussion { ...@@ -353,27 +353,27 @@ body.discussion {
width: 100%; width: 100%;
height: 200px; height: 200px;
z-index: 1; z-index: 1;
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; 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 { .tagsinput {
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 3px; border-radius: 3px;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; 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 { span.tag {
margin-bottom: 0; margin-bottom: 0;
...@@ -386,13 +386,13 @@ body.discussion { ...@@ -386,13 +386,13 @@ body.discussion {
width: 100%; width: 100%;
//height: 50px; //height: 50px;
margin-top: -1px; margin-top: -1px;
padding: 25px 20px 10px 20px; padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
background: #e6e6e6; background: #e6e6e6;
color: #333; 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 { .new-post-preview-label {
...@@ -408,14 +408,14 @@ body.discussion { ...@@ -408,14 +408,14 @@ body.discussion {
.new-post-tags { .new-post-tags {
width: 100%; width: 100%;
height: 40px; height: 40px;
padding: 0 10px; padding: 0 $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border-radius: 3px; border-radius: 3px;
border: 1px solid #333; border: 1px solid #333;
font-size: 16px; font-size: 16px;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
color: #333; 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 { .new-post-title {
...@@ -426,7 +426,7 @@ body.discussion { ...@@ -426,7 +426,7 @@ body.discussion {
@include blue-button; @include blue-button;
float: left; float: left;
height: 37px; height: 37px;
margin-top: 10px; margin-top: $baseline/2;
padding-bottom: 2px; padding-bottom: 2px;
border-color: #333; border-color: #333;
...@@ -439,17 +439,17 @@ body.discussion { ...@@ -439,17 +439,17 @@ body.discussion {
@include white-button; @include white-button;
border-color: #444; border-color: #444;
float: left; float: left;
margin: 10px 0 0 15px; margin: $baseline/2 0 0 15px;
} }
.options { .options {
margin-top: 40px; margin-top: $baseline*2;
label { label {
display: inline; display: inline;
margin-left: 8px; margin-left: 8px;
font-size: 15px; font-size: 15px;
color: #fff; color: $white;
text-shadow: none; text-shadow: none;
} }
} }
...@@ -458,12 +458,12 @@ body.discussion { ...@@ -458,12 +458,12 @@ body.discussion {
.thread-tags { .thread-tags {
margin-top: 20px; margin-top: $baseline;
} }
.thread-tag { .thread-tag {
margin-right: 5px; margin-right: 5px;
padding: 3px 10px 6px; padding: 3px $baseline/2 6px;
border-radius: 3px; border-radius: 3px;
color: #333; color: #333;
background: #c5eeff; background: #c5eeff;
...@@ -473,7 +473,7 @@ body.discussion { ...@@ -473,7 +473,7 @@ body.discussion {
.thread-title { .thread-title {
display: block; display: block;
margin-bottom: 20px; margin-bottom: $baseline;
font-size: 21px; font-size: 21px;
color: #333; color: #333;
font-weight: 700; font-weight: 700;
...@@ -518,7 +518,7 @@ body.discussion { ...@@ -518,7 +518,7 @@ body.discussion {
.sidebar-toggle-moderator-button { .sidebar-toggle-moderator-button {
@include blue-button; @include blue-button;
text-align: center; text-align: center;
margin-top: 20px; margin-top: $baseline;
} }
} }
...@@ -554,7 +554,7 @@ body.discussion { ...@@ -554,7 +554,7 @@ body.discussion {
.wmd-preview { .wmd-preview {
position: relative; position: relative;
font-family: $sans-serif; font-family: $sans-serif;
padding: 25px 20px 10px 20px; padding: 25px $baseline $baseline/2 $baseline;
margin-bottom: 5px; margin-bottom: 5px;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #c8c8c8; border: 1px solid #c8c8c8;
...@@ -583,7 +583,7 @@ body.discussion { ...@@ -583,7 +583,7 @@ body.discussion {
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
margin-bottom: 5px; margin-bottom: 5px;
margin-top: 10px; margin-top: $baseline/2;
padding: 0px; padding: 0px;
height: 20px; height: 20px;
overflow: hidden; overflow: hidden;
...@@ -638,11 +638,11 @@ body.discussion { ...@@ -638,11 +638,11 @@ body.discussion {
.wmd-prompt-dialog { .wmd-prompt-dialog {
@extend .modal; @extend .modal;
background: #fff; background: $white;
} }
.wmd-prompt-dialog { .wmd-prompt-dialog {
padding: 20px; padding: $baseline;
> div { > div {
font-size: 0.8em; font-size: 0.8em;
...@@ -734,8 +734,6 @@ body.discussion { ...@@ -734,8 +734,6 @@ body.discussion {
color: $gray-l1; color: $gray-l1;
font-size: 28px; font-size: 28px;
z-index: 100; z-index: 100;
width: 25px;
height: 25px;
opacity: 1; opacity: 1;
@include transition(all .2s ease-out); @include transition(all .2s ease-out);
} }
...@@ -759,7 +757,7 @@ body.discussion { ...@@ -759,7 +757,7 @@ body.discussion {
.browse-topic-drop-btn { .browse-topic-drop-btn {
span { span {
color: #fff; color: $white;
text-shadow: none; text-shadow: none;
} }
...@@ -794,7 +792,7 @@ body.discussion { ...@@ -794,7 +792,7 @@ body.discussion {
} }
.post-search { .post-search {
padding: 0 10px; padding: 0 $baseline/2;
max-width: 1000px; max-width: 1000px;
} }
...@@ -833,7 +831,7 @@ body.discussion { ...@@ -833,7 +831,7 @@ body.discussion {
font-weight: 700; font-weight: 700;
line-height: 58px; line-height: 58px;
color: #333; color: #333;
text-shadow: 0 1px 0 rgba(255, 255, 255, .8); text-shadow: 0 1px 0 $white-t3;
opacity: 0.0; opacity: 0.0;
@include transition(opacity .2s linear 0s); @include transition(opacity .2s linear 0s);
} }
...@@ -885,12 +883,12 @@ body.discussion { ...@@ -885,12 +883,12 @@ body.discussion {
a { a {
display: block; display: block;
padding: 0 20px; padding: 0 $baseline;
border-top: 1px solid #5f5f5f; border-top: 1px solid #5f5f5f;
font-size: 12px; font-size: 12px;
font-weight: 700; font-weight: 700;
line-height: 22px; line-height: 22px;
color: #fff; color: $white;
@include clearfix; @include clearfix;
@include transition(none); @include transition(none);
...@@ -907,7 +905,7 @@ body.discussion { ...@@ -907,7 +905,7 @@ body.discussion {
float: left; float: left;
width: 80%; width: 80%;
margin: 13px 0; margin: 13px 0;
color: #fff; color: $white;
} }
.unread { .unread {
...@@ -937,7 +935,7 @@ body.discussion { ...@@ -937,7 +935,7 @@ body.discussion {
} }
.browse-topic-drop-search { .browse-topic-drop-search {
padding: 10px; padding: $baseline/2;
} }
.browse-topic-drop-search-input { .browse-topic-drop-search-input {
...@@ -948,7 +946,7 @@ body.discussion { ...@@ -948,7 +946,7 @@ body.discussion {
border-radius: 30px; border-radius: 30px;
border: 1px solid #333; border: 1px solid #333;
box-shadow: 0 1px 3px rgba(0, 0, 0, .25) inset; 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; font-size: 11px;
line-height: 16px; line-height: 16px;
color: #333; color: #333;
...@@ -971,8 +969,8 @@ body.discussion { ...@@ -971,8 +969,8 @@ body.discussion {
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #acacac; border: 1px solid #acacac;
border-radius: 30px; border-radius: 30px;
box-shadow: 0 1px 3px rgba(0, 0, 0, .1) inset, 0 1px 0 rgba(255, 255, 255, .5); box-shadow: 0 1px 3px $white-t0 inset, 0 1px 0 $white-t2;
background: url(../images/search-icon.png) no-repeat 7px center #fff; background: url(../images/search-icon.png) no-repeat 7px center $white;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-weight: 400; font-weight: 400;
font-size: 13px; font-size: 13px;
...@@ -1001,7 +999,7 @@ body.discussion { ...@@ -1001,7 +999,7 @@ body.discussion {
border-bottom: 1px solid $gray-l3; border-bottom: 1px solid $gray-l3;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
background-color: $gray-l2; background-color: $gray-l2;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset; box-shadow: 0 1px 0 $white-t1 inset;
span, span,
a { a {
...@@ -1016,7 +1014,7 @@ body.discussion { ...@@ -1016,7 +1014,7 @@ body.discussion {
.sort-label { .sort-label {
display: block; display: block;
float: left; float: left;
margin: 0 10px; margin: 0 $baseline/2;
} }
li { li {
...@@ -1048,7 +1046,7 @@ body.discussion { ...@@ -1048,7 +1046,7 @@ body.discussion {
} }
.group-filter-label { .group-filter-label {
width: 40px; width: 40px;
margin-left:10px; margin-left: $baseline/2;
} }
.group-filter-select { .group-filter-select {
...@@ -1096,11 +1094,11 @@ body.discussion { ...@@ -1096,11 +1094,11 @@ body.discussion {
float: left; float: left;
clear: both; clear: both;
width: 100%; width: 100%;
padding: 0 10px 0 18px; padding: 0 $baseline/2 0 18px;
margin-bottom: 1px; margin-bottom: 1px;
margin-right: -1px; margin-right: -1px;
@include linear-gradient(top, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0));
background-color: #fff; background-color: $white;
@include clearfix; @include clearfix;
&:hover { &:hover {
...@@ -1141,7 +1139,7 @@ body.discussion { ...@@ -1141,7 +1139,7 @@ body.discussion {
display: block; display: block;
float: left; float: left;
width: 70%; width: 70%;
margin: 8px 0 10px; margin: 8px 0 $baseline/2;
font-size: 13px; font-size: 13px;
font-weight: 700; font-weight: 700;
line-height: 1.4; line-height: 1.4;
...@@ -1197,7 +1195,7 @@ body.discussion { ...@@ -1197,7 +1195,7 @@ body.discussion {
.votes-count, .votes-count,
.comments-count { .comments-count {
@include linear-gradient(top, #3994c7, #4da7d3); @include linear-gradient(top, #3994c7, #4da7d3);
color: #fff; color: $white;
&:after { &:after {
background-position: 0 0; background-position: 0 0;
...@@ -1275,7 +1273,7 @@ body.discussion { ...@@ -1275,7 +1273,7 @@ body.discussion {
min-height: 500px; min-height: 500px;
border: 1px solid #aaa; border: 1px solid #aaa;
border-radius: 3px; border-radius: 3px;
background: #fff; background: $white;
box-shadow: 0 1px 2px rgba(0, 0, 0, .05); box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
&.sidebar-fixed { &.sidebar-fixed {
...@@ -1435,15 +1433,15 @@ body.discussion { ...@@ -1435,15 +1433,15 @@ body.discussion {
.discussion-article { .discussion-article {
position: relative; position: relative;
padding: 40px; padding: $baseline*2;
min-height: 468px; min-height: 468px;
a { a {
word-wrap: break-word; word-wrap: break-word;
} }
h1 { h1 {
margin-bottom: 10px; margin-bottom: $baseline/2;
font-size: 28px; font-size: 28px;
font-weight: 700; font-weight: 700;
letter-spacing: 0; letter-spacing: 0;
...@@ -1467,13 +1465,13 @@ body.discussion { ...@@ -1467,13 +1465,13 @@ body.discussion {
} }
.post-context{ .post-context{
margin-top: 20px; margin-top: $baseline;
font-size: 12px; font-size: 12px;
color: #888; color: #888;
} }
p + p { p + p {
margin-top: 20px; margin-top: $baseline;
} }
.dogear { .dogear {
...@@ -1496,13 +1494,13 @@ body.discussion { ...@@ -1496,13 +1494,13 @@ body.discussion {
} }
.discussion-post { .discussion-post {
padding: 10px 20px; padding: $baseline/2 $baseline;
> header .vote-btn { > header .vote-btn {
position: relative; position: relative;
z-index: 100; z-index: 100;
margin-top: 5px; margin-top: 5px;
margin-left: 40px; margin-left: $baseline*2;
} }
...@@ -1534,7 +1532,7 @@ body.discussion { ...@@ -1534,7 +1532,7 @@ body.discussion {
.discussion-post header, .discussion-post header,
.responses li header { .responses li header {
margin-bottom: 20px; margin-bottom: $baseline;
} }
...@@ -1547,7 +1545,7 @@ body.discussion { ...@@ -1547,7 +1545,7 @@ body.discussion {
> li { > li {
position: relative; position: relative;
margin: 0 -10px 30px; margin: 0 -10px 30px;
padding: 26px 30px 20px; padding: 26px 30px $baseline;
border-radius: 3px; border-radius: 3px;
border: 1px solid #b2b2b2; border: 1px solid #b2b2b2;
box-shadow: 0 1px 3px rgba(0, 0, 0, .15); box-shadow: 0 1px 3px rgba(0, 0, 0, .15);
...@@ -1575,7 +1573,7 @@ body.discussion { ...@@ -1575,7 +1573,7 @@ body.discussion {
background: #009fe2; background: #009fe2;
font-size: 9px; font-size: 9px;
font-weight: 700; font-weight: 700;
color: #fff; color: $white;
text-transform: uppercase; text-transform: uppercase;
} }
...@@ -1591,7 +1589,7 @@ body.discussion { ...@@ -1591,7 +1589,7 @@ body.discussion {
background: #449944; background: #449944;
font-size: 9px; font-size: 9px;
font-weight: 700; font-weight: 700;
color: #fff; color: $white;
text-transform: uppercase; text-transform: uppercase;
} }
...@@ -1619,7 +1617,7 @@ body.discussion { ...@@ -1619,7 +1617,7 @@ body.discussion {
padding: 0 8px; padding: 0 8px;
border-radius: 5px; border-radius: 5px;
border: 1px solid #b2b2b2; 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); box-shadow: 0 1px 1px rgba(0, 0, 0, .15);
font-size: 12px; font-size: 12px;
font-weight: 700; font-weight: 700;
...@@ -1641,7 +1639,7 @@ body.discussion { ...@@ -1641,7 +1639,7 @@ body.discussion {
&.is-cast { &.is-cast {
border-color: #379a42; border-color: #379a42;
@include linear-gradient(top, #50cc5e, #3db84b); @include linear-gradient(top, #50cc5e, #3db84b);
color: #fff; color: $white;
text-shadow: 0 1px 0 rgba(0, 0, 0, .3); 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); box-shadow: 0 1px 0 rgba(255, 255, 255, .4) inset, 0 1px 2px rgba(0, 0, 0, .2);
...@@ -1658,10 +1656,10 @@ body.discussion { ...@@ -1658,10 +1656,10 @@ body.discussion {
float: right; float: right;
width: 27px; width: 27px;
height: 27px; height: 27px;
margin-right: 10px; margin-right: $baseline/2;
border-radius: 27px; border-radius: 27px;
border: 1px solid #a0a0a0; 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); box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
.check-icon { .check-icon {
...@@ -1686,13 +1684,13 @@ body.discussion { ...@@ -1686,13 +1684,13 @@ body.discussion {
blockquote { blockquote {
background: #f6f6f6; background: #f6f6f6;
border-radius: 3px; border-radius: 3px;
padding: 5px 10px; padding: 5px $baseline/2;
font-size: 14px; font-size: 14px;
} }
.comments { .comments {
list-style: none; list-style: none;
margin-top: 20px; margin-top: $baseline;
padding: 0; padding: 0;
border-top: 1px solid #ddd; border-top: 1px solid #ddd;
...@@ -1704,7 +1702,7 @@ body.discussion { ...@@ -1704,7 +1702,7 @@ body.discussion {
blockquote { blockquote {
background: #e6e6e6; background: #e6e6e6;
border-radius: 3px; border-radius: 3px;
padding: 5px 10px; padding: 5px $baseline/2;
font-size: 14px; font-size: 14px;
} }
...@@ -1713,8 +1711,8 @@ body.discussion { ...@@ -1713,8 +1711,8 @@ body.discussion {
@include clearfix; @include clearfix;
.comment-form-input { .comment-form-input {
padding: 5px 10px; padding: 5px $baseline/2;
background-color: #fff; background-color: $white;
font-size: 14px; font-size: 14px;
} }
...@@ -1735,7 +1733,7 @@ body.discussion { ...@@ -1735,7 +1733,7 @@ body.discussion {
.response-body { .response-body {
font-size: 13px; font-size: 13px;
padding: 10px 20px; padding: $baseline/2 $baseline;
p + p { p + p {
margin-top: 12px; margin-top: 12px;
...@@ -1743,7 +1741,7 @@ body.discussion { ...@@ -1743,7 +1741,7 @@ body.discussion {
} }
.posted-details { .posted-details {
margin: 0 20px 10px; margin: 0 $baseline $baseline/2;
font-size: 11px; font-size: 11px;
} }
...@@ -1773,7 +1771,7 @@ body.discussion { ...@@ -1773,7 +1771,7 @@ body.discussion {
} }
.comment-form { .comment-form {
padding: 8px 20px; padding: 8px $baseline;
.wmd-input { .wmd-input {
@include transition(all .2s linear 0s); @include transition(all .2s linear 0s);
...@@ -1791,7 +1789,7 @@ body.discussion { ...@@ -1791,7 +1789,7 @@ body.discussion {
.comment-form-input { .comment-form-input {
width: 100%; width: 100%;
height: 31px; height: 31px;
padding: 0 10px; padding: 0 $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #b2b2b2; border: 1px solid #b2b2b2;
border-radius: 3px; border-radius: 3px;
...@@ -1805,7 +1803,7 @@ body.discussion { ...@@ -1805,7 +1803,7 @@ body.discussion {
.moderator-actions { .moderator-actions {
margin: 0; margin: 0;
margin-top: 20px; margin-top: $baseline;
padding: 0; padding: 0;
@include clearfix; @include clearfix;
...@@ -1821,7 +1819,7 @@ body.discussion { ...@@ -1821,7 +1819,7 @@ body.discussion {
padding: 0 12px; padding: 0 12px;
border-radius: 3px; border-radius: 3px;
border: 1px solid #b2b2b2; border: 1px solid #b2b2b2;
@include linear-gradient(top, #fff 35%, #ebebeb); @include linear-gradient(top, $white 35%, #ebebeb);
font-size: 13px; font-size: 13px;
line-height: 24px; line-height: 24px;
color: #737373; color: #737373;
...@@ -1856,20 +1854,20 @@ body.discussion { ...@@ -1856,20 +1854,20 @@ body.discussion {
} }
.new-post-form { .new-post-form {
margin-top: 20px; margin-top: $baseline
@include clearfix; @include clearfix;
} }
.new-post-form .submit { .new-post-form .submit {
@include blue-button; @include blue-button;
float: left; float: left;
margin-top: 10px; margin-top: $baseline/2;
padding-bottom: 2px; padding-bottom: 2px;
} }
.new-post-form .options { .new-post-form .options {
float: right; float: right;
margin-top: 20px; margin-top: $baseline;
font-size: 14px; font-size: 14px;
label { label {
...@@ -1882,7 +1880,7 @@ body.discussion { ...@@ -1882,7 +1880,7 @@ body.discussion {
.discussion-reply-new { .discussion-reply-new {
padding: 20px; padding: $baseline;
@include clearfix; @include clearfix;
@include transition(opacity .2s linear 0s); @include transition(opacity .2s linear 0s);
...@@ -1905,7 +1903,7 @@ body.discussion { ...@@ -1905,7 +1903,7 @@ body.discussion {
} }
.reply-post-control { .reply-post-control {
margin-top: 20px; margin-top: $baseline;
} }
.discussion-submit-post { .discussion-submit-post {
...@@ -1932,8 +1930,8 @@ body.discussion { ...@@ -1932,8 +1930,8 @@ body.discussion {
.discussion-module { .discussion-module {
@extend .discussion-body; @extend .discussion-body;
position: relative; position: relative;
margin: 20px 0; margin: $baseline 0;
padding: 20px; padding: $baseline;
background: #f6f6f6 !important; background: #f6f6f6 !important;
border-radius: 3px; border-radius: 3px;
...@@ -1944,11 +1942,11 @@ body.discussion { ...@@ -1944,11 +1942,11 @@ body.discussion {
} }
.responses { .responses {
margin-top: 40px; margin-top: $baseline*2;
> li { > li {
margin: 0 20px 20px !important; margin: 0 $baseline $baseline !important;
padding: 26px 30px 20px !important; padding: 26px 30px $baseline !important;
} }
} }
...@@ -1989,7 +1987,7 @@ body.discussion { ...@@ -1989,7 +1987,7 @@ body.discussion {
margin-top: 30px; margin-top: 30px;
.threads { .threads {
margin-top: 20px; margin-top: $baseline;
} }
/* Course content p has a default margin-bottom of 1.416em, this is just to reset that */ /* Course content p has a default margin-bottom of 1.416em, this is just to reset that */
...@@ -2002,7 +2000,7 @@ body.discussion { ...@@ -2002,7 +2000,7 @@ body.discussion {
} }
&.expanded { &.expanded {
padding: 20px 0; padding: $baseline 0;
.dogear{ .dogear{
display: block; display: block;
...@@ -2022,14 +2020,14 @@ body.discussion { ...@@ -2022,14 +2020,14 @@ body.discussion {
.discussion-article { .discussion-article {
border: 1px solid #ddd; border: 1px solid #ddd;
border-bottom-width: 0; border-bottom-width: 0;
background: #fff; background: $white;
min-height: 0; min-height: 0;
padding: 10px 10px 15px 10px; padding: $baseline/2 $baseline/2 15px $baseline/2;
box-shadow: 0 1px 0 #ddd; box-shadow: 0 1px 0 #ddd;
@include transition(all .2s linear 0s); @include transition(all .2s linear 0s);
.discussion-post { .discussion-post {
padding: 12px 20px 0 20px; padding: 12px $baseline 0 $baseline;
@include clearfix; @include clearfix;
.inline-comment-count { .inline-comment-count {
...@@ -2080,7 +2078,7 @@ body.discussion { ...@@ -2080,7 +2078,7 @@ body.discussion {
} }
.post-tools { .post-tools {
margin-left: 20px; margin-left: $baseline;
margin-top: 5px; margin-top: 5px;
a { a {
...@@ -2103,7 +2101,7 @@ body.discussion { ...@@ -2103,7 +2101,7 @@ body.discussion {
} }
.responses { .responses {
margin-top: 10px; margin-top: $baseline/2;
header { header {
padding-bottom: 0; padding-bottom: 0;
...@@ -2140,7 +2138,7 @@ body.discussion { ...@@ -2140,7 +2138,7 @@ body.discussion {
.new-post-article { .new-post-article {
display: none; display: none;
margin-top: 20px; margin-top: $baseline;
.inner-wrapper { .inner-wrapper {
max-width: 1180px; max-width: 1180px;
...@@ -2150,17 +2148,17 @@ body.discussion { ...@@ -2150,17 +2148,17 @@ body.discussion {
.new-post-form { .new-post-form {
width: 100%; width: 100%;
margin-bottom: 20px; margin-bottom: $baseline;
padding: 30px; padding: 30px;
border-radius: 3px; border-radius: 3px;
background: rgba(0, 0, 0, .55); background: rgba(0, 0, 0, .55);
color: #fff; color: $white;
box-shadow: none; box-shadow: none;
@include clearfix; @include clearfix;
@include box-sizing(border-box); @include box-sizing(border-box);
.form-row { .form-row {
margin-bottom: 20px; margin-bottom: $baseline;
} }
.new-post-body .wmd-input { .new-post-body .wmd-input {
...@@ -2169,11 +2167,11 @@ body.discussion { ...@@ -2169,11 +2167,11 @@ body.discussion {
width: 100%; width: 100%;
height: 200px; height: 200px;
z-index: 1; z-index: 1;
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; line-height: 1.6;
...@@ -2186,7 +2184,7 @@ body.discussion { ...@@ -2186,7 +2184,7 @@ body.discussion {
width: 100%; width: 100%;
//height: 50px; //height: 50px;
margin-top: -1px; margin-top: -1px;
padding: 25px 20px 10px 20px; padding: 25px $baseline $baseline/2 $baseline;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
...@@ -2208,7 +2206,7 @@ body.discussion { ...@@ -2208,7 +2206,7 @@ body.discussion {
.new-post-tags { .new-post-tags {
width: 100%; width: 100%;
height: 40px; height: 40px;
padding: 0 10px; padding: 0 $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border-radius: 3px; border-radius: 3px;
border: 1px solid #333; border: 1px solid #333;
...@@ -2223,11 +2221,11 @@ body.discussion { ...@@ -2223,11 +2221,11 @@ body.discussion {
} }
.tagsinput { .tagsinput {
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #333; border: 1px solid #333;
border-radius: 3px; border-radius: 3px;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; line-height: 1.6;
...@@ -2242,7 +2240,7 @@ body.discussion { ...@@ -2242,7 +2240,7 @@ body.discussion {
@include blue-button; @include blue-button;
float: left; float: left;
height: 37px; height: 37px;
margin-top: 10px; margin-top: $baseline/2;
padding-bottom: 2px; padding-bottom: 2px;
border-color: #333; border-color: #333;
...@@ -2254,7 +2252,7 @@ body.discussion { ...@@ -2254,7 +2252,7 @@ body.discussion {
.new-post-cancel { .new-post-cancel {
@include white-button; @include white-button;
float: left; float: left;
margin: 10px 0 0 15px; margin: $baseline/2 0 0 15px;
border-color: #444; border-color: #444;
} }
...@@ -2265,18 +2263,18 @@ body.discussion { ...@@ -2265,18 +2263,18 @@ body.discussion {
display: inline; display: inline;
margin-left: 8px; margin-left: 8px;
font-size: 15px; font-size: 15px;
color: #fff; color: $white;
text-shadow: none; text-shadow: none;
} }
} }
} }
.thread-tags { .thread-tags {
margin: 20px 0; margin: $baseline 0;
} }
.thread-tag { .thread-tag {
padding: 3px 10px 6px; padding: 3px $baseline/2 6px;
margin-right: 5px; margin-right: 5px;
border-radius: 3px; border-radius: 3px;
color: #333; color: #333;
...@@ -2287,7 +2285,7 @@ body.discussion { ...@@ -2287,7 +2285,7 @@ body.discussion {
.thread-title { .thread-title {
display: block; display: block;
margin-bottom: 20px; margin-bottom: $baseline;
font-size: 21px; font-size: 21px;
color: #333; color: #333;
font-weight: 700; font-weight: 700;
...@@ -2374,7 +2372,7 @@ body.discussion { ...@@ -2374,7 +2372,7 @@ body.discussion {
.wmd-preview { .wmd-preview {
position: relative; position: relative;
font-family: $sans-serif; font-family: $sans-serif;
padding: 25px 20px 10px 20px; padding: 25px $baseline $baseline/2 $baseline;
margin-bottom: 5px; margin-bottom: 5px;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #c8c8c8; border: 1px solid #c8c8c8;
...@@ -2403,7 +2401,7 @@ body.discussion { ...@@ -2403,7 +2401,7 @@ body.discussion {
margin-left: 5px; margin-left: 5px;
margin-right: 5px; margin-right: 5px;
margin-bottom: 5px; margin-bottom: 5px;
margin-top: 10px; margin-top: $baseline/2;
padding: 0px; padding: 0px;
height: 20px; height: 20px;
overflow: hidden; overflow: hidden;
...@@ -2459,11 +2457,11 @@ body.discussion { ...@@ -2459,11 +2457,11 @@ body.discussion {
.wmd-prompt-dialog { .wmd-prompt-dialog {
@extend .modal; @extend .modal;
background: #fff; background: $white;
} }
.wmd-prompt-dialog { .wmd-prompt-dialog {
padding: 20px; padding: $baseline;
> div { > div {
font-size: 0.8em; font-size: 0.8em;
...@@ -2519,25 +2517,25 @@ body.discussion { ...@@ -2519,25 +2517,25 @@ body.discussion {
} }
.edit-post-form { .edit-post-form {
width: 100%; width: 100%;
margin-bottom: 20px; margin-bottom: $baseline;
@include clearfix; @include clearfix;
@include box-sizing(border-box); @include box-sizing(border-box);
.form-row { .form-row {
margin-top: 20px; margin-top: $baseline;
} }
.post-cancel { .post-cancel {
@include white-button; @include white-button;
float: left; float: left;
margin: 10px 0 0 15px; margin: $baseline/2 0 0 15px;
} }
.post-update { .post-update {
@include blue-button; @include blue-button;
float: left; float: left;
height: 37px; height: 37px;
margin-top: 10px; margin-top: $baseline/2;
padding-bottom: 2px; padding-bottom: 2px;
&:hover { &:hover {
...@@ -2548,7 +2546,7 @@ body.discussion { ...@@ -2548,7 +2546,7 @@ body.discussion {
.edit-post-title, .edit-post-tags { .edit-post-title, .edit-post-tags {
width: 100%; width: 100%;
height: 40px; height: 40px;
padding: 0 10px; padding: 0 $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border-radius: 3px; border-radius: 3px;
border: 1px solid #aaa; border: 1px solid #aaa;
...@@ -2559,11 +2557,11 @@ body.discussion { ...@@ -2559,11 +2557,11 @@ body.discussion {
} }
.tagsinput { .tagsinput {
padding: 10px; padding: $baseline/2;
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid #aaa; border: 1px solid #aaa;
border-radius: 3px; border-radius: 3px;
background: #fff; background: $white;
font-family: 'Monaco', monospace; font-family: 'Monaco', monospace;
font-size: 13px; font-size: 13px;
line-height: 1.6; line-height: 1.6;
...@@ -2576,11 +2574,11 @@ body.discussion { ...@@ -2576,11 +2574,11 @@ body.discussion {
} }
.thread-tags { .thread-tags {
margin: 20px 0; margin: $baseline 0;
} }
.thread-tag { .thread-tag {
padding: 3px 10px 6px; padding: 3px $baseline/2 6px;
margin-right: 5px; margin-right: 5px;
border-radius: 3px; border-radius: 3px;
color: #333; color: #333;
...@@ -2598,7 +2596,7 @@ body.discussion { ...@@ -2598,7 +2596,7 @@ body.discussion {
font-size: 12px; font-size: 12px;
color:#000; color:#000;
font-style: italic; font-style: italic;
background-color:#fff; background-color: $white;
} }
.discussion-pin { .discussion-pin {
...@@ -2606,8 +2604,13 @@ body.discussion { ...@@ -2606,8 +2604,13 @@ body.discussion {
float:right; float:right;
padding-right: 5px; padding-right: 5px;
font-style: italic; font-style: italic;
<<<<<<< HEAD
cursor:pointer; cursor:pointer;
margin-right: 10px; margin-right: 10px;
=======
cursor:pointer;
margin-right: $baseline/2;
>>>>>>> cleaned up margin and padding to use baseline variable
opacity: 0.8; opacity: 0.8;
span { span {
......
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