Skip to content

E
edx-platform
Commit e74dfb61 by David Ormsbee
Options

Merge pull request #1071 from MITx/bugfix/dave/fix_inline_discuss_css 

Fix inline discuss CSS
parents 01c5825d 141ef18a
Showing with 1801 additions and 0 deletions
lms/static/sass/course.scss
...@@ -46,3 +46,18 @@ ...@@ -46,3 +46,18 @@
// instructor // instructor
@import "course/instructor/instructor"; @import "course/instructor/instructor";
// Askbot / Discussion styles
// TODO: Get rid of askbot-specific styles.
@import "course/discussion/askbot-original";
@import "course/discussion/discussion";
@import "course/discussion/sidebar";
@import "course/discussion/questions";
@import "course/discussion/tags";
@import "course/discussion/question-view" ;
@import "course/discussion/answers";
@import "course/discussion/forms";
@import "course/discussion/form-wmd-toolbar";
@import "course/discussion/modals";
@import "course/discussion/profile";
@import "course/discussion/badges";
lms/static/sass/course/discussion/_answers.scss 0 → 100644
// Styles for individual answers
div.answer-controls {
@include box-sizing(border-box);
display: inline-block;
margin: 0 0 15px;
padding-left: flex-grid(1.1);
width: 100%;
div.answer-count {
display: inline-block;
float: left;
h1 {
margin-bottom: 0;
font-size: em(24);
font-weight: 100;
}
}
div.answer-sort {
float: right;
margin-left: flex-gutter();
nav {
float: right;
margin-top: 10px;
a {
&.on span{
font-weight: bold;
}
&:before {
content: '|';
color: #ccc;
font-size: 16px;
}
}
}
}
}
div.answer-block {
@extend div.question-header;
border-top: #ddd 1px solid;
display: inline-block;
float: left;
padding-top: 20px;
width: 100%;
img.answer-img-accept {
margin: 10px 0px 10px 11px;
}
div.answer-container {
@extend div.question-container;
div.answer-content {
@extend div.question-content;
div.answer-body {
@extend div.question-body;
}
}
}
div.meta-bar {
div.answer-actions {
@extend div.question-actions;
}
}
div.answered-by-owner {
p {
font-style: italic;
color: #656565;
}
div.comments-container {
color: #555;
}
}
div.accepted-answer {
p {
color:#000;
}
}
div.deleted {
p {
color: $pink;
}
}
img.answer-img-accept {
opacity: 0.7;
}
}
div.paginator {
@extend div.answer-block;
text-align: center;
padding: 20px 0;
span {
@include border-radius(3px);
background: #eee;
margin: 0 5px;
padding: 4px 10px;
&.curr {
background: none;
color: $pink;
font-weight: bold;
}
&.next, &.prev {
@extend .light-button;
}
a {
color: #555;
text-decoration: none;
border-bottom: none;
}
}
}
div.answer-own {
border-top: 1px solid #eee;
overflow:hidden;
padding-left: flex-grid(1.2);
padding-top: 10px;
}
div.answer-actions {
margin: 0;
padding:8px 0 8px 8px;
text-align: right;
border-top: 1px solid #efefef;
span.sep {
color: $border-color;
}
a {
cursor: pointer;
text-decoration: none;
@extend a:link;
font-size: em(14);
}
}
lms/static/sass/course/discussion/_badges.scss 0 → 100644
// Style for the user badge list (can be accessed by clicking "View all MIT badges" in the badge section of the Askbot user profile
div.badges-intro {
margin: 20px 0;
}
div.badge-intro {
@extend .badges-intro;
.badge1, .badge2, .badge3 {
font-size: 20px;
}
}
div#award-list{
li.username {
font-size: 20px;
margin-bottom: 8px;
}
}
ul.badge-list {
padding-left: 0;
li.badge {
border-bottom: 1px solid #eee;
@extend .clearfix;
list-style: none;
padding: 10px 0;
&:last-child {
border-bottom: 0;
}
div.check {
float:right;
min-width:flex-grid(1,9);
text-align:right;
span {
font-size:19px;
padding-right:5px;
color:green;
}
}
div.badge-name {
float:left;
width:flex-grid(3,9);
span {
font-size: 20px;
}
}
p {
margin: 0;
float:left;
}
}
}
.gold, .badge1 {
color: #ffcc00;
}
.silver, .badge2 {
color: #cccccc;
}
.bronze, .badge3 {
color: #cc9933;
}
div.discussion-wrapper aside {
div.badge-desc {
border-top: 0;
> div {
margin-bottom: 20px;
span {
font-size: 18px;
@include border-radius(10px);
}
}
}
}
lms/static/sass/course/discussion/_discussion.scss 0 → 100644
// Generic layout styles for the discussion forums
body.askbot {
section.container {
div.discussion-wrapper {
@extend .table-wrapper;
display: table;
div.discussion-content {
@include box-sizing(border-box);
display: table-cell;
min-width: 650px;
padding: 40px;
width: flex-grid(9) + flex-gutter();
a.tabula-rasa, .tabula-rasa{
@extend .light-button;
@include border-radius(5px);
display: block;
margin: 10px auto;
padding: 20px;
text-align: center;
width: flex-grid(5);
text-decoration: none;
color: #888;
font-weight: bold;
&:first-child {
margin-top: 70px;
}
&:last-child {
margin-bottom: 70px;
}
}
}
}
}
}
// Autocomplete
.acInput {
width: 200px;
}
.acResults {
background-color: #fff;
border: 1px solid #ababab;
overflow: hidden;
padding: 0px;
@include box-shadow(0 2px 2px #bbb);
ul {
list-style-position: outside;
list-style: none;
margin: 0;
padding: 0;
width: 100%;
}
li {
cursor: pointer;
display: block;
font: menu;
margin: 0px;
overflow: hidden;
padding: 5px 10px;
text-align: left;
border-top: 1px solid #eee;
width: 100%;
}
}
.acLoading {
background : url('../default/media/images/indicator.gif') right center no-repeat;
}
.acSelect {
background-color: $pink;
color: #fff;
}
lms/static/sass/course/discussion/_form-wmd-toolbar.scss 0 → 100644
// Styles for the WYSIWYG question/answer editor
.wmd-panel
{
}
#wmd-button-bar {
border: 1px solid #ddd;
height:36px;
float:left;
width:99%;
}
#wmd-input {
height: 500px;
background-color: Gainsboro;
border: 1px solid DarkGray;
margin-top: -20px;
}
#wmd-preview {
background-color: LightSkyBlue;
}
#wmd-output {
background-color: Pink;
}
#wmd-button-row {
position: relative;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 0px;
margin-top: 10px;
padding: 0px;
height: 20px;
}
.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;
margin-left: 5px;
margin-right: 5px;
position: absolute;
background-image: url(../images/askbot/wmd-buttons.png);
background-repeat: no-repeat;
background-position: 0px 0px;
display: inline-block;
list-style: none;
}
.wmd-button > a {
width: 20px;
height: 20px;
margin-left: 5px;
margin-right: 5px;
position: absolute;
display: inline-block;
}
/* sprite button slicing style information */
#wmd-bold-button {left: 0px; background-position: 0px 0;}
#wmd-italic-button {left: 25px; background-position: -20px 0;}
#wmd-spacer1 {left: 50px;}
#wmd-link-button {left: 75px; background-position: -40px 0;}
#wmd-quote-button {left: 100px; background-position: -60px 0;}
#wmd-code-button {left: 125px; background-position: -80px 0;}
#wmd-image-button {left: 150px; background-position: -100px 0;}
#wmd-attachment-button {left: 175px; background-position: -120px 0;}
#wmd-spacer2 {left: 200px;}
#wmd-olist-button {left: 225px; background-position: -140px 0;}
#wmd-ulist-button {left: 250px; background-position: -160px 0;}
#wmd-heading-button {left: 275px; background-position: -180px 0;}
#wmd-hr-button {left: 300px; background-position: -200px 0;}
#wmd-spacer3 {left: 325px;}
#wmd-undo-button {left: 350px; background-position: -220px 0;}
#wmd-redo-button {left: 375px; background-position: -240px 0;}
#wmd-help-button {right: 0px; background-position: -260px 0;}
.wmd-prompt-background
{
background-color: Black;
}
.wmd-prompt-dialog
{
border: 1px solid #999999;
background-color: #F5F5F5;
}
.wmd-prompt-dialog > div {
font-size: 1em;
font-family: arial, helvetica, sans-serif;
}
.wmd-prompt-dialog > form > input[type="text"] {
border: 1px solid #999999;
color: black;
}
.wmd-prompt-dialog > form > input[type="button"]{
border: 1px solid #888888;
font-family: trebuchet MS, helvetica, sans-serif;
font-size: 1em;
font-weight: bold;
}
lms/static/sass/course/discussion/_forms.scss 0 → 100644
// Styles for different forms in the system
form.answer-form {
@include box-sizing(border-box);
border-top: 1px solid #ddd;
overflow: hidden;
padding-left: flex-grid(1.1);
padding-top: lh();
p {
margin-bottom: lh();
}
textarea {
@include box-sizing(border-box);
margin-top: 15px;
resize: vertical;
width: 99%;
&#editor {
min-height: em(120);
}
}
div.checkbox {
margin-bottom: lh();
label {
display: inline;
}
}
div.form-item {
margin: 15px 0;
label {
display: block;
margin-bottom: -5px;
}
.title-desc {
@include box-sizing(border-box);
@include border-radius(4px);
background: #333;
color: #fff;
display: none;
font-size: 13px;
padding: 7px 14px;
-webkit-font-smoothing: antialiased;
}
&:hover {
.title-desc {
display: inline-block;
position: absolute;
margin-left: 10px;
z-index: 1;
width: 200px;
&:before {
border-color: transparent #333 transparent transparent;
border-style:solid;
border-width:12px 12px 12px 0;
content:"";
height:0;
left:-10px;
position:absolute;
top:1;
width:0;
}
}
}
}
span.form-error, label.form-error {
color: #990000;
display: inline-block;
font-size: 90%;
font-weight: bold;
padding: 10px 0;
}
div.preview-toggle{
padding: 15px 0;
width: auto;
a {
@extend .light-button;
}
}
.wmd-preview {
margin: 3px 0 15px 0;
padding: 10px;
background-color: #F5F5F5;
min-height: 20px;
overflow: auto;
font-size: 13px;
font-family: Arial;
p {
margin-bottom: 14px;
line-height: 1.4;
font-size: 14px;
}
blockquote {
margin-left: 2.5%;
padding-left: 1.5%;
border-left: 1px dashed #ddd;
color: $pink;
}
ul, ol, pre {
margin-left: 3%;
margin-bottom: 20px;
}
pre {
background-color: #eee;
}
blockquote {
background-color: #eee;
}
}
}
input.after-editor {
margin-bottom: 20px;
margin-right: 10px;
}
form.question-form {
@extend .answer-form;
border: none;
padding: 15px 0 0 0;
input[type="text"] {
@include box-sizing(border-box);
width: flex-grid(6);
}
input[type="checkbox"] {
margin-top: 10px;
}
input[value="Cancel"] {
@extend .light-button;
float: right;
}
div#question-list {
background-color: rgba(255,255,255,0.95);
@include box-sizing(border-box);
margin-top: -15px;
max-width: 505px;
min-width: 300px;
overflow: hidden;
padding-left: 5px;
position: absolute;
width: 35%;
z-index: 9999;
h2 {
text-transform: none;
padding: 8px 0;
border-bottom: 1px solid #eee;
margin: 0;
span {
background: #eee;
color: #555;
padding: 2px 5px;
@include border-radius(2px);
margin-right: 5px;
}
}
}
}
lms/static/sass/course/discussion/_modals.scss 0 → 100644
// Style for modal boxes that pop up to notify the user of various events
.vote-notification {
background-color: darken(#666, 7%);
@include border-radius(4px);
@include box-shadow(0px 2px 9px #aaa);
color: white;
cursor: pointer;
display: none;
font-size: 14px;
font-weight: normal;
padding-bottom: 10px;
position: absolute;
text-align: center;
z-index: 1;
h3 {
background: #666;
padding: 10px 10px 10px 10px;
font-size: 13px;
margin-bottom: 5px;
border-bottom: darken(#666, 10%) 1px solid;
@include box-shadow(0 1px 0 lighten(#666, 10%));
color: #fff;
font-weight: normal;
@include border-radius(4px 4px 0 0);
}
a {
color: #fb7321;
text-decoration: underline;
font-weight: bold;
}
}
lms/static/sass/course/discussion/_profile.scss 0 → 100644
// Style for the user profile view
body.user-profile-page {
section.questions {
h1 {
margin: 0;
}
}
ul.sub-info {
margin-top: lh();
list-style: none;
padding: 0;
> li {
display: table-cell;
padding: (flex-gutter(9)/2);
border-right: 1px dashed #efefef;
@include box-sizing(border-box);
&:first-child {
padding-left: 0;
}
&:last-child {
border-right: 0;
padding-right: 0;
}
&.votes-badges {
width: flex-grid(2,9);
p {
margin-top: 15px;
}
}
&.answer-list {
width: flex-grid(4, 9);
}
&.tags-list {
width: flex-grid(3,9);
}
h2 {
margin-bottom: 30px;
margin-top: 0;
}
span.tag-number {
display: none;
}
}
ul {
list-style: none;
padding: 0;
&.user-stats-table {
list-style: none;
li {
padding: 10px 0 15px;
border-top: 1px solid #eee;
}
}
&.vote-buttons {
list-style: none;
margin-bottom: 30px;
li {
background-position: 10px -10px;
background-repeat: no-repeat;
display: inline-block;
padding: 2px 10px 2px 40px;
margin-bottom: lh(.5);
border: 1px solid lighten($border-color, 10%);
&.up {
background-image: url(../images/askbot/vote-arrow-up.png);
margin-right: 6px;
}
&.down {
background-image: url(../images/askbot/vote-arrow-down.png);
}
}
}
&.badges {
@include inline-block();
padding: 0;
margin: 0;
a {
background-color: #e3e3e3;
border: 0;
@include border-radius(4px);
color: #292309;
display: block;
font-size: 12px;
padding: 10px;
margin-bottom: 10px;
text-shadow: 0 1px 0 #fff;
text-transform: uppercase;
text-decoration: none;
&:hover {
background-color: #cdcdcd;
}
}
}
}
}
}
lms/static/sass/course/discussion/_question-view.scss 0 → 100644
// Styles for the single question view
div.question-header {
@include clearfix();
div.official-stamp {
background: $pink;
color: #fff;
font-size: 12px;
margin-left: -1px;
margin-top: 10px;
padding: 2px 5px;
text-align: center;
}
div.vote-buttons {
display: inline-block;
float: left;
margin-right: flex-gutter(9);
width: flex-grid(0.7,9);
ul {
padding: 0;
margin: 0;
li {
background-repeat: no-repeat;
color: #999;
font-size: em(20);
font-weight: bold;
list-style: none;
text-align: center;
&.question-img-upvote, &.answer-img-upvote {
background-image: url(../images/askbot/vote-arrow-up.png);
background-position: center 0;
cursor: pointer;
height: 12px;
margin-bottom: lh(.5);
&:hover, &.on {
background-image: url(../images/askbot/vote-arrow-up.png);
background-position: center -22px;
}
}
&.question-img-downvote, &.answer-img-downvote {
cursor: pointer;
background-image: url(../images/askbot/vote-arrow-down.png);
background-position: center 0;
height: 12px;
margin-top: lh(.5);
&:hover, &.on {
background-image: url(../images/askbot/vote-arrow-down.png);
background-position: center -22px;
}
}
}
}
}
div.question-container {
display: inline-block;
float: left;
width: flex-grid(8.3,9);
h1 {
margin-top: 0;
font-weight: 100;
line-height: 1.1em;
a {
font-weight: 100;
line-height: 1.1em;
}
}
div.meta-bar {
border-bottom: 1px solid #eee;
display: block;
margin: lh(.5) 0 lh();
overflow: hidden;
padding: 5px 0 10px;
div.tag-list {
display: inline-block;
float:left;
width: flex-grid(4,8);
margin-right: flex-gutter(8);
}
div.question-actions {
display: inline-block;
float:left;
text-align: right;
width: flex-grid(4,8);
a {
@extend a:link;
cursor: pointer;
}
span.sep {
color: #ccc;
}
}
}
div.question-content {
overflow: hidden;
div.question-body {
display: inline-block;
float: left;
margin-right: flex-gutter(8);
width: flex-grid(6.2,8);
blockquote {
margin-left: 2.5%;
padding-left: 1.5%;
border-left: 1px dashed #ddd;
color: $pink;
}
ul, ol, pre {
margin-left: 6%;
margin-bottom: 20px;
}
}
div.post-update-container {
display: inline-block;
float: left;
width: 20%;
border-left: 1px dashed #ddd;
a {
border-bottom: none;
font-style: normal;
}
div.post-update-info {
@include box-sizing(border-box);
padding: 10px;
margin-bottom: 10px;
&:last-child {
margin-bottom: 0;
}
&.revision {
text-align: center;
// background:lighten($cream, 7%);
a {
color: black;
}
}
div.change-date {
font-size: em(14);
margin-bottom: 2px;
}
div.user-meta {
display: inline-block;
span.username {
font-size: 20px;
margin-right: 5px;
}
span.user-badges {
}
}
}
}
}
div.comments-container {
@include box-sizing(border-box);
display: inline-block;
padding: 0 0 3% 0;
width: 100%;
margin-top: lh(2);
div.comments-content {
border-top: 1px solid lighten($border-color, 10%);
.block {
border-top: 1px solid lighten($border-color, 10%);
padding: 15px;
display: block;
&:first-child {
border-top: 0;
}
&.official {
padding-top: 10px;
span.official-comment {
background: $pink;
color: #fff;
display: block;
font-size: em(12);
margin: 0 0 10px -5%;
padding:2px 5px 2px 5%;
text-align: left;
width:100px;
}
}
}
form.post-comments {
padding: 15px;
button:first-of-type {
@extend .blue-button;
}
button:last-child {
margin-left: 10px;
float: right;
}
}
div.comment {
&:first-child {
border-top: 0;
}
&:last-child {
margin-bottom: 20px;
}
aside.comment-controls {
background: none;
border: none;
@include box-shadow(none);
display: inline-block;
padding:0 2% 0 0;
text-align: center;
width: 5%;
div {
background: none;
opacity: 0.6;
&:hover {
opacity: 1;
}
}
div.comment-votes {
width: 16px;
a.upvote {
background: url(../images/askbot/comment-vote-up.png) no-repeat 2px;
cursor: pointer;
color: green;
display: block;
margin-bottom: 6px;
margin-top: 5px;
overflow: hidden;
text-decoration: none;
text-indent: -9999px;
width: 20px;
}
a.upvoted {
@include border-radius(3px);
background: #D1E3A8;
color: green;
font-weight: bold;
margin-top: 10px;
padding: 2px;
text-indent: 0px;
}
}
hr {
margin: 0;
}
div.comment-delete {
@extend a:link;
cursor: pointer;
}
div.comment-edit {
@include transform(rotate(50deg));
cursor: pointer;
a.edit-icon {
color: #555;
text-decoration: none;
}
}
}
div.comment-body {
display: inline-block;
width: 95%;
&#full-width {
width: 100%;
}
div.comment-meta {
text-align: right;
margin-top: lh(.5);
a.author {
font-weight: bold;
}
a.edit {
padding: 2px 10px;
}
}
}
}
}
#edit-comment-form {
margin: 10px 0;
min-height: 100px;
width: 99%;
resize: vertical;
}
.counter {
color: #888;
display: none;
float: right;
margin-top: 5px;
text-align: right;
}
div.controls {
text-align: right;
a {
display: inline-block;
margin: 10px 10px 10px 0;
}
}
}
}
}
div.question-status {
background: $pink;
clear:both;
color: #fff;
display: block;
padding: 10px 0 10px 7.5%;
h3 {
font-weight: normal;
}
a {
color: #eee;
}
}
div.share-question {
padding: 10px 0 10px 7.5%;
p {
padding: 0;
margin: 0;
}
}
lms/static/sass/course/discussion/_questions.scss 0 → 100644
// Styles for the default question list view
div.question-list-header {
@extend h1.top-header;
display: block;
margin-bottom: 0px;
padding-bottom: lh(.5);
overflow: hidden;
width: flex-grid(9,9);
h1 {
margin: 0;
font-size: 1em;
font-weight: 100;
padding-bottom: lh(.5);
> a.light-button {
float: right;
font-size: em(14, 24);
letter-spacing: 0;
font-weight: 400;
}
}
section.question-list-meta {
display: block;
overflow: hidden;
width: 100%;
div {
display: inline-block;
float: left;
}
h1 {
margin: 0;
}
span.label {
color: #555;
}
div.question-list-title {
margin-right: flex-gutter();
h1 {
margin-top: 0;
}
}
div.question-sort {
float: right;
margin-left: flex-gutter();
margin-top: 6px;
nav {
@extend .action-link;
float: right;
font-size: em(16, 24);
a {
font-size: 1em;
&.on span{
font-weight: bold;
}
&:before {
content: '|';
color: #ccc;
font-size: 16px;
}
}
}
}
}
section.question-tags-list {
display: block;
min-height: 26px;
padding-top:15px;
width: 100%;
div {
display: inline-block;
float: left;
}
div.back {
margin-right: 10px;
margin-top: 4px;
a {
color: #555;
font-size: em(14, 24);
}
}
div.tags-list {
}
ul.tags {
span, div {
line-height: 1em;
margin-left: 6px;
cursor: pointer;
}
}
}
}
ul.question-list, div#question-list {
width: flex-grid(9,9);
padding-left: 0;
margin: 0;
li.single-question {
border-bottom: 1px solid #eee;
list-style: none;
padding: lh() 0;
width: 100%;
&:first-child {
border-top: 0;
}
div {
display: inline-block;
&.question-body {
@include box-sizing(border-box);
margin-right: flex-gutter();
width: flex-grid(5,9);
h2 {
font-size: em(20);
font-weight: bold;
letter-spacing: 0;
margin: 0 0 lh() 0;
text-transform: none;
line-height: lh();
a {
line-height: lh();
}
}
p.excerpt {
color: #777;
}
div.user-info {
display: inline-block;
vertical-align: top;
margin: lh() 0 0 0;
line-height: lh();
span.relative-time {
font-weight: normal;
line-height: lh();
}
}
ul.tags {
display: inline-block;
margin: lh() 0 0 0;
padding: 0;
}
}
&.question-meta {
float: right;
width: flex-grid(3,9);
ul {
@include clearfix;
margin: 0;
padding: 0;
list-style: none;
li {
border: 1px solid lighten($border-color, 10%);
@include box-sizing(border-box);
@include box-shadow(0 1px 0 #fff);
height:60px;
float: left;
margin-right: flex-gutter(3);
width: flex-grid(1,3);
&:last-child {
margin-right: 0px;
}
&:hover {
span, div {
color: #555;
}
}
&.answers {
&.accepted {
border-color: lighten($border-color, 10%);
span, div {
color: darken(#c4dfbe, 35%);
}
}
&.no-answers {
span, div {
color: $pink;
}
}
}
span, div {
@include box-sizing(border-box);
color: #888;
display: block;
text-align: center;
}
span {
font-size: 16px;
font-weight: bold;
height: 35px;
padding-top: 15px;
vertical-align: middle;
}
div {
height: 25px;
font-size: 12px;
}
}
}
}
}
}
div.post-own-question {
padding: 11px;
margin-top: 10px;
color: #888;
text-align: center;
a {
font-weight: bold;
@extend .light-button;
padding: 20px;
display: block;
margin: 10px auto;
text-align: center;
width: flex-grid(5);
}
}
}
.search-result-summary {
}
lms/static/sass/course/discussion/_sidebar.scss 0 → 100644
// Styles for the Askbot sidebar
div.discussion-wrapper aside {
@extend .sidebar;
border-left: 1px solid #ccc;
border-right: 0;
width: flex-grid(3);
border-radius: 0 3px 3px 0;
&:after {
left: -1px;
right: auto;
}
&.main-sidebar {
min-width:200px;
}
h1 {
margin-bottom: 0;
}
h2 {
color: #3C3C3C;
font-size: 1em;
font-style: normal;
font-weight: bold;
margin-bottom: 1em;
&.first {
margin-top: 0px;
}
}
h3 {
border-bottom: 0;
box-shadow: none;
}
div.inputs {
input[type="submit"] {
width: 27%;
float: right;
text-align: center;
padding: 4px 0;
text-transform: capitalize;
}
input[type="text"] {
width: 62%;
}
}
div.box {
display: block;
padding: 18px 26px;
border-top: 1px solid lighten($border-color, 10%);
&:first-child {
border-top: 0;
}
ul#related-tags {
position: relative;
left: -10px;
li {
border-bottom: 0;
background: #ddd;
padding: 6px 10px 6px 5px;
a {
padding: 0;
line-height: 12px;
&:hover {
background: transparent;
}
}
}
}
&.contributors {
a {
@include border-radius(3px);
border: 1px solid #aaa;
cursor: pointer;
display: inline-block;
margin-right: 6px;
position: relative;
&:before {
@include border-radius(3px);
@include box-shadow(inset 0 0 1px 1px rgba(255,255,255,.4));
top: 1px; left: 1px; bottom: 1px; right: 1px;
content: '';
position: absolute;
}
}
}
&.tag-selector {
ul {
margin-bottom: 10px;
display: block;
}
}
}
div.search-box {
margin-top: lh(.5);
input {
@include box-sizing(border-box);
display: inline;
}
input[type='submit'] {
background: url(../images/askbot/search-icon.png) no-repeat center;
border: 0;
@include box-shadow(none);
margin-left: 3px;
opacity: 0.5;
padding: 6px 0 0;
position: absolute;
text-indent: -9999px;
width: 24px;
&:hover {
opacity: 0.9;
}
&:focus {
opacity: 1;
}
}
input#keywords {
padding-left: 30px;
padding-right: 30px;
width: 100%;
}
input#clear {
background: none;
border: none;
@include border-radius(0);
@include box-shadow(none);
color: #999;
display: inline;
font-size: 12px;
font-weight: bold;
height: 19px;
line-height: 1em;
margin: {
left: -25px;
top: 8px;
}
padding: 2px 5px;
text-shadow: none;
}
}
div#tagSelector {
ul {
margin: 0;
}
div.inputs {
margin-bottom: lh();
}
div#displayTagFilterControl {
p.choice {
@include inline-block();
margin-right: lh(.5);
margin-top: 0;
}
}
label {
font-style: normal;
font-weight: 400;
}
}
// Question view specific
div.follow-buttons {
margin-top: 20px;
display: block;
a.button {
@include box-sizing(border-box);
display: block;
text-align: center;
width: 100%;
}
}
div.question-stats {
border-top: 0;
ul {
color: #777;
list-style: none;
li {
padding: 7px 0 0;
border: 0;
&:last-child {
@include box-shadow(none);
border: 0;
}
strong {
float: right;
padding-right: 10px;
}
}
}
}
div.user-info, div.user-stats {
@extend div.question-stats;
overflow: hidden;
div {
float: left;
display: block;
}
div.karma {
border: 1px solid $border-color;
@include box-sizing(border-box);
padding: lh(.4) 0;
text-align: center;
width: flex-grid(1, 3);
float: right;
p {
text-align: center;
strong {
display: block;
font-style: 20px;
}
}
}
div.meta {
width: flex-grid(2,3);
padding-right: flex-gutter(3)*0.5;
@include box-sizing(border-box);
h2 {
border: 0;
@include box-shadow(none);
margin: 0 0 8px 0;
padding: 0;
}
p {
color: #777;
font-size: 14px;
}
}
}
div.user-stats {
overflow: visible;
ul {
h2 {
margin:0 (-(lh())) 5px (-(lh()));
padding: lh(.5) lh();
}
}
}
div.question-tips, div.markdown {
ul,
ol {
margin: 0;
padding: 0;
li {
border-bottom: 0;
line-height: lh();
margin-bottom: em(8);
}
}
}
div.view-profile {
border-top: 0;
padding-top: 0;
a {
@extend .gray-button;
@include box-sizing(border-box);
display: block;
text-align: center;
width: 100%;
margin-top: lh(.5);
&:first-child {
margin-top: 0;
}
span {
font-weight: bold;
}
}
}
}
lms/static/sass/course/discussion/_tags.scss 0 → 100644
// Styles for the question tags
ul.tags {
list-style: none;
display: inline;
padding: 0;
li, a {
position: relative;
}
li {
background: #ddd;
color: #555;
display: inline-block;
font-size: 12px;
margin-bottom: 5px;
margin-left: 15px;
padding: 6px 10px 6px 5px;
&:before {
border-color:transparent #ddd transparent transparent;
border-style:solid;
border-width:12px 10px 12px 0;
content:"";
height:0;
left:-10px;
position:absolute;
top:0;
width:0;
}
a {
color: #555;
text-decoration: none;
border-bottom: none;
font-style: normal;
}
}
}
span.tag-number {
display: none;
}
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