Skip to content

E
edx-platform
Commit ea163de0 by Giulio Gratta
Options

Merge pull request #1479 from edx/giulio/a11y-batch1 

A11Y changes: better :focus styling, increased contrast, and added image alt texts
parents 9e76c612 5a46177a
Showing with 199 additions and 188 deletions
common/lib/xmodule/xmodule/css/video/display.scss
...@@ -595,7 +595,7 @@ div.video { ...@@ -595,7 +595,7 @@ div.video {
li { li {
border: 0; border: 0;
color: #666; color: rgb(29,157,217);
cursor: pointer; cursor: pointer;
margin-bottom: 8px; margin-bottom: 8px;
padding: 0; padding: 0;
...@@ -613,7 +613,7 @@ div.video { ...@@ -613,7 +613,7 @@ div.video {
} }
&:hover { &:hover {
color: $blue; text-decoration: underline;
} }
&:empty { &:empty {
......
common/lib/xmodule/xmodule/templates/about/overview.yaml
...@@ -19,7 +19,7 @@ data: | ...@@ -19,7 +19,7 @@ data: |
<h2>Course Staff</h2> <h2>Course Staff</h2>
<article class="teacher"> <article class="teacher">
<div class="teacher-image"> <div class="teacher-image">
<img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0"> <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0" alt="Course Staff Image #1">
</div> </div>
<h3>Staff Member #1</h3> <h3>Staff Member #1</h3>
...@@ -28,7 +28,7 @@ data: | ...@@ -28,7 +28,7 @@ data: |
<article class="teacher"> <article class="teacher">
<div class="teacher-image"> <div class="teacher-image">
<img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0"> <img src="/static/images/pl-faculty.png" align="left" style="margin:0 20 px 0" alt="Course Staff Image #2">
</div> </div>
<h3>Staff Member #2</h3> <h3>Staff Member #2</h3>
......
lms/static/sass/_discussion.scss
...@@ -2619,7 +2619,7 @@ body.discussion { ...@@ -2619,7 +2619,7 @@ body.discussion {
width: 10px; width: 10px;
height: 14px; height: 14px;
padding-right: 3px; padding-right: 3px;
color: #666; color: #333;
} }
.pinned .icon { .pinned .icon {
...@@ -2640,7 +2640,7 @@ body.discussion { ...@@ -2640,7 +2640,7 @@ body.discussion {
} }
.notpinned span { .notpinned span {
color: #666; color: #333;
font-style: italic; font-style: italic;
} }
...@@ -2665,7 +2665,7 @@ display:none; ...@@ -2665,7 +2665,7 @@ display:none;
.notflagged .icon { .notflagged .icon {
display: block; display: block;
color: #666; color: #333;
float: left; float: left;
margin: 3px; margin: 3px;
width: 10px; width: 10px;
...@@ -2690,6 +2690,6 @@ display:none; ...@@ -2690,6 +2690,6 @@ display:none;
} }
.notflagged span { .notflagged span {
color: #666; color: #333;
font-style: italic; font-style: italic;
} }
lms/static/sass/_shame.scss
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
&.disabled, &[disabled], &.is-disabled { &.disabled, &[disabled], &.is-disabled {
background: $action-primary-disabled-bg; background: $action-primary-disabled-bg;
&:hover { &:hover, &:focus {
background: $action-primary-disabled-bg !important; // needed for IE currently background: $action-primary-disabled-bg !important; // needed for IE currently
} }
} }
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
background: $action-primary-bg; background: $action-primary-bg;
color: $action-primary-fg; color: $action-primary-fg;
&:hover, &:active { &:hover, &:active, &:focus {
background: $action-primary-focused-bg; background: $action-primary-focused-bg;
} }
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
background: $action-primary-active-bg; background: $action-primary-active-bg;
color: $action-primary-active-fg; color: $action-primary-active-fg;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $action-primary-active-focused-shadow; box-shadow: inset 0 2px 1px 1px $action-primary-active-focused-shadow;
color: $action-primary-active-focused-fg; color: $action-primary-active-focused-fg;
} }
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
background: $action-secondary-bg; background: $action-secondary-bg;
color: $action-secondary-fg; color: $action-secondary-fg;
&:hover, &:active { &:hover, &:active, &:focus {
background: $action-secondary-focused-bg; background: $action-secondary-focused-bg;
} }
...@@ -98,7 +98,7 @@ ...@@ -98,7 +98,7 @@
background: $action-secondary-active-bg; background: $action-secondary-active-bg;
color: $action-secondary-active-fg; color: $action-secondary-active-fg;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $action-secondary-active-focused-shadow; box-shadow: inset 0 2px 1px 1px $action-secondary-active-focused-shadow;
color: $action-secondary-active-focused-fg; color: $action-secondary-active-focused-fg;
} }
...@@ -172,7 +172,7 @@ ...@@ -172,7 +172,7 @@
opacity: 0.6; opacity: 0.6;
} }
&:hover .track { &:hover .track, &:focus .track {
opacity: 1.0; opacity: 1.0;
} }
...@@ -205,13 +205,13 @@ ...@@ -205,13 +205,13 @@
header.global { header.global {
.logo a:hover, .logo:active { .logo a:hover, .logo:active, .logo a:focus {
border: none; border: none;
text-decoration: none; text-decoration: none;
padding-bottom: 0; padding-bottom: 0;
} }
.nav-global a:hover, .nav-global a:active { .nav-global a:hover, .nav-global a:active, .nav-global a:focus {
border: none; border: none;
} }
} }
......
lms/static/sass/base/_base.scss
...@@ -66,7 +66,7 @@ p { ...@@ -66,7 +66,7 @@ p {
text-decoration: none; text-decoration: none;
@include transition(all 0.1s linear 0s); @include transition(all 0.1s linear 0s);
&:hover { &:hover, &:focus {
color: $link-color; color: $link-color;
text-decoration: underline; text-decoration: underline;
} }
...@@ -79,7 +79,7 @@ a:link, a:visited { ...@@ -79,7 +79,7 @@ a:link, a:visited {
text-decoration: none; text-decoration: none;
@include transition(all 0.1s linear 0s); @include transition(all 0.1s linear 0s);
&:hover { &:hover, &:focus {
text-decoration: underline; text-decoration: underline;
} }
...@@ -246,7 +246,7 @@ mark { ...@@ -246,7 +246,7 @@ mark {
padding: 6px 22px 11px; padding: 6px 22px 11px;
display: inline-block; display: inline-block;
&:hover { &:hover, &:focus {
color: #fff; color: #fff;
background: #1D9DD9; background: #1D9DD9;
} }
...@@ -275,7 +275,7 @@ mark { ...@@ -275,7 +275,7 @@ mark {
border-radius: 0px 0px 10px 10px; border-radius: 0px 0px 10px 10px;
} }
&:hover { &:hover, &:focus {
color: #fff; color: #fff;
background: #1D9DD9; background: #1D9DD9;
} }
......
lms/static/sass/base/_reset.scss
...@@ -11,7 +11,7 @@ body { margin: 0; font-size: 1em; line-height: 1.4; } ...@@ -11,7 +11,7 @@ body { margin: 0; font-size: 1em; line-height: 1.4; }
a { color: #00e; } a { color: #00e; }
a:visited { color: #551a8b; } a:visited { color: #551a8b; }
a:hover { color: #06e; } a:hover, a:focus { color: #06e; }
a:focus { outline: thin dotted; } a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; } a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; } abbr[title] { border-bottom: 1px dotted; }
......
lms/static/sass/course/_discussions-inline.scss
...@@ -275,7 +275,7 @@ ...@@ -275,7 +275,7 @@
padding-bottom: 2px; padding-bottom: 2px;
border-color: #333; border-color: #333;
&:hover { &:hover, &:focus {
border-color: #222; border-color: #222;
} }
} }
......
lms/static/sass/course/_gradebook.scss
...@@ -195,6 +195,8 @@ div.gradebook-wrapper { ...@@ -195,6 +195,8 @@ div.gradebook-wrapper {
.student-table tr:hover td, .student-table tr:hover td,
.grade-table tr:hover td, .grade-table tr:hover td,
.student-table tr:focus td,
.grade-table tr:focus td,
.student-table tr.highlight td, .student-table tr.highlight td,
.grade-table tr.highlight td { .grade-table tr.highlight td {
border-color: #74b7d6; border-color: #74b7d6;
......
lms/static/sass/course/_info.scss
...@@ -105,7 +105,7 @@ div.info-wrapper { ...@@ -105,7 +105,7 @@ div.info-wrapper {
display: block; display: block;
padding: 0; padding: 0;
&:hover { &:hover, &:focus {
background: transparent; background: transparent;
} }
} }
...@@ -140,7 +140,7 @@ div.info-wrapper { ...@@ -140,7 +140,7 @@ div.info-wrapper {
@include inline-block; @include inline-block;
padding: 0; padding: 0;
&:hover { &:hover, &:focus {
background: transparent; background: transparent;
} }
} }
...@@ -161,7 +161,7 @@ div.info-wrapper { ...@@ -161,7 +161,7 @@ div.info-wrapper {
@include inline-block; @include inline-block;
padding: 0; padding: 0;
&:hover { &:hover, &:focus {
background: transparent; background: transparent;
} }
} }
...@@ -177,7 +177,7 @@ div.info-wrapper { ...@@ -177,7 +177,7 @@ div.info-wrapper {
position: absolute; position: absolute;
width: 100%; width: 100%;
&:hover { &:hover, &:focus {
opacity: 0.6; opacity: 0.6;
filter: alpha(opacity=60); filter: alpha(opacity=60);
......
lms/static/sass/course/_open_ended_grading.scss
...@@ -44,7 +44,8 @@ ...@@ -44,7 +44,8 @@
padding: 5px 0px; padding: 5px 0px;
font-size: 1.1em; font-size: 1.1em;
} }
.notification-link:hover .notification-link:hover,
.notification-link:focus
{ {
background-color: #eee; background-color: #eee;
} }
......
lms/static/sass/course/_profile.scss
...@@ -79,7 +79,7 @@ div.profile-wrapper { ...@@ -79,7 +79,7 @@ div.profile-wrapper {
text-transform: uppercase; text-transform: uppercase;
top: 9px; top: 9px;
&:hover { &:hover, &:focus {
color: #555; color: #555;
} }
} }
...@@ -110,7 +110,7 @@ div.profile-wrapper { ...@@ -110,7 +110,7 @@ div.profile-wrapper {
text-transform: uppercase; text-transform: uppercase;
top: 9px; top: 9px;
&:hover { &:hover, &:focus {
color: #555; color: #555;
} }
} }
......
lms/static/sass/course/_textbook.scss
...@@ -85,7 +85,7 @@ div.book-wrapper { ...@@ -85,7 +85,7 @@ div.book-wrapper {
color: $link-color; color: $link-color;
cursor: pointer; cursor: pointer;
&:hover { &:hover, &:focus {
background-color: transparent; background-color: transparent;
color: $link-hover; color: $link-hover;
...@@ -101,7 +101,7 @@ div.book-wrapper { ...@@ -101,7 +101,7 @@ div.book-wrapper {
position: relative; position: relative;
top: 4px; top: 4px;
&:hover { &:hover, &:focus {
filter: alpha(opacity=60); filter: alpha(opacity=60);
opacity: 0.6; opacity: 0.6;
} }
...@@ -161,7 +161,7 @@ div.book-wrapper { ...@@ -161,7 +161,7 @@ div.book-wrapper {
vertical-align: middle; vertical-align: middle;
width: 100%; width: 100%;
&:hover { &:hover, &:focus {
opacity: 1.0; opacity: 1.0;
} }
......
lms/static/sass/course/base/_base.scss
...@@ -15,7 +15,7 @@ table { ...@@ -15,7 +15,7 @@ table {
} }
a { a {
&:hover { &:hover, &:focus {
color: $pink; color: $pink;
text-decoration: none !important; text-decoration: none !important;
} }
......
lms/static/sass/course/base/_extends.scss
...@@ -10,7 +10,7 @@ h1.top-header { ...@@ -10,7 +10,7 @@ h1.top-header {
text-transform: none; text-transform: none;
letter-spacing: 0; letter-spacing: 0;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -129,7 +129,7 @@ h1.top-header { ...@@ -129,7 +129,7 @@ h1.top-header {
@include box-sizing(border-box); @include box-sizing(border-box);
padding: lh(.25) lh(.5) lh(.25) 0; padding: lh(.25) lh(.5) lh(.25) 0;
&:hover { &:hover, &:focus {
color: #666; color: #666;
background: #f6f6f6; background: #f6f6f6;
} }
...@@ -153,7 +153,7 @@ h1.top-header { ...@@ -153,7 +153,7 @@ h1.top-header {
width: 16px; width: 16px;
z-index: 99; z-index: 99;
&:hover { &:hover, &:focus {
background-color: white; background-color: white;
} }
} }
...@@ -177,7 +177,7 @@ h1.top-header { ...@@ -177,7 +177,7 @@ h1.top-header {
border-left: 1px solid lighten($border-color, 10%); border-left: 1px solid lighten($border-color, 10%);
display: block; display: block;
&:hover { &:hover, &:focus {
background: none; background: none;
} }
} }
......
lms/static/sass/course/base/_mixins.scss
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
text-shadow: 0 1px 0 rgba(0, 0, 0, .3); text-shadow: 0 1px 0 rgba(0, 0, 0, .3);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
&:hover { &:hover, &:focus {
border-color: #297095; border-color: #297095;
@include linear-gradient(top, #4fbbe4, #2090d0); @include linear-gradient(top, #4fbbe4, #2090d0);
} }
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.6);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
&:hover { &:hover, &:focus {
@include linear-gradient(top, #fff, #ddd); @include linear-gradient(top, #fff, #ddd);
} }
} }
...@@ -51,7 +51,7 @@ ...@@ -51,7 +51,7 @@
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6); text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.6);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 1px 1px rgba(0, 0, 0, .15);
&:hover { &:hover, &:focus {
background: -webkit-linear-gradient(top, #888, #666); background: -webkit-linear-gradient(top, #888, #666);
} }
} }
\ No newline at end of file
lms/static/sass/course/courseware/_amplifier.scss
...@@ -64,7 +64,7 @@ section.tool-wrapper { ...@@ -64,7 +64,7 @@ section.tool-wrapper {
letter-spacing: 1px; letter-spacing: 1px;
text-transform: uppercase; text-transform: uppercase;
&:hover { &:hover, &:focus {
color: #eee8d5; color: #eee8d5;
} }
} }
...@@ -236,7 +236,7 @@ section.tool-wrapper { ...@@ -236,7 +236,7 @@ section.tool-wrapper {
box-shadow: inset 0 1px 0 lighten( #586e75, 20% ); box-shadow: inset 0 1px 0 lighten( #586e75, 20% );
margin-top: -.3em; margin-top: -.3em;
&:hover, &:active { &:hover, &:active, &:focus {
background-color: lighten( #586e75, 10% ); background-color: lighten( #586e75, 10% );
} }
} }
......
lms/static/sass/course/courseware/_sidebar.scss
...@@ -24,12 +24,13 @@ section.course-index { ...@@ -24,12 +24,13 @@ section.course-index {
border-radius: 0; border-radius: 0;
margin: 0; margin: 0;
overflow: visible; overflow: visible;
font-size: 16px;
&:first-child { &:first-child {
border: none; border: none;
} }
&:hover { &:hover, &:focus {
color: #666; color: #666;
} }
...@@ -47,13 +48,14 @@ section.course-index { ...@@ -47,13 +48,14 @@ section.course-index {
border-radius: 0; border-radius: 0;
box-shadow: none; box-shadow: none;
padding-left: 19px; padding-left: 19px;
color: $link-color;
} }
&.ui-state-active { &.ui-state-active {
@extend .active; @extend .active;
border-bottom: none; border-bottom: none;
&:hover { &:hover, &:focus {
background: none; background: none;
} }
} }
...@@ -88,7 +90,7 @@ section.course-index { ...@@ -88,7 +90,7 @@ section.course-index {
box-shadow: 0 1px 0 #fff inset; box-shadow: 0 1px 0 #fff inset;
} }
&:hover { &:hover, &:focus {
background-color: #fff background-color: #fff
} }
} }
...@@ -134,7 +136,7 @@ section.course-index { ...@@ -134,7 +136,7 @@ section.course-index {
} }
} }
&:hover { &:hover, &:focus {
background: rgba(0, 0, 0, .1); background: rgba(0, 0, 0, .1);
> a p { > a p {
......
lms/static/sass/course/instructor/_instructor_2.scss
...@@ -350,7 +350,7 @@ section.instructor-dashboard-content-2 { ...@@ -350,7 +350,7 @@ section.instructor-dashboard-content-2 {
height: 10px; height: 10px;
background: url('../images/moderator-delete-icon.png') left center no-repeat; background: url('../images/moderator-delete-icon.png') left center no-repeat;
opacity: 0.7; opacity: 0.7;
&:hover { opacity: 0.8; } &:hover, &:focus { opacity: 0.8; }
&:active { opacity: 0.9; } &:active { opacity: 0.9; }
// @include idashbutton($danger-red); // @include idashbutton($danger-red);
...@@ -493,7 +493,7 @@ section.instructor-dashboard-content-2 { ...@@ -493,7 +493,7 @@ section.instructor-dashboard-content-2 {
height: 17px; height: 17px;
background: url('../images/info-icon-dark.png') left center no-repeat; background: url('../images/info-icon-dark.png') left center no-repeat;
opacity: 0.35; opacity: 0.35;
&:hover { opacity: 0.45; } &:hover, &:focus { opacity: 0.45; }
&:active { opacity: 0.5; } &:active { opacity: 0.5; }
} }
......
lms/static/sass/course/layout/_calculator.scss
...@@ -26,7 +26,7 @@ div.calc-main { ...@@ -26,7 +26,7 @@ div.calc-main {
top: -45px; top: -45px;
width: 16px; width: 16px;
&:hover { &:hover, &:focus {
opacity: 0.8; opacity: 0.8;
} }
......
lms/static/sass/course/layout/_chat.scss
...@@ -25,7 +25,8 @@ ...@@ -25,7 +25,8 @@
cursor: pointer; cursor: pointer;
} }
#chat-toggle:hover { #chat-toggle:hover,
#chat-toggle:focus {
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/course/layout/_courseware_header.scss
...@@ -45,7 +45,7 @@ nav.course-material { ...@@ -45,7 +45,7 @@ nav.course-material {
text-decoration: none; text-decoration: none;
// text-shadow: 0 1px 0 rgba(0, 0, 0, .4); // text-shadow: 0 1px 0 rgba(0, 0, 0, .4);
&:hover { &:hover, &:focus {
color: #333; color: #333;
background: rgba(255, 255, 255, .6); background: rgba(255, 255, 255, .6);
} }
......
lms/static/sass/course/layout/_courseware_subnav.scss
...@@ -31,7 +31,7 @@ nav.course-material { ...@@ -31,7 +31,7 @@ nav.course-material {
text-decoration: none; text-decoration: none;
text-shadow: 0 1px rgb(255,255,255); text-shadow: 0 1px rgb(255,255,255);
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
} }
......
lms/static/sass/course/wiki/_create.scss
...@@ -53,7 +53,7 @@ form#wiki_revision { ...@@ -53,7 +53,7 @@ form#wiki_revision {
margin-top: lh(); margin-top: lh();
width: flex-grid(3, 9); width: flex-grid(3, 9);
&:hover { &:hover, &:focus {
color: #333; color: #333;
} }
......
lms/static/sass/course/wiki/_wiki.scss
...@@ -87,7 +87,7 @@ section.wiki { ...@@ -87,7 +87,7 @@ section.wiki {
font-size: 0.72em; font-size: 0.72em;
font-weight: 600; font-weight: 600;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -260,7 +260,7 @@ section.wiki { ...@@ -260,7 +260,7 @@ section.wiki {
font-size: 0.9em; font-size: 0.9em;
line-height: 25px; line-height: 25px;
&:hover { &:hover, &:focus {
background-color: #f6f6f6; background-color: #f6f6f6;
text-decoration: none; text-decoration: none;
} }
...@@ -302,7 +302,7 @@ section.wiki { ...@@ -302,7 +302,7 @@ section.wiki {
background-position: -25px -99px; background-position: -25px -99px;
} }
&:hover { &:hover, &:focus {
background: none; background: none;
} }
} }
...@@ -349,7 +349,7 @@ section.wiki { ...@@ -349,7 +349,7 @@ section.wiki {
background-position: 0 -99px; background-position: 0 -99px;
} }
&:hover { &:hover, &:focus {
background-color: #f6f6f6; background-color: #f6f6f6;
text-decoration: none; text-decoration: none;
} }
...@@ -465,7 +465,7 @@ section.wiki { ...@@ -465,7 +465,7 @@ section.wiki {
text-transform: none !important; text-transform: none !important;
letter-spacing: 0 !important; letter-spacing: 0 !important;
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
} }
...@@ -662,7 +662,7 @@ section.wiki { ...@@ -662,7 +662,7 @@ section.wiki {
background: #f9f9f9; background: #f9f9f9;
border-radius: 5px; border-radius: 5px;
a:hover { a:hover, a:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -823,7 +823,7 @@ section.wiki { ...@@ -823,7 +823,7 @@ section.wiki {
a { a {
color: #aaa; color: #aaa;
&:hover { &:hover, &:focus {
color: #777; color: #777;
} }
} }
...@@ -1007,7 +1007,7 @@ section.wiki { ...@@ -1007,7 +1007,7 @@ section.wiki {
text-align: center; text-align: center;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
&:hover { &:hover, &:focus {
background: darken($pink, 12%); background: darken($pink, 12%);
} }
} }
...@@ -1078,7 +1078,7 @@ section.wiki { ...@@ -1078,7 +1078,7 @@ section.wiki {
text-transform: none !important; text-transform: none !important;
letter-spacing: 0 !important; letter-spacing: 0 !important;
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/elements/_controls.scss
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
cursor: pointer; cursor: pointer;
text-decoration: none; text-decoration: none;
&:hover, &:active { &:hover, &:active, &:focus {
text-decoration: none; text-decoration: none;
} }
...@@ -39,13 +39,13 @@ ...@@ -39,13 +39,13 @@
padding: ($baseline*0.75) $baseline; padding: ($baseline*0.75) $baseline;
text-align: center; text-align: center;
&:hover, &:active { &:hover, &:active, &:focus {
} }
&.current, &.active { &.current, &.active {
&:hover, &:active { &:hover, &:active, &:focus {
} }
} }
...@@ -63,7 +63,7 @@ ...@@ -63,7 +63,7 @@
background: $m-gray; background: $m-gray;
color: $white; color: $white;
&:hover, &:active { &:hover, &:active, &:focus {
background: $m-gray-l1; background: $m-gray-l1;
color: $white; color: $white;
} }
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
background: $m-gray; background: $m-gray;
color: $m-gray-l1; color: $m-gray-l1;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $m-gray-d3; box-shadow: inset 0 2px 1px 1px $m-gray-d3;
color: $m-gray-d3; color: $m-gray-d3;
} }
...@@ -91,7 +91,7 @@ ...@@ -91,7 +91,7 @@
background: $m-blue-d3; background: $m-blue-d3;
color: $white; color: $white;
&:hover, &:active { &:hover, &:active, &:focus {
background: $m-blue-d1; background: $m-blue-d1;
color: $white; color: $white;
} }
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
background: $m-blue; background: $m-blue;
color: $m-blue-d2; color: $m-blue-d2;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $m-blue-d3; box-shadow: inset 0 2px 1px 1px $m-blue-d3;
color: $m-blue-d3; color: $m-blue-d3;
} }
...@@ -119,7 +119,7 @@ ...@@ -119,7 +119,7 @@
background: $m-pink; background: $m-pink;
color: $white; color: $white;
&:hover, &:active { &:hover, &:active, &:focus {
background: $m-pink-l3; background: $m-pink-l3;
color: $white; color: $white;
} }
...@@ -129,7 +129,7 @@ ...@@ -129,7 +129,7 @@
background: $m-pink-l2; background: $m-pink-l2;
color: $m-pink-d1; color: $m-pink-d1;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $m-pink-d2; box-shadow: inset 0 2px 1px 1px $m-pink-d2;
color: $m-pink-d3; color: $m-pink-d3;
} }
...@@ -147,7 +147,7 @@ ...@@ -147,7 +147,7 @@
background: $m-green-d1; background: $m-green-d1;
color: $white; color: $white;
&:hover, &:active { &:hover, &:active, &:focus {
background: $m-green-s1; background: $m-green-s1;
color: $white; color: $white;
} }
...@@ -157,7 +157,7 @@ ...@@ -157,7 +157,7 @@
background: $m-green-l2; background: $m-green-l2;
color: $m-green; color: $m-green;
&:hover, &:active { &:hover, &:active, &:focus {
box-shadow: inset 0 2px 1px 1px $m-green-d1; box-shadow: inset 0 2px 1px 1px $m-green-d1;
color: $m-green-d1; color: $m-green-d1;
} }
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
cursor: default; cursor: default;
pointer-events: none; pointer-events: none;
box-shadow: none; box-shadow: none;
:hover { :hover, :focus {
pointer-events: none; pointer-events: none;
} }
} }
......
lms/static/sass/elements/_typography.scss
...@@ -271,7 +271,7 @@ ...@@ -271,7 +271,7 @@
%copy-link { %copy-link {
border-bottom: 1px dotted transparent; border-bottom: 1px dotted transparent;
&:hover, &:active { &:hover, &:active, &:focus {
border-color: $link-color-d1; border-color: $link-color-d1;
} }
} }
......
lms/static/sass/ie.scss
...@@ -13,13 +13,14 @@ ...@@ -13,13 +13,14 @@
// hide all actions // hide all actions
.home > header .title .actions, .home > header .title .actions,
.home > header .title:hover .actions { .home > header .title:hover .actions,
.home > header .title:focus .actions {
display: none; display: none;
height: auto; height: auto;
} }
.home > header .title { .home > header .title {
&:hover { &:hover, &:focus {
> hgroup { > hgroup {
h1 { h1 {
...@@ -49,7 +50,7 @@ ...@@ -49,7 +50,7 @@
position: static; position: static;
} }
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
&::before { &::before {
...@@ -117,7 +118,7 @@ ...@@ -117,7 +118,7 @@
} }
} }
&:hover { &:hover, &:focus {
background: rgb(245,245,245); background: rgb(245,245,245);
border-color: rgb(170,170,170); border-color: rgb(170,170,170);
box-shadow: 0 1px 16px 0 rgba($blue, 0.4); box-shadow: 0 1px 16px 0 rgba($blue, 0.4);
......
lms/static/sass/multicourse/_about_pages.scss
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
@include transition(all 0.15s linear 0s); @include transition(all 0.15s linear 0s);
text-transform: lowercase; text-transform: lowercase;
&:hover, &.active { &:hover, &.active, &:focus {
border-color: rgb(200,200,200); border-color: rgb(200,200,200);
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
...@@ -165,7 +165,7 @@ ...@@ -165,7 +165,7 @@
padding: 12px 0px 12px 20px; padding: 12px 0px 12px 20px;
text-align: left; text-align: left;
&:hover { &:hover, &:focus {
background: rgb(245,245,245); background: rgb(245,245,245);
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/multicourse/_account.scss
...@@ -173,14 +173,14 @@ ...@@ -173,14 +173,14 @@
a { a {
@include transition(color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s); @include transition(color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s);
&:link, &:visited, &:hover, &:active { &:link, &:visited, &:hover, &:active, &:focus {
color: $link-color-d1; color: $link-color-d1;
font-weight: 400; font-weight: 400;
text-decoration: none !important; // needed but nasty text-decoration: none !important; // needed but nasty
font-family: $sans-serif; font-family: $sans-serif;
} }
&:hover, &:active { &:hover, &:active, &:focus {
text-decoration: none !important; // needed but nasty text-decoration: none !important; // needed but nasty
border-bottom: 1px dotted $link-color-d1; border-bottom: 1px dotted $link-color-d1;
} }
......
lms/static/sass/multicourse/_course_about.scss
...@@ -214,7 +214,7 @@ ...@@ -214,7 +214,7 @@
} }
} }
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
.play-intro { .play-intro {
...@@ -261,7 +261,7 @@ ...@@ -261,7 +261,7 @@
margin-left: 0px; margin-left: 0px;
} }
&:hover, &.active { &:hover, &.active, &:focus {
border-color: $border-color-2; border-color: $border-color-2;
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
...@@ -411,7 +411,7 @@ ...@@ -411,7 +411,7 @@
margin-right: 15px; margin-right: 15px;
padding-right: 15px; padding-right: 15px;
&:hover { &:hover, &:focus {
color: $lighter-base-font-color; color: $lighter-base-font-color;
} }
} }
...@@ -427,7 +427,7 @@ ...@@ -427,7 +427,7 @@
float: none; float: none;
&:hover { &:hover, &:focus {
.sharing-message { .sharing-message {
opacity: 1.0; opacity: 1.0;
top: 56px; top: 56px;
...@@ -456,7 +456,7 @@ ...@@ -456,7 +456,7 @@
top: 65px; top: 65px;
width: 220px; width: 220px;
&:hover { &:hover, &:focus {
opacity: 0; opacity: 0;
} }
} }
...@@ -469,7 +469,7 @@ ...@@ -469,7 +469,7 @@
@include transition(all 0.15s linear 0s); @include transition(all 0.15s linear 0s);
width: 44px; width: 44px;
&:hover { &:hover, &:focus {
opacity: 1.0; opacity: 1.0;
} }
...@@ -512,7 +512,7 @@ ...@@ -512,7 +512,7 @@
} }
} }
&:hover { &:hover, &:focus {
.icon { .icon {
opacity: 1.0; opacity: 1.0;
} }
......
lms/static/sass/multicourse/_dashboard.scss
...@@ -75,7 +75,7 @@ ...@@ -75,7 +75,7 @@
margin-bottom: 15px; margin-bottom: 15px;
padding-bottom: 17px; padding-bottom: 17px;
&:hover { &:hover, &:focus {
.title .icon { .title .icon {
opacity: 1.0; opacity: 1.0;
} }
...@@ -162,7 +162,7 @@ ...@@ -162,7 +162,7 @@
border-radius: 11px; border-radius: 11px;
background: $dot-color; background: $dot-color;
&:hover { &:hover, &:focus {
background: $lighter-base-font-color; background: $lighter-base-font-color;
} }
...@@ -265,7 +265,7 @@ ...@@ -265,7 +265,7 @@
padding: 5px 10px; padding: 5px 10px;
text-shadow: 0 1px rgba(255,255,255, 0.6); text-shadow: 0 1px rgba(255,255,255, 0.6);
&:hover { &:hover, &:focus {
color: $link-color; color: $link-color;
text-decoration: none; text-decoration: none;
} }
...@@ -350,7 +350,7 @@ ...@@ -350,7 +350,7 @@
line-height: 42px; line-height: 42px;
font-weight: 300; font-weight: 300;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -405,12 +405,12 @@ ...@@ -405,12 +405,12 @@
font: normal 15px/1.6rem $sans-serif; font: normal 15px/1.6rem $sans-serif;
padding: 6px 32px 7px; padding: 6px 32px 7px;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -522,7 +522,7 @@ ...@@ -522,7 +522,7 @@
&.disabled { &.disabled {
cursor: default !important; cursor: default !important;
&:hover { &:hover, &:focus {
background: #eee; background: #eee;
background-image: -webkit-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%); background-image: -webkit-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%);
background-image: -moz-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%); background-image: -moz-linear-gradient(top, #EEE 0%, #C2C2C2 50%, #ABABAB 50%, #B0B0B0 100%);
...@@ -584,7 +584,7 @@ ...@@ -584,7 +584,7 @@
font-weight: bold; font-weight: bold;
letter-spacing: 0; letter-spacing: 0;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -624,7 +624,7 @@ ...@@ -624,7 +624,7 @@
font-size: .8em; font-size: .8em;
margin-top: 32px; margin-top: 32px;
&:hover { &:hover, &:focus {
color: #333; color: #333;
} }
} }
......
lms/static/sass/multicourse/_edge.scss
...@@ -23,12 +23,12 @@ $paleYellow: #fffcf1; ...@@ -23,12 +23,12 @@ $paleYellow: #fffcf1;
color: $darkGrey !important; color: $darkGrey !important;
pointer-events: none; pointer-events: none;
cursor: none; cursor: none;
&:hover { &:hover, &:focus {
box-shadow: 0 0 0 0 !important; box-shadow: 0 0 0 0 !important;
} }
} }
&:hover { &:hover, &:focus {
box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15);
text-decoration: none; text-decoration: none;
} }
...@@ -42,7 +42,7 @@ $paleYellow: #fffcf1; ...@@ -42,7 +42,7 @@ $paleYellow: #fffcf1;
background-color: $blue; background-color: $blue;
color: #fff; color: #fff;
&:hover { &:hover, &:focus {
background-color: #62aaf5; background-color: #62aaf5;
color: #fff; color: #fff;
} }
...@@ -57,7 +57,7 @@ $paleYellow: #fffcf1; ...@@ -57,7 +57,7 @@ $paleYellow: #fffcf1;
box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset; box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
color: #6d788b; color: #6d788b;
&:hover { &:hover, &:focus {
background-color: #d9e3ee; background-color: #d9e3ee;
color: #6d788b; color: #6d788b;
} }
...@@ -72,7 +72,7 @@ $paleYellow: #fffcf1; ...@@ -72,7 +72,7 @@ $paleYellow: #fffcf1;
border-bottom: 3px solid $blue; border-bottom: 3px solid $blue;
} }
a:hover { a:hover, a:focus {
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/multicourse/_help.scss
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
padding: 12px 0px 12px 20px; padding: 12px 0px 12px 20px;
text-align: left; text-align: left;
&:hover { &:hover, &:focus {
background: rgb(245,245,245); background: rgb(245,245,245);
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/multicourse/_home.scss
...@@ -43,7 +43,7 @@ ...@@ -43,7 +43,7 @@
@include transition(all 0.2s linear 0s); @include transition(all 0.2s linear 0s);
vertical-align: top; vertical-align: top;
&:hover { &:hover, &:focus {
.actions { .actions {
display: none; display: none;
} }
...@@ -93,7 +93,7 @@ ...@@ -93,7 +93,7 @@
width: flex-grid(2) + flex-gutter(); width: flex-grid(2) + flex-gutter();
z-index: 2; z-index: 2;
&:hover { &:hover, &:focus {
text-decoration: underline; text-decoration: underline;
} }
...@@ -140,7 +140,7 @@ ...@@ -140,7 +140,7 @@
} }
} }
&:hover { &:hover, &:focus {
.play-intro { .play-intro {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8))); @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8)));
box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.5); box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.5);
...@@ -295,7 +295,7 @@ ...@@ -295,7 +295,7 @@
text-shadow: 0 1px rgba(255,255,255, 0.6); text-shadow: 0 1px rgba(255,255,255, 0.6);
@include transition(all 0.15s ease-in-out 0s); @include transition(all 0.15s ease-in-out 0s);
&:hover { &:hover, &:focus {
color: $lighter-base-font-color; color: $lighter-base-font-color;
} }
} }
...@@ -308,7 +308,7 @@ ...@@ -308,7 +308,7 @@
z-index: 2; z-index: 2;
} }
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
&::before { &::before {
...@@ -354,7 +354,7 @@ ...@@ -354,7 +354,7 @@
font-size: 1.0em; font-size: 1.0em;
} }
&:hover { &:hover, &:focus {
.name { .name {
bottom: 14px; bottom: 14px;
} }
...@@ -431,7 +431,7 @@ ...@@ -431,7 +431,7 @@
@include transition(all 0.15s linear 0s); @include transition(all 0.15s linear 0s);
width: flex-grid(4); width: flex-grid(4);
&:hover { &:hover, &:focus {
background: $body-bg; background: $body-bg;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.1); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.1);
...@@ -467,7 +467,7 @@ ...@@ -467,7 +467,7 @@
color: $base-font-color; color: $base-font-color;
font: 700 1em/1.2em $sans-serif; font: 700 1em/1.2em $sans-serif;
&:hover { &:hover, &:focus {
color: $blue; color: $blue;
text-decoration: underline; text-decoration: underline;
} }
...@@ -500,7 +500,7 @@ ...@@ -500,7 +500,7 @@
float: right; float: right;
color: lighten($base-font-color, 50%); color: lighten($base-font-color, 50%);
&:hover { &:hover, &:focus {
color: $blue; color: $blue;
text-decoration: underline; text-decoration: underline;
} }
......
lms/static/sass/multicourse/_jobs.scss
...@@ -97,7 +97,7 @@ ...@@ -97,7 +97,7 @@
padding: 12px 0px 12px 20px; padding: 12px 0px 12px 20px;
text-align: left; text-align: left;
&:hover { &:hover, &:focus {
background: rgb(245,245,245); background: rgb(245,245,245);
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/multicourse/_media-kit.scss
...@@ -77,7 +77,7 @@ $white: rgb(255,255,255); ...@@ -77,7 +77,7 @@ $white: rgb(255,255,255);
} }
} }
&:hover { &:hover, &:focus {
.note { .note {
color: shade($blue, 25%); color: shade($blue, 25%);
...@@ -228,7 +228,7 @@ $white: rgb(255,255,255); ...@@ -228,7 +228,7 @@ $white: rgb(255,255,255);
border: 2px solid tint($light-gray,75%); border: 2px solid tint($light-gray,75%);
padding: $baseline; padding: $baseline;
&:hover { &:hover, &:focus {
border-color: $blue; border-color: $blue;
} }
} }
......
lms/static/sass/multicourse/_testcenter-register.scss
...@@ -484,7 +484,7 @@ ...@@ -484,7 +484,7 @@
} }
} }
&:hover { &:hover, &:focus {
.details, .item, .instructions { .details, .item, .instructions {
opacity: 1.0; opacity: 1.0;
...@@ -546,7 +546,7 @@ ...@@ -546,7 +546,7 @@
font-size: 13px; font-size: 13px;
font-weight: bold; font-weight: bold;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -681,7 +681,7 @@ ...@@ -681,7 +681,7 @@
font-weight: bold; font-weight: bold;
letter-spacing: 0; letter-spacing: 0;
&:hover { &:hover, &:focus {
text-decoration: none; text-decoration: none;
} }
} }
...@@ -743,7 +743,7 @@ ...@@ -743,7 +743,7 @@
color: $red; color: $red;
text-decoration: none; text-decoration: none;
&:hover, &:active { &:hover, &:active, &:focus {
text-decoration: underline; text-decoration: underline;
} }
} }
......
lms/static/sass/shared/_course_filter.scss
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
} }
} }
&:hover { &:hover, &:focus {
.filter-heading { .filter-heading {
background: rgb(255,255,255); background: rgb(255,255,255);
@include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(255,255,255))); @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(255,255,255)));
......
lms/static/sass/shared/_course_object.scss
...@@ -232,7 +232,7 @@ ...@@ -232,7 +232,7 @@
margin-right: 10px; margin-right: 10px;
padding-right: 10px; padding-right: 10px;
&:hover { &:hover, &:focus {
color: $link-color; color: $link-color;
} }
} }
...@@ -244,7 +244,7 @@ ...@@ -244,7 +244,7 @@
} }
} }
&:hover { &:hover, &:focus {
background: $course-profile-bg; background: $course-profile-bg;
border-color: $border-color-1; border-color: $border-color-1;
box-shadow: 0 1px 16px 0 rgba($shadow-color, 0.4); box-shadow: 0 1px 16px 0 rgba($shadow-color, 0.4);
......
lms/static/sass/shared/_footer.scss
...@@ -18,14 +18,14 @@ ...@@ -18,14 +18,14 @@
a { a {
@include transition(link-color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s); @include transition(link-color 0.15s ease-in-out 0s, border 0.15s ease-in-out 0s);
&:link, &:visited, &:hover, &:active { &:link, &:visited, &:hover, &:focus, &:active {
border-bottom: none; border-bottom: none;
color: $link-color; color: $link-color;
text-decoration: none !important; text-decoration: none !important;
font-family: $sans-serif; font-family: $sans-serif;
} }
&:hover, &:active { &:hover, &:focus, &:active {
border-bottom: 1px dotted $link-color; border-bottom: 1px dotted $link-color;
color: $link-color; color: $link-color;
} }
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
a { a {
color: tint($black, 20%); color: tint($black, 20%);
&:hover, &:active { &:hover, &:focus, &:active {
color: $link-color; color: $link-color;
} }
} }
...@@ -100,7 +100,7 @@ ...@@ -100,7 +100,7 @@
a { a {
display: block; display: block;
&:hover, &:active { &:hover, &:focus, &:active {
border: none; border: none;
} }
} }
......
lms/static/sass/shared/_header.scss
...@@ -66,7 +66,7 @@ header.global { ...@@ -66,7 +66,7 @@ header.global {
margin-right: 0px; margin-right: 0px;
} }
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
} }
} }
...@@ -98,7 +98,7 @@ header.global { ...@@ -98,7 +98,7 @@ header.global {
margin-right: 0px; margin-right: 0px;
} }
&:hover, &.active { &:hover, &:focus, &.active {
background: $button-bg-hover-color; background: $button-bg-hover-color;
} }
} }
...@@ -156,7 +156,7 @@ header.global { ...@@ -156,7 +156,7 @@ header.global {
width: 26px; width: 26px;
} }
&:hover { &:hover, &:focus {
.avatar { .avatar {
opacity: 0.8; opacity: 0.8;
} }
...@@ -224,7 +224,7 @@ header.global { ...@@ -224,7 +224,7 @@ header.global {
white-space: nowrap; white-space: nowrap;
width: 100%; width: 100%;
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
} }
...@@ -256,7 +256,7 @@ header.global { ...@@ -256,7 +256,7 @@ header.global {
color: $lighter-base-font-color; color: $lighter-base-font-color;
font-weight: 600; font-weight: 600;
&:hover, &:active { &:hover, &:focus, &:active {
text-decoration: none; text-decoration: none;
color: $link-color; color: $link-color;
} }
......
lms/static/sass/shared/_modal.scss
...@@ -109,8 +109,8 @@ ...@@ -109,8 +109,8 @@
} }
.modal-form-error { .modal-form-error {
background: $error-red; background: tint($red,90%);
border: 1px solid rgb(202, 17, 17); border: 1px solid rgb(143, 14, 14);
color: rgb(143, 14, 14); color: rgb(143, 14, 14);
display: none; display: none;
margin-bottom: 20px; margin-bottom: 20px;
...@@ -195,7 +195,7 @@ ...@@ -195,7 +195,7 @@
margin-bottom: 20px; margin-bottom: 20px;
padding: 8px 10px; padding: 8px 10px;
&:hover { &:hover, &:focus {
background: rgb(230,230,230); background: rgb(230,230,230);
} }
...@@ -262,7 +262,7 @@ ...@@ -262,7 +262,7 @@
font-style: italic; font-style: italic;
text-decoration: underline; text-decoration: underline;
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
} }
} }
...@@ -288,7 +288,7 @@ ...@@ -288,7 +288,7 @@
text-shadow: 0 1px rgba(255,255,255, 0.8); text-shadow: 0 1px rgba(255,255,255, 0.8);
@include transition(all 0.15s ease-out 0s); @include transition(all 0.15s ease-out 0s);
&:hover { &:hover, &:focus {
color: $base-font-color; color: $base-font-color;
text-decoration: none; text-decoration: none;
} }
......
lms/static/sass/views/_verification.scss
...@@ -1560,7 +1560,7 @@ ...@@ -1560,7 +1560,7 @@
@include font-size(24); @include font-size(24);
color: $m-blue-d3; color: $m-blue-d3;
&:hover { &:hover, &:focus {
color: $m-blue-d1; color: $m-blue-d1;
border: none; border: none;
} }
......
lms/templates/courseware/course_about.html
...@@ -162,14 +162,14 @@ ...@@ -162,14 +162,14 @@
% if get_course_about_section(course, "video"): % if get_course_about_section(course, "video"):
<a href="#video-modal" class="media" rel="leanModal"> <a href="#video-modal" class="media" rel="leanModal">
<div class="hero"> <div class="hero">
<img src="${course_image_url(course)}" /> <img src="${course_image_url(course)}" alt="" />
<div class="play-intro"></div> <div class="play-intro"></div>
</div> </div>
</a> </a>
%else: %else:
<div class="media"> <div class="media">
<div class="hero"> <div class="hero">
<img src="${course_image_url(course)}" /> <img src="${course_image_url(course)}" alt="" />
</div> </div>
</div> </div>
% endif % endif
...@@ -203,19 +203,20 @@ ...@@ -203,19 +203,20 @@
## want here (and on this whole page, really). ## want here (and on this whole page, really).
% if self.stanford_theme_enabled(): % if self.stanford_theme_enabled():
<a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}!+(http://class.stanford.edu)" class="share"> <a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}!+(http://class.stanford.edu)" class="share">
<img src="${static.url('images/social/twitter-sharing.png')}"> <img src="${static.url('images/social/twitter-sharing.png')}" alt="Tweet that you've registered for this course">
</a> </a>
<a href="mailto:?subject=Take%20a%20course%20at%20Stanford%20online!&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}+(http://class.stanford.edu)" class="share"> <a href="mailto:?subject=Take%20a%20course%20at%20Stanford%20online!&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}+(http://class.stanford.edu)" class="share">
<img src="${static.url('images/social/email-sharing.png')}"> <img src="${static.url('images/social/email-sharing.png')}" alt="Email someone to say you've registered for this course">
</a> </a>
% else: % else:
<a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}+through+@edxonline:+http://www.edx.org${reverse('about_course', args=[course.id])}" class="share"> <a href="http://twitter.com/intent/tweet?text=I+just+registered+for+${course.number}+${get_course_about_section(course, 'title')}+through+@edxonline:+http://www.edx.org${reverse('about_course', args=[course.id])}" class="share">
<img src="${static.url('images/social/twitter-sharing.png')}"> <img src="${static.url('images/social/twitter-sharing.png')}" alt="Tweet that you've registered for this course">
</a> </a>
<a href="http://www.facebook.com/EdxOnline" class="share"> <img src="${static.url('images/social/facebook-sharing.png')}"> <a href="http://www.facebook.com/EdxOnline" class="share">
<img src="${static.url('images/social/facebook-sharing.png')}" alt="Post a Facebook message to say you've registered for this course">
</a> </a>
<a href="mailto:?subject=Take%20a%20course%20with%20edX%20online&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}%20through%20edX:+http://edx.org/${reverse('about_course', args=[course.id])}" class="share"> <a href="mailto:?subject=Take%20a%20course%20with%20edX%20online&body=I%20just%20registered%20for%20${course.number}%20${get_course_about_section(course, 'title')}%20through%20edX:+http://edx.org/${reverse('about_course', args=[course.id])}" class="share">
<img src="${static.url('images/social/email-sharing.png')}"> <img src="${static.url('images/social/email-sharing.png')}" alt="Email someone to say you've registered for this course">
</a> </a>
% endif % endif
</div> </div>
......
lms/templates/video.html
...@@ -44,48 +44,50 @@ ...@@ -44,48 +44,50 @@
<div class="focus_grabber first"></div> <div class="focus_grabber first"></div>
<div class="tc-wrapper"> <div class="tc-wrapper">
<article class="video-wrapper"> <a href="#transcript-captions" class="sr">Skip to clickable transcript video links.</a>
<div class="video-player-pre"></div>
<article class="video-wrapper">
<section class="video-player"> <div class="video-player-pre"></div>
<div id="${id}"></div>
<h3 class="hidden">${_('ERROR: No playable video sources found!')}</h3> <section class="video-player">
</section> <div id="${id}"></div>
<h3 class="hidden">${_('ERROR: No playable video sources found!')}</h3>
<div class="video-player-post"></div> </section>
<section class="video-controls"> <div class="video-player-post"></div>
<div class="slider" title="Video position"></div>
<section class="video-controls">
<div> <div class="slider" title="Video position"></div>
<ul class="vcr">
<li><a class="video_control" href="#" title="${_('Play')}" role="button" aria-disabled="false"></a></li> <div>
<li><div class="vidtime">0:00 / 0:00</div></li> <ul class="vcr">
</ul> <li><a class="video_control" href="#" title="${_('Play')}" role="button" aria-disabled="false"></a></li>
<div class="secondary-controls"> <li><div class="vidtime">0:00 / 0:00</div></li>
<div class="speeds"> </ul>
<a href="#" title="${_('Speeds')}" role="button" aria-disabled="false"> <div class="secondary-controls">
<h3>${_('Speed')}</h3> <div class="speeds">
<p class="active"></p> <a href="#" title="${_('Speeds')}" role="button" aria-disabled="false">
</a> <h3>${_('Speed')}</h3>
<ol class="video_speeds"></ol> <p class="active"></p>
</div> </a>
<div class="volume"> <ol class="video_speeds"></ol>
<a href="#" title="${_('Volume')}" role="button" aria-disabled="false"></a> </div>
<div class="volume-slider-container"> <div class="volume">
<div class="volume-slider"></div> <a href="#" title="${_('Volume')}" role="button" aria-disabled="false"></a>
</div> <div class="volume-slider-container">
</div> <div class="volume-slider"></div>
<a href="#" class="add-fullscreen" title="${_('Fill browser')}" role="button" aria-disabled="false">${_('Fill browser')}</a> </div>
<a href="#" class="quality_control" title="${_('HD off')}" role="button" aria-disabled="false">${_('HD off')}</a> </div>
<a href="#" class="add-fullscreen" title="${_('Fill browser')}" role="button" aria-disabled="false">${_('Fill browser')}</a>
<a href="#" class="hide-subtitles" title="${_('Turn off captions')}" role="button" aria-disabled="false">${_('Turn off captions')}</a> <a href="#" class="quality_control" title="${_('HD off')}" role="button" aria-disabled="false">${_('HD off')}</a>
</div>
</div> <a href="#" class="hide-subtitles" title="${_('Turn off captions')}" role="button" aria-disabled="false">${_('Turn off captions')}</a>
</section> </div>
</article> </div>
</section>
<ol class="subtitles" tabindex="0" title="${_('Captions')}" role="group" aria-label="${_('Activating an item in this group will spool the video to the corresponding time point')}"><li></li></ol> </article>
<ol id="transcript-captions" class="subtitles" tabindex="0" title="${_('Captions')}" role="group" aria-label="${_('Activating an item in this group will spool the video to the corresponding time point')}"><li></li></ol>
</div> </div>
<div class="focus_grabber last"></div> <div class="focus_grabber last"></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