Skip to content

E
edx-platform
Commit 17f4579f by marco
Options

blankslate edited, header bar now with home button

parent 9a61038c
Showing with 93 additions and 20 deletions
lms/static/sass/_discussion.scss
...@@ -200,7 +200,7 @@ body.discussion { ...@@ -200,7 +200,7 @@ body.discussion {
z-index: 9999; z-index: 9999;
width: 100%; width: 100%;
@include box-sizing(border-box); @include box-sizing(border-box);
background: #737373; background: #797979;
border: 1px solid #333; border: 1px solid #333;
box-shadow: 0 2px 50px rgba(0, 0, 0, .4); box-shadow: 0 2px 50px rgba(0, 0, 0, .4);
} }
...@@ -710,7 +710,7 @@ body.discussion { ...@@ -710,7 +710,7 @@ body.discussion {
border-radius: 3px 0 0 0; border-radius: 3px 0 0 0;
.browse, .home, .browse,
.search { .search {
position: relative; position: relative;
float: left; float: left;
...@@ -723,9 +723,29 @@ body.discussion { ...@@ -723,9 +723,29 @@ body.discussion {
&:hover { &:hover {
background-color: #e9e9e9; background-color: #e9e9e9;
} }
}
&.is-open { .home {
width: 80%; 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%;
z-index: 100;
width: 25px;
height: 25px;
//margin-left: -17px;
background: url(../images/home-discussion-icon.png) no-repeat;
opacity: 1;
@include transition(none);
}
.home-btn {
//nothing here yet
} }
} }
...@@ -734,6 +754,7 @@ body.discussion { ...@@ -734,6 +754,7 @@ body.discussion {
box-shadow: -1px 0 0 #aaa inset; box-shadow: -1px 0 0 #aaa inset;
&.is-open { &.is-open {
width:60%;
.browse-topic-drop-btn span { .browse-topic-drop-btn span {
opacity: 1.0; opacity: 1.0;
} }
...@@ -774,6 +795,11 @@ body.discussion { ...@@ -774,6 +795,11 @@ body.discussion {
&.is-open { &.is-open {
cursor: auto; cursor: auto;
width: 60%;
.home {
width:0%;
}
.post-search { .post-search {
padding: 0 10px; padding: 0 10px;
...@@ -801,7 +827,7 @@ body.discussion { ...@@ -801,7 +827,7 @@ body.discussion {
z-index: 50; z-index: 50;
width: 100%; width: 100%;
height: 100%; height: 100%;
border-radius: 3px 0 0 0; border-radius: 0 0 0 0;
border: 1px solid transparent; border: 1px solid transparent;
text-align: center; text-align: center;
overflow: hidden; overflow: hidden;
...@@ -820,6 +846,9 @@ body.discussion { ...@@ -820,6 +846,9 @@ body.discussion {
opacity: 0.0; opacity: 0.0;
@include transition(opacity .2s linear 0s); @include transition(opacity .2s linear 0s);
} }
.drop-arrow {
font-size:16px;
}
} }
.browse-topic-drop-icon { .browse-topic-drop-icon {
...@@ -843,7 +872,7 @@ body.discussion { ...@@ -843,7 +872,7 @@ body.discussion {
left: -1px; left: -1px;
z-index: 9999; z-index: 9999;
width: 100%; width: 100%;
background: #737373; background: #797979;
border: 1px solid #4b4b4b; border: 1px solid #4b4b4b;
border-left: none; border-left: none;
border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
...@@ -852,8 +881,16 @@ body.discussion { ...@@ -852,8 +881,16 @@ body.discussion {
.browse-topic-drop-menu { .browse-topic-drop-menu {
max-height: 400px; max-height: 400px;
overflow-y: scroll; overflow-y: scroll;
.drop-menu-meta-category span,
.drop-menu-parent-category span {
margin: 10px 0;
font-size: 14px;
font-weight: 700;
}
} }
ul { ul {
position: inline; position: inline;
} }
...@@ -866,7 +903,7 @@ body.discussion { ...@@ -866,7 +903,7 @@ body.discussion {
display: block; display: block;
padding: 0 20px; padding: 0 20px;
border-top: 1px solid #5f5f5f; border-top: 1px solid #5f5f5f;
font-size: 14px; font-size: 12px;
font-weight: 700; font-weight: 700;
line-height: 22px; line-height: 22px;
color: #fff; color: #fff;
...@@ -885,7 +922,7 @@ body.discussion { ...@@ -885,7 +922,7 @@ body.discussion {
.board-name { .board-name {
float: left; float: left;
width: 80%; width: 80%;
margin: 13px 0; margin: 5px 0;
color: #fff; color: #fff;
} }
...@@ -903,14 +940,14 @@ body.discussion { ...@@ -903,14 +940,14 @@ body.discussion {
li li { li li {
a { a {
padding-left: 44px; padding-left: 44px;
background: url(../images/nested-icon.png) no-repeat 22px 14px; background: url(../images/nested-icon.png) no-repeat 22px 5px;
} }
} }
li li li { li li li {
a { a {
padding-left: 68px; padding-left: 68px;
background: url(../images/nested-icon.png) no-repeat 46px 14px; background: url(../images/nested-icon.png) no-repeat 46px 5px;
} }
} }
} }
...@@ -979,7 +1016,7 @@ body.discussion { ...@@ -979,7 +1016,7 @@ body.discussion {
min-height: 27px; min-height: 27px;
border-bottom: 1px solid #a3a3a3; border-bottom: 1px solid #a3a3a3;
@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: #aeaeae; background-color: #aaaaaa;
box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset;
span, span,
...@@ -1268,10 +1305,32 @@ body.discussion { ...@@ -1268,10 +1305,32 @@ body.discussion {
} }
} }
.blank-slate h1 { .blank-slate {
margin-top: 195px; //nothing here
text-align: center; .section {
color: #ccc; border-bottom: 1px solid #ccc;
margin-top: 15px;
}
.home-header {
//nothing here
}
.home-title {
font-size: 18px;
color: #000;
margin-bottom: 5px;
}
.home-description {
font-size: 12px;
line-height: 1;
margin-bottom: 10px;
}
.home-stats {
//nothing
}
.home-emailsettings {
//nothing here
}
} }
.blank-slate, .blank-slate,
......
lms/templates/discussion/_filter_dropdown.html
...@@ -11,12 +11,12 @@ ...@@ -11,12 +11,12 @@
</%def> </%def>
<%def name="render_entry(entries, entry)"> <%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>
<%def name="render_category(categories, category)"> <%def name="render_category(categories, category)">
<li> <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> <ul>
${render_dropdown(categories[category])} ${render_dropdown(categories[category])}
</ul> </ul>
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
</div> </div>
<ul class="browse-topic-drop-menu"> <ul class="browse-topic-drop-menu">
<li> <li>
<a href="#"> <a href="#" class="drop-menu-meta-category">
<span class="board-name" data-discussion_id='#all'>Show All Discussions</span> <span class="board-name" data-discussion_id='#all'>Show All Discussions</span>
</a> </a>
</li> </li>
...@@ -42,7 +42,7 @@ ...@@ -42,7 +42,7 @@
%endif %endif
<li> <li>
<a href="#"> <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'>Following</span>
</a> </a>
</li> </li>
......
lms/templates/discussion/_thread_list_template.html
<script type="text/template" id="thread-list-template"> <script type="text/template" id="thread-list-template">
<div class="browse-search"> <div class="browse-search">
<div class="home">
<a href="#" class="home-icon"></a>
<a href="#" class="home-btn"></a>
</div>
<div class="browse is-open"> <div class="browse is-open">
<a href="#" class="browse-topic-drop-icon"></a> <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> <a href="#" class="browse-topic-drop-btn"><span class="current-board">Show All Discussions</span> <span class="drop-arrow">▾</span></a>
......
lms/templates/discussion/index.html
...@@ -26,7 +26,17 @@ ...@@ -26,7 +26,17 @@
<div class="sidebar"></div> <div class="sidebar"></div>
<div class="discussion-column"> <div class="discussion-column">
<div class="discussion-article blank-slate"> <div class="discussion-article blank-slate">
<h1>${course.display_name_with_default} Discussion</h1> <div class="home-header section">
<h1 class="home-title">${course.display_name_with_default} Discussion Home</h1>
<p class="home-description">Welcome to ${course.display_name_with_default}'s Discussion Home. Select a discussion from the left, or review your profile, participation and email notification settings below.
</p>
</div>
<div class="home-stats section">
The home-stats
</div>
<div class="home-emailsettings section">
The home-emailsettings
</div>
</div> </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