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

FEDX-118 Adding header to test page

Browse Source
This commit is contained in:
AlasdairSwan
2016-03-29 16:10:52 -04:00
committed by Clinton Blackburn
parent 717b56a7b2
commit 3cbb2d1a08
60 changed files with 465 additions and 2890 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
lms/djangoapps/debug/views.py
View File

@@ -45,18 +45,3 @@ def show_parameters(request):
for name, value in sorted(request.POST.items()):
html.append(escape("POST {}: {!r}".format(name, value)))
return HttpResponse("\n".join("<p>{}</p>".format(h) for h in html))
def show_reference_template(request, template):
"""
Shows the specified template as an HTML page. This is used only in debug mode to allow the UX team
to produce and work with static reference templates.
e.g. /template/ux/reference/container.html shows the template under ux/reference/container.html
Note: dynamic parameters can also be passed to the page.
e.g. /template/ux/reference/container.html?name=Foo
"""
try:
return render_to_response(template, request.GET.dict())
except TopLevelLookupException:
return HttpResponseNotFound("Couldn't find template {template}".format(template=template))

16
lms/static/js/header_factory.js Normal file
View File

@@ -0,0 +1,16 @@
;(function (define) {
'use strict';
define([
'edx-ui-toolkit/js/dropdown-menu/dropdown-menu-view'
],
function (DropdownMenuView) {
return function() {
var dropdownMenuView = new DropdownMenuView({
el: '.js-header-user-menu'
}).postRender();
return dropdownMenuView;
};
});
}).call(this, define || RequireJS.define);

1
lms/static/lms/js/build.js
View File

@@ -23,6 +23,7 @@
'js/edxnotes/views/page_factory',
'js/financial-assistance/financial_assistance_form_factory',
'js/groups/views/cohorts_dashboard_factory',
'js/header_factory',
'js/search/course/course_search_factory',
'js/search/dashboard/dashboard_search_factory',
'js/student_account/logistration_factory',

4
lms/static/sass/_build-lms-v2.scss
View File

@@ -5,5 +5,9 @@
// Configuration
@import 'config';
@import 'base/variables';
// Extensions
@import 'shared-v2/base';
@import 'shared-v2/navigation';
@import 'shared-v2/header';

2
lms/static/sass/_shame.scss
View File

