Commit ca2e1ee8 by Brian Talbot

docs.edx.org: syncs Sass mixin naming conventions

parent 9b00ed11
...@@ -36,7 +36,7 @@ body { ...@@ -36,7 +36,7 @@ body {
// layout // layout
[class^="wrapper-"] { [class^="wrapper-"] {
@extend %wrapper; @extend %ui-wrapper;
padding: 0; padding: 0;
> * { > * {
...@@ -45,7 +45,7 @@ body { ...@@ -45,7 +45,7 @@ body {
} }
.sr, hr.divider { .sr, hr.divider {
@extend %text-sr; @extend %ui-text-sr;
} }
// ==================== // ====================
...@@ -57,5 +57,5 @@ strong { ...@@ -57,5 +57,5 @@ strong {
// reset: lists // reset: lists
.list--actions, .list--docs, .list--steps, .list--controls, .list--fields, .list--help, .nav--wizard, .list--tips, .field--group { .list--actions, .list--docs, .list--steps, .list--controls, .list--fields, .list--help, .nav--wizard, .list--tips, .field--group {
@extend %no-list; @extend %ui-no-list;
} }
...@@ -2,53 +2,20 @@ ...@@ -2,53 +2,20 @@
// ==================== // ====================
// primary footer // primary footer
.wrapper-outer-footer { .wrapper--footer {
box-shadow: inset 0 1px 1px 1px $shadow-l1;
display: inline-block;
background: $blue-d2 url('../images/bg-mast.png') 0 0 repeat;
.wrapper-footer { }
@include outer-container;
@include pad(($baseline*2) ($baseline*3));
@include media($bp-m) {
@include pad(($baseline) ($baseline*2));
}
footer.primary {
@include span-columns(12);
color: $gray-l2;
.copy {
color: $gray-l4;
}
.privacy {
text-align: right;
}
.privacy,
.copyright {
@extend %trans-size;
@extend %t-copy-sub1;
@include span-columns(6 of 12);
@include media($bp-ds) { .footer--primary {
@include fill-parent; @include span-columns(12);
margin-bottom: ($baseline/2); margin: ($baseline*1.5) 0;
text-align: center;
}
@include media($bp-m) { .content--copyright {
@include fill-parent; text-align: center;
margin-bottom: ($baseline/2); }
text-align: center;
}
a { .copyright__copy {
color: $white; @extend %t-copy-sub1;
}
}
}
} }
} }
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
// OPTION: add this class for a visual hanging display // OPTION: add this class for a visual hanging display
&.is-hanging { &.is-hanging {
@include box-sizing(border-box); @include box-sizing(border-box);
@extend %depth2; @extend %ui-depth2;
top: -($baseline/4); top: -($baseline/4);
&:after { &:after {
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
nav { nav {
ol, ul { ol, ul {
@extend %no-list; @extend %ui-no-list;
} }
.nav-item { .nav-item {
......
...@@ -39,13 +39,13 @@ ...@@ -39,13 +39,13 @@
// ==================== // ====================
// extends - layout // extends - layout
%wrapper { %ui-wrapper {
@include clearfix(); @include clearfix();
@include box-sizing(border-box); @include box-sizing(border-box);
width: 100%; width: 100%;
} }
%no-list { %ui-no-list {
list-style: none; list-style: none;
margin: 0; margin: 0;
padding: 0; padding: 0;
...@@ -58,14 +58,14 @@ ...@@ -58,14 +58,14 @@
} }
// image-replacement hidden text // image-replacement hidden text
%text-hide { %ui-text-hide {
text-indent: 200%; text-indent: 200%;
white-space: nowrap; white-space: nowrap;
overflow: hidden; overflow: hidden;
} }
// hidden elems - screenreaders // hidden elems - screenreaders
%text-sr { %ui-text-sr {
border: 0; border: 0;
clip: rect(0 0 0 0); clip: rect(0 0 0 0);
height: 1px; height: 1px;
...@@ -77,23 +77,23 @@ ...@@ -77,23 +77,23 @@
} }
// wrapping // wrapping
%text-wrap { %ui-text-wrap {
text-wrap: wrap; text-wrap: wrap;
white-space: pre-wrap; white-space: pre-wrap;
white-space: -moz-pre-wrap; white-space: -moz-pre-wrap;
word-wrap: break-word; word-wrap: break-word;
} }
%fake-link { %ui-fake-link {
cursor: pointer; cursor: pointer;
} }
%disabled { %ui-disabled {
pointer-events: none; pointer-events: none;
outline: none; outline: none;
} }
%icon-inline { %ui-icon-inline {
@extend %t-icon; @extend %t-icon;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
} }
// nth-type style clearing // nth-type style clearing
%wipe-first-child { %ui-wipe-first-child {
&:first-child { &:first-child {
margin-top: 0; margin-top: 0;
...@@ -110,7 +110,7 @@ ...@@ -110,7 +110,7 @@
} }
} }
%wipe-last-child { %ui-wipe-last-child {
&:last-child { &:last-child {
margin-bottom: 0; margin-bottom: 0;
...@@ -120,12 +120,12 @@ ...@@ -120,12 +120,12 @@
} }
// extends - depth levels // extends - depth levels
%depth0 { z-index: 0; } %ui-depth0 { z-index: 0; }
%depth1 { z-index: 10; } %ui-depth1 { z-index: 10; }
%depth2 { z-index: 100; } %ui-depth2 { z-index: 100; }
%depth3 { z-index: 1000; } %ui-depth3 { z-index: 1000; }
%depth4 { z-index: 10000; } %ui-depth4 { z-index: 10000; }
%depth5 { z-index: 100000; } %ui-depth5 { z-index: 100000; }
// extends - transition // extends - transition
%trans-size { %trans-size {
......
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
color: $gray-l2; color: $gray-l2;
p { p {
@extend %wipe-last-child; @extend %ui-wipe-last-child;
margin-bottom: $baseline; margin-bottom: $baseline;
} }
} }
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
// elems: info bits // elems: info bits
.info { .info {
@extend %wipe-last-child; @extend %ui-wipe-last-child;
margin-bottom: ($baseline*2); margin-bottom: ($baseline*2);
} }
...@@ -110,7 +110,7 @@ ...@@ -110,7 +110,7 @@
margin-top: $baseline; margin-top: $baseline;
.item-link { .item-link {
@extend %wipe-last-child; @extend %ui-wipe-last-child;
margin-bottom: $baseline; margin-bottom: $baseline;
border-bottom: 1px solid $gray-l5; border-bottom: 1px solid $gray-l5;
padding-bottom: $baseline; padding-bottom: $baseline;
...@@ -349,7 +349,7 @@ ...@@ -349,7 +349,7 @@
.deco__doc1 { .deco__doc1 {
@include font-size(72); @include font-size(72);
@extend %depth1; @extend %ui-depth1;
left: -($baseline*2); left: -($baseline*2);
.icon-stack-base { .icon-stack-base {
...@@ -364,7 +364,7 @@ ...@@ -364,7 +364,7 @@
.deco__doc2 { .deco__doc2 {
@include font-size(100); @include font-size(100);
@extend %depth3; @extend %ui-depth3;
left: ($baseline*1.5); left: ($baseline*1.5);
.icon-stack-base { .icon-stack-base {
...@@ -378,7 +378,7 @@ ...@@ -378,7 +378,7 @@
.deco__doc3 { .deco__doc3 {
@include font-size(72); @include font-size(72);
@extend %depth2; @extend %ui-depth2;
right: -($baseline*2); right: -($baseline*2);
.icon-stack-base { .icon-stack-base {
...@@ -455,7 +455,7 @@ ...@@ -455,7 +455,7 @@
// elem: audience lists // elem: audience lists
.item-audience { .item-audience {
@extend .trans-size; @extend .trans-size;
@extend %wipe-last-child; @extend %ui-wipe-last-child;
@include span-columns(3 of 9); @include span-columns(3 of 9);
position: relative; position: relative;
...@@ -519,24 +519,4 @@ ...@@ -519,24 +519,4 @@
@extend %t-copy-sub1; @extend %t-copy-sub1;
} }
} }
// ====================
// footer
.footer--primary {
@include span-columns(12);
margin: ($baseline*1.5) 0;
.content--copyright {
text-align: center;
}
.copyright__copy {
@extend %t-copy-sub1;
}
}
// ====================
} }
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