Andal.LND/edx-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

LMS: forum markup tweaks and cleanup

Browse Source
This commit is contained in:
Chris Rodriguez
2015-12-30 12:54:53 -05:00
parent d2392b451f
commit 4454c819c8
9 changed files with 102 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

74
lms/static/sass/discussion/elements/_navigation.scss
View File

@@ -22,15 +22,25 @@
}
.forum-nav-browse {
@include box-sizing(border-box);
display: table-cell;
vertical-align: middle;
width: 50%;
padding: ($baseline/4);
@include box-sizing(border-box);
display: table-cell;
vertical-align: middle;
width: auto;
padding: 11px;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
&:hover, &:focus, &.is-active {
background-color: $gray-l5;
}
&:hover,
&:focus,
&.is-active {
// converted to button from a;
// need importants to overwrite later button styles
box-shadow: none !important;
background-image: none !important;
background-color: $gray-l5 !important;
}
.icon {
@include font-size(14);
@@ -93,6 +103,33 @@
width: 100%;
}
.forum-nav-browse-title {
display: block;
width: 100%;
border: 0;
border-radius: 0;
border-bottom: 1px solid $gray-l3;
padding: ($baseline/2) ($baseline/2);
background: transparent;
box-shadow: none;
background-image: none;
color: $link-color;
text-align: left;
&:hover,
&:focus {
// switched from a to button;
// need to override button styles
background-image: none !important;
box-shadow: none !important;
background: $forum-color-active-thread !important;
}
}
.forum-nav-browse-title .icon {
@include margin-right($baseline/2);
}
.forum-nav-browse-menu {
@include font-size(14);
overflow-y: scroll;
@@ -100,22 +137,15 @@
}
.forum-nav-browse-submenu {
padding-left: $baseline;
list-style: none;
}
list-style: none;
padding: 0;
.forum-nav-browse-title {
display: block;
border-bottom: 1px solid $gray-l3;
padding: ($baseline/2) ($baseline/2);
li {
&:hover, &:focus {
background: $forum-color-active-thread;
}
}
.forum-nav-browse-title .icon {
@include margin-right($baseline/2);
.forum-nav-browse-title {
padding-left: $baseline;
}
}
}
// -------------------

1
lms/static/sass/discussion/views/_create-edit-post.scss
View File

@@ -70,6 +70,7 @@
@extend %cont-truncated;
z-index: 1000;
padding: 0 $baseline 0 ($baseline*0.75);
width: 100%;
height: 40px;
font-size: 14px;
line-height: 36px;

13
lms/templates/discussion/_filter_dropdown.html
View File

@@ -19,13 +19,13 @@ import json
data-discussion-id='${entries[entry]["id"]}'
data-cohorted="${str(entries[entry]['is_cohorted']).lower()}"
>
<a href="#" class="forum-nav-browse-title">${entry}</a>
<button type="button" class="forum-nav-browse-title">${entry}</button>
</li>
</%def>
<%def name="render_category(categories, category)">
<li class="forum-nav-browse-menu-item">
<a href="#" class="forum-nav-browse-title">${category}</a>
<button type="button" class="forum-nav-browse-title">${category}</button>
<ul class="forum-nav-browse-submenu">
${render_dropdown(categories[category])}
</ul>
@@ -37,15 +37,18 @@ import json
<label>
<span class="sr">${_("Filter Topics")}</span>
<input type="text" class="forum-nav-browse-filter-input" placeholder="${_("filter topics")}">
<i class="icon fa fa-filter"></i>
<span class="icon fa fa-filter" aria-hidden="true"></span>
</label>
</form>
<ul class="forum-nav-browse-menu">
<li class="forum-nav-browse-menu-item forum-nav-browse-menu-all">
<a href="#" class="forum-nav-browse-title">${_("All Discussions")}</a>
<button type="button" class="forum-nav-browse-title">${_("All Discussions")}</button>
</li>
<li class="forum-nav-browse-menu-item forum-nav-browse-menu-following">
<a href="#" class="forum-nav-browse-title"><i class="icon fa fa-star"></i>${_("Posts I'm Following")}</a>
<button type="button" class="forum-nav-browse-title">
<span class="icon fa fa-star" aria-hidden="true"></span>
${_("Posts I'm Following")}
</button>
</li>
${render_dropdown(category_map)}
</ul>

17
lms/templates/discussion/_thread_list_template.html
View File

@@ -1,24 +1,27 @@
<%! from django.utils.translation import ugettext as _ %>
<script type="text/template" id="thread-list-template">
<div class="forum-nav-header">
<a href="#" class="forum-nav-browse" aria-haspopup="true">
<button type="button" class="forum-nav-browse" id="forum-nav-browse" aria-haspopup="true">
## There is no whitespace between these because the front-end JS code
## needs to precisely compute the available width for forum-nav-
## browse-current in order to do truncation of topic names.
<i class="icon fa fa-reorder"></i><span class="sr">${_("Discussion topics; current selection is: ")}</span><span class="forum-nav-browse-current">${_("All Discussions")}</span><span class="forum-nav-browse-drop-arrow">▾</span>
</a>
<span class="icon fa fa-reorder" aria-hidden="true"></span>
<span class="sr">${_("Discussion topics; currently listing: ")}</span>
<span class="forum-nav-browse-current">${_("All Discussions")}</span>
<span class="forum-nav-browse-drop-arrow" aria-hidden="true">▾</span>
</button>
<form class="forum-nav-search">
<div class="forum-nav-search-ff-position-fix">
<label>
<span class="sr">${_("Search")}</span>
<input class="forum-nav-search-input" type="text" placeholder="${_("Search all posts")}">
<i class="icon fa fa-search"></i>
<span class="sr">${_("Search all posts")}</span>
<input class="forum-nav-search-input" id="forum-nav-search" type="text" placeholder="${_("Search all posts")}">
<span class="icon fa fa-search" aria-hidden="true"></span>
</label>
</div>
</form>
</div>
<%include file="_filter_dropdown.html" />
<div class="forum-nav-thread-list-wrapper">
<div class="forum-nav-thread-list-wrapper" id="sort-filter-wrapper" tabindex="-1">
<div class="forum-nav-refine-bar">
<label class="forum-nav-filter-main">
## Translators: This labels a filter menu in forum navigation