@@ -139,7 +139,7 @@
.verification-process {
//overriding reset link style for nav/header
header.global {
.header-global {
.logo a:hover, .logo:active, .logo a:focus {
border: none;

2
lms/static/sass/base/_extends.scss
View File

@@ -79,7 +79,7 @@
color: rgb(255, 255, 255);
}
.global {
.header-global {
h2 {
display: none;
}

6
lms/static/sass/base/_layouts.scss
View File

@@ -12,11 +12,11 @@ body.view-in-course {
}
// courseware header
header.global,
header.global.slim {
.header-global,
.header-global.slim {
width: auto;
.nav-wrapper {
.wrapper-header {
min-width: auto;
padding-right: 2%;
padding-left: 2%;

2
lms/static/sass/course/layout/_courseware_header.scss
View File

@@ -72,7 +72,7 @@
}
}
header.global.slim {
.header-global.slim {
box-shadow: 0 1px 2px $shadow-l1;
height: auto;
padding: ($baseline/4) 0 ($baseline/2) 0;

10
lms/static/sass/multicourse/_account.scss
View File

@@ -217,7 +217,7 @@
// aside
aside {
.cta {
.btn {
margin: 0 0 ($baseline*2) 0;
&:last-child {
@@ -230,7 +230,7 @@
}
}
.cta-login {
.btn-login {
h3.title,
.instructions {
@@ -238,7 +238,7 @@
margin-bottom: 0;
}
.cta-login-action {
.btn-login-action {
@extend %btn-secondary-grey-outline;
padding: ($baseline/10) ($baseline*0.75);
@include margin-left($baseline/4);
@@ -631,7 +631,7 @@
// login
.view-login {
header.global .nav-courseware .cta-login {
.header-global .nav-courseware .btn-login {
display: none;
}
@@ -657,7 +657,7 @@
// password reset
.view-passwordreset {
header.global .nav-courseware .cta-login {
.header-global .nav-courseware .btn-login {
display: none;
}

10
lms/static/sass/multicourse/_dashboard.scss
View File

@@ -456,7 +456,7 @@
}
// TYPE: facebook share
&.action-facebook, {
&.action-facebook {
color: $facebook-blue;
}
@@ -931,7 +931,7 @@
@include float(left);
@include margin(0, 15px, 0, 0);
.btn, .cta {
.btn {
display: inline-block;
}
@@ -954,7 +954,7 @@
}
}
.cta {
.btn {
@include float(left);
font: normal 0.8rem/1.2rem $sans-serif;
letter-spacing: 1px;
@@ -1013,7 +1013,7 @@
&.course-status-certrendering {
.cta {
.btn {
margin-top: 2px;
}
}
@@ -1093,7 +1093,7 @@
@include float(left);
position: relative;
.cta {
.btn {
@extend %btn-pl-green-base;
@include float(right);
}

6
lms/static/sass/shared-v2/_base.scss Normal file
View File

@@ -0,0 +1,6 @@
// LMS base styles
.content-wrapper {
margin: 0 auto;
padding: 10px;
}

83
lms/static/sass/shared-v2/_header.scss Normal file
View File

@@ -0,0 +1,83 @@
// LMS header styles
.header-global {
@extend %ui-depth1;
@include box-sizing(border-box);
position: relative;
width: 100%;
border-bottom: 4px solid $courseware-border-bottom-color;
box-shadow: 0 1px 5px 0 $shadow-l1;
background: $header-bg;
.wrapper-header {
@include clearfix();
@include box-sizing(border-box);
height: 74px;
margin: 0 auto;
padding: 10px 10px 0;
width: 100%;
max-width: 1180px;
.logo {
@include float(left);
@include margin-right(39px);
@include margin-left(10px);
margin-top: 4px;
margin-bottom: 0;
position: relative;
}
.left {
@include float(left);
}
.right {
@include float(right);
}
.wrapper-user-menu {
@include float(right);
margin-top: 4px;
width: auto;
}
.dropdown-menu {
@include text-align(left);
top: inherit;
}
.list-inline {
margin-top: 12px;
.item {
display: inline-block;
font-size: font-size(small);
font-weight: font-weight(semi-bold);
text-transform: uppercase;
letter-spacing: 0 !important;
&.active {
a {
text-decoration: none;
color: $link-color;
}
}
a {
color: $courseware-navigation-color;
padding: 3px 10px;
&:hover,
&:focus {
background: inherit;
color: $courseware-hover-color;
}
}
}
}
.nav-courseware.list-inline {
margin-top: 5px;
}
}
}

23
lms/static/sass/shared-v2/_navigation.scss Normal file
View File

@@ -0,0 +1,23 @@
// LMS navigation styles
// skip navigation
.nav-skip {
font-size: font-size(small);
display: inline-block;
position: absolute;
left: 0;
top: -($baseline*30);
overflow: hidden;
background: $white;
border-bottom: 1px solid palette(grayscale, white);
padding: ($baseline*0.75) ($baseline/2);
&:focus,
&:active {
position: relative;
top: auto;
width: auto;
height: auto;
margin: 0;
}
}

14
lms/static/sass/shared/_header.scss
View File

@@ -1,7 +1,7 @@
@import '../base/grid-settings';
@import 'neat/neat'; // lib - Neat
header.global {
.header-global {
@extend %ui-depth1;
border-bottom: 1px solid $gray-l1;
box-shadow: 0 1px 5px 0 $shadow-l1;
@@ -330,7 +330,7 @@ header.global {
li, div {
display: inline-block;
.cta {
.btn {
@extend %m-btn-primary;
}
}
@@ -340,7 +340,7 @@ header.global {
// marketing site design syncing
.view-register, .view-login, .view-passwordreset {
header.global nav {
.header-global nav {
width: 960px;
}
}
@@ -360,7 +360,7 @@ header.global {
// ====================
// CASE: marketing/course discovery
header.global-new {
.header-global-new {
@extend %ui-depth1;
/* Temp. fix until applied globally */
@include box-sizing(border-box);
@@ -852,13 +852,13 @@ header.global-new {
}
}
.view-register header.global-new .cta-register {
.view-register .header-global-new .btn-register {
text-decoration: none;
color: $courseware-hover-color;
border-bottom-color: $courseware-border-bottom-color;
}
.view-login header.global-new .cta-login {
.view-login .header-global-new .btn-login {
text-decoration: none;
color: $courseware-hover-color;
}
@@ -866,7 +866,7 @@ header.global-new {
// marketing site design syncing
.view-register, .view-login {
header.global nav {
.header-global nav {
width: 960px;
}
}

4
lms/static/sass/views/_verification.scss
View File

@@ -109,12 +109,12 @@
}
// reset: navigation (needed due to edX's new global-header styling)
.global-new .nav-global a {
.header-global-new .nav-global a {
padding-bottom: ($baseline +1);
}
// HACK: fix global header height in verification flow ECOM-1808
header.global {
.header-global {
height: 76px;
}

17
lms/templates/main.html
View File

@@ -62,12 +62,18 @@ from pipeline_mako import render_require_js_path_overrides
<%static:css group='style-vendor'/>
<%static:css group='${self.attr.main_css}'/>
% if disable_courseware_js:
<%static:js group='base_vendor'/>
<%static:js group='base_application'/>
% if not uses_pattern_library:
% if disable_courseware_js:
<%static:js group='base_vendor'/>
<%static:js group='base_application'/>
% else:
<%static:js group='main_vendor'/>
<%static:js group='application'/>
% endif
% else:
<%static:js group='main_vendor'/>
<%static:js group='application'/>
## TODO: Update to only bring in RequireJS
## https://openedx.atlassian.net/browse/FEDX-140
<%static:js group='base_vendor'/>
% endif
<script>
@@ -140,6 +146,7 @@ from pipeline_mako import render_require_js_path_overrides
% endif
<%block name="js_extra"/>
<%include file="widgets/segment-io-footer.html" />
<script type="text/javascript" src="${static.url('js/vendor/noreferrer.js')}" charset="utf-8"></script>
<script type="text/javascript" src="${static.url('js/utils/navigation.js')}" charset="utf-8"></script>

156
lms/templates/navigation-edx.html
View File

@@ -1,156 +0,0 @@
## mako
<%page expression_filter="h"/>
<%namespace name='static' file='static_content.html'/>
<%namespace file='main.html' import="login_query"/>
<%!
from django.core.urlresolvers import reverse
from django.utils.translation import ugettext as _
from microsite_configuration.templatetags.microsite import platform_name
from openedx.core.djangoapps.user_api.accounts.image_helpers import get_profile_image_urls_for_user
# App that handles subdomain specific branding
from branding import api as branding_api
# app that handles site status messages
from status.status import get_site_status_msg
%>
## Provide a hook for themes to inject branding on top.
<%block name="navigation_top" />
<%block>
<%
try:
course_id = course.id
except:
# can't figure out a better way to get at a possibly-defined course var
course_id = None
site_status_msg = get_site_status_msg(course_id)
%>
% if site_status_msg:
<div class="site-status">
<div class="inner-wrapper">
<span class="white-error-icon"></span>
<p>${site_status_msg}</p>
</div>
</div>
% endif
</%block>
<header class="${"global slim" if course and not disable_courseware_header else "global-new"}" aria-label="Main" role="banner">
<div class="${'rwd ' if responsive else ''}wrapper-header nav-container">
<h1 class="logo" itemscope="" itemtype="http://schema.org/Organization">
<a href="${marketing_link('ROOT')}" itemprop="url">
<%block name="navigation_logo">
<img src="${static.url(branding_api.get_logo_url())}" alt="${_("{platform_name} Home Page").format(platform_name=static.get_platform_name())}" itemprop="logo" />
</%block>
</a>
</h1>
% if course and not disable_courseware_header:
<h2 class="course-header">
<span class="provider">${course.display_org_with_default}:</span>
<span class="course-number">${course.display_number_with_default}</span>
<span class="course-name">${course.display_name_with_default}</span>
</h2>
% endif
% if user.is_authenticated():
% if not course or disable_courseware_header:
% if not nav_hidden:
<nav aria-label="Main" class="nav-main">
<ul class="left nav-global authenticated">
<%block name="navigation_global_links_authenticated">
<li class="nav-global-01">
<a href="${marketing_link('HOW_IT_WORKS')}">${_("How it Works")}</a>
</li>
<li class="nav-global-02">
<a href="${marketing_link('COURSES')}">${_("Find Courses")}</a>
</li>
<li class="nav-global-03">
<a href="${marketing_link('SCHOOLS')}">${_("Schools & Partners")}</a>
</li>
</%block>
</ul>
</nav>
% endif
% endif
<ul class="user">
<li class="primary">
<a href="${reverse('dashboard')}" class="user-link">
<span class="sr">${_("Dashboard for:")}</span>
<%
username = user.username
profile_image_url = get_profile_image_urls_for_user(user)['medium']
%>
<img class="user-image-frame" src="${profile_image_url}" alt="${_('Profile image for {username}').format(username=username)}">
<div class="label-username">${username}</div>
</a>
</li>
<li class="primary">
<button class="dropdown" aria-haspopup="true" aria-expanded="false"><span class="sr">${_("More options dropdown")}</span> &#9662;</button>
<ul class="dropdown-menu" aria-label="More Options" role="menu">
<%block name="navigation_dropdown_menu_links" >
<li><a href="${reverse('dashboard')}">${_("Dashboard")}</a></li>
<li><a href="${reverse('learner_profile', kwargs={'username': user.username})}">${_("Profile")}</a></li>
<li><a href="${reverse('account_settings')}">${_("Account")}</a></li>
</%block>
<li><a href="${reverse('logout')}" role="menuitem">${_("Sign Out")}</a></li>
</ul>
</li>
</ul>
% if should_display_shopping_cart_func(): # see shoppingcart.context_processor.user_has_cart_context_processor
<ul class="user">
<li class="primary">
<a class="shopping-cart" href="${reverse('shoppingcart.views.show_cart')}">
<i class="icon fa fa-shopping-cart" aria-hidden="true"></i> ${_("Shopping Cart")}
</a>
</li>
</ul>
% endif
% else:
<nav aria-label="Account" class="nav-account-management">
<div class="right nav-courseware">
<div class="nav-courseware-01">
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
% if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain:
<a class="cta cta-login" href="${reverse('course-specific-login', args=[course.id.to_deprecated_string()])}${login_query()}">${_("Sign in")}</a>
% else:
<a class="cta cta-login" href="/login${login_query()}">${_("Sign in")}</a>
% endif
% endif
</div>
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
% if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain:
<div class="nav-courseware-02">
<a class="cta cta-register nav-courseware-button" href="${reverse('course-specific-register', args=[course.id.to_deprecated_string()])}">${_("Register")}</a>
</div>
% else:
<div class="nav-courseware-02">
<a class="cta cta-register nav-courseware-button" href="/register">${_("Register")}</a>
</div>
% endif
% endif
</div>
</nav>
% endif
</div>
</header>
% if course:
<!--[if lte IE 9]>
<div class="ie-banner" aria-hidden="true">
${Text(_('{begin_strong}Warning:{end_strong} Your browser is not fully supported. We strongly recommend using {chrome_link} or {ff_link}.')).format(
begin_strong=HTML('<strong>'),
end_strong=HTML('</strong>'),
chrome_link=HTML('<a href="https://www.google.com/chrome" target="_blank">Chrome</a>'),
ff_link=HTML('<a href="http://www.mozilla.org/firefox" target="_blank">Firefox</a>'),
)
}
</div>
<![endif]-->
% endif
<%include file="help_modal.html"/>

186
lms/templates/navigation.html
View File

@@ -10,7 +10,6 @@ from lms.djangoapps.ccx.overrides import get_current_ccx
from microsite_configuration import microsite
from microsite_configuration.templatetags.microsite import platform_name
from openedx.core.djangolib.markup import Text, HTML
from openedx.core.djangoapps.user_api.accounts.image_helpers import get_profile_image_urls_for_user
# App that handles subdomain specific branding
from branding import api as branding_api
@@ -21,6 +20,15 @@ from status.status import get_site_status_msg
## Provide a hook for themes to inject branding on top.
<%block name="navigation_top" />
## Add UI Toolkit components if using the Pattern Library
% if uses_pattern_library:
<%block name="js_extra">
<%static:require_module module_name="js/header_factory" class_name="HeaderFactory">
HeaderFactory();
</%static:require_module>
</%block>
% endif
<%block>
<%
try:
@@ -39,8 +47,8 @@ site_status_msg = get_site_status_msg(course_id)
</div>
% endif
</%block>
<header id="global-navigation" class="global ${"slim" if course else ""}" >
<nav class="nav-wrapper" aria-label="${_('Global')}">
<header id="global-navigation" class="header-global ${"slim" if course else ""}" >
<nav class="wrapper-header" aria-label="${_('Global')}">
<h1 class="logo">
<a href="${marketing_link('ROOT')}">
<%block name="navigation_logo">
@@ -63,10 +71,10 @@ site_status_msg = get_site_status_msg(course_id)
% endif
% if user.is_authenticated():
<ol class="left nav-global authenticated">
<ol class="left ${main_nav_menu_classlist} authenticated">
<%block name="navigation_global_links_authenticated">
% if settings.FEATURES.get('COURSES_ARE_BROWSABLE') and not show_program_listing:
<li class="nav-global-01">
<li class="item nav-global-01">
<a href="${marketing_link('COURSES')}">${_('Explore courses')}</a>
</li>
% endif
@@ -83,37 +91,84 @@ site_status_msg = get_site_status_msg(course_id)
</li>
% endif
%if settings.FEATURES.get('ENABLE_SYSADMIN_DASHBOARD','') and user.is_staff:
<li>
<li class="item">
## Translators: This is short for "System administration".
<a href="${reverse('sysadmin')}">${_("Sysadmin")}</a>
</li>
%endif
</%block>
</ol>
% if uses_pattern_library:
<div class="wrapper-user-menu dropdown-menu-container logged-in js-header-user-menu">
<a href="${reverse('dashboard')}" class="menu-title">
<span class="sr-only">${_("Dashboard for:")}</span>
<%
username = user.username
profile_image_url = get_profile_image_urls_for_user(user)['medium']
%>
<img class="menu-image" src="${profile_image_url}" alt="">
${username}
</a>
<button type="button" class="menu-button button-more has-dropdown js-dropdown-button default-icon" aria-haspopup="true" aria-expanded="false" aria-controls="${_("Usermenu")}">
<span class="icon-fallback icon-fallback-img">
<span class="icon icon-angle-down" aria-hidden="true"></span>
<span class="text">${_("Usermenu dropdown")}</span>
</span>
</button>
<ul class="dropdown-menu list-divided is-hidden" id="${_("Usermenu")}" tabindex="-1">
<%block name="navigation_dropdown_menu_links" >
<%
if uses_pattern_library:
dropdown_menu_item_classlist = "dropdown-item item has-block-link"
else:
dropdown_menu_item_classlist = ""
%>
<li class="${dropdown_menu_item_classlist}"><a href="${reverse('dashboard')}" class="action">${_("Dashboard")}</a></li>
<li class="${dropdown_menu_item_classlist}"><a href="${reverse('learner_profile', kwargs={'username': user.username})}" class="action">${_("Profile")}</a></li>
<li class="${dropdown_menu_item_classlist}"><a href="${reverse('account_settings')}" class="action">${_("Account")}</a></li>
</%block>
<li class="${dropdown_menu_item_classlist}"><a href="${reverse('logout')}" role="menuitem" class="action">${_("Sign Out")}</a></li>
</ul>
</div>
% else:
<ol class="user">
<li class="primary">
<a href="${reverse('dashboard')}" class="user-link">
<span class="sr">${_("Dashboard for:")}</span>
<%
username = user.username
profile_image_url = get_profile_image_urls_for_user(user)['medium']
if uses_pattern_library:
discovery_btn_classlist = "btn"
else:
discovery_btn_classlist = "cta cta-discovery"
%>
<img class="user-image-frame" src="${profile_image_url}" alt="${_('Profile image for {username}').format(username=username)}">
<div class="label-username">${username}</div>
</a>
</li>
<li class="primary">
<button class="dropdown" aria-haspopup="true" aria-expanded="false"><span class="sr">${_("More options dropdown")}</span><span class="fa fa-sort-desc" aria-hidden="true"></span></button>
<ul class="dropdown-menu" aria-label="More Options" role="menu">
<%block name="navigation_dropdown_menu_links" >
<li><a href="${reverse('dashboard')}">${_("Dashboard")}</a></li>
<li><a href="${reverse('learner_profile', kwargs={'username': user.username})}">${_("Profile")}</a></li>
<li><a href="${reverse('account_settings')}">${_("Account")}</a></li>
</%block>
<li><a href="${reverse('logout')}" role="menuitem">${_("Sign Out")}</a></li>
</ul>
</li>
</ol>
% if settings.FEATURES.get('COURSES_ARE_BROWSABLE'):
<li class="item nav-global-01">
<a href="${marketing_link('COURSES')}">${_('Find Courses')}</a>
</li>
% endif
% if show_program_listing:
<li class="tab-nav-item">
<a class="${'active ' if reverse('dashboard') == request.path else ''}tab-nav-link" href="${reverse('dashboard')}">
${_("Courses")}
</a>
</li>
<li class="tab-nav-item">
<a class="${'active ' if reverse('program_listing_view') == request.path else ''}tab-nav-link" href="${reverse('program_listing_view')}">
${_("Programs")}
</a>
</li>
% endif
% if settings.FEATURES.get('ENABLE_SYSADMIN_DASHBOARD','') and user.is_staff:
<li class="item">
## Translators: This is short for "System administration".
<a href="${reverse('sysadmin')}">${_("Sysadmin")}</a>
</li>
% endif
</%block>
</ol>
<%include file="user_dropdown.html"/>
% if should_display_shopping_cart_func() and not (course and static.is_request_in_themed_site()): # see shoppingcart.context_processor.user_has_cart_context_processor
<ol class="user">
<li class="primary">
@@ -124,57 +179,56 @@ site_status_msg = get_site_status_msg(course_id)
</ol>
% endif
% else:
<ol class="left nav-global">
<%block name="navigation_global_links">
% if static.get_value('ENABLE_MKTG_SITE', settings.FEATURES.get('ENABLE_MKTG_SITE', False)):
<li class="nav-global-01">
<a href="${marketing_link('HOW_IT_WORKS')}">${_("How it Works")}</a>
</li>
% if settings.FEATURES.get('COURSES_ARE_BROWSABLE'):
<li class="nav-global-02">
<a href="${marketing_link('COURSES')}">${_("Courses")}</a>
<ol class="left list-inline nav-global">
<%block name="navigation_global_links">
% if static.get_value('ENABLE_MKTG_SITE', settings.FEATURES.get('ENABLE_MKTG_SITE', False)):
<li class="item nav-global-01">
<a href="${marketing_link('HOW_IT_WORKS')}">${_("How it Works")}</a>
</li>
% if settings.FEATURES.get('COURSES_ARE_BROWSABLE'):
<li class="item nav-global-02">
<a href="${marketing_link('COURSES')}">${_("Courses")}</a>
</li>
% endif
<li class="item nav-global-03">
<a href="${marketing_link('SCHOOLS')}">${_("Schools")}</a>
</li>
% endif
<li class="nav-global-03">
<a href="${marketing_link('SCHOOLS')}">${_("Schools")}</a>
</li>
% endif
</%block>
</%block>
<%block name="navigation_other_global_links">
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
<%block name="navigation_other_global_links">
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
% if settings.FEATURES.get('ENABLE_COURSE_DISCOVERY'):
<li class="nav-global-05">
<a class="cta cta-discovery" href="/courses">${_("Explore courses")}</a>
</li>
<li class="item nav-global-05">
<a class="btn" href="/courses">${_("Explore Courses")}</a>
</li>
%endif
% if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain:
<li class="nav-global-04">
<a class="cta cta-register" href="${reverse('course-specific-register', args=[course.id.to_deprecated_string()])}">${_("Register")}</a>
</li>
<li class="item nav-global-04">
<a class="btn-neutral" href="${reverse('course-specific-register', args=[course.id.to_deprecated_string()])}">${_("Register")}</a>
</li>
% else:
<li class="nav-global-04">
<a class="cta cta-register" href="/register${login_query()}">${_("Register")}</a>
</li>
<li class="item nav-global-04">
<a class="btn-neutral" href="/register${login_query()}">${_("Register")}</a>
</li>
% endif
% endif
</%block>
</ol>
<ol class="right nav-courseware">
<%block name="navigation_sign_in">
<li class="nav-courseware-01">
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
% if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain:
<a class="cta cta-login" href="${reverse('course-specific-login', args=[course.id.to_deprecated_string()])}${login_query()}">${_("Sign in")}</a>
% else:
<a class="cta cta-login" href="/login${login_query()}">${_("Sign in")}</a>
% endif
% endif
</li>
</%block>
</ol>
</%block>
</ol>
<ol class="right nav-courseware list-inline">
<%block name="navigation_sign_in">
<li class="nav-courseware-01">
% if not settings.FEATURES['DISABLE_LOGIN_BUTTON']:
% if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain:
<a class="btn-brand btn-login" href="${reverse('course-specific-login', args=[course.id.to_deprecated_string()])}${login_query()}">${_("Sign in")}</a>
% else:
<a class="btn-brand btn-login" href="/login${login_query()}">${_("Sign in")}</a>
% endif
% endif
</li>
</%block>
</ol>
% endif
% if static.show_language_selector():
<% languages = static.get_released_languages() %>

4
lms/templates/register-sidebar.html
View File

@@ -13,10 +13,10 @@ from django.core.urlresolvers import reverse
% if has_extauth_info is UNDEFINED:
<div class="cta cta-login">
<div class="btn-brand btn-login">
<h3 class="title">${_("Already registered?")}</h3>
<p class="instructions">
<a class="cta-login-action" href="${reverse('signin_user')}${login_query()}">
<a class="btn-login-action" href="${reverse('signin_user')}${login_query()}">
${_("Log in")}
</a>
</p>

59
lms/templates/user_dropdown.html Normal file
View File

@@ -0,0 +1,59 @@
## mako
<%page expression_filter="h"/>
<%namespace name='static' file='static_content.html'/>
<%!
from django.core.urlresolvers import reverse
from django.utils.translation import ugettext as _
from openedx.core.djangoapps.user_api.accounts.image_helpers import get_profile_image_urls_for_user
%>
% if uses_pattern_library:
<div class="wrapper-user-menu dropdown-menu-container logged-in js-header-user-menu">
<a href="${reverse('dashboard')}" class="menu-title">
<span class="sr-only">${_("Dashboard for:")}</span>
<%
username = user.username
profile_image_url = get_profile_image_urls_for_user(user)['medium']
%>
<img class="menu-image" src="${profile_image_url}" alt="">
${username}
</a>
<button type="button" class="menu-button button-more has-dropdown js-dropdown-button default-icon" aria-haspopup="true" aria-expanded="false" aria-controls="${_("Usermenu")}">
<span class="icon-fallback icon-fallback-img">
<span class="icon icon-angle-down" aria-hidden="true"></span>
<span class="text">${_("Usermenu dropdown")}</span>
</span>
</button>
<ul class="dropdown-menu list-divided is-hidden" id="${_("Usermenu")}" tabindex="-1">
<%block name="navigation_dropdown_menu_links" >
<li class="dropdown-item item has-block-link"><a href="${reverse('dashboard')}" class="action">${_("Dashboard")}</a></li>
<li class="dropdown-item item has-block-link"><a href="${reverse('learner_profile', kwargs={'username': user.username})}" class="action">${_("Profile")}</a></li>
<li class="dropdown-item item has-block-link"><a href="${reverse('account_settings')}" class="action">${_("Account")}</a></li>
</%block>
<li class="dropdown-item item has-block-link"><a href="${reverse('logout')}" role="menuitem" class="action">${_("Sign Out")}</a></li>
</ul>
</div>
% else:
<ol class="user">
<li class="primary">
<a href="${reverse('dashboard')}" class="user-link">
<span class="sr">${_("Dashboard for:")}</span>
<%
username = user.username
profile_image_url = get_profile_image_urls_for_user(user)['medium']
%>
<img class="user-image-frame" src="${profile_image_url}" alt="${_('Profile image for {username}').format(username=username)}">
<div class="label-username">${username}</div>
</a>
</li>
<li class="primary">
<button class="dropdown" aria-haspopup="true" aria-expanded="false"><span class="sr">${_("More options dropdown")}</span><span class="fa fa-sort-desc" aria-hidden="true"></span></button>
<ul class="dropdown-menu" aria-label="More Options" role="menu">
${navigation_dropdown_menu_links()}
<li class="item"><a href="${reverse('logout')}" role="menuitem">${_("Sign Out")}</a></li>
</ul>
</li>
</ol>
% endif

8
lms/templates/ux/reference/index.html
View File

@@ -1,5 +1,9 @@
## Override the default styles_version to the Pattern Library version (version 2)
<%! main_css = "style-main-v2" %>
<%page expression_filter="h"/>
<%inherit file="/main.html" />
<%namespace name='static' file='/static_content.html'/>
<%block name="pagetitle">UX Reference</%block>
@@ -12,10 +16,10 @@
<div class="inner-wrapper">
<div class="main-column">
<article class="window unit-body">
<h1>UX Style Reference</h1>
<h2>UX Style Reference</h2>
<section class="xblock xblock-student_view xmodule_display xmodule_HtmlModule">
<h2>Page Types</h2>
<h3>Page Types</h3>
<ul>
<li><a href="pattern-library-test.html">Pattern Library test page</a></li>
</ul>

16
lms/templates/ux/reference/pattern-library-test.html
View File

@@ -10,17 +10,15 @@
<%block name="bodyclass">pattern-library</%block>
<%block name="content">
<h3 class="hd-6 example-set-hd">Warning Alert with Message Only</h3>
<div class="example-set">
<div class="alert alert-warning" role="alert" aria-labelledby="alert-warning-publish-title" tabindex="-1">
<span class="icon alert-icon icon-warning" aria-hidden="true"></span>
<h1>Pattern Library test page</h1>
<div class="alert-message">
<p class="alert-copy">
Interesting pattern library content to come...
</p>
</div>
<div class="alert alert-warning" role="alert" tabindex="-1">
<span class="icon alert-icon fa fa-exclamation-triangle" aria-hidden="true"></span>
<div class="alert-message">
<p class="alert-copy">
Interesting pattern library content to come...
</p>
</div>
</div>
</%block>

2
lms/urls.py
View File

@@ -966,7 +966,7 @@ if settings.DEBUG:
)
# in debug mode, allow any template to be rendered (most useful for UX reference templates)
urlpatterns += url(r'^template/(?P<template>.+)$', 'debug.views.show_reference_template'),
urlpatterns += url(r'^template/(?P<template>.+)$', 'openedx.core.djangoapps.debug.views.show_reference_template'),
if 'debug_toolbar' in settings.INSTALLED_APPS:
import debug_toolbar