Commit edfd0d6a by Chris Rodriguez

AC-549 updating pink

parent 2c4ab116
......@@ -6,8 +6,8 @@ html {
body {
min-width: $fg-min-width;
background: $gray-l5;
color: $gray-d2;
background: $uxpl-grayscale-x-back;
color: $gray-d3;
}
footer.primary{
......
......@@ -28,8 +28,8 @@ html {
body {
@extend %t-copy-base;
min-width: $fg-min-width;
background: $gray-l5;
color: $gray-d2;
background: $uxpl-grayscale-x-back;
color: $gray-d3;
}
body, input, button {
......
......@@ -27,10 +27,10 @@
.cta-show-sock {
@extend %ui-btn-pill;
background: $gray-l5;
background: $uxpl-grayscale-x-back;
font-size: font-size(x-small);
padding: ($baseline/2) $baseline;
color: $gray;
color: $gray-d3;
.icon {
@include margin-right($baseline/4);
......
......@@ -14,7 +14,7 @@
min-width: $fg-min-width;
width: flex-grid(12);
margin: 0 auto;
color: $gray-l1;
color: $gray-d3;
.footer-content-primary {
@include clearfix();
......
......@@ -280,7 +280,7 @@
.nav-item {
@extend %wipe-last-child;
margin-bottom: ($baseline/4);
border-bottom: 1px dotted $gray-l4;
border-bottom: 1px dotted $gray-l5;
padding-bottom: ($baseline/4);
}
}
......
......@@ -41,11 +41,16 @@ $transparent: rgba(0,0,0,0); // used when color value is needed for UI width/tra
// +Colors - UXPL new pattern library colors
// ====================
$uxpl-blue-base: rgba(0, 116, 180, 1); // wcag2a compliant
$uxpl-blue-hover-active: lighten($uxpl-blue-base, 7%); // wcag2a compliant
$uxpl-blue-base: rgb(0, 117, 180); // wcag2a compliant
$uxpl-blue-hover-active: rgb(41, 145, 195); // wcag2a compliant
$uxpl-green-base: rgba(0, 129, 0, 1); // wcag2a compliant
$uxpl-green-hover-active: lighten($uxpl-green-base, 7%); // wcag2a compliant
$uxpl-green-base: rgb(0, 129, 0); // wcag2a compliant
$uxpl-green-hover-active: rgb(0, 155, 0); // wcag2a compliant
$uxpl-pink-base: rgb(194, 56, 125); // wcag2a compliant
$uxpl-pink-hover-active: lighten($uxpl-pink-base, 7%); // wcag2a compliant
$uxpl-grayscale-x-back: rgb(245, 245, 245); // UXPL grayscale, x-back
$uxpl-primary-accent: rgb(14, 166, 236);
......
......@@ -522,7 +522,7 @@
.current-course-image {
margin-bottom: ($baseline/2);
padding: ($baseline/2) $baseline;
background: $gray-l5;
background: $gray-l6;
text-align: center;
.wrapper-course-image {
......@@ -941,7 +941,7 @@
@extend %t-copy-sub2;
display: block;
margin-top: ($baseline/2);
color: $gray-l3;
color: $gray-l5;
}
}
......
......@@ -87,11 +87,16 @@ $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-blue-base: rgb(0, 117, 180); // wcag2a compliant
$uxpl-blue-hover-active: rgb(41, 145, 195); // wcag2a compliant
$uxpl-green-base: rgba(0, 129, 0, 1); // wcag2a compliant
$uxpl-green-hover-active: lighten($uxpl-green-base, 7%); // wcag2a compliant
$uxpl-green-base: rgb(0, 129, 0); // wcag2a compliant
$uxpl-green-hover-active: rgb(0, 155, 0); // wcag2a compliant
$uxpl-pink-base: rgb(194, 56, 125); // wcag2a compliant
$uxpl-pink-hover-active: lighten($uxpl-pink-base, 7%); // wcag2a compliant
$uxpl-grayscale-x-back: rgb(245, 245, 245); // UXPL grayscale, x-back
$pink: rgb(183, 37, 103); // #b72567;
$pink-l1: tint($pink,20%);
......
......@@ -33,7 +33,7 @@ html.video-fullscreen {
@include margin-left($baseline/2);
padding: ($baseline/4) ($baseline/2);
border-radius: ($baseline/4);
background-color: $shadow-l2;
background-color: $light-gray1;
text-align: right;
text-transform: uppercase;
color: $staff-color;
......
......@@ -50,7 +50,6 @@
&.active {
border-bottom: 4px solid $uxpl-blue-base;
background-color: transparent;
color: $uxpl-blue-base;
&:hover,
......
......@@ -249,7 +249,7 @@
@include float(right);
padding: ($baseline/4) ($baseline/2);
border-radius: ($baseline/4);
background-color: $shadow-l2;
background-color: $light-gray1;
@include text-align(right);
text-transform: uppercase;
color: $staff-color;
......
......@@ -159,11 +159,16 @@ $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-blue-base: rgb(0, 117, 180); // wcag2a compliant
$uxpl-blue-hover-active: rgb(41, 145, 195); // wcag2a compliant
$uxpl-green-base: rgba(0, 129, 0, 1); // wcag2a compliant
$uxpl-green-hover-active: lighten($uxpl-green-base, 7%); // wcag2a compliant
$uxpl-green-base: rgb(0, 129, 0); // wcag2a compliant
$uxpl-green-hover-active: rgb(0, 155, 0); // wcag2a compliant
$uxpl-pink-base: rgb(194, 56, 125); // wcag2a compliant
$uxpl-pink-hover-active: lighten($uxpl-pink-base, 7%); // wcag2a compliant
$uxpl-grayscale-x-back: rgb(245, 245, 245); // UXPL grayscale, x-back
$orange: rgb(237, 189, 60);
$orange-l1: tint($orange,20%);
......@@ -311,7 +316,7 @@ $audit-color-lvl2: tint($audit-color-lvl1, 33%);
$credit-color-base: rgb(244,195,0); // accessible with black text
// edx-specific: Studio/Staff actions
$staff-color: $pink;
$staff-color: $uxpl-pink-base;
// ----------------------------
......@@ -439,7 +444,7 @@ $button-archive-color: rgb(238,238,238) !default; // #eeeeee
// larger, random elements
$dark-trans-bg: rgba(0, 0, 0, .75);
$body-bg: rgb(250,250,250) !default;
$body-bg: $uxpl-grayscale-x-back !default;
$container-bg: $white !default;
......@@ -495,7 +500,7 @@ $dashboard-course-cover-border: rgb(221, 221, 221) !default;
// course elements
$content-wrapper-bg: $white !default;
$course-bg-color: #f2f2f2 !default;
$course-bg-color: $uxpl-grayscale-x-back !default;
$account-content-wrapper-bg: shade($body-bg, 2%) !default;
$course-profile-bg: rgb(245,245,245) !default;
$course-header-bg: rgba(255,255,255, 0.93) !default;
......
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