Skip to content

E
edx-platform
Commit 2972e911 by Davorin Sego
Options

search input element styling improvements, test clean up

parent b9ed7582
Showing with 67 additions and 43 deletions
cms/envs/common.py
......@@ -150,7 +150,7 @@ FEATURES = {
'LICENSING': False,
# Enable the courseware search functionality
'ENABLE_COURSEWARE_INDEX': True,
'ENABLE_COURSEWARE_INDEX': False,
# Enable content libraries search functionality
'ENABLE_LIBRARY_INDEX': False,
......
common/djangoapps/student/views.py
......@@ -972,9 +972,9 @@ def login_user(request, error=""): # pylint: disable-msg=too-many-statements,un
platform_name=settings.PLATFORM_NAME, provider_name=requested_provider.name
)
+ "<br/><br/>" +
_("If you don't have an {platform_name} account yet, click <strong>Register</strong> at the top of the page.").format(
platform_name=settings.PLATFORM_NAME
),
_("If you don't have an {platform_name} account yet, "
"click <strong>Register</strong> at the top of the page.").format(
platform_name=settings.PLATFORM_NAME),
content_type="text/plain",
status=403
)
......
lms/envs/common.py
......@@ -359,10 +359,10 @@ FEATURES = {
'MODE_CREATION_FOR_TESTING': False,
# Courseware search feature
'ENABLE_COURSEWARE_SEARCH': True,
'ENABLE_COURSEWARE_SEARCH': False,
# Dashboard search feature
'ENABLE_DASHBOARD_SEARCH': True,
'ENABLE_DASHBOARD_SEARCH': False,
# log all information from cybersource callbacks
'LOG_POSTPAY_CALLBACKS': True,
......@@ -389,7 +389,7 @@ FEATURES = {
},
# Course discovery feature
'ENABLE_COURSE_DISCOVERY': True,
'ENABLE_COURSE_DISCOVERY': False,
# Software secure fake page feature flag
'ENABLE_SOFTWARE_SECURE_FAKE': False,
......
lms/static/js/discovery/app.js
......@@ -37,6 +37,7 @@ define(['backbone', 'course_discovery_meanings'], function(Backbone, meanings) {
dispatcher.listenTo(collection, 'search', function () {
if (collection.length > 0) {
form.showFoundMessage(collection.totalCount);
results.render();
}
else {
......
lms/static/js/discovery/form.js
......@@ -47,6 +47,15 @@ define(['jquery', 'backbone'], function ($, Backbone) {
this.$loadingIndicator.addClass('hidden');
},
showFoundMessage: function (count) {
var msg = ngettext(
'Viewing %s course',
'Viewing %s courses',
count
);
this.$message.html(interpolate(msg, [count]));
},
showNotFoundMessage: function (term) {
var msg = interpolate(
gettext('We couldn\'t find any results for "%s".'),
......
lms/static/js/fixtures/discovery.html
<section class="courses-container">
<div id="discovery-form">
<form>
<div id="discovery-form" class="wrapper-search-context">
<div id="discovery-message" class="search-status-label"></div>
<form class="wrapper-search-input">
<input class="discovery-input" placeholder="Search for a course" type="text"/><!-- removes spacing
--><button type="submit" class="button postfix discovery-submit" aria-label="Search">
<i class="icon fa fa-search" aria-hidden="true"></i>
<div aria-live="polite" aria-relevant="all">
<div id="loading-indicator" class="loading-spinner hidden">
<i class="icon fa fa-spinner fa-spin" aria-hidden="true"></i>
<span class="sr">Loading</span>
</div>
</div>
</button>
</form>
<div id="discovery-message"></div>
<div aria-live="polite" aria-relevant="all">
<div id="loading-indicator" class="hidden">
<i class="icon fa fa-spinner fa-spin"></i> Loading
</div>
<div id="filter-bar" class="filters hide-phone">
</div>
</div>
<div id="filter-bar" class="filters hide-phone">
</div>
<div class="courses" role="region" aria-label="${_('List of Courses')}">
<ul class="courses-listing"></ul>
</div>
<section class="courses">
<ul class="courses-listing"></ul>
</section>
<aside aria-label="Refine your search" class="search-facets phone-menu">
</aside>
<aside aria-label="Refine your search" class="search-facets phone-menu">
</aside>
</section>
</section>
lms/static/js/spec/discovery/discovery_spec.js
......@@ -238,7 +238,7 @@ define([
var data = this.item.model.attributes;
this.item.render();
expect(this.item.$el).toContainHtml(data.content.display_name);
expect(this.item.$el).toContain('a[href="/courses/' + data.course + '/info"]');
expect(this.item.$el).toContain('a[href="/courses/' + data.course + '/about"]');
expect(this.item.$el).toContain('img[src="' + data.image_url + '"]');
expect(this.item.$el.find('.course-name')).toContainHtml(data.org);
expect(this.item.$el.find('.course-name')).toContainHtml(data.content.number);
......
lms/static/sass/base/_base.scss
......@@ -121,7 +121,6 @@ a:focus {
width: flex-grid(12);
margin: 0 auto;
background: $content-wrapper-bg;
padding-bottom: ($baseline*2);
@media print {
padding-bottom: 0;
......
lms/static/sass/base/_variables.scss
......@@ -82,6 +82,7 @@ $gray-d2: shade($gray,40%); // #4c4c4c
$gray-d3: shade($gray,60%); // #323232
$gray-d4: shade($gray,80%); // #191919
$pink: rgb(182,37,103); // #b72567;
$pink-l1: tint($pink,20%);
$pink-l2: tint($pink,40%);
......@@ -133,16 +134,23 @@ $green-u1: desaturate($green,15%);
$green-u2: desaturate($green,30%);
$green-u3: desaturate($green,45%);
// ====================
// COLORS: social platforms
$twitter-blue: #55ACEE;
$facebook-blue: #3B5998;
$linkedin-blue: #0077B5;
// ====================
// TODO: both blue and yellow variables differ from CMS rgb value, need to confirm change to CMS variable is ok in current platform uses before switching.
$blue: rgb(0, 120, 176);
$yellow: rgb(255, 252, 221);
// ====================
// COLORS: old variables
// DEPRECATED: use colors in lists above
$error-red: rgb(253, 87, 87);
$danger-red: rgb(212, 64, 64);
$light-gray: rgb(221, 221, 221);
......@@ -152,7 +160,10 @@ $sidebar-color: rgb(246, 246, 246);
$outer-border-color: rgb(170, 170, 170);
$light-gray: rgb(221,221,221); // #dddddd
// ====================
// used by descriptor css
// DEPRECATED: use colors in lists above
$lightGrey: rgb(237,241,245); // #edf1f5
$darkGrey: rgb(136,145,161); // #8891a1
$lightGrey1: $gray-l3;
......@@ -160,6 +171,8 @@ $blue-d1: shade($blue,20%);
$blue-d2: shade($blue,40%);
$blue-d4: shade($blue,80%);
// ====================
// edx.org marketing site variables
$m-gray: rgb(138,140,143); // #8A8C8F
$m-gray-l1: rgb(151,153,155); // #97999B
......
lms/static/sass/multicourse/_dashboard.scss
......@@ -13,7 +13,7 @@
// ====================
.dashboard {
@include clearfix();
padding: ($baseline*2) 0 0 0;
padding: ($baseline*2) 0 $baseline 0;
.profile-sidebar {
background: transparent;
......
lms/static/sass/multicourse/_home.scss
......@@ -20,7 +20,6 @@ $course-search-input-height: ($button-size);
background-image: $homepage-bg-image;
box-shadow: 0 1px 0 0 $course-header-bg, inset 0 -1px 5px 0 $shadow-l1;
overflow: hidden;
margin-top: $header_image_margin;
padding: 0;
width: flex-grid(12);
......@@ -110,6 +109,7 @@ $course-search-input-height: ($button-size);
height: $course-search-input-height;
color: $black;
font-style: normal;
font-weight: normal;
// STATE: focus
&:focus {
......
lms/static/sass/shared/_header.scss
......@@ -3,7 +3,7 @@
header.global {
@extend %ui-depth1;
border-bottom: 4px solid $courseware-border-bottom-color;
border-bottom: 1px solid $gray-l1;
box-shadow: 0 1px 5px 0 $shadow-l1;
background: $header-bg;
position: relative;
......@@ -286,7 +286,7 @@ header.global {
a {
display:block;
padding: ($baseline/4);
color: $lighter-base-font-color;
color: $link-color;
font-weight: 600;
&:hover, &:focus, &:active {
......
lms/static/sass/views/_homepage.scss
......@@ -16,7 +16,7 @@ $learn-more-horizontal-position: calc(50% - 100px); // calculate the left positi
@extend %ui-no-list;
.courses-listing-item {
margin: ($baseline*0.75) 0 ($baseline*1.5) 0;
margin: 0 0 ($baseline*1.5) 0;
max-height: $course-card-height;
}
}
......
lms/templates/course.html
......@@ -13,14 +13,14 @@ from courseware.courses import course_image_url, get_course_about_section
<div class="learn-more" aria-hidden=true>${_("LEARN MORE")}</div>
</div>
</header>
<section class="course-info" aria-hidden=true>
<div class="course-info" aria-hidden="true">
<h2 class="course-name">
<span class="course-organization">${get_course_about_section(course, 'university')}</span>
<span class="course-code">${course.display_number_with_default}</span>
<span class="course-title">${get_course_about_section(course, 'title')}</span>
</h2>
<div class="course-date" aria-hidden="true">${_("Starts")}: ${course.start_datetime_text()}</div>
</section>
</div>
<div class="sr">
<ul>
<li>${get_course_about_section(course, 'university')}</li>
......
lms/templates/courseware/courses.html
......@@ -57,28 +57,28 @@
<section class="find-courses">
<section class="courses-container">
% if course_discovery_enabled:
<div id="discovery-form" role="search" aria-label="course" class="wrapper-search-context">
<div id="discovery-message" class="search-status-label"></div>
<form class="wrapper-search-input">
<input class="discovery-input" placeholder="${_('Search for a course')}" type="text"/><!-- removes spacing
--><button type="submit" class="button postfix discovery-submit" aria-label="${_('Search')}">
<input class="discovery-input" placeholder="${_('Search for a course')}" type="text"/>
<button type="submit" class="button postfix discovery-submit" aria-label="${_('Search')}">
<i class="icon fa fa-search" aria-hidden="true"></i>
<div aria-live="polite" aria-relevant="all">
<div id="loading-indicator" class="loading-spinner hidden">
<i class="icon fa fa-spinner fa-spin"></i>
<span class="sr">${_('Loading')}</span>
</div>
</div>
</button>
</form>
<div id="discovery-message" class="search-status-label"></div>
<div aria-live="polite" aria-relevant="all">
<div id="loading-indicator" class="hidden">
<i class="icon fa fa-spinner fa-spin"></i> ${_('Loading')}
</div>
</div>
</div>
<div id="filter-bar" class="filters hide-phone">
</div>
% endif
<section class="courses${'' if course_discovery_enabled else ' no-course-discovery'}">
<section class="courses ${'' if course_discovery_enabled else ' no-course-discovery'}" role="region" aria-label="${_('List of Courses')}">
<ul class="courses-listing">
%for course in courses:
<li class="courses-listing-item">
......
lms/templates/discovery/result_item.underscore
<article class="course" role="region" aria-label="<%= content.display_name %>">
<a href="/courses/<%- course %>/info">
<a href="/courses/<%- course %>/about">
<header class="course-image">
<div class="cover-image">
<img src="<%- image_url %>" alt="<%= content.display_name %> <%= content.number %>" />
<div class="learn-more" aria-hidden=true><%= gettext("LEARN MORE") %></div>
</div>
</header>
<section class="course-info" aria-hidden=true>
<section class="course-info" aria-hidden="true">
<h2 class="course-name">
<span class="course-organization"><%= org %></span>
<span class="course-code"><%= content.number %></span>
......
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