Commit 5bd79a86 by David Baumgold

Changed `@include box-shadow()` to `box-shadow`

Bourbon's box-shadow mixin has been deprecated, and they recommend to use the
official spec.
parent 41374838
...@@ -592,7 +592,7 @@ hr.divide { ...@@ -592,7 +592,7 @@ hr.divide {
.window { .window {
// border-radius: 3px; // border-radius: 3px;
// @include box-shadow(0 1px 1px $shadow-l1); // box-shadow: 0 1px 1px $shadow-l1;
// margin-bottom: $baseline; // margin-bottom: $baseline;
// border: 1px solid $gray-l2; // border: 1px solid $gray-l2;
// background: $white; // background: $white;
...@@ -607,7 +607,7 @@ hr.divide { ...@@ -607,7 +607,7 @@ hr.divide {
border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: $lightBluishGrey; background-color: $lightBluishGrey;
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset;
font-size: 14px; font-size: 14px;
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
} }
...@@ -653,7 +653,7 @@ hr.divide { ...@@ -653,7 +653,7 @@ hr.divide {
border: 1px solid #333; border: 1px solid #333;
@include linear-gradient(top, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .1), rgba(255, 255, 255, 0));
background-color: rgba(30, 30, 30, .92); background-color: rgba(30, 30, 30, .92);
@include box-shadow(0 1px 3px rgba(0, 0, 0, .3), 0 1px 0 rgba(255, 255, 255, .1) inset); box-shadow: 0 1px 3px rgba(0, 0, 0, .3), 0 1px 0 rgba(255, 255, 255, .1) inset;
font-size: 13px; font-size: 13px;
text-align: center; text-align: center;
color: #fff; color: #fff;
...@@ -857,7 +857,7 @@ body.js { ...@@ -857,7 +857,7 @@ body.js {
.content-modal { .content-modal {
@include border-bottom-radius(2px); @include border-bottom-radius(2px);
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 2px 4px $shadow-d1); box-shadow: 0 2px 4px $shadow-d1;
position: relative; position: relative;
display: none; display: none;
width: 700px; width: 700px;
......
...@@ -108,7 +108,7 @@ ...@@ -108,7 +108,7 @@
// inherited - ui // inherited - ui
.window { .window {
@include clearfix(); @include clearfix();
@include box-shadow(0 1px 1px $shadow-l1); box-shadow: 0 1px 1px $shadow-l1;
border-radius: 3px; border-radius: 3px;
margin-bottom: $baseline; margin-bottom: $baseline;
border: 1px solid $gray-l2; border: 1px solid $gray-l2;
...@@ -120,7 +120,7 @@ ...@@ -120,7 +120,7 @@
// mixins - grandfathered // mixins - grandfathered
@mixin button { @mixin button {
@include font-size(14); @include font-size(14);
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset, 0 0 0 rgba(0, 0, 0, 0)); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 0 0 rgba(0, 0, 0, 0);
@include transition(background-color .15s, box-shadow .15s); @include transition(background-color .15s, box-shadow .15s);
display: inline-block; display: inline-block;
padding: ($baseline/5) $baseline ($baseline/4); padding: ($baseline/5) $baseline ($baseline/4);
...@@ -139,14 +139,14 @@ ...@@ -139,14 +139,14 @@
} }
&:hover, &.active { &:hover, &.active {
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15)); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15);
} }
} }
@mixin green-button { @mixin green-button {
@include button; @include button;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
border: 1px solid $green-d1; border: 1px solid $green-d1;
border-radius: 3px; border-radius: 3px;
background-color: $green; background-color: $green;
...@@ -161,7 +161,7 @@ ...@@ -161,7 +161,7 @@
border: 1px solid $green-l3 !important; border: 1px solid $green-l3 !important;
background: $green-l3 !important; background: $green-l3 !important;
color: $white !important; color: $white !important;
@include box-shadow(none); box-shadow: none;
} }
} }
...@@ -179,7 +179,7 @@ ...@@ -179,7 +179,7 @@
} }
&.disabled { &.disabled {
@include box-shadow(none); box-shadow: none;
border: 1px solid $blue-l3 !important; border: 1px solid $blue-l3 !important;
background: $blue-l3 !important; background: $blue-l3 !important;
color: $white !important; color: $white !important;
...@@ -200,7 +200,7 @@ ...@@ -200,7 +200,7 @@
} }
&.disabled { &.disabled {
@include box-shadow(none); box-shadow: none;
border: 1px solid $red-l3 !important; border: 1px solid $red-l3 !important;
background: $red-l3 !important; background: $red-l3 !important;
color: $white !important; color: $white !important;
...@@ -221,7 +221,7 @@ ...@@ -221,7 +221,7 @@
} }
&.disabled { &.disabled {
@include box-shadow(none); box-shadow: none;
border: 1px solid $pink-l3 !important; border: 1px solid $pink-l3 !important;
background: $pink-l3 !important; background: $pink-l3 !important;
color: $white !important; color: $white !important;
...@@ -231,7 +231,7 @@ ...@@ -231,7 +231,7 @@
@mixin orange-button { @mixin orange-button {
@include button; @include button;
@include linear-gradient(top, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 60%); @include linear-gradient(top, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0) 60%);
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
border: 1px solid $orange-d1; border: 1px solid $orange-d1;
border-radius: 3px; border-radius: 3px;
background-color: $orange; background-color: $orange;
...@@ -246,14 +246,14 @@ ...@@ -246,14 +246,14 @@
border: 1px solid $orange-l3 !important; border: 1px solid $orange-l3 !important;
background: $orange-l2 !important; background: $orange-l2 !important;
color: $gray-l1 !important; color: $gray-l1 !important;
@include box-shadow(none); box-shadow: none;
} }
} }
@mixin white-button { @mixin white-button {
@include button; @include button;
@include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0));
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
border-radius: 3px; border-radius: 3px;
background-color: #dfe5eb; background-color: #dfe5eb;
...@@ -269,7 +269,7 @@ ...@@ -269,7 +269,7 @@
@mixin grey-button { @mixin grey-button {
@include button; @include button;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
border: 1px solid $gray-d2; border: 1px solid $gray-d2;
border-radius: 3px; border-radius: 3px;
background-color: #d1dae3; background-color: #d1dae3;
...@@ -284,7 +284,7 @@ ...@@ -284,7 +284,7 @@
@mixin gray-button { @mixin gray-button {
@include button; @include button;
@include linear-gradient(top, $white-t1, rgba(255, 255, 255, 0)); @include linear-gradient(top, $white-t1, rgba(255, 255, 255, 0));
@include box-shadow(0 1px 0 $white-t1 inset); box-shadow: 0 1px 0 $white-t1 inset;
border: 1px solid $gray-d1; border: 1px solid $gray-d1;
border-radius: 3px; border-radius: 3px;
background-color: $gray-d2; background-color: $gray-d2;
...@@ -311,7 +311,7 @@ ...@@ -311,7 +311,7 @@
} }
@mixin edit-box { @mixin edit-box {
@include box-shadow(0 1px 0 rgba(255, 255, 255, .2) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .2) inset;
padding: 15px 20px; padding: 15px 20px;
border-radius: 3px; border-radius: 3px;
background-color: $lightBluishGrey2; background-color: $lightBluishGrey2;
...@@ -448,7 +448,7 @@ ...@@ -448,7 +448,7 @@
// sunsetted mixins // sunsetted mixins
@mixin active { @mixin active {
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
@include box-shadow(0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset); box-shadow: 0 -1px 0 rgba(0, 0, 0, .2) inset, 0 1px 0 #fff inset;
background-color: rgba(255, 255, 255, .3); background-color: rgba(255, 255, 255, .3);
text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
} }
...@@ -143,7 +143,7 @@ abbr[title] { ...@@ -143,7 +143,7 @@ abbr[title] {
width: 100%; width: 100%;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
//background-color: $lightBluishGrey; //background-color: $lightBluishGrey;
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset;
li:first-child { li:first-child {
margin-left: 20px; margin-left: 20px;
......
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
} }
&.current, &.active, &.is-selected { &.current, &.active, &.is-selected {
@include box-shadow(inset 0 1px 2px 1px $shadow-l1); box-shadow: inset 0 1px 2px 1px $shadow-l1;
border-color: $gray-l3; border-color: $gray-l3;
} }
} }
......
...@@ -12,7 +12,7 @@ textarea.text { ...@@ -12,7 +12,7 @@ textarea.text {
border-radius: 2px; border-radius: 2px;
@include linear-gradient($gray-l5, $white); @include linear-gradient($gray-l5, $white);
background-color: $gray-l5; background-color: $gray-l5;
@include box-shadow(inset 0 1px 2px $shadow-l1); box-shadow: inset 0 1px 2px $shadow-l1;
font-family: 'Open Sans', sans-serif; font-family: 'Open Sans', sans-serif;
font-size: 11px; font-size: 11px;
color: $baseFontColor; color: $baseFontColor;
...@@ -135,6 +135,6 @@ code { ...@@ -135,6 +135,6 @@ code {
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3)); @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3));
background-color: #edf1f5; background-color: #edf1f5;
@include box-shadow(0 1px 2px rgba(0, 0, 0, 0.1) inset); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
font-family: Monaco, monospace; font-family: Monaco, monospace;
} }
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
.wrapper-header { .wrapper-header {
@extend .depth3; @extend .depth3;
@include box-shadow(0 1px 2px 0 $shadow-l1); box-shadow: 0 1px 2px 0 $shadow-l1;
position: relative; position: relative;
width: 100%; width: 100%;
margin: 0; margin: 0;
......
...@@ -76,7 +76,7 @@ nav { ...@@ -76,7 +76,7 @@ nav {
.nav-sub { .nav-sub {
border-radius: 2px; border-radius: 2px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 1px $shadow-l1); box-shadow: 0 1px 1px $shadow-l1;
position: relative; position: relative;
width: 100%; width: 100%;
border: 1px solid $gray-l3; border: 1px solid $gray-l3;
......
...@@ -163,7 +163,7 @@ ...@@ -163,7 +163,7 @@
.prompt { .prompt {
border-radius: ($baseline/5); border-radius: ($baseline/5);
@include box-shadow(0 0 3px $shadow-d1); box-shadow: 0 0 3px $shadow-d1;
display: inline-block; display: inline-block;
vertical-align: middle; vertical-align: middle;
width: $baseline*17.5; width: $baseline*17.5;
...@@ -176,7 +176,7 @@ ...@@ -176,7 +176,7 @@
} }
.nav-actions { .nav-actions {
@include box-shadow(inset 0 1px 2px $shadow-d1); box-shadow: inset 0 1px 2px $shadow-d1;
border-top: 1px solid $black-t1; border-top: 1px solid $black-t1;
padding: ($baseline*0.75) $baseline; padding: ($baseline*0.75) $baseline;
background: $gray-d4; background: $gray-d4;
...@@ -244,14 +244,14 @@ ...@@ -244,14 +244,14 @@
.wrapper-notification { .wrapper-notification {
@extend .depth5; @extend .depth5;
@include clearfix(); @include clearfix();
@include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $blue); box-shadow: 0 -1px 3px $shadow, inset 0 3px 1px $blue;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
width: 100%; width: 100%;
padding: $baseline ($baseline*2); padding: $baseline ($baseline*2);
&.wrapper-notification-warning { &.wrapper-notification-warning {
@include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $orange); box-shadow: 0 -1px 3px $shadow, inset 0 3px 1px $orange;
[class^="icon"] { [class^="icon"] {
color: $orange; color: $orange;
...@@ -259,7 +259,7 @@ ...@@ -259,7 +259,7 @@
} }
&.wrapper-notification-error { &.wrapper-notification-error {
@include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $red-l1); box-shadow: 0 -1px 3px $shadow, inset 0 3px 1px $red-l1;
[class^="icon"] { [class^="icon"] {
color: $red-l1; color: $red-l1;
...@@ -267,7 +267,7 @@ ...@@ -267,7 +267,7 @@
} }
&.wrapper-notification-confirmation { &.wrapper-notification-confirmation {
@include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $green); box-shadow: 0 -1px 3px $shadow, inset 0 3px 1px $green;
[class^="icon"] { [class^="icon"] {
color: $green; color: $green;
...@@ -275,7 +275,7 @@ ...@@ -275,7 +275,7 @@
} }
&.wrapper-notification-saving { &.wrapper-notification-saving {
@include box-shadow(0 -1px 3px $shadow, inset 0 3px 1px $pink); box-shadow: 0 -1px 3px $shadow, inset 0 3px 1px $pink;
} }
// shorter/status notifications // shorter/status notifications
...@@ -455,7 +455,7 @@ ...@@ -455,7 +455,7 @@
.wrapper-alert { .wrapper-alert {
@extend .depth2; @extend .depth2;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $blue); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $blue;
position: relative; position: relative;
overflow: hidden; overflow: hidden;
width: 100%; width: 100%;
...@@ -472,7 +472,7 @@ ...@@ -472,7 +472,7 @@
} }
&.wrapper-alert-warning { &.wrapper-alert-warning {
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $orange); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $orange;
[class^="icon"] { [class^="icon"] {
color: $orange; color: $orange;
...@@ -480,7 +480,7 @@ ...@@ -480,7 +480,7 @@
} }
&.wrapper-alert-error { &.wrapper-alert-error {
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $red-l1); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $red-l1;
[class^="icon"] { [class^="icon"] {
color: $red-l1; color: $red-l1;
...@@ -488,7 +488,7 @@ ...@@ -488,7 +488,7 @@
} }
&.wrapper-alert-confirmation { &.wrapper-alert-confirmation {
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $green); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $green;
[class^="icon"] { [class^="icon"] {
color: $green; color: $green;
...@@ -496,7 +496,7 @@ ...@@ -496,7 +496,7 @@
} }
&.wrapper-alert-announcement { &.wrapper-alert-announcement {
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $blue); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $blue;
[class^="icon"] { [class^="icon"] {
color: $blue; color: $blue;
...@@ -504,7 +504,7 @@ ...@@ -504,7 +504,7 @@
} }
&.wrapper-alert-step-required { &.wrapper-alert-step-required {
@include box-shadow(0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $pink); box-shadow: 0 1px 1px $white, inset 0 2px 2px $shadow-d1, inset 0 -4px 1px $pink;
[class^="icon"] { [class^="icon"] {
color: $pink; color: $pink;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
#tender_window { #tender_window {
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 2px 3px $shadow); box-shadow: 0 2px 3px $shadow;
height: ($baseline*35) !important; height: ($baseline*35) !important;
background: $white !important; background: $white !important;
border: 2px solid $blue; border: 2px solid $blue;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
background: #fff; background: #fff;
font-family: $f-sans-serif; font-family: $f-sans-serif;
font-size: 12px; font-size: 12px;
@include box-shadow(0 5px 10px rgba(0, 0, 0, 0.1)); box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
z-index: 100000 !important; z-index: 100000 !important;
.ui-widget-header { .ui-widget-header {
......
...@@ -57,7 +57,7 @@ body.signup, body.signin { ...@@ -57,7 +57,7 @@ body.signup, body.signin {
form { form {
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 2px $shadow-l1); box-shadow: 0 1px 2px $shadow-l1;
border-radius: 2px; border-radius: 2px;
width: 100%; width: 100%;
border: 1px solid $gray-l2; border: 1px solid $gray-l2;
......
...@@ -81,7 +81,7 @@ body.course.uploads { ...@@ -81,7 +81,7 @@ body.course.uploads {
} }
.embeddable-xml-input { .embeddable-xml-input {
@include box-shadow(none); box-shadow: none;
width: 100%; width: 100%;
} }
...@@ -194,7 +194,7 @@ body.course.uploads { ...@@ -194,7 +194,7 @@ body.course.uploads {
} }
.embeddable-xml-input { .embeddable-xml-input {
@include box-shadow(none); box-shadow: none;
width: 400px; width: 400px;
} }
......
...@@ -49,7 +49,7 @@ body.course.checklists { ...@@ -49,7 +49,7 @@ body.course.checklists {
// header/title // header/title
header { header {
@include clearfix(); @include clearfix();
@include box-shadow(inset 0 -1px 1px $shadow-l1); box-shadow: inset 0 -1px 1px $shadow-l1;
margin-bottom: 0; margin-bottom: 0;
border-bottom: 1px solid $gray-l3; border-bottom: 1px solid $gray-l3;
padding: $baseline ($baseline*1.5); padding: $baseline ($baseline*1.5);
...@@ -118,7 +118,7 @@ body.course.checklists { ...@@ -118,7 +118,7 @@ body.course.checklists {
// checklist actions // checklist actions
.course-checklist-actions { .course-checklist-actions {
@include clearfix(); @include clearfix();
@include box-shadow(inset 0 1px 1px $shadow-l1); box-shadow: inset 0 1px 1px $shadow-l1;
@include transition(border .15s ease-in-out .25s); @include transition(border .15s ease-in-out .25s);
border-top: 1px solid $gray-l2; border-top: 1px solid $gray-l2;
padding: $baseline ($baseline*1.5); padding: $baseline ($baseline*1.5);
...@@ -155,7 +155,7 @@ body.course.checklists { ...@@ -155,7 +155,7 @@ body.course.checklists {
&.is-collapsed { &.is-collapsed {
header { header {
@include box-shadow(none); box-shadow: none;
.checklist-title { .checklist-title {
......
...@@ -10,9 +10,9 @@ body.dashboard { ...@@ -10,9 +10,9 @@ body.dashboard {
.class-list { .class-list {
margin-top: 20px; margin-top: 20px;
border-radius: 3px; border-radius: 3px;
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
background: #fff; background: #fff;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1)); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
li { li {
position: relative; position: relative;
...@@ -27,7 +27,7 @@ body.dashboard { ...@@ -27,7 +27,7 @@ body.dashboard {
display: block; display: block;
padding: 20px 25px; padding: 20px 25px;
line-height: 1.3; line-height: 1.3;
&:hover { &:hover {
background: $paleYellow; background: $paleYellow;
...@@ -57,7 +57,7 @@ body.dashboard { ...@@ -57,7 +57,7 @@ body.dashboard {
z-index: 10000; z-index: 10000;
position: absolute; position: absolute;
top: 15px; top: 15px;
right: $baseline; right: $baseline;
padding: ($baseline/4) ($baseline/2); padding: ($baseline/4) ($baseline/2);
opacity: 0.0; opacity: 0.0;
pointer-events: none; pointer-events: none;
...@@ -73,7 +73,7 @@ body.dashboard { ...@@ -73,7 +73,7 @@ body.dashboard {
padding: 15px 25px; padding: 15px 25px;
margin-top: 20px; margin-top: 20px;
border-radius: 3px; border-radius: 3px;
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
background: #fff; background: #fff;
box-shadow: 0 1px 2px rgba(0, 0, 0, .1); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
@include clearfix; @include clearfix;
...@@ -121,4 +121,4 @@ body.dashboard { ...@@ -121,4 +121,4 @@ body.dashboard {
@include white-button; @include white-button;
} }
} }
} }
\ No newline at end of file
...@@ -114,7 +114,7 @@ body.index { ...@@ -114,7 +114,7 @@ body.index {
// feature content // feature content
.wrapper-content-features { .wrapper-content-features {
@include box-shadow(0 -1px ($baseline/4) $shadow); box-shadow: 0 -1px ($baseline/4) $shadow;
padding-bottom: ($baseline*2); padding-bottom: ($baseline*2);
padding-top: ($baseline*3); padding-top: ($baseline*3);
background: $white; background: $white;
...@@ -141,7 +141,7 @@ body.index { ...@@ -141,7 +141,7 @@ body.index {
a { a {
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px ($baseline/10) $shadow-l1); box-shadow: 0 1px ($baseline/10) $shadow-l1;
position: relative; position: relative;
top: 0; top: 0;
display: block; display: block;
...@@ -233,7 +233,7 @@ body.index { ...@@ -233,7 +233,7 @@ body.index {
} }
&:hover { &:hover {
@include box-shadow(0 1px ($baseline/10) $shadow-l1); box-shadow: 0 1px ($baseline/10) $shadow-l1;
background: $blue-l5; background: $blue-l5;
top: -($baseline/5); top: -($baseline/5);
......
...@@ -65,7 +65,7 @@ body.course.outline { ...@@ -65,7 +65,7 @@ body.course.outline {
.menu { .menu {
@include font-size(12); @include font-size(12);
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .2)); box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
@include transition(opacity .15s); @include transition(opacity .15s);
z-index: 1; z-index: 1;
display: none; display: none;
...@@ -143,7 +143,7 @@ body.course.outline { ...@@ -143,7 +143,7 @@ body.course.outline {
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
margin-top: 15px; margin-top: 15px;
padding-bottom: 12px; padding-bottom: 12px;
@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.1)); box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
&:first-child { &:first-child {
margin-top: 0; margin-top: 0;
...@@ -199,7 +199,7 @@ body.course.outline { ...@@ -199,7 +199,7 @@ body.course.outline {
.datepair .date, .datepair .date,
.datepair .time { .datepair .time {
@include font-size(13); @include font-size(13);
@include box-shadow(none); box-shadow: none;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
border: none; border: none;
...@@ -343,7 +343,7 @@ body.course.outline { ...@@ -343,7 +343,7 @@ body.course.outline {
.menu { .menu {
@include font-size(12); @include font-size(12);
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .2)); box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
@include transition(opacity .15s); @include transition(opacity .15s);
@include transition(display .15s); @include transition(display .15s);
z-index: 1; z-index: 1;
...@@ -582,7 +582,7 @@ body.course.outline { ...@@ -582,7 +582,7 @@ body.course.outline {
left: 110px; left: 110px;
z-index: 9999; z-index: 9999;
border: 1px solid #3C3C3C; border: 1px solid #3C3C3C;
@include box-shadow(0 1px 15px rgba(0, 0, 0, .2)); box-shadow: 0 1px 15px rgba(0, 0, 0, .2);
} }
.preview { .preview {
...@@ -688,7 +688,7 @@ body.course.outline { ...@@ -688,7 +688,7 @@ body.course.outline {
} }
.ui-draggable-dragging { .ui-draggable-dragging {
@include box-shadow(0 1px 2px rgba(0, 0, 0, .3)); box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
opacity : 0.2; opacity : 0.2;
&:hover { &:hover {
......
...@@ -266,7 +266,7 @@ body.course.settings { ...@@ -266,7 +266,7 @@ body.course.settings {
input, textarea { input, textarea {
@extend .t-copy-lead1; @extend .t-copy-lead1;
@include box-shadow(none); box-shadow: none;
border: none; border: none;
background: none; background: none;
padding: 0; padding: 0;
...@@ -294,7 +294,7 @@ body.course.settings { ...@@ -294,7 +294,7 @@ body.course.settings {
// course link note // course link note
.note-promotion-courseURL { .note-promotion-courseURL {
@include box-shadow(0 2px 1px $shadow-l1); box-shadow: 0 2px 1px $shadow-l1;
border-radius: ($baseline/5); border-radius: ($baseline/5);
margin-top: ($baseline*1.5); margin-top: ($baseline*1.5);
border: 1px solid $gray-l2; border: 1px solid $gray-l2;
...@@ -330,7 +330,7 @@ body.course.settings { ...@@ -330,7 +330,7 @@ body.course.settings {
} }
.list-actions { .list-actions {
@include box-shadow(inset 0 1px 1px $shadow-l1); box-shadow: inset 0 1px 1px $shadow-l1;
border-top: 1px solid $gray-l2; border-top: 1px solid $gray-l2;
padding: ($baseline/2); padding: ($baseline/2);
background: $gray-l5; background: $gray-l5;
...@@ -453,7 +453,7 @@ body.course.settings { ...@@ -453,7 +453,7 @@ body.course.settings {
.new-grade-button { .new-grade-button {
@include box-sizing(border-box); @include box-sizing(border-box);
@include linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0));
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
width: flex-grid(1,9); width: flex-grid(1,9);
height: ($baseline*2); height: ($baseline*2);
position: relative; position: relative;
...@@ -620,7 +620,7 @@ body.course.settings { ...@@ -620,7 +620,7 @@ body.course.settings {
height: 50px; height: 50px;
width: 2px; width: 2px;
background-color: #fff; background-color: #fff;
@include box-shadow(-1px 0 3px rgba(0,0,0,0.1)); box-shadow: -1px 0 3px rgba(0,0,0,0.1);
cursor: ew-resize; cursor: ew-resize;
@include transition(none); @include transition(none);
...@@ -768,7 +768,7 @@ body.course.settings { ...@@ -768,7 +768,7 @@ body.course.settings {
.CodeMirror { .CodeMirror {
@extend .t-copy-base; @extend .t-copy-base;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1) inset); box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
@include linear-gradient($lightGrey, tint($lightGrey, 90%)); @include linear-gradient($lightGrey, tint($lightGrey, 90%));
padding: 5px 8px; padding: 5px 8px;
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
......
...@@ -39,7 +39,7 @@ body.course.static-pages { ...@@ -39,7 +39,7 @@ body.course.static-pages {
.component-editor { .component-editor {
@include edit-box; @include edit-box;
@include box-shadow(none); box-shadow: none;
display: none; display: none;
padding: 0; padding: 0;
border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
...@@ -51,7 +51,7 @@ body.course.static-pages { ...@@ -51,7 +51,7 @@ body.course.static-pages {
// This duplicates the styling from Unit page editing // This duplicates the styling from Unit page editing
.module-actions { .module-actions {
@include box-shadow(inset 0 1px 1px $shadow); box-shadow: inset 0 1px 1px $shadow;
padding: 0px 0 10px 10px; padding: 0px 0 10px 10px;
background-color: $gray-l6; background-color: $gray-l6;
...@@ -74,7 +74,7 @@ body.course.static-pages { ...@@ -74,7 +74,7 @@ body.course.static-pages {
&.new-component-item { &.new-component-item {
background: transparent; background: transparent;
border: none; border: none;
@include box-shadow(none); box-shadow: none;
} }
} }
...@@ -151,7 +151,7 @@ body.course.static-pages { ...@@ -151,7 +151,7 @@ body.course.static-pages {
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
border-radius: 3px; border-radius: 3px;
background: #fff; background: #fff;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1)); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
.page-name { .page-name {
font-size: 19px; font-size: 19px;
...@@ -193,7 +193,7 @@ body.course.static-pages { ...@@ -193,7 +193,7 @@ body.course.static-pages {
border-radius: 2px; border-radius: 2px;
@include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3)); @include linear-gradient(top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .3));
background-color: #edf1f5; background-color: #edf1f5;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1) inset); box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
font-family: Monaco, monospace; font-family: Monaco, monospace;
font-size: 13px; font-size: 13px;
color: #3c3c3c; color: #3c3c3c;
......
...@@ -144,7 +144,7 @@ body.course.subsection { ...@@ -144,7 +144,7 @@ body.course.subsection {
.url { .url {
width: 100%; width: 100%;
margin-bottom: 10px; margin-bottom: 10px;
@include box-shadow(none); box-shadow: none;
} }
.draft-tag, .draft-tag,
...@@ -348,7 +348,7 @@ body.course.subsection { ...@@ -348,7 +348,7 @@ body.course.subsection {
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
font-size: 12px; font-size: 12px;
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .2)); box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
@include transition(opacity .15s); @include transition(opacity .15s);
......
...@@ -49,7 +49,7 @@ body.course.unit { ...@@ -49,7 +49,7 @@ body.course.unit {
border-bottom: 1px solid #cbd1db; border-bottom: 1px solid #cbd1db;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%); @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0) 70%);
background-color: #edf1f5; background-color: #edf1f5;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset;
@include clearfix; @include clearfix;
li { li {
...@@ -140,7 +140,7 @@ body.course.unit { ...@@ -140,7 +140,7 @@ body.course.unit {
font-size: 15px; font-size: 15px;
line-height: 14px; line-height: 14px;
text-align: center; text-align: center;
@include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset); box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset;
.name { .name {
position: absolute; position: absolute;
...@@ -160,7 +160,7 @@ body.course.unit { ...@@ -160,7 +160,7 @@ body.course.unit {
border-radius: 3px; border-radius: 3px;
border: 1px solid $mediumGrey; border: 1px solid $mediumGrey;
background-color: #fff; background-color: #fff;
@include box-shadow(0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset); box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 1px 0 rgba(255, 255, 255, .4) inset;
@include clearfix; @include clearfix;
.cancel-button { .cancel-button {
...@@ -208,7 +208,7 @@ body.course.unit { ...@@ -208,7 +208,7 @@ body.course.unit {
width: 100%; width: 100%;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: $lightBluishGrey; background-color: $lightBluishGrey;
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset;
li:first-child { li:first-child {
margin-left: $baseline; margin-left: $baseline;
...@@ -221,7 +221,7 @@ body.course.unit { ...@@ -221,7 +221,7 @@ body.course.unit {
width: auto; width: auto;
@include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .4), rgba(255, 255, 255, 0));
background-color: tint($lightBluishGrey, 10%); background-color: tint($lightBluishGrey, 10%);
@include box-shadow(0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.2) inset, 0 -1px 0 rgba(0, 0, 0, 0.2) inset;
opacity: 0.8; opacity: 0.8;
&:hover { &:hover {
...@@ -426,7 +426,7 @@ body.course.unit { ...@@ -426,7 +426,7 @@ body.course.unit {
.component-editor { .component-editor {
@include edit-box; @include edit-box;
@include box-shadow(none); box-shadow: none;
display: none; display: none;
padding: 0; padding: 0;
border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0;
...@@ -449,7 +449,7 @@ body.course.unit { ...@@ -449,7 +449,7 @@ body.course.unit {
// Module Actions, also used for Static Pages // Module Actions, also used for Static Pages
.module-actions { .module-actions {
@include box-shadow(inset 0 1px 1px $shadow); box-shadow: inset 0 1px 1px $shadow;
padding: 0 0 $baseline $baseline; padding: 0 0 $baseline $baseline;
background-color: $gray-l6; background-color: $gray-l6;
...@@ -657,7 +657,7 @@ body.course.unit { ...@@ -657,7 +657,7 @@ body.course.unit {
input[type="number"] { input[type="number"] {
width: 38.5%; width: 38.5%;
@include box-shadow(0 1px 2px $shadow-l1 inset); box-shadow: 0 1px 2px $shadow-l1 inset;
//For webkit browsers which render number fields differently, make input wider. //For webkit browsers which render number fields differently, make input wider.
-moz-column-width: { -moz-column-width: {
width: 32%; width: 32%;
...@@ -669,10 +669,10 @@ body.course.unit { ...@@ -669,10 +669,10 @@ body.course.unit {
} }
select { select {
//@include box-shadow(0 1px 2px $shadow-l1 inset); //box-shadow: 0 1px 2px $shadow-l1 inset;
&:focus { &:focus {
@include box-shadow(0 0 1px $shadow); box-shadow: 0 0 1px $shadow;
@include transition(opacity 0.25s ease-in-out); @include transition(opacity 0.25s ease-in-out);
background-color: $yellow; background-color: $yellow;
} }
...@@ -697,7 +697,7 @@ body.course.unit { ...@@ -697,7 +697,7 @@ body.course.unit {
background-color: $gray-l4; background-color: $gray-l4;
&:hover { &:hover {
@include box-shadow(0 1px 1px $shadow); box-shadow: 0 1px 1px $shadow;
@include transition(opacity 0.15s ease-in-out); @include transition(opacity 0.15s ease-in-out);
background-color: $blue-s3; background-color: $blue-s3;
border: 1px solid $blue-s3; border: 1px solid $blue-s3;
...@@ -856,7 +856,7 @@ body.unit { ...@@ -856,7 +856,7 @@ body.unit {
.unit-location { .unit-location {
.url { .url {
@include box-shadow(none); box-shadow: none;
width: 100%; width: 100%;
margin-bottom: $baseline/2; margin-bottom: $baseline/2;
} }
......
...@@ -110,7 +110,7 @@ section.problem { ...@@ -110,7 +110,7 @@ section.problem {
padding: 9px 15px 20px; padding: 9px 15px 20px;
background: #FFF; background: #FFF;
position: relative; position: relative;
@include box-shadow(inset 0 0 0 1px #eee); box-shadow: inset 0 0 0 1px #eee;
border-radius: 3px; border-radius: 3px;
&:empty { &:empty {
...@@ -658,7 +658,7 @@ section.problem { ...@@ -658,7 +658,7 @@ section.problem {
display: block; display: block;
padding: 9px; padding: 9px;
background: #F6F6F6; background: #F6F6F6;
@include box-shadow(inset 0 0 0 1px #fff); box-shadow: inset 0 0 0 1px #fff;
} }
} }
...@@ -689,7 +689,7 @@ section.problem { ...@@ -689,7 +689,7 @@ section.problem {
margin-bottom: 10px; margin-bottom: 10px;
background: #FFF; background: #FFF;
position: relative; position: relative;
@include box-shadow(inset 0 0 0 1px #eee); box-shadow: inset 0 0 0 1px #eee;
border-radius: 3px; border-radius: 3px;
p:last-of-type { p:last-of-type {
......
...@@ -292,7 +292,7 @@ section.open-ended-child { ...@@ -292,7 +292,7 @@ section.open-ended-child {
padding: 9px 15px 20px; padding: 9px 15px 20px;
background: #FFF; background: #FFF;
position: relative; position: relative;
@include box-shadow(inset 0 0 0 1px #eee); box-shadow: inset 0 0 0 1px #eee;
border-radius: 3px; border-radius: 3px;
&:empty { &:empty {
......
.crowdsource-wrapper { .crowdsource-wrapper {
@include box-shadow(inset 0 1px 2px 1px rgba(0,0,0,0.1)); box-shadow: inset 0 1px 2px 1px rgba(0,0,0,0.1);
border-radius: 2px; border-radius: 2px;
display: none; display: none;
margin-top: 20px; margin-top: 20px;
......
...@@ -37,7 +37,7 @@ nav.sequence-nav { ...@@ -37,7 +37,7 @@ nav.sequence-nav {
height: 44px; height: 44px;
margin: 0 30px; margin: 0 30px;
@include linear-gradient(top, #ddd, #eee); @include linear-gradient(top, #ddd, #eee);
@include box-shadow(0 1px 3px rgba(0, 0, 0, .1) inset); box-shadow: 0 1px 3px rgba(0, 0, 0, .1) inset;
} }
ol { ol {
...@@ -228,7 +228,7 @@ nav.sequence-nav { ...@@ -228,7 +228,7 @@ nav.sequence-nav {
width: 70px; width: 70px;
border: 1px solid #ccc; border: 1px solid #ccc;
@include linear-gradient(top, #eee, #ddd); @include linear-gradient(top, #eee, #ddd);
@include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset;
&.prev, &.next { &.prev, &.next {
...@@ -303,7 +303,7 @@ nav.sequence-bottom { ...@@ -303,7 +303,7 @@ nav.sequence-bottom {
height: 44px; height: 44px;
border: 1px solid #ccc; border: 1px solid #ccc;
@include linear-gradient(top, #eee, #ddd); @include linear-gradient(top, #eee, #ddd);
@include box-shadow(0 1px 0 rgba(255, 255, 255, .7) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset;
&.prev, &.next { &.prev, &.next {
margin-bottom: 0; margin-bottom: 0;
......
...@@ -51,7 +51,7 @@ div.video { ...@@ -51,7 +51,7 @@ div.video {
border: 1px solid #000; border: 1px solid #000;
border-radius: 0; border-radius: 0;
border-top: 1px solid #000; border-top: 1px solid #000;
@include box-shadow(inset 0 1px 0 #eee, 0 1px 0 #555); box-shadow: inset 0 1px 0 #eee, 0 1px 0 #555;
height: 7px; height: 7px;
margin-left: -1px; margin-left: -1px;
margin-right: -1px; margin-right: -1px;
...@@ -59,7 +59,7 @@ div.video { ...@@ -59,7 +59,7 @@ div.video {
div.ui-widget-header { div.ui-widget-header {
background: #777; background: #777;
@include box-shadow(inset 0 1px 0 #999); box-shadow: inset 0 1px 0 #999;
} }
a.ui-slider-handle { a.ui-slider-handle {
...@@ -67,7 +67,7 @@ div.video { ...@@ -67,7 +67,7 @@ div.video {
@include background-size(50%); @include background-size(50%);
border: 1px solid darken($pink, 20%); border: 1px solid darken($pink, 20%);
border-radius: 15px; border-radius: 15px;
@include box-shadow(inset 0 1px 0 lighten($pink, 10%)); box-shadow: inset 0 1px 0 lighten($pink, 10%);
cursor: pointer; cursor: pointer;
height: 15px; height: 15px;
margin-left: -7px; margin-left: -7px;
...@@ -96,7 +96,7 @@ div.video { ...@@ -96,7 +96,7 @@ div.video {
a { a {
border-bottom: none; border-bottom: none;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555); box-shadow: 1px 0 0 #555;
cursor: pointer; cursor: pointer;
display: block; display: block;
line-height: 46px; line-height: 46px;
...@@ -169,7 +169,7 @@ div.video { ...@@ -169,7 +169,7 @@ div.video {
background: url('../images/closed-arrow.png') 10px center no-repeat; background: url('../images/closed-arrow.png') 10px center no-repeat;
border-left: 1px solid #000; border-left: 1px solid #000;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
@include clearfix(); @include clearfix();
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -215,7 +215,7 @@ div.video { ...@@ -215,7 +215,7 @@ div.video {
// fix for now // fix for now
ol.video_speeds { ol.video_speeds {
@include box-shadow(inset 1px 0 0 #555, 0 3px 0 #444); box-shadow: inset 1px 0 0 #555, 0 3px 0 #444;
@include transition(); @include transition();
background-color: #444; background-color: #444;
border: 1px solid #000; border: 1px solid #000;
...@@ -227,7 +227,7 @@ div.video { ...@@ -227,7 +227,7 @@ div.video {
z-index: 10; z-index: 10;
li { li {
@include box-shadow( 0 1px 0 #555); box-shadow: 0 1px 0 #555;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -249,7 +249,7 @@ div.video { ...@@ -249,7 +249,7 @@ div.video {
} }
&:last-child { &:last-child {
@include box-shadow(none); box-shadow: none;
border-bottom: 0; border-bottom: 0;
margin-top: 0; margin-top: 0;
} }
...@@ -277,7 +277,7 @@ div.video { ...@@ -277,7 +277,7 @@ div.video {
> a { > a {
background: url('../images/volume.png') 10px center no-repeat; background: url('../images/volume.png') 10px center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
@include clearfix(); @include clearfix();
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -296,7 +296,7 @@ div.video { ...@@ -296,7 +296,7 @@ div.video {
} }
.volume-slider-container { .volume-slider-container {
@include box-shadow(inset 1px 0 0 #555, 0 3px 0 #444); box-shadow: inset 1px 0 0 #555, 0 3px 0 #444;
@include transition(); @include transition();
background-color: #444; background-color: #444;
border: 1px solid #000; border: 1px solid #000;
...@@ -316,14 +316,14 @@ div.video { ...@@ -316,14 +316,14 @@ div.video {
margin: 14px auto; margin: 14px auto;
background: #666; background: #666;
border: 1px solid #000; border: 1px solid #000;
@include box-shadow(0 1px 0 #333); box-shadow: 0 1px 0 #333;
a.ui-slider-handle { a.ui-slider-handle {
background: $pink url(../images/slider-handle.png) center center no-repeat; background: $pink url(../images/slider-handle.png) center center no-repeat;
@include background-size(50%); @include background-size(50%);
border: 1px solid darken($pink, 20%); border: 1px solid darken($pink, 20%);
border-radius: 15px; border-radius: 15px;
@include box-shadow(inset 0 1px 0 lighten($pink, 10%)); box-shadow: inset 0 1px 0 lighten($pink, 10%);
cursor: pointer; cursor: pointer;
height: 15px; height: 15px;
left: -6px; left: -6px;
...@@ -341,7 +341,7 @@ div.video { ...@@ -341,7 +341,7 @@ div.video {
a.add-fullscreen { a.add-fullscreen {
background: url(../images/fullscreen.png) center no-repeat; background: url(../images/fullscreen.png) center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
color: #797979; color: #797979;
display: block; display: block;
float: left; float: left;
...@@ -362,7 +362,7 @@ div.video { ...@@ -362,7 +362,7 @@ div.video {
a.quality_control { a.quality_control {
background: url(../images/hd.png) center no-repeat; background: url(../images/hd.png) center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
color: #797979; color: #797979;
display: block; display: block;
float: left; float: left;
......
...@@ -51,7 +51,7 @@ div.video { ...@@ -51,7 +51,7 @@ div.video {
border: 1px solid #000; border: 1px solid #000;
border-radius: 0; border-radius: 0;
border-top: 1px solid #000; border-top: 1px solid #000;
@include box-shadow(inset 0 1px 0 #eee, 0 1px 0 #555); box-shadow: inset 0 1px 0 #eee, 0 1px 0 #555;
height: 7px; height: 7px;
margin-left: -1px; margin-left: -1px;
margin-right: -1px; margin-right: -1px;
...@@ -59,7 +59,7 @@ div.video { ...@@ -59,7 +59,7 @@ div.video {
div.ui-widget-header { div.ui-widget-header {
background: #777; background: #777;
@include box-shadow(inset 0 1px 0 #999); box-shadow: inset 0 1px 0 #999;
} }
a.ui-slider-handle { a.ui-slider-handle {
...@@ -67,7 +67,7 @@ div.video { ...@@ -67,7 +67,7 @@ div.video {
@include background-size(50%); @include background-size(50%);
border: 1px solid darken($pink, 20%); border: 1px solid darken($pink, 20%);
border-radius: 15px; border-radius: 15px;
@include box-shadow(inset 0 1px 0 lighten($pink, 10%)); box-shadow: inset 0 1px 0 lighten($pink, 10%);
cursor: pointer; cursor: pointer;
height: 15px; height: 15px;
margin-left: -7px; margin-left: -7px;
...@@ -96,7 +96,7 @@ div.video { ...@@ -96,7 +96,7 @@ div.video {
a { a {
border-bottom: none; border-bottom: none;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555); box-shadow: 1px 0 0 #555;
cursor: pointer; cursor: pointer;
display: block; display: block;
line-height: 46px; line-height: 46px;
...@@ -169,7 +169,7 @@ div.video { ...@@ -169,7 +169,7 @@ div.video {
background: url('../images/closed-arrow.png') 10px center no-repeat; background: url('../images/closed-arrow.png') 10px center no-repeat;
border-left: 1px solid #000; border-left: 1px solid #000;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
@include clearfix(); @include clearfix();
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -215,7 +215,7 @@ div.video { ...@@ -215,7 +215,7 @@ div.video {
// fix for now // fix for now
ol.video_speeds { ol.video_speeds {
@include box-shadow(inset 1px 0 0 #555, 0 3px 0 #444); box-shadow: inset 1px 0 0 #555, 0 3px 0 #444;
@include transition(); @include transition();
background-color: #444; background-color: #444;
border: 1px solid #000; border: 1px solid #000;
...@@ -227,7 +227,7 @@ div.video { ...@@ -227,7 +227,7 @@ div.video {
z-index: 10; z-index: 10;
li { li {
@include box-shadow( 0 1px 0 #555); box-shadow: 0 1px 0 #555;
border-bottom: 1px solid #000; border-bottom: 1px solid #000;
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -249,7 +249,7 @@ div.video { ...@@ -249,7 +249,7 @@ div.video {
} }
&:last-child { &:last-child {
@include box-shadow(none); box-shadow: none;
border-bottom: 0; border-bottom: 0;
margin-top: 0; margin-top: 0;
} }
...@@ -277,7 +277,7 @@ div.video { ...@@ -277,7 +277,7 @@ div.video {
> a { > a {
background: url('../images/volume.png') 10px center no-repeat; background: url('../images/volume.png') 10px center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
@include clearfix(); @include clearfix();
color: #fff; color: #fff;
cursor: pointer; cursor: pointer;
...@@ -296,7 +296,7 @@ div.video { ...@@ -296,7 +296,7 @@ div.video {
} }
.volume-slider-container { .volume-slider-container {
@include box-shadow(inset 1px 0 0 #555, 0 3px 0 #444); box-shadow: inset 1px 0 0 #555, 0 3px 0 #444;
@include transition(); @include transition();
background-color: #444; background-color: #444;
border: 1px solid #000; border: 1px solid #000;
...@@ -316,14 +316,14 @@ div.video { ...@@ -316,14 +316,14 @@ div.video {
margin: 14px auto; margin: 14px auto;
background: #666; background: #666;
border: 1px solid #000; border: 1px solid #000;
@include box-shadow(0 1px 0 #333); box-shadow: 0 1px 0 #333;
a.ui-slider-handle { a.ui-slider-handle {
background: $pink url(../images/slider-handle.png) center center no-repeat; background: $pink url(../images/slider-handle.png) center center no-repeat;
@include background-size(50%); @include background-size(50%);
border: 1px solid darken($pink, 20%); border: 1px solid darken($pink, 20%);
border-radius: 15px; border-radius: 15px;
@include box-shadow(inset 0 1px 0 lighten($pink, 10%)); box-shadow: inset 0 1px 0 lighten($pink, 10%);
cursor: pointer; cursor: pointer;
height: 15px; height: 15px;
left: -6px; left: -6px;
...@@ -341,7 +341,7 @@ div.video { ...@@ -341,7 +341,7 @@ div.video {
a.add-fullscreen { a.add-fullscreen {
background: url(../images/fullscreen.png) center no-repeat; background: url(../images/fullscreen.png) center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
color: #797979; color: #797979;
display: block; display: block;
float: left; float: left;
...@@ -362,7 +362,7 @@ div.video { ...@@ -362,7 +362,7 @@ div.video {
a.quality_control { a.quality_control {
background: url(../images/hd.png) center no-repeat; background: url(../images/hd.png) center no-repeat;
border-right: 1px solid #000; border-right: 1px solid #000;
@include box-shadow(1px 0 0 #555, inset 1px 0 0 #555); box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
color: #797979; color: #797979;
display: block; display: block;
float: left; float: left;
......
...@@ -158,14 +158,14 @@ ...@@ -158,14 +158,14 @@
text-align: center; text-align: center;
&:hover, &:active { &:hover, &:active {
@include box-shadow(0 2px 1px $shadow-l1); box-shadow: 0 2px 1px $shadow-l1;
} }
&.current, &.active { &.current, &.active {
@include box-shadow(inset 1px 1px 2px $shadow-d1); box-shadow: inset 1px 1px 2px $shadow-d1;
&:hover, &:active { &:hover, &:active {
@include box-shadow(inset 1px 1px 1px $shadow-d1); box-shadow: inset 1px 1px 1px $shadow-d1;
} }
} }
} }
...@@ -238,6 +238,6 @@ ...@@ -238,6 +238,6 @@
// UI archetypes - well // UI archetypes - well
.ui-well { .ui-well {
@include box-shadow(inset 0 1px 2px 1px $shadow); box-shadow: inset 0 1px 2px 1px $shadow;
padding: ($baseline*0.75); padding: ($baseline*0.75);
} }
...@@ -105,7 +105,7 @@ body.discussion { ...@@ -105,7 +105,7 @@ body.discussion {
color: #fff; color: #fff;
line-height: 1.6; line-height: 1.6;
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2)); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 rgba(255, 255, 255, .2);
li { li {
padding: 10px 20px 12px 45px; padding: 10px 20px 12px 45px;
...@@ -492,7 +492,7 @@ body.discussion { ...@@ -492,7 +492,7 @@ body.discussion {
display: table-cell; display: table-cell;
border-radius: 3px 0 0 3px; border-radius: 3px 0 0 3px;
border-right: 1px solid #ddd; border-right: 1px solid #ddd;
@include box-shadow(none); box-shadow: none;
background-color: $sidebar-color; background-color: $sidebar-color;
.user-profile { .user-profile {
...@@ -847,7 +847,7 @@ body.discussion { ...@@ -847,7 +847,7 @@ body.discussion {
border: 1px solid #4b4b4b; border: 1px solid #4b4b4b;
border-left: none; border-left: none;
border-radius: 0 0 3px 3px; border-radius: 0 0 3px 3px;
@include box-shadow(1px 0 0 #4b4b4b inset); box-shadow: 1px 0 0 #4b4b4b inset;
.browse-topic-drop-menu { .browse-topic-drop-menu {
max-height: 400px; max-height: 400px;
......
...@@ -24,7 +24,7 @@ div.gradebook-wrapper { ...@@ -24,7 +24,7 @@ div.gradebook-wrapper {
background: url(../images/search-icon.png) no-repeat 9px center #f6f6f6; background: url(../images/search-icon.png) no-repeat 9px center #f6f6f6;
font-family: $sans-serif; font-family: $sans-serif;
font-size: 11px; font-size: 11px;
@include box-shadow(0 1px 4px rgba(0, 0, 0, .12) inset); box-shadow: 0 1px 4px rgba(0, 0, 0, .12) inset;
outline: none; outline: none;
@include transition(border-color .15s); @include transition(border-color .15s);
......
...@@ -82,7 +82,7 @@ div.info-wrapper { ...@@ -82,7 +82,7 @@ div.info-wrapper {
@extend .sidebar; @extend .sidebar;
border-radius: 0 4px 4px 0; border-radius: 0 4px 4px 0;
border-left: 1px solid #ddd; border-left: 1px solid #ddd;
@include box-shadow(none); box-shadow: none;
font-size: 14px; font-size: 14px;
&:after { &:after {
...@@ -128,7 +128,7 @@ div.info-wrapper { ...@@ -128,7 +128,7 @@ div.info-wrapper {
background: #fff; background: #fff;
border-radius: 3px; border-radius: 3px;
padding: 14px 0; padding: 14px 0;
@include box-shadow(0 0 1px 1px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .25)); box-shadow: 0 0 1px 1px rgba(0, 0, 0, .1), 0 1px 3px rgba(0, 0, 0, .25);
h4 { h4 {
margin-bottom: 16px; margin-bottom: 16px;
...@@ -199,7 +199,7 @@ div.info-wrapper { ...@@ -199,7 +199,7 @@ div.info-wrapper {
h3 { h3 {
border-bottom: 0; border-bottom: 0;
@include box-shadow(none); box-shadow: none;
color: #888; color: #888;
font-size: 1em; font-size: 1em;
margin-bottom: 0; margin-bottom: 0;
......
...@@ -31,7 +31,7 @@ div.profile-wrapper { ...@@ -31,7 +31,7 @@ div.profile-wrapper {
li { li {
border-bottom: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3;
@include box-shadow(0 1px 0 #eee); box-shadow: 0 1px 0 #eee;
color: lighten($text-color, 10%); color: lighten($text-color, 10%);
display: block; display: block;
padding: lh(.5) 0 lh(.5) lh(.5); padding: lh(.5) 0 lh(.5) lh(.5);
...@@ -100,7 +100,7 @@ div.profile-wrapper { ...@@ -100,7 +100,7 @@ div.profile-wrapper {
input#pwd_reset_button { input#pwd_reset_button {
background: none; background: none;
border: none; border: none;
@include box-shadow(none); box-shadow: none;
color: #999; color: #999;
font-size: 12px; font-size: 12px;
font-weight: normal; font-weight: normal;
...@@ -120,7 +120,7 @@ div.profile-wrapper { ...@@ -120,7 +120,7 @@ div.profile-wrapper {
div#change_password_pop { div#change_password_pop {
border-bottom: 1px solid #d3d3d3; border-bottom: 1px solid #d3d3d3;
@include box-shadow(0 1px 0 #eee); box-shadow: 0 1px 0 #eee;
color: #4D4D4D; color: #4D4D4D;
padding: 7px lh(); padding: 7px lh();
......
...@@ -36,7 +36,7 @@ a { ...@@ -36,7 +36,7 @@ a {
border-radius: 3px; border-radius: 3px;
border: 1px solid $outer-border-color; border: 1px solid $outer-border-color;
background: $container-bg; background: $container-bg;
@include box-shadow(0 1px 2px rgba(0, 0, 0, 0.05)); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
} }
} }
...@@ -60,7 +60,7 @@ input[type="password"] { ...@@ -60,7 +60,7 @@ input[type="password"] {
background: $white; background: $white;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
border-radius: 0; border-radius: 0;
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6), inset 0 0 3px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6), inset 0 0 3px 0 rgba(0,0,0, 0.1);
@include box-sizing(border-box); @include box-sizing(border-box);
font: normal 1em $sans-serif; font: normal 1em $sans-serif;
height: 35px; height: 35px;
...@@ -74,7 +74,7 @@ input[type="password"] { ...@@ -74,7 +74,7 @@ input[type="password"] {
&:focus { &:focus {
border-color: lighten($link-color, 20%); border-color: lighten($link-color, 20%);
@include box-shadow(0 0 6px 0 rgba($blue, 0.4), inset 0 0 4px 0 rgba(0,0,0, 0.15)); box-shadow: 0 0 6px 0 rgba($blue, 0.4), inset 0 0 4px 0 rgba(0,0,0, 0.15);
outline: none; outline: none;
} }
} }
......
...@@ -42,7 +42,7 @@ h1.top-header { ...@@ -42,7 +42,7 @@ h1.top-header {
width: flex-grid(9) + flex-gutter(); width: flex-grid(9) + flex-gutter();
@media print { @media print {
@include box-shadow(none); box-shadow: none;
} }
} }
......
...@@ -4,7 +4,7 @@ section.tool-wrapper { ...@@ -4,7 +4,7 @@ section.tool-wrapper {
background: #073642; background: #073642;
border-bottom: 1px solid darken(#002b36, 10%); border-bottom: 1px solid darken(#002b36, 10%);
border-top: 1px solid darken(#002b36, 10%); border-top: 1px solid darken(#002b36, 10%);
@include box-shadow(inset 0 0 0 4px darken(#094959, 2%)); box-shadow: inset 0 0 0 4px darken(#094959, 2%);
color: #839496; color: #839496;
display: table; display: table;
margin: lh() (-(lh())) 0; margin: lh() (-(lh())) 0;
...@@ -76,7 +76,7 @@ section.tool-wrapper { ...@@ -76,7 +76,7 @@ section.tool-wrapper {
@extend .clearfix; @extend .clearfix;
background: darken(#073642, 2%); background: darken(#073642, 2%);
border-right: 1px solid darken(#002b36, 6%); border-right: 1px solid darken(#002b36, 6%);
@include box-shadow(1px 0 0 lighten(#002b36, 6%), inset 0 0 0 4px darken(#094959, 6%)); box-shadow: 1px 0 0 lighten(#002b36, 6%), inset 0 0 0 4px darken(#094959, 6%);
@include box-sizing(border-box); @include box-sizing(border-box);
display: table-cell; display: table-cell;
padding: lh(); padding: lh();
...@@ -88,7 +88,7 @@ section.tool-wrapper { ...@@ -88,7 +88,7 @@ section.tool-wrapper {
div.music-wrapper { div.music-wrapper {
@extend .clearfix; @extend .clearfix;
border-bottom: 1px solid darken(#073642, 10%); border-bottom: 1px solid darken(#073642, 10%);
@include box-shadow(0 1px 0 lighten(#073642, 2%)); box-shadow: 0 1px 0 lighten(#073642, 2%);
margin-bottom: lh(); margin-bottom: lh();
padding: 0 0 lh(); padding: 0 0 lh();
...@@ -101,7 +101,7 @@ section.tool-wrapper { ...@@ -101,7 +101,7 @@ section.tool-wrapper {
margin-top: 19px; margin-top: 19px;
&:active { &:active {
@include box-shadow(none); box-shadow: none;
} }
&[value="Stop"] { &[value="Stop"] {
...@@ -109,7 +109,7 @@ section.tool-wrapper { ...@@ -109,7 +109,7 @@ section.tool-wrapper {
font: bold 14px $body-font-family; font: bold 14px $body-font-family;
&:active { &:active {
@include box-shadow(none); box-shadow: none;
} }
} }
} }
...@@ -118,7 +118,7 @@ section.tool-wrapper { ...@@ -118,7 +118,7 @@ section.tool-wrapper {
div.inputs-wrapper { div.inputs-wrapper {
@extend .clearfix; @extend .clearfix;
border-bottom: 1px solid darken(#073642, 10%); border-bottom: 1px solid darken(#073642, 10%);
@include box-shadow(0 1px 0 lighten(#073642, 2%)); box-shadow: 0 1px 0 lighten(#073642, 2%);
@include clearfix; @include clearfix;
margin-bottom: lh(); margin-bottom: lh();
margin-bottom: lh(); margin-bottom: lh();
...@@ -193,7 +193,7 @@ section.tool-wrapper { ...@@ -193,7 +193,7 @@ section.tool-wrapper {
div.top-sliders { div.top-sliders {
@extend .clearfix; @extend .clearfix;
border-bottom: 1px solid darken(#073642, 10%); border-bottom: 1px solid darken(#073642, 10%);
@include box-shadow(0 1px 0 lighten(#073642, 2%)); box-shadow: 0 1px 0 lighten(#073642, 2%);
margin-bottom: lh(); margin-bottom: lh();
padding: 0 0 lh(); padding: 0 0 lh();
...@@ -226,14 +226,14 @@ section.tool-wrapper { ...@@ -226,14 +226,14 @@ section.tool-wrapper {
&.ui-slider-horizontal { &.ui-slider-horizontal {
background: darken(#002b36, 2%); background: darken(#002b36, 2%);
border: 1px solid darken(#002b36, 8%); border: 1px solid darken(#002b36, 8%);
@include box-shadow(none); box-shadow: none;
height: 0.4em; height: 0.4em;
} }
.ui-slider-handle { .ui-slider-handle {
background: lighten( #586e75, 5% ) url('../images/amplifier-slider-handle.png') center no-repeat; background: lighten( #586e75, 5% ) url('../images/amplifier-slider-handle.png') center no-repeat;
border: 1px solid darken(#002b36, 8%); border: 1px solid darken(#002b36, 8%);
@include box-shadow(inset 0 1px 0 lighten( #586e75, 20% )); box-shadow: inset 0 1px 0 lighten( #586e75, 20% );
margin-top: -.3em; margin-top: -.3em;
&:hover, &:active { &:hover, &:active {
......
...@@ -45,7 +45,7 @@ section.course-index { ...@@ -45,7 +45,7 @@ section.course-index {
a { a {
border-radius: 0; border-radius: 0;
@include box-shadow(none); box-shadow: none;
padding-left: 19px; padding-left: 19px;
} }
...@@ -72,7 +72,7 @@ section.course-index { ...@@ -72,7 +72,7 @@ section.course-index {
padding: 11px 14px; padding: 11px 14px;
@include linear-gradient(top, $sidebar-chapter-bg-top, $sidebar-chapter-bg-bottom); @include linear-gradient(top, $sidebar-chapter-bg-top, $sidebar-chapter-bg-bottom);
background-color: $sidebar-chapter-bg; background-color: $sidebar-chapter-bg;
@include box-shadow(0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset); box-shadow: 0 1px 0 #fff inset, 0 -1px 0 rgba(0, 0, 0, .1) inset;
@include transition(background-color .1s); @include transition(background-color .1s);
&.is-open { &.is-open {
...@@ -85,7 +85,7 @@ section.course-index { ...@@ -85,7 +85,7 @@ section.course-index {
&:last-child { &:last-child {
border-radius: 0 0 0 3px; border-radius: 0 0 0 3px;
@include box-shadow(0 1px 0 #fff inset); box-shadow: 0 1px 0 #fff inset;
} }
&:hover { &:hover {
...@@ -143,7 +143,7 @@ section.course-index { ...@@ -143,7 +143,7 @@ section.course-index {
} }
&:active { &:active {
@include box-shadow(inset 0 1px 14px 0 rgba(0,0,0, 0.1)); box-shadow: inset 0 1px 14px 0 rgba(0,0,0, 0.1);
&:after { &:after {
opacity: 1.0; opacity: 1.0;
...@@ -170,7 +170,7 @@ section.course-index { ...@@ -170,7 +170,7 @@ section.course-index {
> a { > a {
border: 1px solid $border-color-1; border: 1px solid $border-color-1;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .35) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset;
background: $sidebar-active-image; background: $sidebar-active-image;
&:after { &:after {
......
...@@ -52,7 +52,7 @@ div.calc-main { ...@@ -52,7 +52,7 @@ div.calc-main {
background: #111; background: #111;
border: 1px solid #000; border: 1px solid #000;
border-radius: 0; border-radius: 0;
@include box-shadow(none); box-shadow: none;
@include box-sizing(border-box); @include box-sizing(border-box);
color: #fff; color: #fff;
float: left; float: left;
...@@ -73,7 +73,7 @@ div.calc-main { ...@@ -73,7 +73,7 @@ div.calc-main {
input#calculator_output { input#calculator_output {
background: #111; background: #111;
border: 0; border: 0;
@include box-shadow(none); box-shadow: none;
@include box-sizing(border-box); @include box-sizing(border-box);
color: #fff; color: #fff;
float: left; float: left;
...@@ -94,7 +94,7 @@ div.calc-main { ...@@ -94,7 +94,7 @@ div.calc-main {
input#calculator_input { input#calculator_input {
border: none; border: none;
@include box-shadow(none); box-shadow: none;
@include box-sizing(border-box); @include box-sizing(border-box);
font-size: 16px; font-size: 16px;
padding: 10px; padding: 10px;
...@@ -122,7 +122,7 @@ div.calc-main { ...@@ -122,7 +122,7 @@ div.calc-main {
dl { dl {
background: #fff; background: #fff;
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 0 3px #999); box-shadow: 0 0 3px #999;
color: #333; color: #333;
display: none; display: none;
line-height: lh(); line-height: lh();
......
...@@ -43,7 +43,7 @@ nav.course-material { ...@@ -43,7 +43,7 @@ nav.course-material {
// background: rgba(0, 0, 0, .2); // background: rgba(0, 0, 0, .2);
@include linear-gradient(top, rgba(0, 0, 0, .4), rgba(0, 0, 0, .25)); @include linear-gradient(top, rgba(0, 0, 0, .4), rgba(0, 0, 0, .25));
background-color: transparent; background-color: transparent;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .5), 0 1px 1px rgba(0, 0, 0, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .5), 0 1px 1px rgba(0, 0, 0, .3) inset;
color: #fff; color: #fff;
text-shadow: 0 1px 0 rgba(0, 0, 0, .4); text-shadow: 0 1px 0 rgba(0, 0, 0, .4);
} }
...@@ -61,7 +61,7 @@ nav.course-material { ...@@ -61,7 +61,7 @@ nav.course-material {
} }
header.global.slim { header.global.slim {
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1)); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
height: auto; height: auto;
padding: 5px 0 10px 0; padding: 5px 0 10px 0;
border-bottom: 1px solid $outer-border-color; border-bottom: 1px solid $outer-border-color;
...@@ -81,7 +81,7 @@ header.global.slim { ...@@ -81,7 +81,7 @@ header.global.slim {
border-color: darken($link-color, 10%); border-color: darken($link-color, 10%);
border-radius: 3px; border-radius: 3px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
color: #fff; color: #fff;
display: inline-block; display: inline-block;
font-family: $sans-serif; font-family: $sans-serif;
......
...@@ -35,7 +35,7 @@ form#wiki_revision { ...@@ -35,7 +35,7 @@ form#wiki_revision {
#submit_delete { #submit_delete {
background: none; background: none;
border: none; border: none;
@include box-shadow(none); box-shadow: none;
color: #999; color: #999;
float: right; float: right;
font-weight: normal; font-weight: normal;
......
...@@ -406,7 +406,7 @@ section.wiki { ...@@ -406,7 +406,7 @@ section.wiki {
.CodeMirror { .CodeMirror {
background: #fafafa; background: #fafafa;
border: 1px solid #c8c8c8; border: 1px solid #c8c8c8;
@include box-shadow(0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1)); box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.6), inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
} }
.CodeMirror-scroll { .CodeMirror-scroll {
...@@ -417,7 +417,7 @@ section.wiki { ...@@ -417,7 +417,7 @@ section.wiki {
position: relative; position: relative;
canvas { canvas {
@include box-shadow(0 0 1px 1px rgba(0, 0, 0, .1), 0 1px 6px rgba(0, 0, 0, .2)); box-shadow: 0 0 1px 1px rgba(0, 0, 0, .1), 0 1px 6px rgba(0, 0, 0, .2);
} }
&:before { &:before {
...@@ -613,7 +613,7 @@ section.wiki { ...@@ -613,7 +613,7 @@ section.wiki {
line-height: 28px; line-height: 28px;
color: #333; color: #333;
text-align: center; text-align: center;
@include box-shadow(0 1px 0 #fff inset, 0 1px 2px rgba(0, 0, 0, .2)); box-shadow: 0 1px 0 #fff inset, 0 1px 2px rgba(0, 0, 0, .2);
} }
} }
...@@ -987,7 +987,7 @@ section.wiki { ...@@ -987,7 +987,7 @@ section.wiki {
overflow: hidden; overflow: hidden;
background: $pink; background: $pink;
padding: lh(); padding: lh();
@include box-shadow(inset 0 0 0 1px lighten($pink, 10%)); box-shadow: inset 0 0 0 1px lighten($pink, 10%);
border: 1px solid darken($pink, 15%); border: 1px solid darken($pink, 15%);
p { p {
......
...@@ -65,7 +65,7 @@ header.global { ...@@ -65,7 +65,7 @@ header.global {
} }
.home .university-partners .partners { .home .university-partners .partners {
width: 660px; width: 660px;
li.partner { li.partner {
...@@ -118,7 +118,7 @@ header.global { ...@@ -118,7 +118,7 @@ header.global {
&:hover { &:hover {
background: rgb(245,245,245); background: rgb(245,245,245);
border-color: rgb(170,170,170); border-color: rgb(170,170,170);
@include box-shadow(0 1px 16px 0 rgba($blue, 0.4)); box-shadow: 0 1px 16px 0 rgba($blue, 0.4);
.info { .info {
top: 0; top: 0;
......
...@@ -447,7 +447,7 @@ ...@@ -447,7 +447,7 @@
} }
.submission-error, .system-error { .submission-error, .system-error {
@include box-shadow(inset 0 -1px 2px 0 tint($red, 85%)); box-shadow: inset 0 -1px 2px 0 tint($red, 85%);
border-bottom: 3px solid shade($red, 10%); border-bottom: 3px solid shade($red, 10%);
background: tint($red,95%); background: tint($red,95%);
...@@ -580,7 +580,7 @@ ...@@ -580,7 +580,7 @@
form { form {
border-radius: 0; border-radius: 0;
@include box-shadow(none); box-shadow: none;
margin: 0; margin: 0;
border: none; border: none;
padding: 0; padding: 0;
...@@ -610,7 +610,7 @@ ...@@ -610,7 +610,7 @@
.modal-form-error { .modal-form-error {
@extend .body-text; @extend .body-text;
@include box-shadow(inset 0 -1px 2px 0 tint($red, 85%)); box-shadow: inset 0 -1px 2px 0 tint($red, 85%);
@include box-sizing(border-box); @include box-sizing(border-box);
margin: $baseline 0 ($baseline/2) 0 !important; margin: $baseline 0 ($baseline/2) 0 !important;
padding: $baseline; padding: $baseline;
......
...@@ -7,9 +7,9 @@ ...@@ -7,9 +7,9 @@
background: $course-profile-bg; background: $course-profile-bg;
@include background-image(url($homepage-bg-image)); @include background-image(url($homepage-bg-image));
background-size: cover; background-size: cover;
@include box-shadow(0 1px 80px 0 rgba(0,0,0, 0.5)); box-shadow: 0 1px 80px 0 rgba(0,0,0, 0.5);
border-bottom: 1px solid $border-color-3; border-bottom: 1px solid $border-color-3;
@include box-shadow(inset 0 1px 5px 0 rgba(0,0,0, 0.1)); box-shadow: inset 0 1px 5px 0 rgba(0,0,0, 0.1);
height: 280px; height: 280px;
margin-top: $header_image_margin; margin-top: $header_image_margin;
padding-top: 150px; padding-top: 150px;
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
.intro-inner-wrapper { .intro-inner-wrapper {
background: $course-header-bg; background: $course-header-bg;
border: 1px solid $border-color-3; border: 1px solid $border-color-3;
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5)); box-shadow: 0 4px 25px 0 rgba(0,0,0, 0.5);
@include box-sizing(border-box); @include box-sizing(border-box);
@include clearfix; @include clearfix;
margin: 0 auto; margin: 0 auto;
...@@ -45,7 +45,7 @@ ...@@ -45,7 +45,7 @@
> hgroup { > hgroup {
border-bottom: 1px solid $border-color-2; border-bottom: 1px solid $border-color-2;
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
margin-bottom: 20px; margin-bottom: 20px;
padding-bottom: 20px; padding-bottom: 20px;
width: 100%; width: 100%;
...@@ -184,7 +184,7 @@ ...@@ -184,7 +184,7 @@
.play-intro { .play-intro {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.65), rgba(0,0,0, 0.75))); @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.65), rgba(0,0,0, 0.75)));
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 12px 0 rgba(0,0,0, 0.4)); box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.4);
border: 2px solid rgba(255,255,255, 0.8); border: 2px solid rgba(255,255,255, 0.8);
height: 80px; height: 80px;
left: 50%; left: 50%;
...@@ -219,7 +219,7 @@ ...@@ -219,7 +219,7 @@
.play-intro { .play-intro {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8))); @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8)));
@include box-shadow(0 1px 12px 0 rgba(0,0,0, 0.5)); box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.5);
border-color: rgba(255,255,255, 0.9); border-color: rgba(255,255,255, 0.9);
&::after { &::after {
...@@ -350,7 +350,7 @@ ...@@ -350,7 +350,7 @@
width: flex-grid(4); width: flex-grid(4);
> section { > section {
@include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.15)); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.15);
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
&.course-summary { &.course-summary {
...@@ -439,7 +439,7 @@ ...@@ -439,7 +439,7 @@
rgba(0,0,0, 0.7) 100%)); rgba(0,0,0, 0.7) 100%));
border: 1px solid rgba(0,0,0, 0.5); border: 1px solid rgba(0,0,0, 0.5);
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5)); box-shadow: 0 4px 25px 0 rgba(0,0,0, 0.5);
@include box-sizing(border-box); @include box-sizing(border-box);
color: rgb(255,255,255); color: rgb(255,255,255);
float: right; float: right;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
@include background-image(url($homepage-bg-image)); @include background-image(url($homepage-bg-image));
background-position: center top !important; background-position: center top !important;
border-bottom: 1px solid $border-color-3; border-bottom: 1px solid $border-color-3;
@include box-shadow(inset 0 -1px 8px 0 rgba(0,0,0, 0.2), inset 0 1px 12px 0 rgba(0,0,0, 0.3)); box-shadow: inset 0 -1px 8px 0 rgba(0,0,0, 0.2), inset 0 1px 12px 0 rgba(0,0,0, 0.3);
height: 430px; height: 430px;
margin-top: $header_image_margin; margin-top: $header_image_margin;
width: 100%; width: 100%;
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
background: #FFF; background: #FFF;
background: $course-header-bg; background: $course-header-bg;
border: 1px solid $border-color-3; border: 1px solid $border-color-3;
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5)); box-shadow: 0 4px 25px 0 rgba(0,0,0, 0.5);
padding: 20px 30px; padding: 20px 30px;
position: relative; position: relative;
z-index: 2; z-index: 2;
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
.dashboard-banner { .dashboard-banner {
background: $yellow; background: $yellow;
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
padding: 10px; padding: 10px;
margin-bottom: 30px; margin-bottom: 30px;
...@@ -59,7 +59,7 @@ ...@@ -59,7 +59,7 @@
border-top: none; border-top: none;
//@include border-bottom-radius(4px); //@include border-bottom-radius(4px);
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.15)); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.15);
@include clearfix; @include clearfix;
margin: 0px; margin: 0px;
padding: 20px 10px 10px; padding: 20px 10px 10px;
...@@ -131,7 +131,7 @@ ...@@ -131,7 +131,7 @@
margin: 30px 10px 0; margin: 30px 10px 0;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
background: $dashboard-profile-color; background: $dashboard-profile-color;
@include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.15)); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.15);
* { * {
font-family: $sans-serif; font-family: $sans-serif;
...@@ -251,7 +251,7 @@ ...@@ -251,7 +251,7 @@
background-color: $button-bg-color; background-color: $button-bg-color;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 8px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 8px 0 rgba(0,0,0, 0.1);
@include box-sizing(border-box); @include box-sizing(border-box);
color: $base-font-color; color: $base-font-color;
font-family: $sans-serif; font-family: $sans-serif;
...@@ -346,7 +346,7 @@ ...@@ -346,7 +346,7 @@
.course-status { .course-status {
background: $yellow; background: $yellow;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
margin-top: 17px; margin-top: 17px;
margin-right: flex-gutter(); margin-right: flex-gutter();
padding: 5px; padding: 5px;
......
...@@ -13,7 +13,7 @@ $paleYellow: #fffcf1; ...@@ -13,7 +13,7 @@ $paleYellow: #fffcf1;
font-weight: 700; font-weight: 700;
text-transform: none; text-transform: none;
letter-spacing: 0; letter-spacing: 0;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset, 0 0 0 rgba(0, 0, 0, 0)); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 0 0 rgba(0, 0, 0, 0);
@include transition(background-color .15s, box-shadow .15s); @include transition(background-color .15s, box-shadow .15s);
&.disabled { &.disabled {
...@@ -29,7 +29,7 @@ $paleYellow: #fffcf1; ...@@ -29,7 +29,7 @@ $paleYellow: #fffcf1;
} }
&:hover { &:hover {
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15)); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset, 0 1px 1px rgba(0, 0, 0, .15);
text-decoration: none; text-decoration: none;
} }
} }
...@@ -54,7 +54,7 @@ $paleYellow: #fffcf1; ...@@ -54,7 +54,7 @@ $paleYellow: #fffcf1;
border-radius: 3px; border-radius: 3px;
@include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0)); @include linear-gradient(top, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
background-color: #d1dae3; background-color: #d1dae3;
@include box-shadow(0 1px 0 rgba(255, 255, 255, .3) inset); box-shadow: 0 1px 0 rgba(255, 255, 255, .3) inset;
color: #6d788b; color: #6d788b;
&:hover { &:hover {
...@@ -63,7 +63,7 @@ $paleYellow: #fffcf1; ...@@ -63,7 +63,7 @@ $paleYellow: #fffcf1;
} }
} }
.edge-landing { .edge-landing {
border-top: 5px solid $blue; border-top: 5px solid $blue;
header { header {
...@@ -85,7 +85,7 @@ $paleYellow: #fffcf1; ...@@ -85,7 +85,7 @@ $paleYellow: #fffcf1;
background: #fff; background: #fff;
border: 1px solid $darkGrey; border: 1px solid $darkGrey;
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 1px 2px rgba(0, 0, 0, .1)); box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
@include clearfix; @include clearfix;
} }
...@@ -257,4 +257,4 @@ $paleYellow: #fffcf1; ...@@ -257,4 +257,4 @@ $paleYellow: #fffcf1;
color: #fff; color: #fff;
} }
} }
} }
\ No newline at end of file
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
@include background-image(url($homepage-bg-image)); @include background-image(url($homepage-bg-image));
background-size: cover; background-size: cover;
border-bottom: 1px solid $border-color-3; border-bottom: 1px solid $border-color-3;
@include box-shadow(0 1px 0 0 $course-header-bg, inset 0 -1px 5px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 0 0 $course-header-bg, inset 0 -1px 5px 0 rgba(0,0,0, 0.1);
@include clearfix; @include clearfix;
height: 460px; height: 460px;
overflow: hidden; overflow: hidden;
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
background: #FFF; background: #FFF;
background: $course-header-bg; background: $course-header-bg;
border: 1px solid $border-color-3; border: 1px solid $border-color-3;
@include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5)); box-shadow: 0 4px 25px 0 rgba(0,0,0, 0.5);
@include box-sizing(border-box); @include box-sizing(border-box);
min-height: 120px; min-height: 120px;
margin-left: grid-width(2) + $gw-gutter; margin-left: grid-width(2) + $gw-gutter;
...@@ -84,7 +84,7 @@ ...@@ -84,7 +84,7 @@
border: 1px solid $border-color-3; border: 1px solid $border-color-3;
border-left: 0; border-left: 0;
@include box-sizing(border-box); @include box-sizing(border-box);
// @include box-shadow(0 4px 25px 0 rgba(0,0,0, 0.5)); // box-shadow: 0 4px 25px 0 rgba(0,0,0, 0.5);
height: 120px; height: 120px;
float: left; float: left;
padding: 4px; padding: 4px;
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
.play-intro { .play-intro {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.65), rgba(0,0,0, 0.75))); @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.65), rgba(0,0,0, 0.75)));
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 1px 12px 0 rgba(0,0,0, 0.4)); box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.4);
@include box-sizing(border-box); @include box-sizing(border-box);
border: 2px solid rgba(255,255,255, 0.8); border: 2px solid rgba(255,255,255, 0.8);
height: 60px; height: 60px;
...@@ -143,7 +143,7 @@ ...@@ -143,7 +143,7 @@
&:hover { &:hover {
.play-intro { .play-intro {
@include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8))); @include background-image(linear-gradient(-90deg, rgba(0,0,0, 0.75), rgba(0,0,0, 0.8)));
@include box-shadow(0 1px 12px 0 rgba(0,0,0, 0.5)); box-shadow: 0 1px 12px 0 rgba(0,0,0, 0.5);
border-color: rgba(255,255,255, 0.9); border-color: rgba(255,255,255, 0.9);
&::after { &::after {
...@@ -167,7 +167,7 @@ ...@@ -167,7 +167,7 @@
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
border-radius: 4px; border-radius: 4px;
border-top-color: $border-color-1; border-top-color: $border-color-1;
@include box-shadow(inset 0 0 0 1px rgba(255,255,255, 0.4), 0 0px 12px 0 rgba(0,0,0, 0.2)); box-shadow: inset 0 0 0 1px rgba(255,255,255, 0.4), 0 0px 12px 0 rgba(0,0,0, 0.2);
color: $lighter-base-font-color; color: $lighter-base-font-color;
letter-spacing: 1px; letter-spacing: 1px;
margin-bottom: 0px; margin-bottom: 0px;
...@@ -410,7 +410,7 @@ ...@@ -410,7 +410,7 @@
.news { .news {
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.15)); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.15);
padding: 20px; padding: 20px;
width: flex-grid(12); width: flex-grid(12);
...@@ -434,7 +434,7 @@ ...@@ -434,7 +434,7 @@
&:hover { &:hover {
background: $body-bg; background: $body-bg;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
@include box-shadow(inset 0 0 3px 0 rgba(0,0,0, 0.1)); box-shadow: inset 0 0 3px 0 rgba(0,0,0, 0.1);
} }
&:last-child { &:last-child {
......
...@@ -11,7 +11,7 @@ $white: rgb(255,255,255); ...@@ -11,7 +11,7 @@ $white: rgb(255,255,255);
.wrapper-mediakit { .wrapper-mediakit {
border-radius: 4px; border-radius: 4px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 10px 0 rgba(0,0,0, 0.1);
margin: ($baseline*3) 0 0 0; margin: ($baseline*3) 0 0 0;
border: 1px solid $border-color; border: 1px solid $border-color;
padding: ($baseline*2) ($baseline*3); padding: ($baseline*2) ($baseline*3);
...@@ -115,7 +115,7 @@ $white: rgb(255,255,255); ...@@ -115,7 +115,7 @@ $white: rgb(255,255,255);
aside { aside {
border-radius: 2px; border-radius: 2px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 4px 0 rgba(0,0,0, 0.2)); box-shadow: 0 1px 4px 0 rgba(0,0,0, 0.2);
width: 330px; width: 330px;
float: left; float: left;
border: 3px solid tint(rgb(96, 155, 216), 35%); border: 3px solid tint(rgb(96, 155, 216), 35%);
...@@ -173,7 +173,7 @@ $white: rgb(255,255,255); ...@@ -173,7 +173,7 @@ $white: rgb(255,255,255);
.library { .library {
border-radius: 2px; border-radius: 2px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 4px 0 rgba(0,0,0, 0.2)); box-shadow: 0 1px 4px 0 rgba(0,0,0, 0.2);
border: 3px solid tint($light-gray,50%); border: 3px solid tint($light-gray,50%);
padding: 0; padding: 0;
background: tint($light-gray,50%); background: tint($light-gray,50%);
...@@ -222,7 +222,7 @@ $white: rgb(255,255,255); ...@@ -222,7 +222,7 @@ $white: rgb(255,255,255);
a { a {
border-radius: 2px; border-radius: 2px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 2px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 2px 0 rgba(0,0,0, 0.1);
display: block; display: block;
min-height: 380px; min-height: 380px;
border: 2px solid tint($light-gray,75%); border: 2px solid tint($light-gray,75%);
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
border-radius: 4px; border-radius: 4px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 5px 50px 0 rgba(0,0,0, 0.3)); box-shadow: 0 5px 50px 0 rgba(0,0,0, 0.3);
margin: 120px auto 0; margin: 120px auto 0;
padding: 0px 40px 40px; padding: 0px 40px 40px;
width: flex-grid(5); width: flex-grid(5);
......
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
border: 1px solid rgb(220,220,220); border: 1px solid rgb(220,220,220);
border-radius: 10px; border-radius: 10px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 2px 16px 0 rgba(0,0,0, 0.1)); box-shadow: 0 2px 16px 0 rgba(0,0,0, 0.1);
margin: 0 auto; margin: 0 auto;
padding: 80px 80px 40px 80px; padding: 80px 80px 40px 80px;
width: flex-grid(10); width: flex-grid(10);
......
...@@ -63,13 +63,13 @@ ...@@ -63,13 +63,13 @@
// form // form
.form-fields-primary, .form-fields-secondary { .form-fields-primary, .form-fields-secondary {
border-bottom: 1px solid rgba(0,0,0,0.25); border-bottom: 1px solid rgba(0,0,0,0.25);
@include box-shadow(0 1px 2px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 2px 0 rgba(0,0,0, 0.1);
} }
form { form {
border: 1px solid rgb(216, 223, 230); border: 1px solid rgb(216, 223, 230);
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 1px 2px 0 rgba(0,0,0, 0.2)); box-shadow: 0 1px 2px 0 rgba(0,0,0, 0.2);
.instructions, .note { .instructions, .note {
margin: 0; margin: 0;
...@@ -512,7 +512,7 @@ ...@@ -512,7 +512,7 @@
} }
.actions { .actions {
@include box-shadow(inset 0 1px 1px 0px rgba(0,0,0,0.2)); box-shadow: inset 0 1px 1px 0px rgba(0,0,0,0.2);
border-top: 1px solid tint(rgb(0,0,0), 90%); border-top: 1px solid tint(rgb(0,0,0), 90%);
padding-top: ($baseline*0.75); padding-top: ($baseline*0.75);
background: tint($yellow,70%); background: tint($yellow,70%);
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
.message { .message {
background: rgb(252,252,252); background: rgb(252,252,252);
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
@include box-shadow(0 3px 20px 0 rgba(0,0,0, 0.2)); box-shadow: 0 3px 20px 0 rgba(0,0,0, 0.2);
border-radius: 4px; border-radius: 4px;
margin: 0 auto; margin: 0 auto;
padding: 40px; padding: 40px;
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
nav { nav {
@include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(230,230,230))); @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(230,230,230)));
@include box-shadow(inset 0 0 0 1px rgba(255,255,255, 0.4), inset 0 0 0 -1px rgba(255,255,255, 0.4)); box-shadow: inset 0 0 0 1px rgba(255,255,255, 0.4), inset 0 0 0 -1px rgba(255,255,255, 0.4);
@include box-sizing(border-box); @include box-sizing(border-box);
border: 1px solid rgb(190,190,190); border: 1px solid rgb(190,190,190);
border-bottom-color: rgb(200,200,200); border-bottom-color: rgb(200,200,200);
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
z-index: 9; z-index: 9;
&.fixed-top { &.fixed-top {
@include box-shadow(0 1px 15px 0 rgba(0,0,0, 0.2), inset 0 0 0 1px rgba(255,255,255, 0.4)); box-shadow: 0 1px 15px 0 rgba(0,0,0, 0.2), inset 0 0 0 1px rgba(255,255,255, 0.4);
max-width: 1200px; max-width: 1200px;
position: fixed; position: fixed;
top: 0px; top: 0px;
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
@include background-image(linear-gradient(-90deg, rgb(250,250,250) 0%, rgb(245,245,245) 50%, rgb(235,235,235) 50%, rgb(230,230,230) 100%)); @include background-image(linear-gradient(-90deg, rgb(250,250,250) 0%, rgb(245,245,245) 50%, rgb(235,235,235) 50%, rgb(230,230,230) 100%));
border-radius: 4px; border-radius: 4px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.4), inset 0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.4), inset 0 1px 0 0 rgba(255,255,255, 0.6);
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
color: $base-font-color; color: $base-font-color;
cursor: pointer; cursor: pointer;
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
background: rgb(255,255,255); background: rgb(255,255,255);
border-radius: 0px 4px 4px 4px; border-radius: 0px 4px 4px 4px;
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
@include box-shadow(0 2px 15px 0 rgba(0,0,0, 0.2)); box-shadow: 0 2px 15px 0 rgba(0,0,0, 0.2);
padding: 20px 0px 5px 20px; padding: 20px 0px 5px 20px;
position: absolute; position: absolute;
visibility: hidden; visibility: hidden;
...@@ -68,7 +68,7 @@ ...@@ -68,7 +68,7 @@
@include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(255,255,255))); @include background-image(linear-gradient(-90deg, rgb(250,250,250), rgb(255,255,255)));
border-radius: 4px 4px 0px 0px; border-radius: 4px 4px 0px 0px;
border-bottom: 1px dotted rgb(200,200,200); border-bottom: 1px dotted rgb(200,200,200);
@include box-shadow(0 2px 0 -1px rgb(255,255,255)); box-shadow: 0 2px 0 -1px rgb(255,255,255);
color: $base-font-color; color: $base-font-color;
height: 40px; height: 40px;
} }
......
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
border: 1px solid $border-color-1; border: 1px solid $border-color-1;
border-radius: 2px; border-radius: 2px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 10px 0 rgba(0,0,0, 0.15), inset 0 0 0 1px rgba(255,255,255, 0.9)); box-shadow: 0 1px 10px 0 rgba(0,0,0, 0.15), inset 0 0 0 1px rgba(255,255,255, 0.9);
margin-bottom: 30px; margin-bottom: 30px;
position: relative; position: relative;
width: 100%; width: 100%;
...@@ -80,7 +80,7 @@ ...@@ -80,7 +80,7 @@
bottom: 6px; bottom: 6px;
border: 1px solid rgba(0,0,0, 0.5); border: 1px solid rgba(0,0,0, 0.5);
@include border-right-radius(2px); @include border-right-radius(2px);
@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.15)); box-shadow: 0 1px 5px 0 rgba(0,0,0, 0.15);
@include clearfix; @include clearfix;
position: absolute; position: absolute;
right: -4px; right: -4px;
...@@ -111,7 +111,7 @@ ...@@ -111,7 +111,7 @@
// > a { // > a {
@include background-image(linear-gradient(-90deg, rgba(255,255,255, 1), rgba(255,255,255, 0.85))); @include background-image(linear-gradient(-90deg, rgba(255,255,255, 1), rgba(255,255,255, 0.85)));
@include box-shadow(inset 0 -1px 0 0 rgba(255,255,255, 0.2)); box-shadow: inset 0 -1px 0 0 rgba(255,255,255, 0.2);
border-bottom: 1px solid rgba(150,150,150, 0.7); border-bottom: 1px solid rgba(150,150,150, 0.7);
display: block; display: block;
height: 50px; height: 50px;
...@@ -247,7 +247,7 @@ ...@@ -247,7 +247,7 @@
&:hover { &:hover {
background: $course-profile-bg; background: $course-profile-bg;
border-color: $border-color-1; border-color: $border-color-1;
@include box-shadow(0 1px 16px 0 rgba($shadow-color, 0.4)); box-shadow: 0 1px 16px 0 rgba($shadow-color, 0.4);
.info { .info {
top: -150px; top: -150px;
......
.wrapper-footer { .wrapper-footer {
@include box-shadow(0 -1px 5px 0 rgba(0,0,0, 0.1)); box-shadow: 0 -1px 5px 0 rgba(0,0,0, 0.1);
border-top: 1px solid tint($m-gray,50%); border-top: 1px solid tint($m-gray,50%);
padding: 25px ($baseline/2) ($baseline*1.5) ($baseline/2); padding: 25px ($baseline/2) ($baseline*1.5) ($baseline/2);
background: $footer-bg; background: $footer-bg;
......
...@@ -18,7 +18,7 @@ input[type="tel"] { ...@@ -18,7 +18,7 @@ input[type="tel"] {
background: $form-bg-color; background: $form-bg-color;
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6), inset 0 0 3px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6), inset 0 0 3px 0 rgba(0,0,0, 0.1);
@include box-sizing(border-box); @include box-sizing(border-box);
font: italic 300 1rem/1.6rem $serif; font: italic 300 1rem/1.6rem $serif;
height: 35px; height: 35px;
...@@ -32,7 +32,7 @@ input[type="tel"] { ...@@ -32,7 +32,7 @@ input[type="tel"] {
&:focus { &:focus {
border-color: darken($button-archive-color, 50%); border-color: darken($button-archive-color, 50%);
@include box-shadow(0 0 6px 0 darken($button-archive-color, 50%), inset 0 0 4px 0 rgba(0,0,0, 0.15)); box-shadow: 0 0 6px 0 darken($button-archive-color, 50%), inset 0 0 4px 0 rgba(0,0,0, 0.15);
outline: none; outline: none;
} }
} }
......
header.global { header.global {
border-bottom: 1px solid $m-gray; border-bottom: 1px solid $m-gray;
@include box-shadow(0 1px 5px 0 rgba(0,0,0, 0.1)); box-shadow: 0 1px 5px 0 rgba(0,0,0, 0.1);
background: $header-bg; background: $header-bg;
height: 76px; height: 76px;
position: relative; position: relative;
...@@ -81,7 +81,7 @@ header.global { ...@@ -81,7 +81,7 @@ header.global {
border: 1px solid $border-color-2; border: 1px solid $border-color-2;
border-radius: 3px; border-radius: 3px;
@include box-sizing(border-box); @include box-sizing(border-box);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
color: $base-font-color; color: $base-font-color;
display: inline-block; display: inline-block;
font-family: $sans-serif; font-family: $sans-serif;
...@@ -159,7 +159,7 @@ header.global { ...@@ -159,7 +159,7 @@ header.global {
ul.dropdown-menu { ul.dropdown-menu {
background: $border-color-4; background: $border-color-4;
border-radius: 4px; border-radius: 4px;
@include box-shadow(0 2px 24px 0 rgba(0,0,0, 0.3)); box-shadow: 0 2px 24px 0 rgba(0,0,0, 0.3);
border: 1px solid $border-color-3; border: 1px solid $border-color-3;
display: none; display: none;
padding: 5px 10px; padding: 5px 10px;
...@@ -181,7 +181,7 @@ header.global { ...@@ -181,7 +181,7 @@ header.global {
bottom: 6px solid transparent; bottom: 6px solid transparent;
left: 6px solid transparent; left: 6px solid transparent;
} }
@include box-shadow(1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3); box-shadow: 1px 0 0 0 $border-color-3, 0 -1px 0 0 $border-color-3;
content: ""; content: "";
display: block; display: block;
height: 0px; height: 0px;
...@@ -195,11 +195,11 @@ header.global { ...@@ -195,11 +195,11 @@ header.global {
li { li {
display: block; display: block;
border-top: 1px dotted $border-color-2; border-top: 1px dotted $border-color-2;
@include box-shadow(inset 0 1px 0 0 rgba(255,255,255, 0.05)); box-shadow: inset 0 1px 0 0 rgba(255,255,255, 0.05);
&:first-child { &:first-child {
border: none; border: none;
@include box-shadow(none); box-shadow: none;
} }
> a { > a {
......
...@@ -14,7 +14,7 @@ ...@@ -14,7 +14,7 @@
background: rgba(0,0,0, 0.6); background: rgba(0,0,0, 0.6);
border: 1px solid rgba(0, 0, 0, 0.9); border: 1px solid rgba(0, 0, 0, 0.9);
border-radius: 0px; border-radius: 0px;
@include box-shadow(0 15px 80px 15px rgba(0,0,0, 0.5)); box-shadow: 0 15px 80px 15px rgba(0,0,0, 0.5);
color: #fff; color: #fff;
display: none; display: none;
left: 50%; left: 50%;
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
.inner-wrapper { .inner-wrapper {
background: #000; background: #000;
@include box-shadow(none); box-shadow: none;
height: 315px; height: 315px;
padding: 10px; padding: 10px;
width: 560px; width: 560px;
...@@ -44,7 +44,7 @@ ...@@ -44,7 +44,7 @@
.inner-wrapper { .inner-wrapper {
background: #000; background: #000;
@include box-shadow(none); box-shadow: none;
height: 360px; height: 360px;
padding: 10px; padding: 10px;
width: 640px; width: 640px;
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
background: $modal-bg-color; background: $modal-bg-color;
border-radius: 0px; border-radius: 0px;
border: 1px solid rgba(0, 0, 0, 0.9); border: 1px solid rgba(0, 0, 0, 0.9);
@include box-shadow(inset 0 1px 0 0 rgba(255, 255, 255, 0.7)); box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
overflow: hidden; overflow: hidden;
padding-left: 10px; padding-left: 10px;
padding-right: 10px; padding-right: 10px;
...@@ -143,7 +143,7 @@ ...@@ -143,7 +143,7 @@
.input-group { .input-group {
@include clearfix; @include clearfix;
border-bottom: 1px solid rgb(210,210,210); border-bottom: 1px solid rgb(210,210,210);
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
margin-bottom: 30px; margin-bottom: 30px;
padding-bottom: 10px; padding-bottom: 10px;
} }
...@@ -190,7 +190,7 @@ ...@@ -190,7 +190,7 @@
background: rgb(233,233,233); background: rgb(233,233,233);
border: 1px solid rgb(200,200,200); border: 1px solid rgb(200,200,200);
border-radius: 3px; border-radius: 3px;
@include box-shadow(0 1px 0 0 rgba(255,255,255, 0.6)); box-shadow: 0 1px 0 0 rgba(255,255,255, 0.6);
display: block; display: block;
margin-bottom: 20px; margin-bottom: 20px;
padding: 8px 10px; padding: 8px 10px;
......
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