Somewhat compacted the embedded thread view, but it probably needs a more thorough redesign.
This commit is contained in:
@@ -60,7 +60,7 @@
|
|||||||
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 rgba(0, 0, 0, 0.15) inset;
|
||||||
}
|
}
|
||||||
@@ -82,7 +82,7 @@
|
|||||||
|
|
||||||
.wmd-button-bar {
|
.wmd-button-bar {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: Silver;
|
background-color: Silver;
|
||||||
}
|
}
|
||||||
|
|
||||||
.wmd-input {
|
.wmd-input {
|
||||||
@@ -129,25 +129,25 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.wmd-button-row {
|
.wmd-button-row {
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
margin-right: 5px;
|
margin-right: 5px;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
margin-top: 10px;
|
margin-top: 10px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@include transition(all, .2s, easeOut);
|
@include transition(all, .2s, easeOut);
|
||||||
}
|
}
|
||||||
|
|
||||||
.wmd-spacer {
|
.wmd-spacer {
|
||||||
width: 1px;
|
width: 1px;
|
||||||
height: 20px;
|
height: 20px;
|
||||||
margin-left: 14px;
|
margin-left: 14px;
|
||||||
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
background-color: Silver;
|
background-color: Silver;
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -301,7 +301,7 @@ body.discussion {
|
|||||||
border-top: 1px solid #5f5f5f;
|
border-top: 1px solid #5f5f5f;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
color: #eee;
|
color: #eee;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #666;
|
background-color: #666;
|
||||||
@@ -332,7 +332,7 @@ body.discussion {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
padding: 0 15px;
|
padding: 0 15px;
|
||||||
box-sizing: border-box;
|
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 rgba(0, 0, 0, .25) inset;
|
||||||
@@ -392,7 +392,7 @@ body.discussion {
|
|||||||
box-sizing: border-box;
|
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 rgba(0, 0, 0, 0.3) inset;
|
||||||
}
|
}
|
||||||
@@ -400,10 +400,10 @@ body.discussion {
|
|||||||
.new-post-preview-label {
|
.new-post-preview-label {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 4px;
|
top: 4px;
|
||||||
left: 4px;
|
left: 4px;
|
||||||
font-size: 11px;
|
font-size: 11px;
|
||||||
color: #aaa;
|
color: #aaa;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
.new-post-title,
|
.new-post-title,
|
||||||
@@ -468,7 +468,7 @@ body.discussion {
|
|||||||
color: #333;
|
color: #333;
|
||||||
background: #c5eeff;
|
background: #c5eeff;
|
||||||
border: 1px solid #90c4d7;
|
border: 1px solid #90c4d7;
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.thread-title {
|
.thread-title {
|
||||||
@@ -478,7 +478,7 @@ body.discussion {
|
|||||||
color: #333;
|
color: #333;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -567,7 +567,7 @@ body.discussion {
|
|||||||
height: 60px;
|
height: 60px;
|
||||||
border-bottom: 1px solid #a3a3a3;
|
border-bottom: 1px solid #a3a3a3;
|
||||||
border-radius: 3px 0 0 0;
|
border-radius: 3px 0 0 0;
|
||||||
|
|
||||||
|
|
||||||
.browse,
|
.browse,
|
||||||
.search {
|
.search {
|
||||||
@@ -762,7 +762,7 @@ body.discussion {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 30px;
|
height: 30px;
|
||||||
padding: 0 15px;
|
padding: 0 15px;
|
||||||
box-sizing: border-box;
|
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 rgba(0, 0, 0, .25) inset;
|
||||||
@@ -929,7 +929,7 @@ body.discussion {
|
|||||||
box-shadow: 0 1px 0 #4697c1, 0 -1px 0 #4697c1;
|
box-shadow: 0 1px 0 #4697c1, 0 -1px 0 #4697c1;
|
||||||
|
|
||||||
.title {
|
.title {
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.votes-count,
|
.votes-count,
|
||||||
@@ -1077,7 +1077,7 @@ body.discussion {
|
|||||||
.responses {
|
.responses {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
margin-top: 40px;
|
margin-top: 40px;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
||||||
> li {
|
> li {
|
||||||
position: relative;
|
position: relative;
|
||||||
@@ -1230,8 +1230,8 @@ body.discussion {
|
|||||||
background: #009FE2;
|
background: #009FE2;
|
||||||
font-size: 9px;
|
font-size: 9px;
|
||||||
font-weight: 700;
|
font-weight: 700;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
color: white;
|
color: white;
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -1386,7 +1386,7 @@ body.discussion {
|
|||||||
}
|
}
|
||||||
|
|
||||||
#wmd-input {
|
#wmd-input {
|
||||||
@include discussion-wmd-input;
|
@include discussion-wmd-input;
|
||||||
}
|
}
|
||||||
|
|
||||||
#wmd-preview {
|
#wmd-preview {
|
||||||
@@ -1418,7 +1418,53 @@ body.discussion {
|
|||||||
|
|
||||||
/* For some reason I have to do this to get the SCSS to compile, can't stick it under the above .discussion-module */
|
/* For some reason I have to do this to get the SCSS to compile, can't stick it under the above .discussion-module */
|
||||||
.discussion-module {
|
.discussion-module {
|
||||||
.discussion-reply-new {
|
section.discussion {
|
||||||
display:none
|
/* Course content p has a default margin-bottom of 1.416, this is just to reset that */
|
||||||
|
|
||||||
|
.discussion-thread {
|
||||||
|
padding: 0.5em;
|
||||||
|
|
||||||
|
p {
|
||||||
|
margin-bottom: 0em;
|
||||||
|
}
|
||||||
|
.discussion-article {
|
||||||
|
border: 1px solid;
|
||||||
|
border-radius: 3px;
|
||||||
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
|
||||||
|
|
||||||
|
.discussion-post {
|
||||||
|
header {
|
||||||
|
padding-bottom: 0.1em;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.post-body {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.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 {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<section class="discussion">
|
<section class="discussion">
|
||||||
{{#threads}}
|
{{#threads}}
|
||||||
<article class="discussion-article" data-id="{{id}}" id="thread_{{id}}">
|
<article class="discussion-thread" id="thread_{{id}}">
|
||||||
</article>
|
</article>
|
||||||
{{/threads}}
|
{{/threads}}
|
||||||
</section>
|
</section>
|
||||||
|
|||||||
Reference in New Issue
Block a user