diff --git a/AUTHORS b/AUTHORS index c170b8459f..a27106006a 100644 --- a/AUTHORS +++ b/AUTHORS @@ -173,3 +173,4 @@ Jason Zhu Marceau Cnudde Braden MacDonald Jonathan Piacenti +Alasdair Swan diff --git a/lms/static/sass/shared/_header.scss b/lms/static/sass/shared/_header.scss index eb6226e97a..8581d92010 100644 --- a/lms/static/sass/shared/_header.scss +++ b/lms/static/sass/shared/_header.scss @@ -26,208 +26,207 @@ header.global { } } - ol { - &.left { - float: left; + .left { + float: left; + } + + .guest { + float: right; + } + + > li { + display: inline-block; + margin-right: 20px; + position: relative; + vertical-align: middle; + + &:last-child { + margin-right: 0px; } - &.guest { - float: right; + a { + letter-spacing: 1px; + vertical-align: middle; } + } - > li { + li.secondary { + > a { + color: $link-color; + display: block; + font-family: $sans-serif; display: inline-block; - margin-right: 20px; - position: relative; + margin: 0px 30px 0px 0px; + text-decoration: none; + text-transform: uppercase; + text-shadow: 0 1px rgba(255,255,255, 0.6); + + &:last-child { + margin-right: 0px; + } + + &:hover, &:focus { + color: $base-font-color; + } + } + } + + .primary { + margin-right: 5px; + + > a { + @include background-image($button-bg-image); + background-color: $button-bg-color; + border: 1px solid $border-color-2; + border-radius: 3px; + @include box-sizing(border-box); + box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6); + color: $base-font-color; + display: inline-block; + font-family: $sans-serif; + display: inline-block; + line-height: 1em; + margin: 1px 5px; + padding: 10px 12px; + text-decoration: none; + text-transform: uppercase; + text-shadow: 0 1px rgba(255,255,255, 0.6); vertical-align: middle; &:last-child { margin-right: 0px; } - a { - letter-spacing: 1px; - vertical-align: middle; + &:hover, &:focus, &:active { + background: $button-bg-hover-color; } } + } - li.secondary { - > a { - color: $link-color; - display: block; - font-family: $sans-serif; - display: inline-block; - margin: 0px 30px 0px 0px; - text-decoration: none; - text-transform: uppercase; - text-shadow: 0 1px rgba(255,255,255, 0.6); + .user { + float: right; + margin-top: 4px; - &:last-child { - margin-right: 0px; - } - - &:hover, &:focus { - color: $base-font-color; - } - } - } - - li.primary { - margin-right: 5px; + > .primary { + display: block; + float: left; + margin: 0px; + position: relative; > a { - @include background-image($button-bg-image); - background-color: $button-bg-color; - border: 1px solid $border-color-2; - border-radius: 3px; - @include box-sizing(border-box); - box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6); - color: $base-font-color; - display: inline-block; - font-family: $sans-serif; - display: inline-block; - line-height: 1em; - margin: 1px 5px; - padding: 10px 12px; - text-decoration: none; - text-transform: uppercase; - text-shadow: 0 1px rgba(255,255,255, 0.6); - vertical-align: middle; - - &:last-child { - margin-right: 0px; - } - - &:hover, &:focus, &:active { - background: $button-bg-hover-color; - } - } - } - - &.user { - float: right; - margin-top: 4px; - - > li.primary { - display: block; - float: left; margin: 0px; + @include border-right-radius(0px); + } + + &:last-child { + > a { + border-radius: 0 4px 4px 0; + border-left: none; + padding: 5px 8px 7px 8px; + + &.shopping-cart { + border-radius: 4px; + border: 1px solid $border-color-2; + margin-right: 10px; + padding-bottom: 6px; + } + } + } + } + + a.user-link { + padding: 6px 12px 8px 35px; + position: relative; + text-transform: none; + font-size: 14px; + font-weight: bold; + letter-spacing: 0; + + .avatar { + @include background-image(url('../images/small-header-home-icon.png')); + background-repeat: no-repeat; + height: 26px; + display: inline-block; + left: 8px; + opacity: 0.5; + overflow: hidden; + position: absolute; + top: 4px; + @include transition(all 0.15s linear 0s); + width: 26px; + } + + &:hover, &:focus { + .avatar { + opacity: 0.8; + } + } + } + + .dropdown-menu { + background: $border-color-4; + border-radius: 4px; + box-shadow: 0 2px 24px 0 rgba(0,0,0, 0.3); + border: 1px solid $border-color-3; + display: none; + padding: 5px 10px; + position: absolute; + right: 0px; + top: 34px; + width: 170px; + z-index: 3; + + &.expanded { + display: block; + } + + &::before { + background: transparent; + border: { + top: 6px solid $border-color-4; + right: 6px solid $border-color-4; + bottom: 6px solid transparent; + left: 6px solid transparent; + } + box-shadow: 1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3; + content: ""; + display: block; + height: 0px; + position: absolute; + @include transform(rotate(-45deg)); + right: 12px; + top: -6px; + width: 0px; + } + + li { + display: block; + border-top: 1px dotted $border-color-2; + box-shadow: inset 0 1px 0 0 rgba(255,255,255, 0.05); + + &:first-child { + border: none; + box-shadow: none; + } > a { - margin: 0px; - @include border-right-radius(0px); - } - - &:last-child { - > a { - border-radius: 0 4px 4px 0; - border-left: none; - padding: 5px 8px 7px 8px; - - &.shopping-cart { - border-radius: 4px; - border: 1px solid $border-color-2; - margin-right: 10px; - padding-bottom: 6px; - } - } - } - } - - a.user-link { - padding: 6px 12px 8px 35px; - position: relative; - text-transform: none; - font-size: 14px; - font-weight: bold; - letter-spacing: 0; - - .avatar { - @include background-image(url('../images/small-header-home-icon.png')); - background-repeat: no-repeat; - height: 26px; - display: inline-block; - left: 8px; - opacity: 0.5; + border: 1px solid transparent; + border-radius: 3px; + @include box-sizing(border-box); + color: $link-color; + cursor: pointer; + display: block; + margin: 5px 0px; overflow: hidden; - position: absolute; - top: 4px; - @include transition(all 0.15s linear 0s); - width: 26px; - } + padding: 3px 5px 4px; + text-overflow: ellipsis; + @include transition(padding 0.15s linear 0s); + white-space: nowrap; + width: 100%; - &:hover, &:focus { - .avatar { - opacity: 0.8; - } - } - } - - ul.dropdown-menu { - background: $border-color-4; - border-radius: 4px; - box-shadow: 0 2px 24px 0 rgba(0,0,0, 0.3); - border: 1px solid $border-color-3; - display: none; - padding: 5px 10px; - position: absolute; - right: 0px; - top: 34px; - width: 170px; - z-index: 3; - - &.expanded { - display: block; - } - - &::before { - background: transparent; - border: { - top: 6px solid $border-color-4; - right: 6px solid $border-color-4; - bottom: 6px solid transparent; - left: 6px solid transparent; - } - box-shadow: 1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3; - content: ""; - display: block; - height: 0px; - position: absolute; - @include transform(rotate(-45deg)); - right: 12px; - top: -6px; - width: 0px; - } - - li { - display: block; - border-top: 1px dotted $border-color-2; - box-shadow: inset 0 1px 0 0 rgba(255,255,255, 0.05); - - &:first-child { - border: none; - box-shadow: none; - } - - > a { - border: 1px solid transparent; - border-radius: 3px; - @include box-sizing(border-box); - color: $link-color; - cursor: pointer; - display: block; - margin: 5px 0px; - overflow: hidden; - padding: 3px 5px 4px; - text-overflow: ellipsis; - @include transition(padding 0.15s linear 0s); - white-space: nowrap; - width: 100%; - - &:hover, &:focus { - color: $base-font-color; - text-decoration: none; - } + &:hover, &:focus { + color: $base-font-color; + text-decoration: none; } } } @@ -237,8 +236,10 @@ header.global { .nav-global { margin-top: ($baseline/2); list-style: none; + float: left; - li { + li, + div { display: inline-block; margin: 0 $baseline+1 0 0; font-size: em(14); @@ -282,7 +283,7 @@ header.global { margin-top: ($baseline/4); list-style: none; - li { + div { display: inline-block; .cta { @@ -350,205 +351,204 @@ header.global-new { } } - ol { - &.left { - float: left; + .left { + float: left; + } + + .guest { + float: right; + } + + > li { + display: inline-block; + margin-right: 20px; + position: relative; + vertical-align: middle; + + &:last-child { + margin-right: 0px; } - &.guest { - float: right; + a { + vertical-align: middle; } + } - > li { + li.secondary { + > a { + color: $link-color; + font-family: $sans-serif; display: inline-block; - margin-right: 20px; - position: relative; + margin: 0px 30px 0px 0px; + text-decoration: none; + text-transform: uppercase; + text-shadow: 0 1px rgba(255,255,255, 0.6); + + &:last-child { + margin-right: 0px; + } + + &:hover, &:focus { + color: $base-font-color; + } + } + } + + .primary { + margin-right: 5px; + + > a { + @include background-image($button-bg-image); + background-color: $button-bg-color; + border: 1px solid $border-color-2; + border-radius: 3px; + @include box-sizing(border-box); + box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6); + color: $base-font-color; + font-family: $header-sans-serif; + display: inline-block; + line-height: 1em; + margin: 1px 5px; + padding: 10px 12px; + text-decoration: none; + text-transform: uppercase; + text-shadow: 0 1px rgba(255,255,255, 0.6); vertical-align: middle; &:last-child { margin-right: 0px; } - a { - vertical-align: middle; + &:hover, &:focus, &:active { + background: $button-bg-hover-color; } } + } - li.secondary { - > a { - color: $link-color; - font-family: $sans-serif; - display: inline-block; - margin: 0px 30px 0px 0px; - text-decoration: none; - text-transform: uppercase; - text-shadow: 0 1px rgba(255,255,255, 0.6); + .user { + float: right; + margin-top: 4px; - &:last-child { - margin-right: 0px; - } - - &:hover, &:focus { - color: $base-font-color; - } - } - } - - li.primary { - margin-right: 5px; + > .primary { + display: block; + float: left; + margin: 0px; + position: relative; > a { - @include background-image($button-bg-image); - background-color: $button-bg-color; - border: 1px solid $border-color-2; - border-radius: 3px; - @include box-sizing(border-box); - box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6); - color: $base-font-color; - font-family: $header-sans-serif; - display: inline-block; - line-height: 1em; - margin: 1px 5px; - padding: 10px 12px; - text-decoration: none; - text-transform: uppercase; - text-shadow: 0 1px rgba(255,255,255, 0.6); - vertical-align: middle; - - &:last-child { - margin-right: 0px; - } - - &:hover, &:focus, &:active { - background: $button-bg-hover-color; - } - } - } - - &.user { - float: right; - margin-top: 4px; - - > li.primary { - display: block; - float: left; margin: 0px; + @include border-right-radius(0px); + } + + &:last-child { + > a { + border-radius: 0 4px 4px 0; + border-left: none; + padding: 5px 8px 7px 8px; + + &.shopping-cart { + border-radius: 4px; + border: 1px solid $border-color-2; + margin-right: 10px; + padding-bottom: 6px; + } + } + } + } + + a.user-link { + padding: 6px 12px 8px 35px; + position: relative; + text-transform: none; + font-size: 14px; + font-weight: bold; + letter-spacing: 0; + + .avatar { + @include background-image(url('../images/small-header-home-icon.png')); + background-repeat: no-repeat; + height: 26px; + display: inline-block; + left: 8px; + opacity: 0.5; + overflow: hidden; + position: absolute; + top: 4px; + @include transition(all 0.15s linear 0s); + width: 26px; + } + + &:hover, &:focus { + .avatar { + opacity: 0.8; + } + } + } + + .dropdown-menu { + background: $border-color-4; + border-radius: 4px; + box-shadow: 0 2px 24px 0 rgba(0,0,0, 0.3); + border: 1px solid $border-color-3; + display: none; + padding: 5px 10px; + position: absolute; + right: 0px; + top: 34px; + width: 170px; + z-index: 3; + + &.expanded { + display: block; + } + + &::before { + background: transparent; + border: { + top: 6px solid $border-color-4; + right: 6px solid $border-color-4; + bottom: 6px solid transparent; + left: 6px solid transparent; + } + box-shadow: 1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3; + content: ""; + display: block; + height: 0px; + position: absolute; + @include transform(rotate(-45deg)); + right: 12px; + top: -6px; + width: 0px; + } + + li { + display: block; + border-top: 1px dotted $border-color-2; + box-shadow: inset 0 1px 0 0 rgba(255,255,255, 0.05); + + &:first-child { + border: none; + box-shadow: none; + } > a { - margin: 0px; - @include border-right-radius(0px); - } - - &:last-child { - > a { - border-radius: 0 4px 4px 0; - border-left: none; - padding: 5px 8px 7px 8px; - - &.shopping-cart { - border-radius: 4px; - border: 1px solid $border-color-2; - margin-right: 10px; - padding-bottom: 6px; - } - } - } - } - - a.user-link { - padding: 6px 12px 8px 35px; - position: relative; - text-transform: none; - font-size: 14px; - font-weight: bold; - letter-spacing: 0; - - .avatar { - @include background-image(url('../images/small-header-home-icon.png')); - background-repeat: no-repeat; - height: 26px; - display: inline-block; - left: 8px; - opacity: 0.5; + border: 1px solid transparent; + border-radius: 3px; + @include box-sizing(border-box); + color: $link-color; + cursor: pointer; + display: block; + margin: 5px 0px; overflow: hidden; - position: absolute; - top: 4px; - @include transition(all 0.15s linear 0s); - width: 26px; - } + padding: 3px 5px 4px; + text-overflow: ellipsis; + @include transition(padding 0.15s linear 0s); + white-space: nowrap; + width: 100%; - &:hover, &:focus { - .avatar { - opacity: 0.8; - } - } - } - - ul.dropdown-menu { - background: $border-color-4; - border-radius: 4px; - box-shadow: 0 2px 24px 0 rgba(0,0,0, 0.3); - border: 1px solid $border-color-3; - display: none; - padding: 5px 10px; - position: absolute; - right: 0px; - top: 34px; - width: 170px; - z-index: 3; - - &.expanded { - display: block; - } - - &::before { - background: transparent; - border: { - top: 6px solid $border-color-4; - right: 6px solid $border-color-4; - bottom: 6px solid transparent; - left: 6px solid transparent; - } - box-shadow: 1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3; - content: ""; - display: block; - height: 0px; - position: absolute; - @include transform(rotate(-45deg)); - right: 12px; - top: -6px; - width: 0px; - } - - li { - display: block; - border-top: 1px dotted $border-color-2; - box-shadow: inset 0 1px 0 0 rgba(255,255,255, 0.05); - - &:first-child { - border: none; - box-shadow: none; - } - - > a { - border: 1px solid transparent; - border-radius: 3px; - @include box-sizing(border-box); - color: $link-color; - cursor: pointer; - display: block; - margin: 5px 0px; - overflow: hidden; - padding: 3px 5px 4px; - text-overflow: ellipsis; - @include transition(padding 0.15s linear 0s); - white-space: nowrap; - width: 100%; - - &:hover, &:focus { - color: $base-font-color; - text-decoration: none; - } + &:hover, &:focus { + color: $base-font-color; + text-decoration: none; } } } @@ -558,8 +558,10 @@ header.global-new { .nav-global { margin-top: ($baseline/2); list-style: none; + float: left; - li { + li, + div { display: inline-block; margin: 0 $baseline+1 0 0; text-transform: uppercase; @@ -587,12 +589,22 @@ header.global-new { } } - .nav-courseware { @extend .nav-global; float: right; - li { + div { + display: inline-block; + margin: 0 21px 0 0; + text-transform: uppercase; + letter-spacing: 0!important; + position: relative; + vertical-align: middle; + + &:last-child { + margin-right: 0; + } + a { &.nav-courseware-button { padding: 5px 45px 5px 45px; diff --git a/lms/templates/footer-edx-new.html b/lms/templates/footer-edx-new.html index 05d3ffcf3a..6a1848117b 100644 --- a/lms/templates/footer-edx-new.html +++ b/lms/templates/footer-edx-new.html @@ -5,7 +5,7 @@ ## WARNING: These files are specific to edx.org and are not used in installations outside of that domain. Open edX users will want to use the file "footer.html" for any changes or overrides.
-
+

${_("About edX")}

@@ -40,7 +40,7 @@
-
+
+

${_("Follow Us")}

- + ${_("Twitter")} - + ${_("Facebook")} - + ${_("Meetup")} - + ${_("LinkedIn")} - + ${_("Google+")}
diff --git a/lms/templates/navigation.html b/lms/templates/navigation.html index bcaf320eae..ab42f2b55d 100644 --- a/lms/templates/navigation.html +++ b/lms/templates/navigation.html @@ -36,12 +36,12 @@ site_status_msg = get_site_status_msg(course_id) % endif -
-
+
  1. @@ -79,6 +80,7 @@ site_status_msg = get_site_status_msg(course_id)
+ % if display_shopping_cart: # see shoppingcart.context_processor.user_has_cart_context_processor
  1. @@ -105,28 +107,28 @@ site_status_msg = get_site_status_msg(course_id)
-
    +
    % if not settings.FEATURES['DISABLE_LOGIN_BUTTON']: % if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain: -
  1. +
    ${_("Register")} -
    2. +
    % else: -
  2. +
    ${_("Register")} -
    3. + % endif % endif -
  3. - % if not settings.FEATURES['DISABLE_LOGIN_BUTTON']: - % if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain: - - % else: - - % endif - % endif -
    4. -
+
+ % if not settings.FEATURES['DISABLE_LOGIN_BUTTON']: + % if course and settings.FEATURES.get('RESTRICT_ENROLL_BY_REG_METHOD') and course.enrollment_domain: + + % else: + + % endif + % endif +
+ % endif