basic shell for home page exists, along with start of color cleanup for the rest of _discussion.scss

This commit is contained in:
marco
2013-06-12 13:47:39 -04:00
parent 6657ac189a
commit f674e61f7a
3 changed files with 55 additions and 23 deletions

View File

@@ -713,11 +713,11 @@ body.discussion {
width: 20%;
height: 100%;
@include linear-gradient(top, rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));
background-color: #dcdcdc;
@include transition(all .2s ease-out 0s);
background-color: $gray-l4;
@include transition(all .2s ease-out);
&:hover {
background-color: #e9e9e9;
background-color: $gray-l3;
}
}
@@ -731,12 +731,13 @@ body.discussion {
position: absolute;
top: 30%;
left: 30%;
color: $gray;
font-size: 28px;
z-index: 100;
width: 25px;
height: 25px;
opacity: 1;
@include transition(none);
@include transition(all .2s ease-out);
}
}
@@ -997,9 +998,9 @@ 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: #aaaaaa;
background-color: $gray-l2;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset;
span,
@@ -1007,7 +1008,7 @@ body.discussion {
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);
}
@@ -1028,18 +1029,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;
}
@@ -1286,7 +1287,6 @@ body.discussion {
section {
border-bottom: 1px solid #ccc;
margin: $baseline $baseline $baseline 0;
}
.label {
@@ -1294,6 +1294,11 @@ body.discussion {
font-size: 12px;
}
.label-settings {
padding-top: $baseline;
padding-bottom: $baseline/2;
}
.home-header {
margin: 0;
}
@@ -1309,6 +1314,7 @@ body.discussion {
margin-bottom: $baseline/2;
}
.home-stats {
padding: $baseline 0;
.label-area {
display: inline-block;
@@ -1323,7 +1329,8 @@ body.discussion {
.stats-grouping {
display: inline-block;
width: 65%;
width: 70%;
padding-left: $baseline;
.profile-stat {
display: inline-block;
@@ -1335,6 +1342,11 @@ body.discussion {
display: inline-block;
font-size: 28px;
padding: 0 $baseline/2;
vertical-align: middle;
}
.profile-stat-label{
vertical-align: middle;
}
}
}
@@ -1358,17 +1370,18 @@ body.discussion {
border-bottom: 1px solid #b2b2b2;
.row-title {
padding: $baseline;
padding: 30px $baseline;
display: inline-block;
width: 15%;
background-color: $light-gray;
background-color: $gray-l4;
font-size: 12px;
}
.row-item-full, .row-item {
display: inline-block;
font-size: 12px;
width: 25%;
padding-left: $baseline/2;
width: 23%;
vertical-align: middle;
.icon {
@@ -1378,6 +1391,14 @@ body.discussion {
vertical-align: middle;
}
.icon-stack i {
padding: 0 $baseline/2;
}
.row-setting {
padding-left: $baseline;
}
.row-description {
display: inline-block;
width: 70%;
@@ -1389,7 +1410,8 @@ body.discussion {
width: 70%;
.row-description {
width: 90%;
width: 80%;
padding-left: 15px;
}
}
}

View File

@@ -43,7 +43,7 @@
%endif
<li>
<a href="#" class="drop-menu-meta-category">
<span class="board-name" data-discussion_id='#following'>Following</span>
<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)}

View File

@@ -36,12 +36,21 @@
<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>POSTS</div>
<div class="profile-stat profile-stat-comments"><span class="count count-comments">12</span> COMMENTS</div>
<div class="profile-stat profile-stat-following"><span class="count count-following">9</span> POSTS I FOLLOW</div>
<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">HOW TO USE EDX DISCUSSIONS</span>
<span class="label label-settings">HOW TO USE EDX DISCUSSIONS</span>
<section class="home-helpgrid">
<ul class="helpgrid-list">
<li class="helpgrid-row helpgrid-row-navigation">
@@ -75,13 +84,14 @@
</div>
</li>
<li class="helpgrid-row helpgrid-row-notification">
<span class="row-title">Reconnect through email</span>
<span class="row-title">Receive updates</span>
<div class="row-item-full">
<span class="icon-stack">
<i class="icon-sign-blank icon-stack-base"></i>
<i class="icon-envelope icon-light"></i>
</span>
<span class="row-description">If enabled, you will receive an email digest of all the posts you are following which have new content you haven&#39;t seen or already been emailed about. </span>
<span class="row-setting"><input type="checkbox" name="email-notification"></input></span>
<span class="row-description"> If enabled, you will receive an email digest if there is new activity from posts you are following. </span>
</div>
</li>
</ul>