Skip to content

E
edx-platform
Commit e727bd22 by Brian Talbot
Options

Merge pull request #4790 from edx/talbs/studio-stylesweep-fontweight 

Studio: Refactoring font-weight CSS rules to use Sass placeholders
parents d9a2d229 f8ec9294
Showing with 393 additions and 394 deletions
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;
}
......
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;
......
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;
}
// ====================
......
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;
}
......
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;
}
......
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;
}
}
}
......
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-"] {
......
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;
}
}
......
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;
......
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;
}
......
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 {
......
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;
......
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;
}
}
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 {
......
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);
......
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);
......
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;
......
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;
}
}
......
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;
}
}
......
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);
......
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;
}
}
}
......
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;
}
......
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 {
......
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;
}
}
}
......
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 {
......
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;
}
......
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 {
......
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 {
......
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;
}
}
}
......
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;
}
}
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;
}
}
......
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;
}
......
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;
......
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