diff --git a/cms/static/sass/_base.scss b/cms/static/sass/_base.scss
index 60bc4696477cd3cdaa91ec8e67361d8d4971f03b..47b6db55db60d4438016f621e7d0b35e4990ad70 100644
--- a/cms/static/sass/_base.scss
+++ b/cms/static/sass/_base.scss
@@ -30,7 +30,7 @@ a {
h1 {
@extend %t-title4;
- font-weight: 300;
+ @extend %t-light;
}
.waiting {
@@ -52,23 +52,23 @@ h1 {
// typography - basic
.page-header {
@extend %t-title3;
+ @extend %t-strong;
display: block;
- font-weight: 600;
color: $gray-d3;
.navigation, .subtitle {
@extend %t-title7;
+ @extend %t-regular;
position: relative;
top: ($baseline/4);
display: block;
color: $gray-l2;
- font-weight: 400;
}
}
.section-header {
@extend %t-title4;
- font-weight: 600;
+ @extend %t-strong;
.subtitle {
@extend %t-title7;
@@ -77,7 +77,7 @@ h1 {
.area-header {
@extend %t-title6;
- font-weight: 600;
+ @extend %t-strong;
.subtitle {
@extend %t-title8;
@@ -86,7 +86,7 @@ h1 {
.area-subheader {
@extend %t-title7;
- font-weight: 600;
+ @extend %t-strong;
.subtitle {
@extend %t-title9;
@@ -163,7 +163,7 @@ h1 {
// typography - loose headings (BT: needs to be removed once html is clean)
.title-1, .title-2, .title-3, .title-4, .title-5, .title-6 {
- font-weight: 600;
+ @extend %t-strong;
}
// typography - primary content
@@ -214,22 +214,22 @@ h1 {
.title-4 {
@extend %t-title7;
+ @extend %t-regular;
margin-bottom: $baseline;
- font-weight: 500
}
.title-5 {
@extend %t-title7;
+ @extend %t-regular;
color: $gray-l1;
margin-bottom: $baseline;
- font-weight: 500
}
.title-6 {
@extend %t-title7;
+ @extend %t-regular;
color: $gray-l2;
margin-bottom: $baseline;
- font-weight: 500
}
p, ul, ol, dl {
@@ -317,16 +317,16 @@ hr.divide {
label {
display: block;
margin-bottom: 6px;
- font-weight: 700;
+ @extend %t-strong;
&.inline-label {
display: inline;
}
.description {
+ @extend %t-regular;
display: block;
font-size: 11px;
- font-weight: 400;
font-style: italic;
line-height: 1.3;
color: #999;
@@ -366,28 +366,28 @@ hr.divide {
}
strong {
+ @extend %t-strong;
display: block;
margin-bottom: 10px;
font-size: 16px;
- font-weight: 700;
text-align: center;
}
.close-button {
+ @extend %t-strong;
position: absolute;
top: 0;
right: 0;
width: 27px;
height: 27px;
font-size: 22px;
- font-weight: 700;
line-height: 25px;
color: #aaa;
text-align: center;
.close-icon {
+ @extend %t-strong;
font-size: 16px;
- font-weight: 700;
}
}
@@ -418,8 +418,8 @@ hr.divide {
}
&:after {
- content: '';
@extend .spinner-icon;
+ content: '';
display: block;
position: absolute;
top: 50%;
@@ -475,12 +475,12 @@ hr.divide {
.edit-button.standard,
.delete-button.standard,
.duplicate-button.standard {
- @extend %t-action4;
@include white-button;
+ @extend %t-regular;
+ @extend %t-action4;
float: left;
padding: 3px 10px 4px;
margin-left: 7px;
- font-weight: 400;
.edit-icon,
.delete-icon,
@@ -499,6 +499,7 @@ hr.divide {
.tooltip {
@include font-size(12);
@include transition(opacity $tmg-f3 ease-out 0s);
+ @extend %t-regular;
@extend %ui-depth5;
position: absolute;
top: 0;
@@ -506,7 +507,6 @@ hr.divide {
padding: 0 10px;
border-radius: 3px;
background: rgba(0, 0, 0, 0.85);
- font-weight: normal;
line-height: 26px;
color: $white;
pointer-events: none;
@@ -635,8 +635,8 @@ body.js {
.title {
@extend %t-title5;
+ @extend %t-strong;
margin: 0 0 ($baseline/2) 0;
- font-weight: 600;
color: $gray-d3;
}
diff --git a/cms/static/sass/_reset.scss b/cms/static/sass/_reset.scss
index 6225a4ed89c7c10b7ca63c2dc65713e9875bcf54..ba12a7f6c361384b0a232f5e6255842a99930bff 100644
--- a/cms/static/sass/_reset.scss
+++ b/cms/static/sass/_reset.scss
@@ -127,8 +127,8 @@ abbr[title] {
margin: 0;
}
a {
+ @extend %t-regular;
float: none;
- font-weight: normal;
}
}
@@ -152,9 +152,9 @@ abbr[title] {
opacity: 0.8;
&:ui-state-active {
+ @extend %t-regular;
background-color: rgba(255, 255, 255, .3);
opacity: 1.0;
- font-weight: 400;
}
a:focus {
outline: none;
diff --git a/cms/static/sass/_shame.scss b/cms/static/sass/_shame.scss
index 0549cbf7c5e10f9a4d45ee11cfcddc4b6ae450b1..6d0ceb35a82ad1c726acdb66593817b8c502dd98 100644
--- a/cms/static/sass/_shame.scss
+++ b/cms/static/sass/_shame.scss
@@ -44,7 +44,7 @@
// yes we have no boldness today - need to fix the resets
body strong,
body b {
- font-weight: 700;
+ @extend %t-ultrastrong;
}
// ====================
diff --git a/cms/static/sass/assets/_graphics.scss b/cms/static/sass/assets/_graphics.scss
index 3bd927841fc9a3c3e599569409ee536d6211aacc..af0a467916932c211eda54a94aee97ab7654ab48 100644
--- a/cms/static/sass/assets/_graphics.scss
+++ b/cms/static/sass/assets/_graphics.scss
@@ -156,9 +156,9 @@
.draft-tag,
.public-tag,
.private-tag {
+ @extend %t-strong;
margin-left: 3px;
font-size: 9px;
- font-weight: 600;
text-transform: uppercase;
color: #a4aab7;
}
diff --git a/cms/static/sass/elements/_forms.scss b/cms/static/sass/elements/_forms.scss
index e5490fe58fa5c74f5d6d6ca0aacdf4ccf5667620..66ce3827c4a7f5c0d4a19b2b6e506c48de8945dd 100644
--- a/cms/static/sass/elements/_forms.scss
+++ b/cms/static/sass/elements/_forms.scss
@@ -124,7 +124,7 @@ form[class^="create-"] {
.title {
@extend %t-title4;
- font-weight: 600;
+ @extend %t-strong;
padding: $baseline ($baseline*1.5) 0 ($baseline*1.5);
}
@@ -146,7 +146,7 @@ form[class^="create-"] {
&.required {
label {
- font-weight: 600;
+ @extend %t-strong;
}
label:after {
@@ -308,9 +308,9 @@ form[class^="create-"] {
.action {
@include transition(all $tmg-f2 linear 0s);
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
text-transform: uppercase;
}
diff --git a/cms/static/sass/elements/_header.scss b/cms/static/sass/elements/_header.scss
index e6b06242f5eef259dff7bfce4c49c532cc437ed8..8560bb17394e1581a5a8d3311a66d506956954fb 100644
--- a/cms/static/sass/elements/_header.scss
+++ b/cms/static/sass/elements/_header.scss
@@ -52,9 +52,9 @@
> ol > .nav-item {
@extend %t-action3;
+ @extend %t-strong;
display: inline-block;
vertical-align: middle;
- font-weight: 600;
&:last-child {
margin-right: 0;
@@ -149,12 +149,12 @@
.course-title {
@extend %t-action2;
+ @extend %t-strong;
display: block;
width: 100%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
- font-weight: 600;
}
// entire link
@@ -311,17 +311,17 @@
.action-signup {
@include blue-button;
@include font-size(14);
+ @extend %t-strong;
padding: ($baseline/4) ($baseline/2);
text-transform: uppercase;
- font-weight: 600;
}
.action-signin {
@include white-button;
@include font-size(14);
+ @extend %t-strong;
padding: ($baseline/4) ($baseline/2);
text-transform: uppercase;
- font-weight: 600;
}
}
}
diff --git a/cms/static/sass/elements/_icons.scss b/cms/static/sass/elements/_icons.scss
index fca70879022483e3afc8b9b55f7b06a4a3477841..937366c0030751af6788c2579d8893bb23fc77c2 100644
--- a/cms/static/sass/elements/_icons.scss
+++ b/cms/static/sass/elements/_icons.scss
@@ -25,11 +25,11 @@
%ui-badge {
@extend %t-title9;
+ @extend %t-strong;
position: relative;
border-bottom-right-radius: ($baseline/10);
border-bottom-left-radius: ($baseline/10);
padding: ($baseline/4) ($baseline/2) ($baseline/4) ($baseline/2);
- font-weight: 600;
text-transform: uppercase;
* [class^="icon-"] {
diff --git a/cms/static/sass/elements/_layout.scss b/cms/static/sass/elements/_layout.scss
index 942a85e7ef4b1639e18ba21cd814ba1be93ed30d..1dbd1b0b1078b0f649fe26bad7e45e9feb6f6243 100644
--- a/cms/static/sass/elements/_layout.scss
+++ b/cms/static/sass/elements/_layout.scss
@@ -178,9 +178,9 @@
.title-1 {
@extend %t-title3;
+ @extend %t-strong;
margin: 0;
padding: 0;
- font-weight: 600;
color: $gray-d3;
}
}
diff --git a/cms/static/sass/elements/_modal-window.scss b/cms/static/sass/elements/_modal-window.scss
index 80c76b89c7d45c31d86a939cea77776d032fc262..1263f041e6384b4191846cd83d55496787adb12f 100644
--- a/cms/static/sass/elements/_modal-window.scss
+++ b/cms/static/sass/elements/_modal-window.scss
@@ -25,8 +25,8 @@
.title {
@extend %t-title5;
+ @extend %t-strong;
margin: ($baseline/4) ($baseline/2) ($baseline/2) ($baseline/2);
- font-weight: 600;
color: $black;
}
@@ -253,9 +253,9 @@
label {
@extend %t-copy-sub1;
+ @extend %t-strong;
@include transition(color $tmg-f3 ease-in-out 0s);
margin: 0 0 ($baseline/4) 0;
- font-weight: 600;
&.is-focused {
color: $blue;
@@ -391,11 +391,11 @@
.component-name {
@extend %t-title5;
+ @extend %t-strong;
display: inline-block;
vertical-align: middle;
width: 48%;
margin-left: ($baseline/2);
- font-weight: 600;
color: $black;
em {
@@ -419,12 +419,12 @@
a.tab {
@extend %btn-secondary-gray;
@extend %t-copy-sub1;
+ @extend %t-regular;
background-image: none;
box-shadow: none;
border: 0;
padding: ($baseline/4) ($baseline/2);
text-transform: uppercase;
- font-weight: normal;
&.current {
background-color: $gray-d1;
diff --git a/cms/static/sass/elements/_modal.scss b/cms/static/sass/elements/_modal.scss
index 812542515ac936f85b9e18a2a8c18999e161a5f3..532f747a9587560d806556412f33df266fd353c5 100644
--- a/cms/static/sass/elements/_modal.scss
+++ b/cms/static/sass/elements/_modal.scss
@@ -36,10 +36,10 @@
}
h2 {
+ @extend %t-light;
margin: 0 10px 30px;
color: #646464;
font-size: 19px;
- font-weight: 300;
letter-spacing: 1px;
text-transform: uppercase;
}
diff --git a/cms/static/sass/elements/_modules.scss b/cms/static/sass/elements/_modules.scss
index cb786d47db283ef69acdbf7bb1399b71092456ee..9894fffcab7b67ea2f797d5b6511585b92f2ab81 100644
--- a/cms/static/sass/elements/_modules.scss
+++ b/cms/static/sass/elements/_modules.scss
@@ -11,10 +11,10 @@
.bar-mod-title {
@extend %t-title6;
+ @extend %t-strong;
display: block;
padding: ($baseline/2) ($baseline*.75);
background-color: $gray-l4;
- font-weight: 600;
}
.bar-mod-content {
@@ -24,8 +24,8 @@
.title {
@extend %t-title8;
+ @extend %t-strong;
margin-bottom: ($baseline/4);
- font-weight: 600;
color: $gray-l2;
text-transform: uppercase;
}
@@ -108,9 +108,9 @@
h5 {
@extend %t-title5;
+ @extend %t-strong;
margin-bottom: ($baseline*.75);
color: $green-d1;
- font-weight: 600;
}
// add component - list of green buttons
@@ -198,12 +198,12 @@
a {
@include clearfix();
@include transition(none);
+ @extend %t-strong;
display: block;
border: 0px;
padding: 7px $baseline;
background: $white;
color: $gray-d3;
- font-weight: 500;
&:hover {
diff --git a/cms/static/sass/elements/_navigation.scss b/cms/static/sass/elements/_navigation.scss
index 893fb30a7d656f20c3c6f8ce2fcc8ad3212a5999..2963b41b633fcd07f1eab89856afc968e37c0853 100644
--- a/cms/static/sass/elements/_navigation.scss
+++ b/cms/static/sass/elements/_navigation.scss
@@ -118,11 +118,11 @@ nav {
.nav-item {
@extend %t-action3;
+ @extend %t-strong;
display: block;
margin: 0 0 ($baseline/4) 0;
border-bottom: 1px solid $gray-l5;
padding: 0 0($baseline/4) 0;
- font-weight: 500;
&:last-child {
margin-bottom: 0;
diff --git a/cms/static/sass/elements/_system-feedback.scss b/cms/static/sass/elements/_system-feedback.scss
index 8a850b14b2f531f3755551ecae547023d0140887..cf0a54937b153df4296567c779f7ee50962647a5 100644
--- a/cms/static/sass/elements/_system-feedback.scss
+++ b/cms/static/sass/elements/_system-feedback.scss
@@ -8,13 +8,13 @@
}
.message-status {
- display: none;
@include border-top-radius(2px);
@include box-sizing(border-box);
+ @extend %t-strong;
+ display: none;
border-bottom: 2px solid $yellow-d2;
margin: 0 0 $baseline 0;
padding: ($baseline/2) $baseline;
- font-weight: 500;
background: $yellow-d1;
color: $white;
@@ -234,7 +234,7 @@
.action-primary {
@extend %t-action4;
- font-weight: 600;
+ @extend %t-strong;
}
.action-secondary {
@@ -396,7 +396,7 @@
min-width: $fg-min-width;
strong {
- font-weight: 700;
+ @extend %t-strong;
}
[class^="icon"], .copy {
@@ -459,8 +459,8 @@
.action-primary {
@include blue-button();
+ @extend %t-strong;
border-color: $blue-d2;
- font-weight: 600;
}
.action-secondary {
@@ -576,7 +576,7 @@
color: $white;
strong {
- font-weight: 700;
+ @extend %t-strong;
}
[class^="icon"], .copy {
@@ -609,37 +609,37 @@
width: flex-grid(1, 12);
}
- .copy {
- width: flex-grid(7, 12);
- margin-right: flex-gutter();
- }
+ .copy {
+ width: flex-grid(7, 12);
+ margin-right: flex-gutter();
+ }
- .nav-actions {
- width: flex-grid(4, 12);
- float: right;
- margin-top: ($baseline/2);
- text-align: right;
+ .nav-actions {
+ width: flex-grid(4, 12);
+ float: right;
+ margin-top: ($baseline/2);
+ text-align: right;
- .nav-item {
- display: inline-block;
- vertical-align: middle;
- margin-right: ($baseline/2);
+ .nav-item {
+ display: inline-block;
+ vertical-align: middle;
+ margin-right: ($baseline/2);
- &:last-child {
- margin-right: 0;
- }
+ &:last-child {
+ margin-right: 0;
+ }
- .action-primary {
- @extend %t-action4;
- font-weight: 600;
- }
+ .action-primary {
+ @extend %t-action4;
+ @extend %t-strong;
+ }
- .action-secondary {
- @extend %t-action4;
- }
- }
- }
+ .action-secondary {
+ @extend %t-action4;
+ }
+ }
}
+}
// with cancel
.action-alert-close {
@@ -863,7 +863,7 @@ body.uxdesign.alerts {
}
strong {
- font-weight: 700;
+ @extend %t-strong;
}
.alert-action {
@@ -877,38 +877,38 @@ body.uxdesign.alerts {
}
body.error {
- background: $gray-d4;
- color: $gray-d3;
-
- .primary-header {
- display: none;
- }
-
- .error-prompt {
- width: 700px;
- margin: 150px auto;
- padding: 60px 50px 90px;
- border-radius: 3px;
- background: $white;
- text-align: center;
- }
-
- h1 {
- float: none;
- margin: 0;
- font-size: 60px;
- font-weight: 300;
- color: $gray-d3;
- }
-
- .description {
- margin-bottom: 50px;
- font-size: 21px;
- }
-
- .back-button {
- @include blue-button;
- padding: 14px 40px 18px;
- font-size: 18px;
- }
+ background: $gray-d4;
+ color: $gray-d3;
+
+ .primary-header {
+ display: none;
+ }
+
+ .error-prompt {
+ width: 700px;
+ margin: 150px auto;
+ padding: 60px 50px 90px;
+ border-radius: 3px;
+ background: $white;
+ text-align: center;
+ }
+
+ h1 {
+ @extend %t-light;
+ float: none;
+ margin: 0;
+ font-size: 60px;
+ color: $gray-d3;
+ }
+
+ .description {
+ margin-bottom: 50px;
+ font-size: 21px;
+ }
+
+ .back-button {
+ @include blue-button;
+ padding: 14px 40px 18px;
+ font-size: 18px;
+ }
}
diff --git a/cms/static/sass/elements/_system-help.scss b/cms/static/sass/elements/_system-help.scss
index b9e351e43527ad0b6604546e696160f2955d2785..f7e34f2043db75016f8bc695c32c45b74e9e2940 100644
--- a/cms/static/sass/elements/_system-help.scss
+++ b/cms/static/sass/elements/_system-help.scss
@@ -8,7 +8,7 @@
.title {
@extend %t-title4;
- font-weight: 600;
+ @extend %t-strong;
}
.copy {
@@ -16,7 +16,7 @@
}
strong {
- font-weight: 600;
+ @extend %t-strong;
}
// CASE: has links alongside
@@ -56,8 +56,8 @@
.title {
@extend %t-title6;
+ @extend %t-strong;
margin-bottom: ($baseline/2);
- font-weight: 700;
}
.copy {
@@ -72,7 +72,7 @@
}
strong {
- font-weight: 600;
+ @extend %t-strong;
}
&.has-status {
@@ -230,9 +230,9 @@
h3, .title {
@extend %t-title7;
+ @extend %t-strong;
margin: 0 0 ($baseline/4) 0;
color: $gray-d2;
- font-weight: 600;
}
p, .copy {
diff --git a/cms/static/sass/elements/_tender-widget.scss b/cms/static/sass/elements/_tender-widget.scss
index 1b04cb19fd8f91929b86ed09bb2e4f6606ab2f76..bf35b5016bcb168ea5648fd882e0bf9211d1e11a 100644
--- a/cms/static/sass/elements/_tender-widget.scss
+++ b/cms/static/sass/elements/_tender-widget.scss
@@ -61,7 +61,7 @@
}
.widget-layout h1, .widget-layout h2, .widget-layout h3, .widget-layout h4, .widget-layout h5, .widget-layout h6, .widget-layout label {
- font-weight: 600;
+ @extend %t-strong;
}
.widget-layout .header h1 {
@@ -86,10 +86,10 @@
}
.widget-layout label {
+ @extend %t-strong;
font-size: 14px;
margin-bottom: 5px;
color: #4c4c4c;
- font-weight: 500;
}
.widget-layout input[type="text"], .widget-layout textarea {
@@ -177,12 +177,12 @@
}
.widget-layout #discussion_body:before {
+ @extend %t-strong;
content: "What Question or Feedback Would You Like to Share?";
display: block;
font-size: 14px;
margin-bottom: 5px;
color: #4c4c4c;
- font-weight: 500;
}
@@ -203,8 +203,8 @@
}
.widget-layout dl#brain_buster_captcha dd label {
+ @extend %t-strong;
display: block;
- font-weight: 700;
margin: 0 15px 5px 0 !important;
}
@@ -214,11 +214,11 @@
}
.widget-layout .form-actions .btn-post_topic {
+ @extend %t-strong;
display: block;
width: 100%;
height: auto !important;
font-size: 16px;
- font-weight: 700;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0);
-moz-box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0);
box-shadow: 0 1px 0 rgba(255,255,255,0.3) inset,0 0 0 rgba(0,0,0,0);
diff --git a/cms/static/sass/elements/_xblocks.scss b/cms/static/sass/elements/_xblocks.scss
index b58db7857ecc11dfa1f039a424e08ca0e7027720..0ec084acff050b29855ea19f90782a37de657c75 100644
--- a/cms/static/sass/elements/_xblocks.scss
+++ b/cms/static/sass/elements/_xblocks.scss
@@ -313,11 +313,11 @@
}
.xblock-header-primary {
+ @extend %t-light;
display: flex;
margin-bottom: 0;
border-bottom: 1px solid $gray-l4;
background-color: $gray-l6;
- font-weight: 300;
}
.xblock-render {
@@ -434,10 +434,10 @@
.upload-setting {
@extend %ui-btn-flat-outline;
@extend %t-action3;
+ @extend %t-strong;
@include box-sizing(border-box);
display: inline-block;
padding: ($baseline/2);
- font-weight: 600;
width: 49%;
margin-right: 2%;
}
@@ -445,10 +445,10 @@
.download-setting {
@extend %ui-btn-non;
@extend %t-action4;
+ @extend %t-strong;
@include box-sizing(border-box);
display: inline-block;
padding: ($baseline/2);
- font-weight: 600;
width: 49%;
text-align: center;
color: $blue;
@@ -521,8 +521,9 @@
}
.setting-label {
- @extend %t-copy-sub1;
@include transition(color $tmg-f2 ease-in-out 0s);
+ @extend %t-copy-sub1;
+ @extend %t-strong;
vertical-align: middle;
display: inline-block;
position: relative;
@@ -530,7 +531,6 @@
width: 25%;
min-width: 100px;
margin-right: ($baseline/2);
- font-weight: 600;
&.is-focused {
color: $blue;
@@ -662,10 +662,10 @@
.create-setting {
@extend %ui-btn-flat-outline;
@extend %t-action3;
+ @extend %t-strong;
display: block;
width: 100%;
padding: ($baseline/2);
- font-weight: 600;
*[class^="icon-"] {
margin-right: ($baseline/4);
@@ -733,10 +733,10 @@
.create-setting {
@extend %ui-btn-flat-outline;
@extend %t-action3;
+ @extend %t-strong;
display: block;
width: 88%;
padding: ($baseline/2);
- font-weight: 600;
*[class^="icon-"] {
margin-right: ($baseline/4);
diff --git a/cms/static/sass/elements/_xmodules.scss b/cms/static/sass/elements/_xmodules.scss
index 4fe2450388375c22e01fa67f9168d55aa5e92497..8bc2aa19719a0d60f19a05c2ccbba8a8204f0551 100644
--- a/cms/static/sass/elements/_xmodules.scss
+++ b/cms/static/sass/elements/_xmodules.scss
@@ -52,10 +52,10 @@
.collapse-setting {
@extend %t-action3;
+ @extend %t-strong;
display: block;
width: 100%;
padding: ($baseline/2);
- font-weight: 600;
*[class^="icon-"] {
margin-right: ($baseline/4);
@@ -140,8 +140,8 @@
}
.transcripts-message-status {
+ @extend %t-strong;
color: $green;
- font-weight: 700;
&.status-error {
color: $red;
@@ -282,9 +282,9 @@
.create-setting {
@extend %ui-btn-flat-outline;
@extend %t-action3;
+ @extend %t-strong;
display: block;
padding: ($baseline/2);
- font-weight: 600;
*[class^="icon-"] {
margin-right: ($baseline/4);
@@ -294,9 +294,9 @@
.upload-setting {
@extend %ui-btn-flat-outline;
@extend %t-action3;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/2);
- font-weight: 600;
width: 49%;
margin-right: 2%;
}
@@ -304,9 +304,9 @@
.download-setting {
@extend %ui-btn-non;
@extend %t-action4;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/2);
- font-weight: 600;
width: 49%;
text-align: center;
color: $blue;
diff --git a/cms/static/sass/views/_account.scss b/cms/static/sass/views/_account.scss
index e3566acf3e411f2ceade4bbdf4ad0fea3bc3f3af..adf68981d70bf3af3ad120bb025082dd79c8a1bb 100644
--- a/cms/static/sass/views/_account.scss
+++ b/cms/static/sass/views/_account.scss
@@ -29,9 +29,9 @@
h1 {
@extend %t-title3;
+ @extend %t-strong;
margin: 0;
padding: 0;
- font-weight: 600;
}
.action {
@@ -70,13 +70,13 @@
margin-top: $baseline;
.action-primary {
- @include blue-button;
- @extend %t-action2;
+ @include blue-button();
@include transition(all $tmg-f3 linear 0s);
+ @extend %t-action2;
+ @extend %t-strong;
display: block;
width: 100%;
padding: ($baseline*0.75) ($baseline/2);
- font-weight: 600;
text-transform: uppercase;
}
}
@@ -96,7 +96,7 @@
&.required {
label {
- font-weight: 600;
+ @extend %t-strong;
}
label:after {
@@ -228,9 +228,9 @@
h3 {
@extend %t-title7;
+ @extend %t-strong;
margin: 0 0 ($baseline/4) 0;
color: $gray-d2;
- font-weight: 600;
}
}
diff --git a/cms/static/sass/views/_assets.scss b/cms/static/sass/views/_assets.scss
index 1cdce2f1f3024c157e04b2032248373d43849df4..fe16b85f2639bdc3ef018f717eb2edeed577d2d0 100644
--- a/cms/static/sass/views/_assets.scss
+++ b/cms/static/sass/views/_assets.scss
@@ -60,7 +60,7 @@
.count-current-shown,
.count-total,
.sort-order {
- font-weight: 700;
+ @extend %t-strong;
}
}
@@ -125,12 +125,12 @@
.page-number-input,
.total-pages {
@extend %t-copy-base;
+ @extend %t-strong;
width: ($baseline*2.5);
margin: 0 ($baseline*0.75);
padding: ($baseline/4);
text-align: center;
color: $gray;
- font-weight: 600;
}
.current-page {
@@ -141,9 +141,9 @@
.page-divider {
@extend %t-title4;
+ @extend %t-regular;
vertical-align: middle;
color: $gray-l2;
- font-weight: 400;
}
@@ -207,8 +207,8 @@
.current-sort {
+ @extend %t-strong;
border-bottom: 1px solid $gray-l3;
- font-weight: 700;
}
// CASE: embed column
@@ -404,9 +404,9 @@
.title {
@extend %t-title3;
+ @extend %t-light;
float: none;
margin: ($baseline*2) 0 ($baseline*1.5);
- font-weight: 300;
}
.file-input {
@@ -471,9 +471,9 @@
margin: ($baseline*1.5) 0 ($baseline*4);
label {
+ @extend %t-strong;
display: block;
margin-bottom: ($baseline/2);
- font-weight: 700;
}
}
diff --git a/cms/static/sass/views/_checklists.scss b/cms/static/sass/views/_checklists.scss
index 806f453af2743e6b08fb3b035863f8062a7c22b6..2f50e04564293b8416dac47b94fbb3ac069d3a35 100644
--- a/cms/static/sass/views/_checklists.scss
+++ b/cms/static/sass/views/_checklists.scss
@@ -101,17 +101,17 @@
.status-count {
@extend %t-copy-base;
+ @extend %t-strong;
margin-left: ($baseline/4);
margin-right: ($baseline/4);
color: $gray-d3;
- font-weight: 600;
}
.status-amount {
@extend %t-copy-base;
+ @extend %t-strong;
margin-left: ($baseline/4);
color: $gray-d3;
- font-weight: 600;
}
}
}
@@ -140,7 +140,7 @@
.action-secondary {
@include grey-button();
@extend %t-action3;
- font-weight: 400;
+ @extend %t-regular;
float: right;
.icon-delete {
@@ -232,11 +232,11 @@
}
.task-details {
+ @extend %t-strong;
display: inline-block;
vertical-align: text-top;
float: left;
width: flex-grid(6,9);
- font-weight: 500;
.task-name {
@include transition(color $tmg-f2 ease-in-out 0s);
diff --git a/cms/static/sass/views/_container.scss b/cms/static/sass/views/_container.scss
index f94353118cc241c2639f186b6957696e574dd525..cea328ad4f5ab19388682ee408caf8a796409e8b 100644
--- a/cms/static/sass/views/_container.scss
+++ b/cms/static/sass/views/_container.scss
@@ -19,10 +19,10 @@
.page-header {
.page-header-title {
- @extend %t-title;
@include font-size(28);
@include line-height(32);
- font-weight: 600;
+ @extend %t-title;
+ @extend %t-strong;
}
.is-editable {
@@ -52,8 +52,8 @@
.button {
@extend %t-action3;
+ @extend %t-regular;
padding: ($baseline/4) ($baseline*.75);
- font-weight: 400;
}
}
}
@@ -150,22 +150,22 @@
.date,
.user {
- font-weight: 600;
+ @extend %t-strong;
}
}
.wrapper-release {
.release-date {
- font-weight: 600;
+ @extend %t-strong;
}
}
.wrapper-visibility {
.copy {
+ @extend %t-strong;
margin-bottom: ($baseline/10);
- font-weight: 600;
}
[class^="icon-"] {
@@ -213,7 +213,7 @@
.date,
.user {
- font-weight: 600;
+ @extend %t-strong;
}
}
}
diff --git a/cms/static/sass/views/_dashboard.scss b/cms/static/sass/views/_dashboard.scss
index d27fa955b0ac6083cdb92d95740d5e360fed9968..49bec99934a22392a981389ff052a65eb968f762 100644
--- a/cms/static/sass/views/_dashboard.scss
+++ b/cms/static/sass/views/_dashboard.scss
@@ -3,150 +3,150 @@
.view-dashboard {
- // temp
- .content {
- margin-bottom: ($baseline*5);
-
- &:last-child {
- margin-bottom: 0;
- }
- }
-
- // ====================
-
- // basic layout
- .content-primary, .content-supplementary {
- @include box-sizing(border-box);
- float: left;
- }
-
- .content-primary {
- width: flex-grid(9, 12);
- margin-right: flex-gutter();
- }
-
- .content-supplementary {
- width: flex-grid(3, 12);
- }
-
- // ====================
-
- // elements - notices
- .content .notice-incontext {
- width: flexgrid(9, 9);
-
- // CASE: notice has actions {
- &.has-actions, &.list-notices .notice-item.has-actions {
-
- .msg, .list-actions {
- display: inline-block;
- vertical-align: middle;
- }
-
- .msg {
- width: flex-grid(6, 9);
- margin-right: flex-gutter();
- }
-
- .list-actions {
- width: flex-grid(3, 9);
- text-align: right;
- margin-top: 0;
-
- .action-item {
-
- }
-
- .action-create-course {
- @extend %btn-primary-green;
- @extend %t-action3;
- }
- }
- }
- }
-
-
-
- // elements - course creation rights controls
- .wrapper-creationrights {
- overflow: hidden;
-
- .ui-toggle-control {
- @extend %ui-depth2;
- @extend %btn-secondary-gray;
- @include clearfix();
- display: block;
- text-align: left;
-
- // STATE: hover - syncing up colors with current so transition is smoother
- &:hover {
- background: $gray-d1;
- color: $white;
- }
-
- .label {
- @extend %t-action3;
- float: left;
- width: flex-grid(8, 9);
- margin: 3px flex-gutter() 0 0;
- }
-
- .icon-remove-sign {
- @extend %t-action1;
- @include transform(rotate(45deg));
- @include transform-origin(center center);
- @include transition(all $tmg-f1 linear 0s);
- float: right;
- text-align: right;
- }
- }
-
- .ui-toggle-target {
- @extend %ui-depth1;
- @include transition(opacity $tmg-f1 ease-in-out 0s);
- position: relative;
- top: -2px;
- display: none;
- opacity: 0;
- }
-
- // CASE: when the content area is shown
- &.is-shown {
-
- .ui-toggle-control {
- @include border-bottom-radius(0);
-
- .icon-remove-sign {
- @include transform(rotate(90deg));
- @include transform-origin(center center);
- }
- }
-
- .ui-toggle-target {
- display: block;
- opacity: 1.0;
- }
- }
-
-
- }
-
- // elements - course creation rights controls
- .status-creationrights {
- margin-top: $baseline;
-
- .title {
- @extend %t-title7;
- margin-bottom: ($baseline/4);
- font-weight: 700;
- color: $gray-d1;
- }
-
- .copy {
-
- }
-
- .list-actions, .form-actions {
+ // temp
+ .content {
+ margin-bottom: ($baseline*5);
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+ }
+
+ // ====================
+
+ // basic layout
+ .content-primary, .content-supplementary {
+ @include box-sizing(border-box);
+ float: left;
+ }
+
+ .content-primary {
+ width: flex-grid(9, 12);
+ margin-right: flex-gutter();
+ }
+
+ .content-supplementary {
+ width: flex-grid(3, 12);
+ }
+
+ // ====================
+
+ // elements - notices
+ .content .notice-incontext {
+ width: flexgrid(9, 9);
+
+ // CASE: notice has actions {
+ &.has-actions, &.list-notices .notice-item.has-actions {
+
+ .msg, .list-actions {
+ display: inline-block;
+ vertical-align: middle;
+ }
+
+ .msg {
+ width: flex-grid(6, 9);
+ margin-right: flex-gutter();
+ }
+
+ .list-actions {
+ width: flex-grid(3, 9);
+ text-align: right;
+ margin-top: 0;
+
+ .action-item {
+
+ }
+
+ .action-create-course {
+ @extend %btn-primary-green;
+ @extend %t-action3;
+ }
+ }
+ }
+ }
+
+
+
+ // elements - course creation rights controls
+ .wrapper-creationrights {
+ overflow: hidden;
+
+ .ui-toggle-control {
+ @extend %ui-depth2;
+ @extend %btn-secondary-gray;
+ @include clearfix();
+ display: block;
+ text-align: left;
+
+ // STATE: hover - syncing up colors with current so transition is smoother
+ &:hover {
+ background: $gray-d1;
+ color: $white;
+ }
+
+ .label {
+ @extend %t-action3;
+ float: left;
+ width: flex-grid(8, 9);
+ margin: 3px flex-gutter() 0 0;
+ }
+
+ .icon-remove-sign {
+ @extend %t-action1;
+ @include transform(rotate(45deg));
+ @include transform-origin(center center);
+ @include transition(all $tmg-f1 linear 0s);
+ float: right;
+ text-align: right;
+ }
+ }
+
+ .ui-toggle-target {
+ @extend %ui-depth1;
+ @include transition(opacity $tmg-f1 ease-in-out 0s);
+ position: relative;
+ top: -2px;
+ display: none;
+ opacity: 0;
+ }
+
+ // CASE: when the content area is shown
+ &.is-shown {
+
+ .ui-toggle-control {
+ @include border-bottom-radius(0);
+
+ .icon-remove-sign {
+ @include transform(rotate(90deg));
+ @include transform-origin(center center);
+ }
+ }
+
+ .ui-toggle-target {
+ display: block;
+ opacity: 1.0;
+ }
+ }
+
+
+ }
+
+ // elements - course creation rights controls
+ .status-creationrights {
+ margin-top: $baseline;
+
+ .title {
+ @extend %t-title7;
+ @extend %t-strong;
+ margin-bottom: ($baseline/4);
+ color: $gray-d1;
+ }
+
+ .copy {
+
+ }
+
+ .list-actions, .form-actions {
margin-top: ($baseline*0.75);
.action-item {
@@ -161,29 +161,29 @@
// specific - request button
// BT: should we abstract these states out for all buttons like this
.action-request {
- position: relative;
- overflow: hidden;
-
- .icon-cog {
- @include transition(all $tmg-f1 ease-in-out $tmg-f1);
- @include font-size(20);
- position: absolute;
- top: ($baseline/2);
- left: -($baseline);
- visibility: hidden;
- opacity: 0.0;
- }
+ position: relative;
+ overflow: hidden;
+
+ .icon-cog {
+ @include transition(all $tmg-f1 ease-in-out $tmg-f1);
+ @include font-size(20);
+ position: absolute;
+ top: ($baseline/2);
+ left: -($baseline);
+ visibility: hidden;
+ opacity: 0.0;
+ }
// state: submitting
- &.is-submitting {
- padding-left: ($baseline*2);
+ &.is-submitting {
+ padding-left: ($baseline*2);
- .icon-cog {
- left: ($baseline*0.75);
- visibility: visible;
- opacity: 1.0;
- }
- }
+ .icon-cog {
+ left: ($baseline*0.75);
+ visibility: visible;
+ opacity: 1.0;
+ }
+ }
// state: has an error
&.has-error {
@@ -202,112 +202,112 @@
.status-update {
- .label {
- @extend %cont-text-sr;
- }
-
- .value {
- border-radius: ($baseline/4);
- position: relative;
- overflow: hidden;
- padding: ($baseline/5) ($baseline/2);
- background: $gray;
-
- .status-indicator {
- position: absolute;
- top: 0;
- left: 0;
- display: block;
- width: 100%;
- height: ($baseline/4);
- opacity: 0.40;
- }
- }
-
- .value-formal, .value-description {
- border-radius: ($baseline/10);
- display: inline-block;
- vertical-align: middle;
- color: $white;
- }
-
- .value-formal {
- @extend %t-title5;
- margin: ($baseline/2);
- font-weight: 700;
-
- [class^="icon-"] {
- margin-right: ($baseline/4);
- }
- }
-
- .value-description {
- @extend %t-copy-sub1;
- position: relative;
- color: $white;
- opacity: 0.85;
- }
+ .label {
+ @extend %cont-text-sr;
+ }
+
+ .value {
+ border-radius: ($baseline/4);
+ position: relative;
+ overflow: hidden;
+ padding: ($baseline/5) ($baseline/2);
+ background: $gray;
+
+ .status-indicator {
+ position: absolute;
+ top: 0;
+ left: 0;
+ display: block;
+ width: 100%;
+ height: ($baseline/4);
+ opacity: 0.40;
+ }
+ }
+
+ .value-formal, .value-description {
+ border-radius: ($baseline/10);
+ display: inline-block;
+ vertical-align: middle;
+ color: $white;
+ }
+
+ .value-formal {
+ @extend %t-title5;
+ @extend %t-strong;
+ margin: ($baseline/2);
+
+ [class^="icon-"] {
+ margin-right: ($baseline/4);
+ }
+ }
+
+ .value-description {
+ @extend %t-copy-sub1;
+ position: relative;
+ color: $white;
+ opacity: 0.85;
+ }
}
- // CASE: rights are not requested yet
- &.is-unrequested {
+ // CASE: rights are not requested yet
+ &.is-unrequested {
- .title {
- @extend %cont-text-sr;
- }
- }
+ .title {
+ @extend %cont-text-sr;
+ }
+ }
- // CASE: status is pending
- &.is-pending {
+ // CASE: status is pending
+ &.is-pending {
- .status-update {
+ .status-update {
- .value {
- background: $orange;
- }
+ .value {
+ background: $orange;
+ }
- .status-indicator {
- background: $orange-d1;
- }
- }
- }
+ .status-indicator {
+ background: $orange-d1;
+ }
+ }
+ }
// CASE: status is denied
&.is-denied {
- .status-update {
+ .status-update {
- .value {
- background: $red-l1;
- }
+ .value {
+ background: $red-l1;
+ }
- .status-indicator {
- background: $red-s1;
- }
- }
+ .status-indicator {
+ background: $red-s1;
+ }
+ }
}
- }
+ }
- // ====================
+ // ====================
// ELEM: course listings
- .courses {
- margin: $baseline 0;
- }
-
- .list-courses {
- margin-top: $baseline;
- border-radius: 3px;
- border: 1px solid $gray;
- background: $white;
- box-shadow: 0 1px 2px $shadow-l1;
-
- .course-item {
+ .courses {
+ margin: $baseline 0;
+ }
+
+ .list-courses {
+ margin-top: $baseline;
+ border-radius: 3px;
+ border: 1px solid $gray;
+ background: $white;
+ box-shadow: 0 1px 2px $shadow-l1;
+
+ .course-item {
@include box-sizing(border-box);
width: flex-grid(9, 9);
- position: relative;
- border-bottom: 1px solid $gray-l1;
+ position: relative;
+ border-bottom: 1px solid $gray-l1;
padding: $baseline;
// STATE: hover/focus
@@ -344,8 +344,8 @@
// course title
.course-title {
@extend %t-title4;
+ @extend %t-light;
margin: 0 ($baseline*2) ($baseline/4) 0;
- font-weight: 300;
}
// course metadata
@@ -405,8 +405,8 @@
border-bottom: none;
}
}
- }
- }
+ }
+ }
// ELEM: new user form
.wrapper-create-course {
@@ -430,70 +430,70 @@
// course listings
- .create-course {
-
- .row {
- @include clearfix();
- margin-bottom: ($baseline*0.75);
- }
-
- .column {
- float: left;
- width: 48%;
- }
-
- .column:first-child {
- margin-right: 4%;
- }
-
- label {
- @extend %t-title7;
- display: block;
- font-weight: 700;
- }
-
- .new-course-org,
- .new-course-number,
- .new-course-name,
- .new-course-run {
- width: 100%;
- }
-
- .new-course-name {
- @extend %t-title5;
- font-weight: 300;
- }
-
- .new-course-save {
- @include blue-button;
- }
-
- .new-course-cancel {
- @include white-button;
- }
-
- .item-details {
- padding-bottom: 0;
- }
-
- .wrap-error {
- @include transition(all $tmg-f2 ease 0s);
- height: 0;
- overflow: hidden;
- opacity: 0;
- }
-
- .wrap-error.is-shown {
- height: 65px;
- opacity: 1;
- }
-
- .message-status {
- display: block;
- margin-bottom: 0;
- padding: ($baseline*.5) ($baseline*1.5) 8px ($baseline*1.5);
- font-weight: bold;
- }
-
- }
+ .create-course {
+
+ .row {
+ @include clearfix();
+ margin-bottom: ($baseline*0.75);
+ }
+
+ .column {
+ float: left;
+ width: 48%;
+ }
+
+ .column:first-child {
+ margin-right: 4%;
+ }
+
+ label {
+ @extend %t-title7;
+ @extend %t-strong;
+ display: block;
+ }
+
+ .new-course-org,
+ .new-course-number,
+ .new-course-name,
+ .new-course-run {
+ width: 100%;
+ }
+
+ .new-course-name {
+ @extend %t-title5;
+ @extend %t-light;
+ }
+
+ .new-course-save {
+ @include blue-button;
+ }
+
+ .new-course-cancel {
+ @include white-button;
+ }
+
+ .item-details {
+ padding-bottom: 0;
+ }
+
+ .wrap-error {
+ @include transition(all $tmg-f2 ease 0s);
+ height: 0;
+ overflow: hidden;
+ opacity: 0;
+ }
+
+ .wrap-error.is-shown {
+ height: 65px;
+ opacity: 1;
+ }
+
+ .message-status {
+ @extend %t-strong;
+ display: block;
+ margin-bottom: 0;
+ padding: ($baseline*.5) ($baseline*1.5) 8px ($baseline*1.5);
+ }
+
+ }
}
diff --git a/cms/static/sass/views/_export-git.scss b/cms/static/sass/views/_export-git.scss
index dda371b45ea7167e1e3a4598bfce2e9daefd5ba7..81c152497a4745b4f0e44c754c7dab975bc04046 100644
--- a/cms/static/sass/views/_export-git.scss
+++ b/cms/static/sass/views/_export-git.scss
@@ -23,15 +23,15 @@
}
h3 {
- font-size: 19px;
- font-weight: 700;
+ @extend %t-strong;
+ font-size: 19px;
}
.export-git-info-block {
dt {
+ @extend %t-strong;
font-size: 19px;
- font-weight: 700;
margin-top: 12px;
}
diff --git a/cms/static/sass/views/_export.scss b/cms/static/sass/views/_export.scss
index 145778f0a52543541b7308c250045ad370874066..9a023d3f4bc66c3e69809de34ccc75f62017e3e8 100644
--- a/cms/static/sass/views/_export.scss
+++ b/cms/static/sass/views/_export.scss
@@ -96,13 +96,13 @@
font-size: 14px;
h2 {
- font-weight: 700;
+ @extend %t-strong;
font-size: 19px;
margin-bottom: 20px;
}
strong {
- font-weight: 700;
+ @extend %t-strong;
}
p + p {
@@ -132,9 +132,9 @@
text-align: center;
h2 {
+ @extend %t-light;
margin-bottom: 30px;
font-size: 26px;
- font-weight: 300;
}
.error-block {
diff --git a/cms/static/sass/views/_group-configuration.scss b/cms/static/sass/views/_group-configuration.scss
index d9ae45d055cd2f184816d681d8368880fca6976f..b83803bf404b3593a9df858f48c34fd1f9c3d5e9 100644
--- a/cms/static/sass/views/_group-configuration.scss
+++ b/cms/static/sass/views/_group-configuration.scss
@@ -52,12 +52,12 @@
.group-configuration-title {
@extend %t-title;
+ @extend %t-strong;
@include font-size(22);
@include line-height(22);
overflow: hidden;
text-overflow: ellipsis;
margin-right: ($baseline*14);
- font-weight: bold;
.group-toggle {
display: inline-block;
@@ -248,21 +248,21 @@
// add a group is below with groups styling
.action-primary {
@include blue-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
text-transform: uppercase;
}
.action-secondary {
@include grey-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
text-transform: uppercase;
}
@@ -282,7 +282,7 @@
color: $gray;
strong {
- font-weight: 600;
+ @extend %t-strong;
}
}
@@ -300,7 +300,7 @@
&.required {
label {
- font-weight: 600;
+ @extend %t-strong;
}
label:after {
@@ -393,7 +393,7 @@
color: $gray-l1;
.group-configuration-value {
- font-weight: 600;
+ @extend %t-strong;
white-space: nowrap;
margin-left: ($baseline*0.5);
}
@@ -405,7 +405,7 @@
}
label.required {
- font-weight: 600;
+ @extend %t-strong;
&:after {
margin-left: ($baseline/4);
@@ -471,12 +471,12 @@
.action-add-group {
@extend %ui-btn-flat-outline;
+ @extend %t-strong;
@include font-size(16);
display: block;
width: 100%;
margin: ($baseline*1.5) 0 0 0;
padding: ($baseline/2);
- font-weight: 600;
}
}
}
diff --git a/cms/static/sass/views/_import.scss b/cms/static/sass/views/_import.scss
index 38bd624eea2cc2e99a335c690c5a0d49de33a966..83f70135d1725f57bfd4bdef3c09a4bf66157d84 100644
--- a/cms/static/sass/views/_import.scss
+++ b/cms/static/sass/views/_import.scss
@@ -92,7 +92,7 @@
}
.file-name {
- font-weight: bold;
+ @extend %t-strong;
}
}
@@ -151,7 +151,7 @@
.title {
@extend %t-title5;
- font-weight: 600;
+ @extend %t-strong;
}
.copy {
diff --git a/cms/static/sass/views/_index.scss b/cms/static/sass/views/_index.scss
index 656a577bc7437ddfcdd30932e4bf79bb38bf04ec..f3df6ecdb82d7413816e609b594ac7c88bde59b2 100644
--- a/cms/static/sass/views/_index.scss
+++ b/cms/static/sass/views/_index.scss
@@ -63,11 +63,11 @@
h1 {
@extend %t-title2;
+ @extend %t-strong;
float: none;
margin: 0 0 ($baseline/2) 0;
border-bottom: 1px solid $blue-l1;
padding: 0;
- font-weight: 500;
color: $white;
}
@@ -76,7 +76,7 @@
}
.logo {
- font-weight: 600;
+ @extend %t-strong;
margin-left: ($baseline/2);
}
@@ -197,8 +197,8 @@
h3 {
@extend %t-title4;
+ @extend %t-strong;
margin: 0 0 ($baseline/2) 0;
- font-weight: 600;
}
> p {
@@ -207,8 +207,8 @@
}
strong {
+ @extend %t-strong;
color: $gray-d2;
- font-weight: 500;
}
.list-proofpoints {
@@ -232,8 +232,8 @@
.title {
@extend %t-copy-base;
+ @extend %t-strong;
margin: 0 0 ($baseline/4) 0;
- font-weight: 500;
color: $gray-d3;
}
@@ -323,10 +323,10 @@
text-align: center;
&.action-primary {
- @extend %t-action1;
@include blue-button;
+ @extend %t-action1;
+ @extend %t-strong;
padding: ($baseline*0.75) ($baseline/2);
- font-weight: 600;
text-align: center;
text-transform: uppercase;
}
diff --git a/cms/static/sass/views/_settings.scss b/cms/static/sass/views/_settings.scss
index 46d2a18b0d2c8f7d7a344eefdd48029e1e0c7e18..01cce38925a52f059a6ecc6107fb3ae9c00b6a35 100644
--- a/cms/static/sass/views/_settings.scss
+++ b/cms/static/sass/views/_settings.scss
@@ -22,13 +22,13 @@
}
.message-status {
- display: none;
@include border-top-radius(2px);
@include box-sizing(border-box);
+ @extend %t-strong;
+ display: none;
border-bottom: 2px solid $yellow;
margin: 0 0 20px 0;
padding: 10px 20px;
- font-weight: 500;
background: $paleYellow;
.text {
@@ -116,7 +116,7 @@
.remove-item {
@include white-button;
@extend %t-action3;
- font-weight: 400;
+ @extend %t-strong;
}
.new-button {
@@ -140,7 +140,7 @@
&.required {
label {
- font-weight: 600;
+ @extend %t-strong;
}
label:after {
@@ -154,10 +154,10 @@
}
label {
- @extend %t-copy-sub1;
@include transition(color $tmg-f2 ease-in-out 0s);
+ @extend %t-copy-sub1;
+ @extend %t-strong;
margin: 0 0 ($baseline/4) 0;
- font-weight: 400;
&.is-focused {
color: $blue;
@@ -266,12 +266,12 @@
input, textarea {
@extend %t-copy-lead1;
+ @extend %t-strong;
box-shadow: none;
border: none;
background: none;
padding: 0;
margin: 0;
- font-weight: 600;
}
}
@@ -338,7 +338,7 @@
.action-primary {
@extend %btn-primary-blue;
@extend %t-action3;
- font-weight: 600;
+ @extend %t-strong;
[class^="icon-"] {
@extend %t-icon5;
@@ -653,10 +653,10 @@
}
.letter-grade {
+ @extend %t-strong;
display: block;
margin: 10px 15px 0 0;
font-size: 16px;
- font-weight: 700;
line-height: 14px;
}
@@ -799,8 +799,8 @@
position: relative;
.title {
+ @extend %t-strong;
margin-top: ($baseline/2);
- font-weight: 600;
}
.field {
diff --git a/cms/static/sass/views/_static-pages.scss b/cms/static/sass/views/_static-pages.scss
index 6d9b838672a15064e25b73f74c2efc5700c50da7..eee48d542fc8644098f31981a38ef2a56f4a9f55 100644
--- a/cms/static/sass/views/_static-pages.scss
+++ b/cms/static/sass/views/_static-pages.scss
@@ -347,8 +347,8 @@
box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
.page-name {
+ @extend %t-strong;
font-size: 19px;
- font-weight: 700;
}
.item-actions {
diff --git a/cms/static/sass/views/_textbooks.scss b/cms/static/sass/views/_textbooks.scss
index 2acf08f9abc9049ba51e5d5a89422b41ca5d91ee..0f7528152c88138971f3e7ba087da51293fc54a7 100644
--- a/cms/static/sass/views/_textbooks.scss
+++ b/cms/static/sass/views/_textbooks.scss
@@ -30,8 +30,8 @@
.textbook-title {
@extend %t-title4;
+ @extend %t-strong;
margin-right: ($baseline*14);
- font-weight: bold;
}
.ui-toggle-expansion {
@@ -147,21 +147,21 @@
.action-primary {
@include blue-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
text-transform: uppercase;
}
.action-secondary {
@include grey-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
text-transform: uppercase;
}
@@ -175,7 +175,7 @@
strong {
- font-weight: 600;
+ @extend %t-strong;
}
@@ -195,7 +195,7 @@
&.required {
label {
- font-weight: 600;
+ @extend %t-strong;
}
label:after {
@@ -349,7 +349,6 @@
width: 100%;
margin: ($baseline*1.5) 0 0 0;
padding: ($baseline/2);
- font-weight: 600;
}
}
}
diff --git a/cms/static/sass/views/_updates.scss b/cms/static/sass/views/_updates.scss
index 9fc354eb56123feff411c4e659f5eec30e67cd03..d263d340322628f43daf387de590a9a182670842 100644
--- a/cms/static/sass/views/_updates.scss
+++ b/cms/static/sass/views/_updates.scss
@@ -3,24 +3,24 @@
.view-updates {
- .course-info-wrapper {
- display: table;
- width: 100%;
- clear: both;
- }
-
- .main-column,
- .course-handouts {
- float: none;
- display: table-cell;
- }
-
- .main-column {
- border-radius: 3px 0 0 3px;
- border-right-color: $mediumGrey;
- }
-
- .CodeMirror {
+ .course-info-wrapper {
+ display: table;
+ width: 100%;
+ clear: both;
+ }
+
+ .main-column,
+ .course-handouts {
+ float: none;
+ display: table-cell;
+ }
+
+ .main-column {
+ border-radius: 3px 0 0 3px;
+ border-right-color: $mediumGrey;
+ }
+
+ .CodeMirror {
border: 1px solid #3c3c3c;
background: #fff;
color: #3c3c3c;
@@ -28,185 +28,185 @@
}
.course-updates {
- padding: 30px 40px;
- margin: 0;
-
- .update-list > li {
- padding: 34px 0 42px;
- border-top: 1px solid #cbd1db;
-
- &:first-child {
- padding-top: 0;
- border: none;
- }
-
- &.editing {
- position: relative;
- z-index: 1001;
- padding: 0;
- border-top: none;
- border-radius: 3px;
- background: #fff;
-
- .post-preview {
- display: none;
- }
- }
-
- h1 {
- float: none;
- font-size: 24px;
- font-weight: 300;
- }
-
- h2 {
- margin-bottom: 18px;
- font-size: 14px;
- font-weight: 700;
- line-height: 30px;
- color: #646464;
- letter-spacing: 1px;
- text-transform: uppercase;
- }
-
- h3 {
- margin: 34px 0 11px;
- font-size: 16px;
- font-weight: 700;
- }
- }
-
- .update-contents {
- p {
- font-size: 16px;
- line-height: 25px;
- }
-
- p + p {
- margin-top: 25px;
- }
-
- .primary {
- border: 1px solid #ddd;
- background: #f6f6f6;
- padding: 20px;
- }
-
- ol, ul {
- margin: 1em 0;
- padding: 0 0 0 1em;
- color: $baseFontColor;
-
- li {
- margin-bottom: 0.708em;
- }
- }
-
- ol {
- list-style: decimal outside none;
- }
-
- ul {
- list-style: disc outside none;
- }
-
- pre {
- margin: 1em 0;
- color: $baseFontColor;
- font-family: monospace, serif;
- font-size: 1em;
- white-space: pre-wrap;
- word-wrap: break-word;
- }
-
- code {
- color: $baseFontColor;
- font-family: monospace, serif;
- background: none;
- padding: 0;
- }
- }
-
-
- .new-update-form {
- @include edit-box;
- margin-bottom: 24px;
- padding: 30px;
- border: none;
-
- textarea {
- height: 180px;
- }
- }
-
- .post-actions {
- float: right;
-
- .edit-button,
- .delete-button{
- float: left;
- @include white-button;
- padding: 3px 10px 4px;
- margin-left: 7px;
- font-size: 12px;
- font-weight: 400;
-
- .edit-icon,
- .delete-icon {
- margin-right: 4px;
- }
- }
- }
+ padding: 30px 40px;
+ margin: 0;
+
+ .update-list > li {
+ padding: 34px 0 42px;
+ border-top: 1px solid #cbd1db;
+
+ &:first-child {
+ padding-top: 0;
+ border: none;
+ }
+
+ &.editing {
+ position: relative;
+ z-index: 1001;
+ padding: 0;
+ border-top: none;
+ border-radius: 3px;
+ background: #fff;
+
+ .post-preview {
+ display: none;
+ }
+ }
+
+ h1 {
+ @extend %t-light;
+ float: none;
+ font-size: 24px;
+ }
+
+ h2 {
+ @extend %t-strong;
+ margin-bottom: 18px;
+ font-size: 14px;
+ line-height: 30px;
+ color: #646464;
+ letter-spacing: 1px;
+ text-transform: uppercase;
+ }
+
+ h3 {
+ @extend %t-strong;
+ margin: 34px 0 11px;
+ font-size: 16px;
+ }
+ }
+
+ .update-contents {
+ p {
+ font-size: 16px;
+ line-height: 25px;
+ }
+
+ p + p {
+ margin-top: 25px;
+ }
+
+ .primary {
+ border: 1px solid #ddd;
+ background: #f6f6f6;
+ padding: 20px;
+ }
+
+ ol, ul {
+ margin: 1em 0;
+ padding: 0 0 0 1em;
+ color: $baseFontColor;
+
+ li {
+ margin-bottom: 0.708em;
+ }
+ }
+
+ ol {
+ list-style: decimal outside none;
+ }
+
+ ul {
+ list-style: disc outside none;
+ }
+
+ pre {
+ margin: 1em 0;
+ color: $baseFontColor;
+ font-family: monospace, serif;
+ font-size: 1em;
+ white-space: pre-wrap;
+ word-wrap: break-word;
+ }
+
+ code {
+ color: $baseFontColor;
+ font-family: monospace, serif;
+ background: none;
+ padding: 0;
+ }
+ }
+
+
+ .new-update-form {
+ @include edit-box;
+ margin-bottom: 24px;
+ padding: 30px;
+ border: none;
+
+ textarea {
+ height: 180px;
+ }
+ }
+
+ .post-actions {
+ float: right;
+
+ .edit-button,
+ .delete-button{
+ @include white-button;
+ @extend %t-regular;
+ float: left;
+ padding: 3px 10px 4px;
+ margin-left: 7px;
+ font-size: 12px;
+
+ .edit-icon,
+ .delete-icon {
+ margin-right: 4px;
+ }
+ }
+ }
}
.course-handouts {
- @extend %ui-window;
- width: 30%;
- padding: 20px 30px;
- margin: 0;
- border-radius: 0 3px 3px 0;
- border-left: none;
- background: $lightGrey;
-
- .title {
- margin-bottom: 24px;
- font-size: 22px;
- font-weight: 300;
- }
-
- .edit-button {
- float: right;
- @include white-button;
+ @extend %ui-window;
+ width: 30%;
+ padding: 20px 30px;
+ margin: 0;
+ border-radius: 0 3px 3px 0;
+ border-left: none;
+ background: $lightGrey;
+
+ .title {
+ @extend %t-light;
+ margin-bottom: 24px;
+ font-size: 22px;
+ }
+
+ .edit-button {
+ @include white-button;
+ @extend %t-regular;
+ float: right;
padding: 3px 10px 4px;
margin-left: 7px;
font-size: 12px;
- font-weight: 400;
.edit-icon,
.delete-icon {
margin-right: 4px;
}
- }
+ }
- .handouts-content {
- font-size: 14px;
- }
+ .handouts-content {
+ font-size: 14px;
+ }
- .treeview-handoutsnav li {
- margin-bottom: 12px;
- }
+ .treeview-handoutsnav li {
+ margin-bottom: 12px;
+ }
}
.edit-handouts-form {
- @include edit-box;
- position: absolute;
- right: 0;
- top: 0;
- z-index: 10001;
- width: 800px;
- padding: 30px;
-
- textarea {
- height: 300px;
- }
+ @include edit-box;
+ position: absolute;
+ right: 0;
+ top: 0;
+ z-index: 10001;
+ width: 800px;
+ padding: 30px;
+
+ textarea {
+ height: 300px;
+ }
}
diff --git a/cms/static/sass/views/_users.scss b/cms/static/sass/views/_users.scss
index b9c41cdf1f0ce772309768557001a27eaef03c77..aa2d21b038ab2565cdce3736f018b86cf233dcf0 100644
--- a/cms/static/sass/views/_users.scss
+++ b/cms/static/sass/views/_users.scss
@@ -101,9 +101,9 @@
color: $white;
.msg-you {
+ @extend %t-strong;
margin-left: ($baseline/5);
text-transform: none;
- font-weight: 500;
color: $pink-l3;
}
@@ -131,11 +131,11 @@
}
.user-username {
- @extend %t-title4;
@include transition(color $tmg-f2 ease-in-out 0s);
+ @extend %t-title4;
+ @extend %t-strong;
margin: 0 ($baseline/2) ($baseline/10) 0;
color: $gray-d4;
- font-weight: 600;
}
.user-email {
@@ -186,20 +186,20 @@
&.add-admin-role {
@include blue-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
}
&.remove-admin-role {
@include grey-button;
- @extend %t-action2;
@include transition(all .15s);
+ @extend %t-action2;
+ @extend %t-strong;
display: inline-block;
padding: ($baseline/5) $baseline;
- font-weight: 600;
}
}
diff --git a/common/static/sass/_mixins-inherited.scss b/common/static/sass/_mixins-inherited.scss
index 61f4d6815e9b16f4bd430d9e5deaa32c04bfd6d4..abb0aecd0b2f3cde1ee4ffafaf458a6fc6c44b01 100644
--- a/common/static/sass/_mixins-inherited.scss
+++ b/common/static/sass/_mixins-inherited.scss
@@ -121,10 +121,10 @@
@mixin button {
@include font-size(14);
@include transition(background-color 0.15s, box-shadow 0.15s);
+ @extend %t-strong;
box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 0 0 rgba(0, 0, 0, 0);
display: inline-block;
padding: ($baseline/5) $baseline ($baseline/4);
- font-weight: 700;
&.disabled, &.is-disabled {
border: 1px solid $gray-l1 !important;
@@ -331,9 +331,9 @@
}
h5 {
+ @extend %t-strong;
margin-bottom: 8px;
color: #fff;
- font-weight: 700;
}
.row {
@@ -388,9 +388,9 @@
.draft-item:after,
.public-item:after,
.private-item:after {
+ @extend %t-strong;
margin-left: 3px;
font-size: 9px;
- font-weight: 600;
text-transform: uppercase;
}
diff --git a/common/static/sass/_mixins.scss b/common/static/sass/_mixins.scss
index 509f9bd138b57c1674cc64506131ca39ef96d0fd..736ee9d451f2df17a08f6aa92049b9df15f3e887 100644
--- a/common/static/sass/_mixins.scss
+++ b/common/static/sass/_mixins.scss
@@ -182,11 +182,11 @@
%ui-btn-primary {
@extend %ui-btn;
@extend %ui-btn-pill;
+ @extend %t-strong;
padding:($baseline/2) $baseline;
border-width: 1px;
border-style: solid;
box-shadow: none;
- font-weight: 600;
line-height: 1.5em;
text-align: center;
@@ -224,9 +224,9 @@
}
%ui-btn-flat-outline {
- @extend %t-action4;
@include transition(all .15s);
- font-weight: 600;
+ @extend %t-strong;
+ @extend %t-action4;
text-align: center;
border-radius: ($baseline/4);
border: 1px solid $blue-l2;