AC-517 fixes color-contrast ignores across platform
This commit is contained in:
@@ -206,7 +206,7 @@
|
||||
chooseFile: function(event) {
|
||||
if (event && event.preventDefault) { event.preventDefault(); }
|
||||
if (event.currentTarget.files.length === 1) {
|
||||
this.$el.find(DOM_SELECTORS.upload_csv_button).removeClass('disabled');
|
||||
this.$el.find(DOM_SELECTORS.upload_csv_button).attr('disabled', 'false');
|
||||
this.$el.find(DOM_SELECTORS.browse_file).val(
|
||||
event.currentTarget.value.substring(event.currentTarget.value.lastIndexOf("\\") + 1));
|
||||
}
|
||||
|
||||
@@ -34,10 +34,10 @@
|
||||
var template = this.loadTemplate('certificate-white-list');
|
||||
this.$el.html(template({certificates: this.collection.models}));
|
||||
if (!this.active_certificate || this.collection.isEmpty()){
|
||||
this.$("#generate-exception-certificates").addClass("is-disabled");
|
||||
this.$("#generate-exception-certificates").attr("disabled", "disabled");
|
||||
}
|
||||
else {
|
||||
this.$("#generate-exception-certificates").removeClass("is-disabled");
|
||||
this.$("#generate-exception-certificates").removeAttr("disabled");
|
||||
}
|
||||
},
|
||||
|
||||
@@ -107,4 +107,4 @@
|
||||
});
|
||||
}
|
||||
);
|
||||
}).call(this, define || RequireJS.define);
|
||||
}).call(this, define || RequireJS.define);
|
||||
|
||||
@@ -204,7 +204,7 @@ define([
|
||||
|
||||
it("verifies that Generate Exception Certificate button is disabled", function() {
|
||||
expect(view.$el.find('table tbody tr').length).toBe(2);
|
||||
expect(view.$el.find('#generate-exception-certificates').first()).not.toHaveClass('is-disabled');
|
||||
expect(view.$el.find('#generate-exception-certificates').first()).not.toHaveAttr('disabled');
|
||||
|
||||
// Render the view with active_certificate set to false.
|
||||
view = new CertificateWhiteListView({
|
||||
@@ -214,7 +214,7 @@ define([
|
||||
view.render();
|
||||
|
||||
// Verify that `Generate Exception Certificate` is disabled even when Collection is not empty.
|
||||
expect(view.$el.find('#generate-exception-certificates').first()).toHaveClass('is-disabled');
|
||||
expect(view.$el.find('#generate-exception-certificates').first()).toHaveAttr('disabled', 'disabled');
|
||||
expect(view.$el.find('table tbody tr').length).toBe(2);
|
||||
});
|
||||
|
||||
|
||||
@@ -53,11 +53,11 @@ div.book-wrapper {
|
||||
a {
|
||||
@include clearfix();
|
||||
padding: 0;
|
||||
color: $link-color;
|
||||
color: $uxpl-blue-base;
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: transparent;
|
||||
color: $link-hover;
|
||||
color: $uxpl-blue-hover-active;
|
||||
|
||||
.page-number {
|
||||
opacity: 1.0;
|
||||
|
||||
@@ -75,7 +75,7 @@ html.video-fullscreen {
|
||||
color: $gray;
|
||||
}
|
||||
a:active, a:hover {
|
||||
color: $link-hover;
|
||||
color: $uxpl-blue-base;
|
||||
}
|
||||
|
||||
.license-label,
|
||||
@@ -151,7 +151,7 @@ html.video-fullscreen {
|
||||
}
|
||||
button.gated-sequence {
|
||||
background: $transparent;
|
||||
color: $blue-d1;
|
||||
color: $uxpl-blue-base;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
@include text-align(left);
|
||||
@@ -160,7 +160,7 @@ html.video-fullscreen {
|
||||
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
color: $link-hover;
|
||||
color: $uxpl-blue-hover-active;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -169,12 +169,12 @@ html.video-fullscreen {
|
||||
font-size: 1.3em;
|
||||
}
|
||||
.gated-sequence {
|
||||
color: #147ABA;
|
||||
color: $uxpl-blue-base;
|
||||
font-weight: 600;
|
||||
padding: ($baseline / 1.5) ($baseline / 4);
|
||||
a.start-timed-exam {
|
||||
cursor: pointer;
|
||||
color: #147ABA;
|
||||
color: $uxpl-blue-base;
|
||||
font-weight: 600;
|
||||
position: relative;
|
||||
top: ($baseline/10);
|
||||
@@ -306,7 +306,7 @@ html.video-fullscreen {
|
||||
}
|
||||
&:last-child {
|
||||
> .practice-exam {
|
||||
color: #147ABA;
|
||||
color: $uxpl-blue-base;
|
||||
}
|
||||
border-bottom: none;
|
||||
}
|
||||
@@ -663,3 +663,14 @@ section.self-assessment {
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
* CodeMirror color contrast overrides
|
||||
* (so we don't change the vendor file)
|
||||
*/
|
||||
|
||||
.CodeMirror {
|
||||
|
||||
.CodeMirror-linenumber.CodeMirror-gutter-elt {
|
||||
color: $gray-d3 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -33,7 +33,7 @@
|
||||
|
||||
.file-download-link a {
|
||||
font-size: 15px;
|
||||
color: $link-color;
|
||||
color: $uxpl-blue-base;
|
||||
text-decoration: underline;
|
||||
padding: ($baseline/4);
|
||||
}
|
||||
@@ -674,7 +674,7 @@
|
||||
// .add-field
|
||||
|
||||
input[type="button"].add {
|
||||
@include idashbutton($blue);
|
||||
@include idashbutton($uxpl-blue-base);
|
||||
position: absolute;
|
||||
@include right($baseline);
|
||||
}
|
||||
@@ -756,7 +756,7 @@
|
||||
}
|
||||
}
|
||||
.form-submit {
|
||||
@include idashbutton($blue);
|
||||
@include idashbutton($uxpl-blue-base);
|
||||
@include font-size(14);
|
||||
@include line-height(14);
|
||||
margin-right: ($baseline/2);
|
||||
@@ -778,7 +778,7 @@
|
||||
}
|
||||
|
||||
.action-create {
|
||||
@include idashbutton($blue);
|
||||
@include idashbutton($uxpl-blue-base);
|
||||
@extend %t-weight4;
|
||||
@include float(right);
|
||||
@include text-align(right);
|
||||
@@ -803,7 +803,7 @@
|
||||
|
||||
// specific message actions
|
||||
.message .action-create {
|
||||
@include idashbutton($blue);
|
||||
@include idashbutton($uxpl-blue-base);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -979,7 +979,7 @@
|
||||
}
|
||||
|
||||
.action-submit {
|
||||
@include idashbutton($blue);
|
||||
@include idashbutton($uxpl-blue-base);
|
||||
// needed to override very poor specificity and base rules for blue button
|
||||
@include font-size(14);
|
||||
margin-bottom: 0;
|
||||
@@ -1126,7 +1126,7 @@
|
||||
}
|
||||
|
||||
.cohorted-text {
|
||||
color: $link-color;
|
||||
color: $uxpl-blue-base;
|
||||
}
|
||||
|
||||
.discussions-wrapper {
|
||||
@@ -1427,7 +1427,7 @@ input[name="subject"] {
|
||||
color: #3c3c3c;
|
||||
line-height: 30px;
|
||||
.add{
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
font-size: em(13);
|
||||
@include float(right);
|
||||
@@ -1632,7 +1632,7 @@ input[name="subject"] {
|
||||
border-radius: 2px;
|
||||
input[type="button"]#update_coupon_button, input[type="button"]#add_coupon_button,
|
||||
input[type="button"]#set_course_button, input[type="button"]#lookup_regcode {
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
display: block;
|
||||
height: auto;
|
||||
@@ -1641,7 +1641,7 @@ input[name="subject"] {
|
||||
white-space: normal;
|
||||
}
|
||||
input[name="generate-registration-codes-csv"]{
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
}
|
||||
.modal-form-error {
|
||||
@@ -1782,7 +1782,7 @@ input[name="subject"] {
|
||||
h2 {
|
||||
font-size: 24px;
|
||||
font-weight: 100;
|
||||
color: #1580b0;
|
||||
color: $uxpl-blue-base;
|
||||
@include text-align(left);
|
||||
}
|
||||
}
|
||||
@@ -1906,7 +1906,7 @@ input[name="subject"] {
|
||||
color: #3c3c3c;
|
||||
line-height: 30px;
|
||||
.add{
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
font-size: em(13);
|
||||
@include float(right);
|
||||
@@ -1925,7 +1925,7 @@ input[name="subject"] {
|
||||
color: #3C3C3C;
|
||||
line-height: 30px;
|
||||
.add{
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
font-size: em(13);
|
||||
}
|
||||
@@ -1948,7 +1948,7 @@ input[name="subject"] {
|
||||
color: #3C3C3C;
|
||||
line-height: 30px;
|
||||
.add{
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@extend .button-reset;
|
||||
font-size: em(13);
|
||||
}
|
||||
@@ -2135,8 +2135,8 @@ input[name="subject"] {
|
||||
&:focus {
|
||||
z-index: 2;
|
||||
color: #fff;
|
||||
background-color: darken(#428bca, 6.5%);
|
||||
border-color: darken(#428bca, 6.5%);
|
||||
background-color: $uxpl-blue-base;
|
||||
border-color: $uxpl-blue-base;
|
||||
cursor: default;
|
||||
}
|
||||
}
|
||||
@@ -2302,7 +2302,7 @@ input[name="subject"] {
|
||||
color: $gray-d1;
|
||||
|
||||
&:hover {
|
||||
color: $blue;
|
||||
color: $uxpl-blue-hover-active;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -2361,21 +2361,20 @@ input[name="subject"] {
|
||||
display: inline;
|
||||
@include margin-left(-5px);
|
||||
span.browse {
|
||||
@include button(simple, $blue);
|
||||
@include button(simple, $uxpl-blue-base);
|
||||
@include margin-right($baseline);
|
||||
padding: 6px ($baseline/2);
|
||||
font-size: 12px;
|
||||
border-radius: 0 3px 3px 0;
|
||||
}
|
||||
input.file_field {
|
||||
@extend %cont-text-sr;
|
||||
position: absolute;
|
||||
@include right(0);
|
||||
top: 0;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
cursor: pointer;
|
||||
opacity: 0;
|
||||
filter: alpha(opacity=0);
|
||||
}
|
||||
}
|
||||
& > span, & input[disabled] {
|
||||
|
||||
@@ -44,18 +44,18 @@
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $blue;
|
||||
border-bottom: 4px solid $blue;
|
||||
color: $uxpl-blue-hover-active;
|
||||
border-bottom: 4px solid $uxpl-blue-hover-active;
|
||||
}
|
||||
|
||||
&.active {
|
||||
border-bottom: 4px solid $blue;
|
||||
border-bottom: 4px solid $uxpl-blue-base;
|
||||
background-color: transparent;
|
||||
color: $blue;
|
||||
color: $uxpl-blue-base;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
color: $blue;
|
||||
color: $uxpl-blue-base;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -97,7 +97,7 @@
|
||||
display: block;
|
||||
@include background-image(linear-gradient(-90deg, lighten($link-color, 8%), lighten($link-color, 5%) 50%, $link-color 50%, darken($link-color, 10%) 100%));
|
||||
border: 1px solid transparent;
|
||||
border-color: darken($link-color, 10%);
|
||||
border-color: $uxpl-blue-base;
|
||||
border-radius: 3px;
|
||||
@include box-sizing(border-box);
|
||||
box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
|
||||
@@ -117,7 +117,7 @@
|
||||
vertical-align: middle;
|
||||
|
||||
&:hover, &:active, &:focus {
|
||||
@include background-image(linear-gradient(-90deg, $link-color, $link-color 50%, $link-color 50%, $link-color 100%));
|
||||
@include background-image(linear-gradient(-90deg, $uxpl-blue-base, $uxpl-blue-base 50%, $uxpl-blue-base 50%, $uxpl-blue-base 100%));
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -159,6 +159,12 @@ $blue-t1: rgba($blue, 0.25);
|
||||
$blue-t2: rgba($blue, 0.50);
|
||||
$blue-t3: rgba($blue, 0.75);
|
||||
|
||||
$uxpl-blue-base: rgba(0, 116, 180, 1); // wcag2a compliant
|
||||
$uxpl-blue-hover-active: lighten($uxpl-blue-base, 7%); // wcag2a compliant
|
||||
|
||||
$uxpl-green-base: rgba(0, 129, 0, 1); // wcag2a compliant
|
||||
$uxpl-green-hover-active: lighten($uxpl-green-base, 7%); // wcag2a compliant
|
||||
|
||||
$orange: rgb(237, 189, 60);
|
||||
$orange-l1: tint($orange,20%);
|
||||
$orange-l2: tint($orange,40%);
|
||||
@@ -423,11 +429,11 @@ $action-secondary-disabled-bg: $m-gray-d3 !default;
|
||||
$action-secondary-disabled-fg: $white !default;
|
||||
|
||||
// actions - misc
|
||||
$link-color: $blue !default;
|
||||
$link-color-d1: $blue !default;
|
||||
$link-hover: $blue-l1 !default; // from our Pattern Library http://ux.edx.org/elements/colors/
|
||||
$link-color: $uxpl-blue-base !default;
|
||||
$link-color-d1: $link-color !default;
|
||||
$link-hover: $uxpl-blue-hover-active !default; // from our Pattern Library http://ux.edx.org/elements/colors/
|
||||
$site-status-color: $pink !default;
|
||||
$button-color: $blue !default;
|
||||
$button-color: $uxpl-blue-base !default;
|
||||
$button-archive-color: rgb(238,238,238) !default; // #eeeeee
|
||||
|
||||
// larger, random elements
|
||||
@@ -462,7 +468,7 @@ $courseware-footer-margin: 0px !default;
|
||||
$courseware-border-bottom-color: rgb(68,162,222) !default;
|
||||
$courseware-button-border-color: rgb(230,230,230) !default;
|
||||
$courseware-hover-color: rgb(51,52,53) !default;
|
||||
$courseware-navigation-color: $blue !default;
|
||||
$courseware-navigation-color: $uxpl-blue-base !default;
|
||||
|
||||
// homepage, onboarding, and course discovery
|
||||
$homepage__header--gradient__color--alpha: lighten($gray, 15%) !default;
|
||||
|
||||
Reference in New Issue
Block a user