Moved files and removed files
This commit is contained in:
Kyle Fiedler
@@ -8,19 +8,41 @@
|
||||
@import 'base/extends';
|
||||
@import 'base/animations';
|
||||
|
||||
// Course styles
|
||||
@import 'course/courseware_subnav';
|
||||
|
||||
// Courseware styles
|
||||
@import 'course/old/base/extends';
|
||||
// Course base / layout styles
|
||||
@import 'course/layout/courseware_subnav';
|
||||
@import 'course/base/extends';
|
||||
@import "course/plugins/jquery-ui-1.8.16.custom", "course/plugins/jquery.qtip.min";
|
||||
|
||||
@import 'module/module-styles.scss';
|
||||
|
||||
@import 'course/old/courseware/courseware';
|
||||
@import 'course/old/courseware/sidebar';
|
||||
@import 'course/old/courseware/amplifier';
|
||||
// courseware
|
||||
@import 'course/courseware/courseware';
|
||||
@import 'course/courseware/sidebar';
|
||||
@import 'course/courseware/amplifier';
|
||||
|
||||
@import "course/old/info";
|
||||
// wiki
|
||||
@import "course/wiki/basic-html";
|
||||
@import "course/wiki/sidebar";
|
||||
@import "course/wiki/create";
|
||||
@import "course/wiki/wiki";
|
||||
@import "course/wiki/table";
|
||||
|
||||
@import "course/old/plugins/jquery-ui-1.8.16.custom", "course/old/plugins/jquery.qtip.min";
|
||||
@import "course/old/textbook";
|
||||
// pages
|
||||
@import "course/info";
|
||||
@import "course/textbook";
|
||||
@import "course/profile";
|
||||
@import "course/gradebook";
|
||||
|
||||
// Askbot / Discussion styles
|
||||
@import "course/discussion/askbot-original";
|
||||
@import "course/discussion/discussion";
|
||||
@import "course/discussion/sidebar";
|
||||
@import "course/discussion/questions";
|
||||
@import "course/discussion/tags";
|
||||
@import "course/discussion/question-view" ;
|
||||
@import "course/discussion/answers";
|
||||
@import "course/discussion/forms";
|
||||
@import "course/discussion/form-wmd-toolbar";
|
||||
@import "course/discussion/modals";
|
||||
@import "course/discussion/profile";
|
||||
@import "course/discussion/badges";
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
SASS
|
||||
====
|
||||
|
||||
This project is using Sass to generate its CSS. Sass is a CSS preprocessor that
|
||||
allows for faster development of CSS. For more information about sass:
|
||||
|
||||
http://sass-lang.com
|
||||
|
||||
Install SASS
|
||||
------------
|
||||
|
||||
To use sass, make sure that you have RubyGems install, then you can use Bundler:
|
||||
|
||||
$ gem install bundler
|
||||
$ bundle install
|
||||
|
||||
This should ensure that you have all the dependencies required for compiling.
|
||||
|
||||
Compiling
|
||||
---------
|
||||
|
||||
The dev server will automatically compile sass files that have changed. Simply start
|
||||
the server using:
|
||||
|
||||
$ rake runserver
|
||||
|
||||
To run it along side of development:
|
||||
|
||||
$ sass --watch lms/static/sass:lms/static/sass -r ./lms/static/sass/bourbon/lib/bourbon.rb
|
||||
@@ -1,17 +0,0 @@
|
||||
@import "bourbon/bourbon";
|
||||
|
||||
// Base layout
|
||||
@import "base/variables", "base/functions", "base/extends", "base/base";
|
||||
@import "layout/layout", "layout/header", "layout/footer", "layout/calculator", "layout/leanmodal";
|
||||
@import "plugins/jquery-ui-1.8.16.custom", "plugins/jquery.qtip.min";
|
||||
|
||||
// pages
|
||||
@import "courseware/courseware", "courseware/sidebar", "courseware/video", "courseware/sequence-nav", "courseware/amplifier";
|
||||
@import "textbook";
|
||||
@import "info";
|
||||
@import "profile";
|
||||
@import "gradebook";
|
||||
@import "wiki/basic-html", "wiki/sidebar", "wiki/create", "wiki/wiki", "wiki/table";
|
||||
@import "help";
|
||||
|
||||
@import "discussion/askbot-original", "discussion/discussion","discussion/sidebar", "discussion/questions", "discussion/tags", "discussion/question-view" , "discussion/answers", "discussion/forms", "discussion/form-wmd-toolbar", "discussion/modals", "discussion/profile", "discussion/badges";
|
||||
@@ -1,77 +0,0 @@
|
||||
:focus {
|
||||
outline-color: #ccc;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
a {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size:1.6em;
|
||||
margin:20px 0 10px 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: $body-font-size;
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
margin:20px 0 10px 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: $body-line-height;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
#{$all-text-inputs}, textarea {
|
||||
border: 1px solid #999;
|
||||
@include box-shadow(0 -1px 0 #fff);
|
||||
font: $body-font-size $body-font-family;
|
||||
@include linear-gradient(#eee, #fff);
|
||||
padding: 4px;
|
||||
|
||||
&:focus {
|
||||
border-color: $mit-red;
|
||||
}
|
||||
}
|
||||
|
||||
a {
|
||||
color: $mit-red;
|
||||
|
||||
&:link {
|
||||
color: $mit-red;
|
||||
}
|
||||
|
||||
&:visited {
|
||||
color: darken($mit-red, 10%);
|
||||
}
|
||||
|
||||
&:link, &:visited {
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
p &, li > &, span > &, .inline {
|
||||
border-bottom: 1px solid #bbb;
|
||||
// font-style: italic;
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
input[type="submit"], input[type="button"], button {
|
||||
@extend .button;
|
||||
}
|
||||
|
||||
@@ -1,125 +0,0 @@
|
||||
/* Generated by Font Squirrel (http://www.fontsquirrel.com) on January 25, 2012 05:06:34 PM America/New_York */
|
||||
|
||||
|
||||
// Not used in UI
|
||||
// @font-face {
|
||||
// font-family: 'Open Sans';
|
||||
// src: url('../fonts/OpenSans-Light-webfont.eot');
|
||||
// src: url('../fonts/OpenSans-Light-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
// url('../fonts/OpenSans-Light-webfont.woff') format('woff'),
|
||||
// url('../fonts/OpenSans-Light-webfont.ttf') format('truetype'),
|
||||
// url('../fonts/OpenSans-Light-webfont.svg#OpenSansLight') format('svg');
|
||||
// font-weight: 300;
|
||||
// font-style: normal;
|
||||
|
||||
// }
|
||||
|
||||
// @font-face {
|
||||
// font-family: 'Open Sans';
|
||||
// src: url('../fonts/OpenSans-LightItalic-webfont.eot');
|
||||
// src: url('../fonts/OpenSans-LightItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
// url('../fonts/OpenSans-LightItalic-webfont.woff') format('woff'),
|
||||
// url('../fonts/OpenSans-LightItalic-webfont.ttf') format('truetype'),
|
||||
// url('../fonts/OpenSans-LightItalic-webfont.svg#OpenSansLightItalic') format('svg');
|
||||
// font-weight: 300;
|
||||
// font-style: italic;
|
||||
|
||||
// }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Regular-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Regular-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Regular-webfont.svg#OpenSansRegular') format('svg');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Italic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Italic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Italic-webfont.svg#OpenSansItalic') format('svg');
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
// Not used in UI
|
||||
// @font-face {
|
||||
// font-family: 'Open Sans';
|
||||
// src: url('../fonts/OpenSans-Semibold-webfont.eot');
|
||||
// src: url('../fonts/OpenSans-Semibold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
// url('../fonts/OpenSans-Semibold-webfont.woff') format('woff'),
|
||||
// url('../fonts/OpenSans-Semibold-webfont.ttf') format('truetype'),
|
||||
// url('../fonts/OpenSans-Semibold-webfont.svg#OpenSansSemibold') format('svg');
|
||||
// font-weight: 600;
|
||||
// font-style: normal;
|
||||
|
||||
// }
|
||||
|
||||
// @font-face {
|
||||
// font-family: 'Open Sans';
|
||||
// src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot');
|
||||
// src: url('../fonts/OpenSans-SemiboldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
// url('../fonts/OpenSans-SemiboldItalic-webfont.woff') format('woff'),
|
||||
// url('../fonts/OpenSans-SemiboldItalic-webfont.ttf') format('truetype'),
|
||||
// url('../fonts/OpenSans-SemiboldItalic-webfont.svg#OpenSansSemiboldItalic') format('svg');
|
||||
// font-weight: 600;
|
||||
// font-style: italic;
|
||||
|
||||
// }
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot');
|
||||
src: url('../fonts/OpenSans-Bold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-Bold-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-Bold-webfont.svg#OpenSansBold') format('svg');
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-BoldItalic-webfont.svg#OpenSansBoldItalic') format('svg');
|
||||
font-weight: 700;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-ExtraBold-webfont.eot');
|
||||
src: url('../fonts/OpenSans-ExtraBold-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-ExtraBold-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-ExtraBold-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-ExtraBold-webfont.svg#OpenSansExtrabold') format('svg');
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot');
|
||||
src: url('../fonts/OpenSans-ExtraBoldItalic-webfont.eot?#iefix') format('embedded-opentype'),
|
||||
url('../fonts/OpenSans-ExtraBoldItalic-webfont.woff') format('woff'),
|
||||
url('../fonts/OpenSans-ExtraBoldItalic-webfont.ttf') format('truetype'),
|
||||
url('../fonts/OpenSans-ExtraBoldItalic-webfont.svg#OpenSansExtraboldItalic') format('svg');
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
|
||||
}
|
||||
|
||||
@@ -1,102 +0,0 @@
|
||||
/*
|
||||
html5doctor.com Reset Stylesheet
|
||||
v1.6.1
|
||||
Last Updated: 2010-09-17
|
||||
Author: Richard Clark - http://richclarkdesign.com
|
||||
Twitter: @rich_clark
|
||||
*/
|
||||
|
||||
html, body, div, span, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
abbr, address, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, samp,
|
||||
small, strong, var,
|
||||
b, i,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin:0;
|
||||
padding:0;
|
||||
border:0;
|
||||
outline:0;
|
||||
font-size:100%;
|
||||
vertical-align:baseline;
|
||||
background:transparent;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height:1;
|
||||
}
|
||||
|
||||
article,aside,details,figcaption,figure,
|
||||
footer,header,hgroup,menu,nav,section {
|
||||
display:block;
|
||||
}
|
||||
|
||||
nav ul {
|
||||
list-style:none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes:none;
|
||||
}
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content:'';
|
||||
content:none;
|
||||
}
|
||||
|
||||
a {
|
||||
margin:0;
|
||||
padding:0;
|
||||
font-size:100%;
|
||||
vertical-align:baseline;
|
||||
background:transparent;
|
||||
}
|
||||
|
||||
/* change colours to suit your needs */
|
||||
ins {
|
||||
background-color:#ff9;
|
||||
color:#000;
|
||||
text-decoration:none;
|
||||
}
|
||||
|
||||
/* change colours to suit your needs */
|
||||
mark {
|
||||
background-color:#ff9;
|
||||
color:#000;
|
||||
font-style:italic;
|
||||
font-weight:bold;
|
||||
}
|
||||
|
||||
del {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
abbr[title], dfn[title] {
|
||||
border-bottom:1px dotted;
|
||||
cursor:help;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse:collapse;
|
||||
border-spacing:0;
|
||||
}
|
||||
|
||||
/* change border colour to suit your needs */
|
||||
hr {
|
||||
display:block;
|
||||
height:1px;
|
||||
border:0;
|
||||
border-top:1px solid #cccccc;
|
||||
margin:1em 0;
|
||||
padding:0;
|
||||
}
|
||||
|
||||
input, select {
|
||||
vertical-align:middle;
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
// Variables
|
||||
// ---------------------------------------- //
|
||||
|
||||
// Type
|
||||
$body-font-family: "Open Sans", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Verdana, sans-serif;
|
||||
$body-font-size: 14px;
|
||||
$body-line-height: golden-ratio($body-font-size, 1);
|
||||
|
||||
// Grid
|
||||
$fg-column: 80px;
|
||||
$fg-gutter: 25px;
|
||||
$fg-max-columns: 12;
|
||||
$fg-max-width: 1400px;
|
||||
$fg-min-width: 810px;
|
||||
|
||||
// Color
|
||||
$light-gray: #ddd;
|
||||
$dark-gray: #333;
|
||||
$mit-red: #993333;
|
||||
$cream: #F6EFD4;
|
||||
$text-color: $dark-gray;
|
||||
$border-color: $light-gray;
|
||||
35
lms/static/sass/course/old/bourbon/_bourbon.scss
vendored
35
lms/static/sass/course/old/bourbon/_bourbon.scss
vendored
@@ -1,35 +0,0 @@
|
||||
// Custom Functions
|
||||
@import "functions/deprecated-webkit-gradient";
|
||||
@import "functions/flex-grid";
|
||||
@import "functions/grid-width";
|
||||
@import "functions/linear-gradient";
|
||||
@import "functions/modular-scale";
|
||||
@import "functions/radial-gradient";
|
||||
@import "functions/render-gradients";
|
||||
@import "functions/tint-shade";
|
||||
|
||||
// CSS3 Mixins
|
||||
@import "css3/animation";
|
||||
@import "css3/appearance";
|
||||
@import "css3/background-image";
|
||||
@import "css3/background-size";
|
||||
@import "css3/border-image";
|
||||
@import "css3/border-radius";
|
||||
@import "css3/box-shadow";
|
||||
@import "css3/box-sizing";
|
||||
@import "css3/columns";
|
||||
@import "css3/flex-box";
|
||||
@import "css3/inline-block";
|
||||
@import "css3/linear-gradient";
|
||||
@import "css3/radial-gradient";
|
||||
@import "css3/transform";
|
||||
@import "css3/transition";
|
||||
@import "css3/user-select";
|
||||
|
||||
// Addons & other mixins
|
||||
@import "addons/button";
|
||||
@import "addons/clearfix";
|
||||
@import "addons/font-family";
|
||||
@import "addons/html5-input-types";
|
||||
@import "addons/position";
|
||||
@import "addons/timing-functions";
|
||||
@@ -1,267 +0,0 @@
|
||||
@mixin button ($style: simple, $base-color: #4294f0) {
|
||||
|
||||
@if type-of($style) == color {
|
||||
$base-color: $style;
|
||||
$style: simple;
|
||||
}
|
||||
|
||||
// Grayscale button
|
||||
@if $base-color == grayscale($base-color) {
|
||||
@if $style == simple {
|
||||
@include simple($base-color, $grayscale: true);
|
||||
}
|
||||
|
||||
@else if $style == shiny {
|
||||
@include shiny($base-color, $grayscale: true);
|
||||
}
|
||||
|
||||
@else if $style == pill {
|
||||
@include pill($base-color, $grayscale: true);
|
||||
}
|
||||
}
|
||||
|
||||
// Colored button
|
||||
@else {
|
||||
@if $style == simple {
|
||||
@include simple($base-color);
|
||||
}
|
||||
|
||||
@else if $style == shiny {
|
||||
@include shiny($base-color);
|
||||
}
|
||||
|
||||
@else if $style == pill {
|
||||
@include pill($base-color);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Simple Button
|
||||
//************************************************************************//
|
||||
@mixin simple($base-color, $grayscale: false) {
|
||||
$color: hsl(0, 0, 100%);
|
||||
$border: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
|
||||
$inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%);
|
||||
$stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 15%, $lightness: -18%);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
@if $grayscale == true {
|
||||
$border: grayscale($border);
|
||||
$inset-shadow: grayscale($inset-shadow);
|
||||
$stop-gradient: grayscale($stop-gradient);
|
||||
$text-shadow: grayscale($text-shadow);
|
||||
}
|
||||
|
||||
border: 1px solid $border;
|
||||
@include border-radius (3px);
|
||||
@include box-shadow (inset 0 1px 0 0 $inset-shadow);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 11px;
|
||||
font-weight: bold;
|
||||
@include linear-gradient ($base-color, $stop-gradient);
|
||||
padding: 6px 18px 7px;
|
||||
text-shadow: 0 1px 0 $text-shadow;
|
||||
-webkit-background-clip: padding-box;
|
||||
|
||||
&:hover {
|
||||
$base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%);
|
||||
$inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%);
|
||||
$stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%);
|
||||
|
||||
@if $grayscale == true {
|
||||
$base-color-hover: grayscale($base-color-hover);
|
||||
$inset-shadow-hover: grayscale($inset-shadow-hover);
|
||||
$stop-gradient-hover: grayscale($stop-gradient-hover);
|
||||
}
|
||||
|
||||
@include box-shadow (inset 0 1px 0 0 $inset-shadow-hover);
|
||||
cursor: pointer;
|
||||
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
|
||||
}
|
||||
|
||||
&:active {
|
||||
$border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
|
||||
$inset-shadow-active: adjust-color($base-color, $saturation: 7%, $lightness: -17%);
|
||||
|
||||
@if $grayscale == true {
|
||||
$border-active: grayscale($border-active);
|
||||
$inset-shadow-active: grayscale($inset-shadow-active);
|
||||
}
|
||||
|
||||
border: 1px solid $border-active;
|
||||
@include box-shadow (inset 0 0 8px 4px $inset-shadow-active, inset 0 0 8px 4px $inset-shadow-active, 0 1px 1px 0 #eee);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Shiny Button
|
||||
//************************************************************************//
|
||||
@mixin shiny($base-color, $grayscale: false) {
|
||||
$color: hsl(0, 0, 100%);
|
||||
$border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81);
|
||||
$border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122);
|
||||
$fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46);
|
||||
$inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12);
|
||||
$second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33);
|
||||
$text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114);
|
||||
$third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
@if $grayscale == true {
|
||||
$border: grayscale($border);
|
||||
$border-bottom: grayscale($border-bottom);
|
||||
$fourth-stop: grayscale($fourth-stop);
|
||||
$inset-shadow: grayscale($inset-shadow);
|
||||
$second-stop: grayscale($second-stop);
|
||||
$text-shadow: grayscale($text-shadow);
|
||||
$third-stop: grayscale($third-stop);
|
||||
}
|
||||
|
||||
border: 1px solid $border;
|
||||
border-bottom: 1px solid $border-bottom;
|
||||
@include border-radius(5px);
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
@include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%);
|
||||
padding: 7px 20px 8px;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 -1px 1px $text-shadow;
|
||||
|
||||
&:hover {
|
||||
$first-stop-hover: adjust-color($base-color, $red: -13, $green: -15, $blue: -18);
|
||||
$second-stop-hover: adjust-color($base-color, $red: -66, $green: -62, $blue: -51);
|
||||
$third-stop-hover: adjust-color($base-color, $red: -93, $green: -85, $blue: -66);
|
||||
$fourth-stop-hover: adjust-color($base-color, $red: -86, $green: -80, $blue: -63);
|
||||
|
||||
@if $grayscale == true {
|
||||
$first-stop-hover: grayscale($first-stop-hover);
|
||||
$second-stop-hover: grayscale($second-stop-hover);
|
||||
$third-stop-hover: grayscale($third-stop-hover);
|
||||
$fourth-stop-hover: grayscale($fourth-stop-hover);
|
||||
}
|
||||
|
||||
cursor: pointer;
|
||||
@include linear-gradient(top, $first-stop-hover 0%,
|
||||
$second-stop-hover 50%,
|
||||
$third-stop-hover 50%,
|
||||
$fourth-stop-hover 100%);
|
||||
}
|
||||
|
||||
&:active {
|
||||
$inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122);
|
||||
|
||||
@if $grayscale == true {
|
||||
$inset-shadow-active: grayscale($inset-shadow-active);
|
||||
}
|
||||
|
||||
@include box-shadow(inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Pill Button
|
||||
//************************************************************************//
|
||||
@mixin pill($base-color, $grayscale: false) {
|
||||
$color: hsl(0, 0, 100%);
|
||||
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%);
|
||||
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%);
|
||||
$border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%);
|
||||
$inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%);
|
||||
$stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%);
|
||||
$text-shadow: adjust-color($base-color, $hue: 5, $saturation: -19%, $lightness: -15%);
|
||||
|
||||
@if lightness($base-color) > 70% {
|
||||
$color: hsl(0, 0, 20%);
|
||||
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
|
||||
}
|
||||
|
||||
@if $grayscale == true {
|
||||
$border-bottom: grayscale($border-bottom);
|
||||
$border-sides: grayscale($border-sides);
|
||||
$border-top: grayscale($border-top);
|
||||
$inset-shadow: grayscale($inset-shadow);
|
||||
$stop-gradient: grayscale($stop-gradient);
|
||||
$text-shadow: grayscale($text-shadow);
|
||||
}
|
||||
|
||||
border: 1px solid $border-top;
|
||||
border-color: $border-top $border-sides $border-bottom;
|
||||
@include border-radius(16px);
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow, 0 1px 2px 0 #b3b3b3);
|
||||
color: $color;
|
||||
display: inline;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
@include linear-gradient ($base-color, $stop-gradient);
|
||||
padding: 3px 16px 5px;
|
||||
text-align: center;
|
||||
text-shadow: 0 -1px 1px $text-shadow;
|
||||
-webkit-background-clip: padding-box;
|
||||
|
||||
&:hover {
|
||||
$base-color-hover: adjust-color($base-color, $lightness: -4.5%);
|
||||
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%);
|
||||
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%);
|
||||
$border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%);
|
||||
$inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%);
|
||||
$stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%);
|
||||
$text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%);
|
||||
|
||||
@if $grayscale == true {
|
||||
$base-color-hover: grayscale($base-color-hover);
|
||||
$border-bottom: grayscale($border-bottom);
|
||||
$border-sides: grayscale($border-sides);
|
||||
$border-top: grayscale($border-top);
|
||||
$inset-shadow-hover: grayscale($inset-shadow-hover);
|
||||
$stop-gradient-hover: grayscale($stop-gradient-hover);
|
||||
$text-shadow-hover: grayscale($text-shadow-hover);
|
||||
}
|
||||
|
||||
border: 1px solid $border-top;
|
||||
border-color: $border-top $border-sides $border-bottom;
|
||||
@include box-shadow(inset 0 1px 0 0 $inset-shadow-hover);
|
||||
cursor: pointer;
|
||||
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
|
||||
text-shadow: 0 -1px 1px $text-shadow-hover;
|
||||
-webkit-background-clip: padding-box;
|
||||
}
|
||||
|
||||
&:active {
|
||||
$active-color: adjust-color($base-color, $hue: 4, $saturation: -12%, $lightness: -10%);
|
||||
$border-active: adjust-color($base-color, $hue: 6, $saturation: -2.5%, $lightness: -30%);
|
||||
$border-bottom-active: adjust-color($base-color, $hue: 11, $saturation: 6%, $lightness: -31%);
|
||||
$inset-shadow-active: adjust-color($base-color, $hue: 9, $saturation: 2%, $lightness: -21.5%);
|
||||
$text-shadow-active: adjust-color($base-color, $hue: 5, $saturation: -12%, $lightness: -21.5%);
|
||||
|
||||
@if $grayscale == true {
|
||||
$active-color: grayscale($active-color);
|
||||
$border-active: grayscale($border-active);
|
||||
$border-bottom-active: grayscale($border-bottom-active);
|
||||
$inset-shadow-active: grayscale($inset-shadow-active);
|
||||
$text-shadow-active: grayscale($text-shadow-active);
|
||||
}
|
||||
|
||||
background: $active-color;
|
||||
border: 1px solid $border-active;
|
||||
border-bottom: 1px solid $border-bottom-active;
|
||||
@include box-shadow(inset 0 0 6px 3px $inset-shadow-active, 0 1px 0 0 #fff);
|
||||
text-shadow: 0 -1px 1px $text-shadow-active;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,29 +0,0 @@
|
||||
// Micro clearfix provides an easy way to contain floats without adding additional markup
|
||||
//
|
||||
// Example usage:
|
||||
//
|
||||
// // Contain all floats within .wrapper
|
||||
// .wrapper {
|
||||
// @include clearfix;
|
||||
// .content,
|
||||
// .sidebar {
|
||||
// float : left;
|
||||
// }
|
||||
// }
|
||||
|
||||
@mixin clearfix {
|
||||
zoom: 1;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
display: table;
|
||||
}
|
||||
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
|
||||
// Acknowledgements
|
||||
// Micro clearfix: [Nicolas Gallagher](http://nicolasgallagher.com/micro-clearfix-hack/)
|
||||
@@ -1,5 +0,0 @@
|
||||
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
||||
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
|
||||
$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
|
||||
$verdana: Verdana, Geneva, sans-serif;
|
||||
@@ -1,36 +0,0 @@
|
||||
//************************************************************************//
|
||||
// Generate a variable ($all-text-inputs) with a list of all html5
|
||||
// input types that have a text-based input, excluding textarea.
|
||||
// http://diveintohtml5.org/forms.html
|
||||
//************************************************************************//
|
||||
$inputs-list: 'input[type="email"]',
|
||||
'input[type="number"]',
|
||||
'input[type="password"]',
|
||||
'input[type="search"]',
|
||||
'input[type="tel"]',
|
||||
'input[type="text"]',
|
||||
'input[type="url"]',
|
||||
|
||||
// Webkit & Gecko may change the display of these in the future
|
||||
'input[type="color"]',
|
||||
'input[type="date"]',
|
||||
'input[type="datetime"]',
|
||||
'input[type="datetime-local"]',
|
||||
'input[type="month"]',
|
||||
'input[type="time"]',
|
||||
'input[type="week"]';
|
||||
|
||||
$unquoted-inputs-list: ();
|
||||
|
||||
@each $input-type in $inputs-list {
|
||||
$unquoted-inputs-list: append($unquoted-inputs-list, unquote($input-type), comma);
|
||||
}
|
||||
|
||||
$all-text-inputs: $unquoted-inputs-list;
|
||||
|
||||
// You must use interpolation on the variable:
|
||||
// #{$all-text-inputs}
|
||||
//************************************************************************//
|
||||
// #{$all-text-inputs}, textarea {
|
||||
// border: 1px solid red;
|
||||
// }
|
||||
@@ -1,30 +0,0 @@
|
||||
@mixin position ($position: relative, $coordinates: 0 0 0 0) {
|
||||
|
||||
@if type-of($position) == list {
|
||||
$coordinates: $position;
|
||||
$position: relative;
|
||||
}
|
||||
|
||||
$top: nth($coordinates, 1);
|
||||
$right: nth($coordinates, 2);
|
||||
$bottom: nth($coordinates, 3);
|
||||
$left: nth($coordinates, 4);
|
||||
|
||||
position: $position;
|
||||
|
||||
@if not(unitless($top)) {
|
||||
top: $top;
|
||||
}
|
||||
|
||||
@if not(unitless($right)) {
|
||||
right: $right;
|
||||
}
|
||||
|
||||
@if not(unitless($bottom)) {
|
||||
bottom: $bottom;
|
||||
}
|
||||
|
||||
@if not(unitless($left)) {
|
||||
left: $left;
|
||||
}
|
||||
}
|
||||
@@ -1,32 +0,0 @@
|
||||
// CSS cubic-bezier timing functions. Timing functions courtesy of jquery.easie (github.com/jaukia/easie)
|
||||
// Timing functions are the same as demo'ed here: http://jqueryui.com/demos/effect/easing.html
|
||||
|
||||
// EASE IN
|
||||
$ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530);
|
||||
$ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
|
||||
$ease-in-quart: cubic-bezier(0.895, 0.030, 0.685, 0.220);
|
||||
$ease-in-quint: cubic-bezier(0.755, 0.050, 0.855, 0.060);
|
||||
$ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
|
||||
$ease-in-expo: cubic-bezier(0.950, 0.050, 0.795, 0.035);
|
||||
$ease-in-circ: cubic-bezier(0.600, 0.040, 0.980, 0.335);
|
||||
$ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
|
||||
|
||||
// EASE OUT
|
||||
$ease-out-quad: cubic-bezier(0.250, 0.460, 0.450, 0.940);
|
||||
$ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
$ease-out-quart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
|
||||
$ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
|
||||
$ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
|
||||
$ease-out-expo: cubic-bezier(0.190, 1.000, 0.220, 1.000);
|
||||
$ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000);
|
||||
$ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
|
||||
|
||||
// EASE IN OUT
|
||||
$ease-in-out-quad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
|
||||
$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
|
||||
$ease-in-out-quart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
|
||||
$ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
|
||||
$ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
|
||||
$ease-in-out-expo: cubic-bezier(1.000, 0.000, 0.000, 1.000);
|
||||
$ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.150, 0.860);
|
||||
$ease-in-out-back: cubic-bezier(0.680, -0.550, 0.265, 1.550);
|
||||
@@ -1,171 +0,0 @@
|
||||
// http://www.w3.org/TR/css3-animations/#the-animation-name-property-
|
||||
// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties.
|
||||
|
||||
// Official animation shorthand property.
|
||||
@mixin animation ($animation-1,
|
||||
$animation-2: false, $animation-3: false,
|
||||
$animation-4: false, $animation-5: false,
|
||||
$animation-6: false, $animation-7: false,
|
||||
$animation-8: false, $animation-9: false)
|
||||
{
|
||||
$full: compact($animation-1, $animation-2, $animation-3, $animation-4,
|
||||
$animation-5, $animation-6, $animation-7, $animation-8, $animation-9);
|
||||
|
||||
-webkit-animation: $full;
|
||||
-moz-animation: $full;
|
||||
animation: $full;
|
||||
}
|
||||
|
||||
// Individual Animation Properties
|
||||
@mixin animation-name ($name-1,
|
||||
$name-2: false, $name-3: false,
|
||||
$name-4: false, $name-5: false,
|
||||
$name-6: false, $name-7: false,
|
||||
$name-8: false, $name-9: false)
|
||||
{
|
||||
$full: compact($name-1, $name-2, $name-3, $name-4,
|
||||
$name-5, $name-6, $name-7, $name-8, $name-9);
|
||||
|
||||
-webkit-animation-name: $full;
|
||||
-moz-animation-name: $full;
|
||||
animation-name: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-duration ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4,
|
||||
$time-5, $time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-animation-duration: $full;
|
||||
-moz-animation-duration: $full;
|
||||
animation-duration: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-timing-function ($motion-1: ease,
|
||||
// ease | linear | ease-in | ease-out | ease-in-out
|
||||
$motion-2: false, $motion-3: false,
|
||||
$motion-4: false, $motion-5: false,
|
||||
$motion-6: false, $motion-7: false,
|
||||
$motion-8: false, $motion-9: false)
|
||||
{
|
||||
$full: compact($motion-1, $motion-2, $motion-3, $motion-4,
|
||||
$motion-5, $motion-6, $motion-7, $motion-8, $motion-9);
|
||||
|
||||
-webkit-animation-timing-function: $full;
|
||||
-moz-animation-timing-function: $full;
|
||||
animation-timing-function: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-iteration-count ($value-1: 1,
|
||||
// infinite | <number>
|
||||
$value-2: false, $value-3: false,
|
||||
$value-4: false, $value-5: false,
|
||||
$value-6: false, $value-7: false,
|
||||
$value-8: false, $value-9: false)
|
||||
{
|
||||
$full: compact($value-1, $value-2, $value-3, $value-4,
|
||||
$value-5, $value-6, $value-7, $value-8, $value-9);
|
||||
|
||||
-webkit-animation-iteration-count: $full;
|
||||
-moz-animation-iteration-count: $full;
|
||||
animation-iteration-count: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-direction ($direction-1: normal,
|
||||
// normal | alternate
|
||||
$direction-2: false, $direction-3: false,
|
||||
$direction-4: false, $direction-5: false,
|
||||
$direction-6: false, $direction-7: false,
|
||||
$direction-8: false, $direction-9: false)
|
||||
{
|
||||
$full: compact($direction-1, $direction-2, $direction-3, $direction-4,
|
||||
$direction-5, $direction-6, $direction-7, $direction-8, $direction-9);
|
||||
|
||||
-webkit-animation-direction: $full;
|
||||
-moz-animation-direction: $full;
|
||||
animation-direction: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-play-state ($state-1: running,
|
||||
// running | paused
|
||||
$state-2: false, $state-3: false,
|
||||
$state-4: false, $state-5: false,
|
||||
$state-6: false, $state-7: false,
|
||||
$state-8: false, $state-9: false)
|
||||
{
|
||||
$full: compact($state-1, $state-2, $state-3, $state-4,
|
||||
$state-5, $state-6, $state-7, $state-8, $state-9);
|
||||
|
||||
-webkit-animation-play-state: $full;
|
||||
-moz-animation-play-state: $full;
|
||||
animation-play-state: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-delay ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4,
|
||||
$time-5, $time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-animation-delay: $full;
|
||||
-moz-animation-delay: $full;
|
||||
animation-delay: $full;
|
||||
}
|
||||
|
||||
|
||||
@mixin animation-fill-mode ($mode-1: none,
|
||||
// http://goo.gl/l6ckm
|
||||
// none | forwards | backwards | both
|
||||
$mode-2: false, $mode-3: false,
|
||||
$mode-4: false, $mode-5: false,
|
||||
$mode-6: false, $mode-7: false,
|
||||
$mode-8: false, $mode-9: false)
|
||||
{
|
||||
$full: compact($mode-1, $mode-2, $mode-3, $mode-4,
|
||||
$mode-5, $mode-6, $mode-7, $mode-8, $mode-9);
|
||||
|
||||
-webkit-animation-fill-mode: $full;
|
||||
-moz-animation-fill-mode: $full;
|
||||
animation-fill-mode: $full;
|
||||
}
|
||||
|
||||
|
||||
// Deprecated
|
||||
@mixin animation-basic ($name, $time: 0, $motion: ease) {
|
||||
$length-of-name: length($name);
|
||||
$length-of-time: length($time);
|
||||
$length-of-motion: length($motion);
|
||||
|
||||
@if $length-of-name > 1 {
|
||||
@include animation-name(zip($name));
|
||||
} @else {
|
||||
@include animation-name( $name);
|
||||
}
|
||||
|
||||
@if $length-of-time > 1 {
|
||||
@include animation-duration(zip($time));
|
||||
} @else {
|
||||
@include animation-duration( $time);
|
||||
}
|
||||
|
||||
@if $length-of-motion > 1 {
|
||||
@include animation-timing-function(zip($motion));
|
||||
} @else {
|
||||
@include animation-timing-function( $motion);
|
||||
}
|
||||
@warn "The animation-basic mixin is deprecated. Use the animation mixin instead.";
|
||||
}
|
||||
|
||||
@@ -1,7 +0,0 @@
|
||||
@mixin appearance ($value) {
|
||||
-webkit-appearance: $value;
|
||||
-moz-appearance: $value;
|
||||
-ms-appearance: $value;
|
||||
-o-appearance: $value;
|
||||
appearance: $value;
|
||||
}
|
||||
@@ -1,57 +0,0 @@
|
||||
//************************************************************************//
|
||||
// Background-image property for adding multiple background images with
|
||||
// gradients, or for stringing multiple gradients together.
|
||||
//************************************************************************//
|
||||
|
||||
@mixin background-image(
|
||||
$image-1 , $image-2: false,
|
||||
$image-3: false, $image-4: false,
|
||||
$image-5: false, $image-6: false,
|
||||
$image-7: false, $image-8: false,
|
||||
$image-9: false, $image-10: false
|
||||
) {
|
||||
$images: compact($image-1, $image-2,
|
||||
$image-3, $image-4,
|
||||
$image-5, $image-6,
|
||||
$image-7, $image-8,
|
||||
$image-9, $image-10);
|
||||
|
||||
background-image: add-prefix($images, webkit);
|
||||
background-image: add-prefix($images, moz);
|
||||
background-image: add-prefix($images, ms);
|
||||
background-image: add-prefix($images, o);
|
||||
background-image: add-prefix($images);
|
||||
}
|
||||
|
||||
|
||||
@function add-prefix($images, $vendor: false) {
|
||||
$images-prefixed: ();
|
||||
|
||||
@for $i from 1 through length($images) {
|
||||
$type: type-of(nth($images, $i)); // Get type of variable - List or String
|
||||
|
||||
// If variable is a list - Gradient
|
||||
@if $type == list {
|
||||
$gradient-type: nth(nth($images, $i), 1); // Get type of gradient (linear || radial)
|
||||
$gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue)
|
||||
|
||||
$gradient: render-gradients($gradient-args, $gradient-type, $vendor);
|
||||
$images-prefixed: append($images-prefixed, $gradient, comma);
|
||||
}
|
||||
|
||||
// If variable is a string - Image
|
||||
@else if $type == string {
|
||||
$images-prefixed: join($images-prefixed, nth($images, $i), comma);
|
||||
}
|
||||
}
|
||||
@return $images-prefixed;
|
||||
}
|
||||
|
||||
|
||||
|
||||
//Examples:
|
||||
//@include background-image(linear-gradient(top, orange, red));
|
||||
//@include background-image(radial-gradient(50% 50%, cover circle, orange, red));
|
||||
//@include background-image(url("/images/a.png"), linear-gradient(orange, red));
|
||||
//@include background-image(url("image.png"), linear-gradient(orange, red), url("image.png"));
|
||||
//@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red);
|
||||
@@ -1,15 +0,0 @@
|
||||
@mixin background-size ($length-1,
|
||||
$length-2: false, $length-3: false,
|
||||
$length-4: false, $length-5: false,
|
||||
$length-6: false, $length-7: false,
|
||||
$length-8: false, $length-9: false)
|
||||
{
|
||||
$full: compact($length-1, $length-2, $length-3, $length-4,
|
||||
$length-5, $length-6, $length-7, $length-8, $length-9);
|
||||
|
||||
-webkit-background-size: $full;
|
||||
-moz-background-size: $full;
|
||||
-ms-background-size: $full;
|
||||
-o-background-size: $full;
|
||||
background-size: $full;
|
||||
}
|
||||
@@ -1,7 +0,0 @@
|
||||
@mixin border-image ($image) {
|
||||
-webkit-border-image: $image;
|
||||
-moz-border-image: $image;
|
||||
-ms-border-image: $image;
|
||||
-o-border-image: $image;
|
||||
border-image: $image;
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
@mixin border-radius ($radii) {
|
||||
-webkit-border-radius: $radii;
|
||||
-moz-border-radius: $radii;
|
||||
-ms-border-radius: $radii;
|
||||
-o-border-radius: $radii;
|
||||
border-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-left-radius($radii) {
|
||||
-webkit-border-top-left-radius: $radii;
|
||||
-moz-border-top-left-radius: $radii;
|
||||
-moz-border-radius-topleft: $radii;
|
||||
-ms-border-top-left-radius: $radii;
|
||||
-o-border-top-left-radius: $radii;
|
||||
border-top-left-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-right-radius($radii) {
|
||||
-webkit-border-top-right-radius: $radii;
|
||||
-moz-border-top-right-radius: $radii;
|
||||
-moz-border-radius-topright: $radii;
|
||||
-ms-border-top-right-radius: $radii;
|
||||
-o-border-top-right-radius: $radii;
|
||||
border-top-right-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-bottom-left-radius($radii) {
|
||||
-webkit-border-bottom-left-radius: $radii;
|
||||
-moz-border-bottom-left-radius: $radii;
|
||||
-moz-border-radius-bottomleft: $radii;
|
||||
-ms-border-bottom-left-radius: $radii;
|
||||
-o-border-bottom-left-radius: $radii;
|
||||
border-bottom-left-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-bottom-right-radius($radii) {
|
||||
-webkit-border-bottom-right-radius: $radii;
|
||||
-moz-border-bottom-right-radius: $radii;
|
||||
-moz-border-radius-bottomright: $radii;
|
||||
-ms-border-bottom-right-radius: $radii;
|
||||
-o-border-bottom-right-radius: $radii;
|
||||
border-bottom-right-radius: $radii;
|
||||
}
|
||||
|
||||
@mixin border-top-radius($radii) {
|
||||
@include border-top-left-radius($radii);
|
||||
@include border-top-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-right-radius($radii) {
|
||||
@include border-top-right-radius($radii);
|
||||
@include border-bottom-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-bottom-radius($radii) {
|
||||
@include border-bottom-left-radius($radii);
|
||||
@include border-bottom-right-radius($radii);
|
||||
}
|
||||
|
||||
@mixin border-left-radius($radii) {
|
||||
@include border-top-left-radius($radii);
|
||||
@include border-bottom-left-radius($radii);
|
||||
}
|
||||
@@ -1,14 +0,0 @@
|
||||
// Box-Shadow Mixin Requires Sass v3.1.1+
|
||||
@mixin box-shadow ($shadow-1,
|
||||
$shadow-2: false, $shadow-3: false,
|
||||
$shadow-4: false, $shadow-5: false,
|
||||
$shadow-6: false, $shadow-7: false,
|
||||
$shadow-8: false, $shadow-9: false)
|
||||
{
|
||||
$full: compact($shadow-1, $shadow-2, $shadow-3, $shadow-4,
|
||||
$shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9);
|
||||
|
||||
-webkit-box-shadow: $full;
|
||||
-moz-box-shadow: $full;
|
||||
box-shadow: $full;
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
@mixin box-sizing ($box) {
|
||||
// content-box | border-box | inherit
|
||||
-webkit-box-sizing: $box;
|
||||
-moz-box-sizing: $box;
|
||||
box-sizing: $box;
|
||||
}
|
||||
@@ -1,67 +0,0 @@
|
||||
@mixin columns($arg: auto) {
|
||||
// <column-count> || <column-width>
|
||||
-webkit-columns: $arg;
|
||||
-moz-columns: $arg;
|
||||
columns: $arg;
|
||||
}
|
||||
|
||||
@mixin column-count($int: auto) {
|
||||
// auto || integer
|
||||
-webkit-column-count: $int;
|
||||
-moz-column-count: $int;
|
||||
column-count: $int;
|
||||
}
|
||||
|
||||
@mixin column-gap($length: normal) {
|
||||
// normal || length
|
||||
-webkit-column-gap: $length;
|
||||
-moz-column-gap: $length;
|
||||
column-gap: $length;
|
||||
}
|
||||
|
||||
@mixin column-fill($arg: auto) {
|
||||
// auto || length
|
||||
-webkit-columns-fill: $arg;
|
||||
-moz-columns-fill: $arg;
|
||||
columns-fill: $arg;
|
||||
}
|
||||
|
||||
@mixin column-rule($arg) {
|
||||
// <border-width> || <border-style> || <color>
|
||||
-webkit-column-rule: $arg;
|
||||
-moz-column-rule: $arg;
|
||||
column-rule: $arg;
|
||||
}
|
||||
|
||||
@mixin column-rule-color($color) {
|
||||
-webkit-column-rule-color: $color;
|
||||
-moz-column-rule-color: $color;
|
||||
column-rule-color: $color;
|
||||
}
|
||||
|
||||
@mixin column-rule-style($style: none) {
|
||||
// none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid
|
||||
-webkit-column-rule-style: $style;
|
||||
-moz-column-rule-style: $style;
|
||||
column-rule-style: $style;
|
||||
}
|
||||
|
||||
@mixin column-rule-width ($width: none) {
|
||||
-webkit-column-rule-width: $width;
|
||||
-moz-column-rule-width: $width;
|
||||
column-rule-width: $width;
|
||||
}
|
||||
|
||||
@mixin column-span($arg: none) {
|
||||
// none || all
|
||||
-webkit-column-span: $arg;
|
||||
-moz-column-span: $arg;
|
||||
column-span: $arg;
|
||||
}
|
||||
|
||||
@mixin column-width($length: auto) {
|
||||
// auto || length
|
||||
-webkit-column-width: $length;
|
||||
-moz-column-width: $length;
|
||||
column-width: $length;
|
||||
}
|
||||
@@ -1,67 +0,0 @@
|
||||
// CSS3 Flexible Box Model and property defaults
|
||||
|
||||
// Custom shorthand notation for flexbox
|
||||
@mixin box($orient: inline-axis, $pack: start, $align: stretch) {
|
||||
@include display-box;
|
||||
@include box-orient($orient);
|
||||
@include box-pack($pack);
|
||||
@include box-align($align);
|
||||
}
|
||||
|
||||
@mixin display-box {
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: box;
|
||||
}
|
||||
|
||||
@mixin box-orient($orient: inline-axis) {
|
||||
// horizontal|vertical|inline-axis|block-axis|inherit
|
||||
-webkit-box-orient: $orient;
|
||||
-moz-box-orient: $orient;
|
||||
box-orient: $orient;
|
||||
}
|
||||
|
||||
@mixin box-pack($pack: start) {
|
||||
// start|end|center|justify
|
||||
-webkit-box-pack: $pack;
|
||||
-moz-box-pack: $pack;
|
||||
box-pack: $pack;
|
||||
}
|
||||
|
||||
@mixin box-align($align: stretch) {
|
||||
// start|end|center|baseline|stretch
|
||||
-webkit-box-align: $align;
|
||||
-moz-box-align: $align;
|
||||
box-align: $align;
|
||||
}
|
||||
|
||||
@mixin box-direction($direction: normal) {
|
||||
// normal|reverse|inherit
|
||||
-webkit-box-direction: $direction;
|
||||
-moz-box-direction: $direction;
|
||||
box-direction: $direction;
|
||||
}
|
||||
@mixin box-lines($lines: single) {
|
||||
// single|multiple
|
||||
-webkit-box-lines: $lines;
|
||||
-moz-box-lines: $lines;
|
||||
box-lines: $lines;
|
||||
}
|
||||
|
||||
@mixin box-ordinal-group($integer: 1) {
|
||||
-webkit-box-ordinal-group: $integer;
|
||||
-moz-box-ordinal-group: $integer;
|
||||
box-ordinal-group: $integer;
|
||||
}
|
||||
|
||||
@mixin box-flex($value: 0.0) {
|
||||
-webkit-box-flex: $value;
|
||||
-moz-box-flex: $value;
|
||||
box-flex: $value;
|
||||
}
|
||||
|
||||
@mixin box-flex-group($integer: 1) {
|
||||
-webkit-box-flex-group: $integer;
|
||||
-moz-box-flex-group: $integer;
|
||||
box-flex-group: $integer;
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
// Legacy support for inline-block in IE7 (maybe IE6)
|
||||
@mixin inline-block {
|
||||
display: -moz-inline-box;
|
||||
-moz-box-orient: vertical;
|
||||
display: inline-block;
|
||||
vertical-align: baseline;
|
||||
zoom: 1;
|
||||
*display: inline;
|
||||
*vertical-align: auto;
|
||||
}
|
||||
@@ -1,41 +0,0 @@
|
||||
@mixin linear-gradient($pos, $G1, $G2: false,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false,
|
||||
$fallback: false) {
|
||||
// Detect what type of value exists in $pos
|
||||
$pos-type: type-of(nth($pos, 1));
|
||||
|
||||
// If $pos is missing from mixin, reassign vars and add default position
|
||||
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
||||
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
||||
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
||||
$pos: top; // Default position
|
||||
}
|
||||
|
||||
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
|
||||
// Set $G1 as the default fallback color
|
||||
$fallback-color: nth($G1, 1);
|
||||
|
||||
// If $fallback is a color use that color as the fallback color
|
||||
@if (type-of($fallback) == color) or ($fallback == "transparent") {
|
||||
$fallback-color: $fallback;
|
||||
}
|
||||
|
||||
background-color: $fallback-color;
|
||||
background-image: deprecated-webkit-gradient(linear, $full); // Safari <= 5.0
|
||||
background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome
|
||||
background-image: -moz-linear-gradient($pos, $full);
|
||||
background-image: -ms-linear-gradient($pos, $full);
|
||||
background-image: -o-linear-gradient($pos, $full);
|
||||
background-image: unquote("linear-gradient(#{$pos}, #{$full})");
|
||||
}
|
||||
|
||||
|
||||
// Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well.
|
||||
// @include linear-gradient(#1e5799, #2989d8);
|
||||
// @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8);
|
||||
// @include linear-gradient(top, #1e5799 0%, #2989d8 50%);
|
||||
// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%);
|
||||
@@ -1,31 +0,0 @@
|
||||
// Requires Sass 3.1+
|
||||
@mixin radial-gradient($pos, $shape-size,
|
||||
$G1, $G2,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false,
|
||||
$fallback: false) {
|
||||
|
||||
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
|
||||
// Set $G1 as the default fallback color
|
||||
$fallback-color: nth($G1, 1);
|
||||
|
||||
// If $fallback is a color use that color as the fallback color
|
||||
@if (type-of($fallback) == color) or ($fallback == "transparent") {
|
||||
$fallback-color: $fallback;
|
||||
}
|
||||
|
||||
background-color: $fallback-color;
|
||||
background-image: deprecated-webkit-gradient(radial, $full); // Safari <= 5.0
|
||||
background-image: -webkit-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -moz-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -ms-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: -o-radial-gradient($pos, $shape-size, $full);
|
||||
background-image: unquote("radial-gradient(#{$pos}, #{$shape-size}, #{$full})");
|
||||
}
|
||||
|
||||
// Usage: Gradient position and shape-size are required. Color stops are optional.
|
||||
// @include radial-gradient(50% 50%, circle cover, #1e5799, #efefef);
|
||||
// @include radial-gradient(50% 50%, circle cover, #eee 10%, #1e5799 30%, #efefef);
|
||||
@@ -1,19 +0,0 @@
|
||||
@mixin transform($property: none) {
|
||||
// none | <transform-function>
|
||||
-webkit-transform: $property;
|
||||
-moz-transform: $property;
|
||||
-ms-transform: $property;
|
||||
-o-transform: $property;
|
||||
transform: $property;
|
||||
}
|
||||
|
||||
@mixin transform-origin($axes: 50%) {
|
||||
// x-axis - left | center | right | length | %
|
||||
// y-axis - top | center | bottom | length | %
|
||||
// z-axis - length
|
||||
-webkit-transform-origin: $axes;
|
||||
-moz-transform-origin: $axes;
|
||||
-ms-transform-origin: $axes;
|
||||
-o-transform-origin: $axes;
|
||||
transform-origin: $axes;
|
||||
}
|
||||
@@ -1,104 +0,0 @@
|
||||
// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable.
|
||||
// Example: @include transition (all, 2.0s, ease-in-out);
|
||||
// @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s));
|
||||
// @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s));
|
||||
|
||||
@mixin transition ($property: all, $duration: 0.15s, $timing-function: ease-out, $delay: 0) {
|
||||
|
||||
// Detect # of args passed into each variable
|
||||
$length-of-property: length($property);
|
||||
$length-of-duration: length($duration);
|
||||
$length-of-timing-function: length($timing-function);
|
||||
$length-of-delay: length($delay);
|
||||
|
||||
@if $length-of-property > 1 {
|
||||
@include transition-property(zip($property)); }
|
||||
@else {
|
||||
@include transition-property( $property);
|
||||
}
|
||||
|
||||
@if $length-of-duration > 1 {
|
||||
@include transition-duration(zip($duration)); }
|
||||
@else {
|
||||
@include transition-duration( $duration);
|
||||
}
|
||||
|
||||
@if $length-of-timing-function > 1 {
|
||||
@include transition-timing-function(zip($timing-function)); }
|
||||
@else {
|
||||
@include transition-timing-function( $timing-function);
|
||||
}
|
||||
|
||||
@if $length-of-delay > 1 {
|
||||
@include transition-delay(zip($delay)); }
|
||||
@else {
|
||||
@include transition-delay( $delay);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@mixin transition-property ($prop-1: all,
|
||||
$prop-2: false, $prop-3: false,
|
||||
$prop-4: false, $prop-5: false,
|
||||
$prop-6: false, $prop-7: false,
|
||||
$prop-8: false, $prop-9: false)
|
||||
{
|
||||
$full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5,
|
||||
$prop-6, $prop-7, $prop-8, $prop-9);
|
||||
|
||||
-webkit-transition-property: $full;
|
||||
-moz-transition-property: $full;
|
||||
-ms-transition-property: $full;
|
||||
-o-transition-property: $full;
|
||||
transition-property: $full;
|
||||
}
|
||||
|
||||
@mixin transition-duration ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
||||
$time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-transition-duration: $full;
|
||||
-moz-transition-duration: $full;
|
||||
-ms-transition-duration: $full;
|
||||
-o-transition-duration: $full;
|
||||
transition-duration: $full;
|
||||
}
|
||||
|
||||
@mixin transition-timing-function ($motion-1: ease,
|
||||
$motion-2: false, $motion-3: false,
|
||||
$motion-4: false, $motion-5: false,
|
||||
$motion-6: false, $motion-7: false,
|
||||
$motion-8: false, $motion-9: false)
|
||||
{
|
||||
$full: compact($motion-1, $motion-2, $motion-3, $motion-4, $motion-5,
|
||||
$motion-6, $motion-7, $motion-8, $motion-9);
|
||||
|
||||
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
|
||||
-webkit-transition-timing-function: $full;
|
||||
-moz-transition-timing-function: $full;
|
||||
-ms-transition-timing-function: $full;
|
||||
-o-transition-timing-function: $full;
|
||||
transition-timing-function: $full;
|
||||
}
|
||||
|
||||
@mixin transition-delay ($time-1: 0,
|
||||
$time-2: false, $time-3: false,
|
||||
$time-4: false, $time-5: false,
|
||||
$time-6: false, $time-7: false,
|
||||
$time-8: false, $time-9: false)
|
||||
{
|
||||
$full: compact($time-1, $time-2, $time-3, $time-4, $time-5,
|
||||
$time-6, $time-7, $time-8, $time-9);
|
||||
|
||||
-webkit-transition-delay: $full;
|
||||
-moz-transition-delay: $full;
|
||||
-ms-transition-delay: $full;
|
||||
-o-transition-delay: $full;
|
||||
transition-delay: $full;
|
||||
}
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
@mixin user-select($arg: none) {
|
||||
-webkit-user-select: $arg;
|
||||
-moz-user-select: $arg;
|
||||
-ms-user-select: $arg;
|
||||
user-select: $arg;
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
// Render Deprecated Webkit Gradient - Linear || Radial
|
||||
//************************************************************************//
|
||||
@function deprecated-webkit-gradient($type, $full) {
|
||||
$gradient-list: ();
|
||||
$gradient: false;
|
||||
$full-length: length($full);
|
||||
$percentage: false;
|
||||
$gradient-type: $type;
|
||||
|
||||
@for $i from 1 through $full-length {
|
||||
$gradient: nth($full, $i);
|
||||
|
||||
@if length($gradient) == 2 {
|
||||
$color-stop: color-stop(nth($gradient, 2), nth($gradient, 1));
|
||||
$gradient-list: join($gradient-list, $color-stop, comma);
|
||||
}
|
||||
@else {
|
||||
@if $i == $full-length {
|
||||
$percentage: 100%;
|
||||
}
|
||||
@else {
|
||||
$percentage: ($i - 1) * (100 / ($full-length - 1)) + "%";
|
||||
}
|
||||
$color-stop: color-stop(unquote($percentage), $gradient);
|
||||
$gradient-list: join($gradient-list, $color-stop, comma);
|
||||
}
|
||||
}
|
||||
|
||||
@if $type == radial {
|
||||
$gradient: -webkit-gradient(radial, center center, 0, center center, 460, $gradient-list);
|
||||
}
|
||||
@else if $type == linear {
|
||||
$gradient: -webkit-gradient(linear, left top, left bottom, $gradient-list);
|
||||
}
|
||||
@return $gradient;
|
||||
}
|
||||
@@ -1,35 +0,0 @@
|
||||
// Flexible grid
|
||||
@function flex-grid($columns, $container-columns: $fg-max-columns) {
|
||||
$width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
|
||||
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
|
||||
@return percentage($width / $container-width);
|
||||
}
|
||||
|
||||
// Flexible gutter
|
||||
@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) {
|
||||
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
|
||||
@return percentage($gutter / $container-width);
|
||||
}
|
||||
|
||||
// The $fg-column, $fg-gutter and $fg-max-columns variables must be defined in your base stylesheet to properly use the flex-grid function.
|
||||
// This function takes the fluid grid equation (target / context = result) and uses columns to help define each.
|
||||
//
|
||||
// $fg-column: 60px; // Column Width
|
||||
// $fg-gutter: 25px; // Gutter Width
|
||||
// $fg-max-columns: 12; // Total Columns For Main Container
|
||||
//
|
||||
// div {
|
||||
// width: flex-grid(4); // returns (315px / 1020px) = 30.882353%;
|
||||
// margin-left: flex-gutter(); // returns (25px / 1020px) = 2.45098%;
|
||||
//
|
||||
// p {
|
||||
// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%;
|
||||
// float: left;
|
||||
// margin: flex-gutter(4); // returns (25px / 315px) = 7.936508%;
|
||||
// }
|
||||
//
|
||||
// blockquote {
|
||||
// float: left;
|
||||
// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%;
|
||||
// }
|
||||
// }
|
||||
@@ -1,13 +0,0 @@
|
||||
@function grid-width($n) {
|
||||
@return $n * $gw-column + ($n - 1) * $gw-gutter;
|
||||
}
|
||||
|
||||
// The $gw-column and $gw-gutter variables must be defined in your base stylesheet to properly use the grid-width function.
|
||||
//
|
||||
// $gw-column: 100px; // Column Width
|
||||
// $gw-gutter: 40px; // Gutter Width
|
||||
//
|
||||
// div {
|
||||
// width: grid-width(4); // returns 520px;
|
||||
// margin-left: $gw-gutter; // returns 40px;
|
||||
// }
|
||||
@@ -1,23 +0,0 @@
|
||||
@function linear-gradient($pos: top, $G1: false, $G2: false,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
|
||||
// Detect what type of value exists in $pos
|
||||
$pos-type: type-of(nth($pos, 1));
|
||||
|
||||
// If $pos is missing from mixin, reassign vars and add default position
|
||||
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
|
||||
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
|
||||
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
|
||||
$pos: top; // Default position
|
||||
}
|
||||
|
||||
$type: linear;
|
||||
$gradient: compact($pos, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
$type-gradient: append($type, $gradient, comma);
|
||||
|
||||
@return $type-gradient;
|
||||
}
|
||||
|
||||
@@ -1,40 +0,0 @@
|
||||
@function modular-scale($value, $increment, $ratio) {
|
||||
@if $increment > 0 {
|
||||
@for $i from 1 through $increment {
|
||||
$value: ($value * $ratio);
|
||||
}
|
||||
}
|
||||
|
||||
@if $increment < 0 {
|
||||
$increment: abs($increment);
|
||||
@for $i from 1 through $increment {
|
||||
$value: ($value / $ratio);
|
||||
}
|
||||
}
|
||||
|
||||
@return $value;
|
||||
}
|
||||
|
||||
// div {
|
||||
// Increment Up GR with positive value
|
||||
// font-size: modular-scale(14px, 1, 1.618); // returns: 22.652px
|
||||
//
|
||||
// Increment Down GR with negative value
|
||||
// font-size: modular-scale(14px, -1, 1.618); // returns: 8.653px
|
||||
//
|
||||
// Can be used with ceil(round up) or floor(round down)
|
||||
// font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px
|
||||
// font-size: ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px
|
||||
// }
|
||||
//
|
||||
// modularscale.com
|
||||
|
||||
@function golden-ratio($value, $increment) {
|
||||
@return modular-scale($value, $increment, 1.618)
|
||||
}
|
||||
|
||||
// div {
|
||||
// font-size: golden-ratio(14px, 1); // returns: 22.652px
|
||||
// }
|
||||
//
|
||||
// goldenratiocalculator.com
|
||||
@@ -1,15 +0,0 @@
|
||||
// This function is required and used by the background-image mixin.
|
||||
@function radial-gradient($pos, $shape-size,
|
||||
$G1, $G2,
|
||||
$G3: false, $G4: false,
|
||||
$G5: false, $G6: false,
|
||||
$G7: false, $G8: false,
|
||||
$G9: false, $G10: false) {
|
||||
|
||||
$type: radial;
|
||||
$gradient: compact($pos, $shape-size, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
|
||||
$type-gradient: append($type, $gradient, comma);
|
||||
|
||||
@return $type-gradient;
|
||||
}
|
||||
|
||||
@@ -1,14 +0,0 @@
|
||||
// User for linear and radial gradients within background-image or border-image properties
|
||||
|
||||
@function render-gradients($gradients, $gradient-type, $vendor: false) {
|
||||
$vendor-gradients: false;
|
||||
@if $vendor {
|
||||
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient($gradients);
|
||||
}
|
||||
|
||||
@else if $vendor == false {
|
||||
$vendor-gradients: "#{$gradient-type}-gradient(#{$gradients})";
|
||||
$vendor-gradients: unquote($vendor-gradients);
|
||||
}
|
||||
@return $vendor-gradients;
|
||||
}
|
||||
@@ -1,9 +0,0 @@
|
||||
// Add percentage of white to a color
|
||||
@function tint($color, $percent){
|
||||
@return mix(white, $color, $percent);
|
||||
}
|
||||
|
||||
// Add percentage of black to a color
|
||||
@function shade($color, $percent){
|
||||
@return mix(black, $color, $percent);
|
||||
}
|
||||
@@ -1,19 +0,0 @@
|
||||
require "bourbon/generator"
|
||||
|
||||
module Bourbon
|
||||
if defined?(Rails)
|
||||
class Engine < ::Rails::Engine
|
||||
require 'bourbon/engine'
|
||||
end
|
||||
|
||||
module Rails
|
||||
class Railtie < ::Rails::Railtie
|
||||
rake_tasks do
|
||||
load "tasks/install.rake"
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
require File.join(File.dirname(__FILE__), "/bourbon/sass_extensions")
|
||||
@@ -1,6 +0,0 @@
|
||||
module Bourbon::SassExtensions
|
||||
end
|
||||
|
||||
require "sass"
|
||||
|
||||
require File.join(File.dirname(__FILE__), "/sass_extensions/functions")
|
||||
@@ -1,13 +0,0 @@
|
||||
module Bourbon::SassExtensions::Functions
|
||||
end
|
||||
|
||||
require File.join(File.dirname(__FILE__), "/functions/compact")
|
||||
|
||||
module Sass::Script::Functions
|
||||
include Bourbon::SassExtensions::Functions::Compact
|
||||
end
|
||||
|
||||
# Wierd that this has to be re-included to pick up sub-modules. Ruby bug?
|
||||
class Sass::Script::Functions::EvaluationContext
|
||||
include Sass::Script::Functions
|
||||
end
|
||||
@@ -1,13 +0,0 @@
|
||||
# Compact function pulled from compass
|
||||
module Bourbon::SassExtensions::Functions::Compact
|
||||
|
||||
def compact(*args)
|
||||
sep = :comma
|
||||
if args.size == 1 && args.first.is_a?(Sass::Script::List)
|
||||
args = args.first.value
|
||||
sep = args.first.separator
|
||||
end
|
||||
Sass::Script::List.new(args.reject{|a| !a.to_bool}, sep)
|
||||
end
|
||||
|
||||
end
|
||||
@@ -1,97 +0,0 @@
|
||||
footer {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
@include box-sizing(border-box);
|
||||
color: #777;
|
||||
margin-top: $body-line-height;
|
||||
padding: 0 $body-line-height;
|
||||
|
||||
@media print {
|
||||
display: none;
|
||||
}
|
||||
|
||||
p {
|
||||
float: left;
|
||||
|
||||
a {
|
||||
color: #444;
|
||||
|
||||
&:link, &:visited {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
float: right;
|
||||
|
||||
ul {
|
||||
float: left;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
margin-right: 20px;
|
||||
|
||||
a {
|
||||
color: #444;
|
||||
|
||||
&:link, &:visited {
|
||||
color: #444;
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.social {
|
||||
margin-right: 40px;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
}
|
||||
|
||||
li {
|
||||
float: left;
|
||||
margin-right: lh(.5);
|
||||
|
||||
&:after {
|
||||
content: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
border-bottom: 0;
|
||||
display: block;
|
||||
height: 29px;
|
||||
text-indent: -9999px;
|
||||
width: 28px;
|
||||
|
||||
&:hover {
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
|
||||
&.twitter a {
|
||||
background: url('../images/social/twitter.png') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
&.facebook a {
|
||||
background: url('../images/social/facebook.png') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
&.linkedin a {
|
||||
background: url('../images/social/linkedin.png') 0 0 no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,183 +0,0 @@
|
||||
div.header-wrapper {
|
||||
background: $mit-red;
|
||||
border-bottom: 1px solid #fff;
|
||||
@include box-shadow(inset 0 -4px 6px darken($mit-red, 5%));
|
||||
|
||||
@media print {
|
||||
display: none;
|
||||
}
|
||||
|
||||
header {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
@include box-sizing(border-box);
|
||||
padding: 0 $body-line-height;
|
||||
|
||||
hgroup {
|
||||
@extend .clearfix;
|
||||
float: left;
|
||||
min-width: flex-grid(3);
|
||||
padding-top: 13px;
|
||||
|
||||
h1 {
|
||||
color: darken($mit-red, 25%);
|
||||
font-size: 18px;
|
||||
font-weight: 800;
|
||||
@include inline-block();
|
||||
line-height: lh();
|
||||
margin: 0;
|
||||
padding: 0 lh(.5) 0 0;
|
||||
text-shadow: 0 1px 0 lighten($mit-red, 10%);
|
||||
|
||||
&:after {
|
||||
color: darken($mit-red, 10%);
|
||||
content: "•";
|
||||
display: inline-block;
|
||||
font-size: 10px;
|
||||
letter-spacing: -2px;
|
||||
padding-left: lh(.5);
|
||||
text-shadow: 0;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: 16px;
|
||||
@include inline-block();
|
||||
letter-spacing: 0;
|
||||
margin: 0;
|
||||
padding: 0 lh() 0px 0;
|
||||
text-shadow: 0 -1px 0 darken($mit-red, 10%);
|
||||
text-transform: none;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
a {
|
||||
color: #fff;
|
||||
border: none;
|
||||
|
||||
&:hover {
|
||||
color: rgba(#fff, .7);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
display: block;
|
||||
float: none;
|
||||
|
||||
h1 {
|
||||
border: 0;
|
||||
float: left;
|
||||
}
|
||||
|
||||
h2 {
|
||||
border: 0;
|
||||
float: left;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
background: #501016;
|
||||
border-bottom: 1px solid darken(#501016, 10%);
|
||||
@include border-radius(3px 3px 0 0);
|
||||
@include box-shadow(inset 0 0 0 1px darken(#501016, 5%), inset 0 2px 0 lighten(#501016, 5%));
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 5px 0 0;
|
||||
padding: 0;
|
||||
text-shadow: 0 -1px 0 darken($mit-red, 10%);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
ul {
|
||||
@extend .clearfix;
|
||||
margin: 0;
|
||||
|
||||
li {
|
||||
line-height: lh();
|
||||
margin-bottom: 0;
|
||||
float: left;
|
||||
|
||||
a {
|
||||
border: none;
|
||||
color: #fff;
|
||||
display: block;
|
||||
font-style: normal;
|
||||
font-weight: bold;
|
||||
padding: 10px lh() 8px;
|
||||
|
||||
@media screen and (max-width: 1020px) {
|
||||
padding: 10px lh(.7) 8px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: rgba(#fff, .7);
|
||||
background-color: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 900px) {
|
||||
width: 100%;
|
||||
float: none;
|
||||
|
||||
ul {
|
||||
li {
|
||||
display: table-cell;
|
||||
padding: auto;
|
||||
text-align: center;
|
||||
width: 16.6666666667%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.active {
|
||||
background: #F4F4F4;
|
||||
border: 1px solid darken(#501016, 10%);
|
||||
border-bottom: 0;
|
||||
@include border-radius(3px 3px 0 0);
|
||||
@include box-shadow(0 2px 0 #f4f4f4, inset 0 1px 0 #fff);
|
||||
color: #333;
|
||||
text-shadow: 0 1px 0 #fff;
|
||||
}
|
||||
|
||||
&.courseware {
|
||||
li.courseware a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
|
||||
&.book {
|
||||
li.book a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
|
||||
&.info {
|
||||
li.info a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
|
||||
&.discussion {
|
||||
li.discussion a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
|
||||
&.wiki {
|
||||
li.wiki a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
|
||||
&.profile {
|
||||
li.profile a {
|
||||
@extend .active;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,55 +0,0 @@
|
||||
html {
|
||||
margin-top: 0;
|
||||
|
||||
body {
|
||||
background: #f4f4f4; //#f3f1e5
|
||||
color: $dark-gray;
|
||||
font: $body-font-size $body-font-family;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
|
||||
section.main-content {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
background: #fff;
|
||||
border: 1px solid #bbb;
|
||||
border-bottom: 1px solid #bbb;
|
||||
@include box-shadow(0 0 4px #dfdfdf);
|
||||
@include box-sizing(border-box);
|
||||
margin-top: 3px;
|
||||
|
||||
@media print {
|
||||
border-bottom: 0;
|
||||
@include border-radius(none);
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1400px) {
|
||||
@include border-radius(4px);
|
||||
margin-top: lh(.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
div.qtip {
|
||||
div.ui-tooltip-content {
|
||||
background: #000;
|
||||
background: rgba(#000, .8);
|
||||
border: none;
|
||||
color: #fff;
|
||||
font: 12px $body-font-family;
|
||||
margin-right: -20px;
|
||||
margin-top: -30px;
|
||||
}
|
||||
}
|
||||
|
||||
section.outside-app {
|
||||
@extend .main-content;
|
||||
max-width: 600px;
|
||||
padding: lh();
|
||||
|
||||
#{$all-text-inputs} {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,251 +0,0 @@
|
||||
#lean_overlay {
|
||||
background: #000;
|
||||
display: none;
|
||||
height:100%;
|
||||
left: 0px;
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
width:100%;
|
||||
z-index:100;
|
||||
}
|
||||
|
||||
div.leanModal_box {
|
||||
background: #fff;
|
||||
border: none;
|
||||
@include border-radius(3px);
|
||||
@include box-shadow(0 0 6px #000);
|
||||
@include box-sizing(border-box);
|
||||
display: none;
|
||||
padding: lh(2);
|
||||
text-align: left;
|
||||
|
||||
a.modal_close {
|
||||
color: #aaa;
|
||||
display: block;
|
||||
font-style: normal;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
right: 12px;
|
||||
top: 12px;
|
||||
width: 14px;
|
||||
z-index: 2;
|
||||
|
||||
&:hover{
|
||||
color: $mit-red;
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
|
||||
h1 {
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 24px;
|
||||
margin-bottom: lh();
|
||||
margin-top: 0;
|
||||
padding-bottom: lh();
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
&#enroll {
|
||||
max-width: 600px;
|
||||
|
||||
ol {
|
||||
@extend .clearfix;
|
||||
padding-top: lh();
|
||||
|
||||
li {
|
||||
|
||||
&.terms, &.honor-code {
|
||||
float: none;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
div.tip {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
div.tip {
|
||||
background: #333;
|
||||
color: #fff;
|
||||
display: block;
|
||||
font-size: 16px;
|
||||
line-height: lh();
|
||||
margin: 0 0 0 -10px;
|
||||
padding: 10px;
|
||||
position: absolute;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
width: 500px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
form {
|
||||
text-align: left;
|
||||
|
||||
div#register_error, div#login_error, div#pwd_error {
|
||||
$error-color: #333;
|
||||
background-color: $error-color;
|
||||
border: darken($error-color, 20%);
|
||||
color: #fff;
|
||||
font-family: "Open sans";
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
margin: (-(lh())) (-(lh())) lh();
|
||||
padding: lh(.5);
|
||||
text-shadow: 0 1px 0 darken($error-color, 10%);
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
&:empty {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: none;
|
||||
margin-bottom: lh();
|
||||
|
||||
li {
|
||||
margin-bottom: lh(.5);
|
||||
|
||||
&.terms, &.remember {
|
||||
border-top: 1px solid #eee;
|
||||
clear: both;
|
||||
float: none;
|
||||
padding-top: lh();
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&.honor-code {
|
||||
float: none;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
#{$all-text-inputs}, textarea {
|
||||
@include box-sizing(border-box);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
input[type="checkbox"] {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc outside none;
|
||||
margin: lh(.5) 0 lh() lh();
|
||||
|
||||
li {
|
||||
color: #666;
|
||||
float: none;
|
||||
font-size: 14px;
|
||||
list-style: disc outside none;
|
||||
margin-bottom: lh(.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
input[type="button"], input[type="submit"] {
|
||||
@include button($mit-red);
|
||||
font-size: 18px;
|
||||
padding: lh(.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#login {
|
||||
min-width: 400px;
|
||||
|
||||
header {
|
||||
border-bottom: 1px solid #ddd;
|
||||
margin-bottom: lh();
|
||||
padding-bottom: lh();
|
||||
|
||||
h1 {
|
||||
border-bottom: 0;
|
||||
padding-bottom: 0;
|
||||
margin-bottom: lh(.25);
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
li {
|
||||
float: none;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.lost-password {
|
||||
margin-top: lh();
|
||||
text-align: left;
|
||||
|
||||
a {
|
||||
color: #999;
|
||||
|
||||
&:hover {
|
||||
color: #444;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#pwd_reset {
|
||||
p {
|
||||
margin-bottom: lh();
|
||||
}
|
||||
|
||||
input[type="email"] {
|
||||
margin-bottom: lh();
|
||||
}
|
||||
}
|
||||
|
||||
div#apply_name_change,
|
||||
div#change_email,
|
||||
div#unenroll,
|
||||
div#deactivate-account {
|
||||
max-width: 700px;
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
margin-bottom: lh(.5);
|
||||
|
||||
textarea, #{$all-text-inputs} {
|
||||
@include box-sizing(border-box);
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
textarea {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
input[type="submit"] {
|
||||
white-space: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div#feedback_div{
|
||||
form{
|
||||
ol {
|
||||
li {
|
||||
float: none;
|
||||
width: 100%;
|
||||
|
||||
textarea#feedback_message {
|
||||
height: 100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,15 +0,0 @@
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.wrapper, .subpage, section.copyright, section.tos, section.privacy-policy, section.honor-code, header.announcement div, section.index-content, footer {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
div#enroll {
|
||||
form {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
@@ -1,6 +0,0 @@
|
||||
@import "bourbon/bourbon";
|
||||
@import "base/reset", "base/font-face", "base/functions";
|
||||
|
||||
// pages
|
||||
@import "marketing/variables", "marketing/extends", "marketing/base", "marketing/header", "marketing/footer", "marketing/index";
|
||||
@import "layout/leanmodal";
|
||||
@@ -1,44 +0,0 @@
|
||||
body {
|
||||
background-color: #fff;
|
||||
color: #444;
|
||||
font: $body-font-size $body-font-family;
|
||||
|
||||
:focus {
|
||||
outline-color: #ccc;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font: 800 24px $header-font-family;
|
||||
}
|
||||
|
||||
li {
|
||||
margin-bottom: lh();
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $mit-red;
|
||||
font-style: italic;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: darken($mit-red, 10%);
|
||||
}
|
||||
}
|
||||
|
||||
#{$all-text-inputs}, textarea {
|
||||
@include box-shadow(0 -1px 0 #fff);
|
||||
@include linear-gradient(#eee, #fff);
|
||||
border: 1px solid #999;
|
||||
font: $body-font-size $body-font-family;
|
||||
padding: 4px;
|
||||
width: 100%;
|
||||
|
||||
&:focus {
|
||||
border-color: $mit-red;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,94 +0,0 @@
|
||||
.wrapper {
|
||||
@include box-sizing(border-box);
|
||||
margin: 0 auto;
|
||||
max-width: $fg-max-width;
|
||||
// min-width: $fg-min-width;
|
||||
padding: lh();
|
||||
width: flex-grid(12);
|
||||
}
|
||||
|
||||
.subpage {
|
||||
@extend .clearfix;
|
||||
@extend .wrapper;
|
||||
|
||||
> div {
|
||||
padding-left: flex-grid(4) + flex-gutter();
|
||||
|
||||
@media screen and (max-width: 940px) {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: lh();
|
||||
line-height: lh();
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: lh(.5);
|
||||
}
|
||||
|
||||
h2 {
|
||||
font: 18px $header-font-family;
|
||||
color: #000;
|
||||
margin-bottom: lh(.5);
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc outside none;
|
||||
|
||||
li {
|
||||
list-style: disc outside none;
|
||||
line-height: lh();
|
||||
}
|
||||
}
|
||||
|
||||
dl {
|
||||
margin-bottom: lh();
|
||||
|
||||
dd {
|
||||
margin-bottom: lh(.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: ".";
|
||||
display: block;
|
||||
height: 0;
|
||||
clear: both;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
.button {
|
||||
@include border-radius(3px);
|
||||
@include inline-block();
|
||||
@include transition();
|
||||
background-color: $mit-red;
|
||||
border: 1px solid darken($mit-red, 10%);
|
||||
color: #fff;
|
||||
margin: lh() 0 lh(.5);
|
||||
padding: lh(.25) lh(.5);
|
||||
text-decoration: none;
|
||||
font-style: normal;
|
||||
@include box-shadow(inset 0 1px 0 lighten($mit-red, 8%));
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($mit-red, 10%);
|
||||
border-color: darken($mit-red, 20%);
|
||||
}
|
||||
|
||||
span {
|
||||
font-family: Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", "Times New Roman", serif;
|
||||
font-style: italic;
|
||||
}
|
||||
}
|
||||
|
||||
p.ie-warning {
|
||||
display: block !important;
|
||||
line-height: 1.3em;
|
||||
background: yellow;
|
||||
margin-bottom: lh();
|
||||
padding: lh();
|
||||
}
|
||||
@@ -1,101 +0,0 @@
|
||||
footer {
|
||||
@extend .wrapper;
|
||||
@extend .clearfix;
|
||||
padding-top: 0;
|
||||
|
||||
div.footer-wrapper {
|
||||
border-top: 1px solid #e5e5e5;
|
||||
padding: lh() 0;
|
||||
background: url('../images/marketing/mit-logo.png') right center no-repeat;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
background-position: left bottom;
|
||||
padding-bottom: lh(3);
|
||||
}
|
||||
|
||||
a {
|
||||
color: #888;
|
||||
text-decoration: none;
|
||||
@include transition();
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #666;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
@include inline-block();
|
||||
margin-right: lh();
|
||||
}
|
||||
|
||||
ul {
|
||||
@include inline-block();
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-top: lh();
|
||||
}
|
||||
|
||||
li {
|
||||
@include inline-block();
|
||||
margin-bottom: 0;
|
||||
|
||||
&:after {
|
||||
content: ' |';
|
||||
display: inline;
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
&:after {
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
&.social {
|
||||
float: right;
|
||||
margin-right: 60px;
|
||||
position: relative;
|
||||
top: -5px;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
}
|
||||
|
||||
li {
|
||||
float: left;
|
||||
margin-right: lh(.5);
|
||||
|
||||
&:after {
|
||||
content: none;
|
||||
display: none;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
height: 29px;
|
||||
width: 28px;
|
||||
text-indent: -9999px;
|
||||
|
||||
&:hover {
|
||||
opacity: .8;
|
||||
}
|
||||
}
|
||||
|
||||
&.twitter a {
|
||||
background: url('../images/marketing/twitter.png') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
&.facebook a {
|
||||
background: url('../images/marketing/facebook.png') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
&.linkedin a {
|
||||
background: url('../images/marketing/linkedin.png') 0 0 no-repeat;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,169 +0,0 @@
|
||||
header.announcement {
|
||||
@include background-size(cover);
|
||||
background: #333;
|
||||
border-bottom: 1px solid #000;
|
||||
color: #fff;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
&.home {
|
||||
background: #e3e3e3 url("../images/marketing/shot-5-medium.jpg");
|
||||
|
||||
@media screen and (min-width: 1200px) {
|
||||
background: #e3e3e3 url("../images/marketing/shot-5-large.jpg");
|
||||
}
|
||||
|
||||
div {
|
||||
padding: lh(10) lh() lh(3);
|
||||
|
||||
@media screen and (max-width:780px) {
|
||||
padding: lh(2.5) lh() lh(2);
|
||||
}
|
||||
|
||||
//hide login link for homepage
|
||||
nav {
|
||||
h1 {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
a.login {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.course {
|
||||
background: #e3e3e3 url("../images/marketing/course-bg-small.jpg");
|
||||
|
||||
@media screen and (min-width: 1200px) {
|
||||
background: #e3e3e3 url("../images/marketing/course-bg-large.jpg");
|
||||
}
|
||||
|
||||
@media screen and (max-width: 1199px) and (min-width: 700px) {
|
||||
background: #e3e3e3 url("../images/marketing/course-bg-medium.jpg");
|
||||
}
|
||||
|
||||
div {
|
||||
padding: lh(4) lh() lh(2);
|
||||
|
||||
@media screen and (max-width:780px) {
|
||||
padding: lh(2.5) lh() lh(2);
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
div {
|
||||
@extend .wrapper;
|
||||
position: relative;
|
||||
|
||||
nav {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: lh();
|
||||
@include border-radius(0 0 3px 3px);
|
||||
background: #333;
|
||||
background: rgba(#000, .7);
|
||||
padding: lh(.5) lh();
|
||||
|
||||
h1 {
|
||||
@include inline-block();
|
||||
margin-right: lh(.5);
|
||||
|
||||
|
||||
a {
|
||||
font: italic 800 18px $header-font-family;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
a.login {
|
||||
text-decoration: none;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
font-style: normal;
|
||||
font-family: $header-font-family;
|
||||
|
||||
&:hover, &:focus {
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section {
|
||||
@extend .clearfix;
|
||||
background: $mit-red;
|
||||
@include inline-block();
|
||||
margin-left: flex-grid(4) + flex-gutter();
|
||||
padding: lh() lh(1.5);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: "Open Sans";
|
||||
font-size: 30px;
|
||||
font-weight: 800;
|
||||
@include inline-block();
|
||||
line-height: 1.2em;
|
||||
margin: 0 lh() 0 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: "Open Sans";
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
@include inline-block();
|
||||
line-height: 1.2em;
|
||||
}
|
||||
|
||||
&.course {
|
||||
section {
|
||||
float: left;
|
||||
margin-left: 0;
|
||||
margin-right: flex-gutter(8);
|
||||
padding: 0;
|
||||
width: flex-grid(4, 8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
a {
|
||||
@extend .button;
|
||||
background-color: darken($mit-red, 20%);
|
||||
border-color: darken($mit-red, 30%);
|
||||
@include box-shadow(inset 0 1px 0 darken($mit-red, 10%), 0 1px 0 lighten($mit-red, 5%));
|
||||
display: block;
|
||||
padding: lh(.5) lh();
|
||||
text-align: center;
|
||||
|
||||
&:hover {
|
||||
background-color: darken($mit-red, 10%);
|
||||
border-color: darken($mit-red, 20%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
width: flex-grid(4, 8);
|
||||
line-height: lh();
|
||||
float: left;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -1,337 +0,0 @@
|
||||
section.index-content {
|
||||
@extend .wrapper;
|
||||
@extend .clearfix;
|
||||
|
||||
section {
|
||||
@extend .clearfix;
|
||||
float: left;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
width: auto;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 800 24px "Open Sans";
|
||||
margin-bottom: lh();
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: lh();
|
||||
margin-bottom: lh();
|
||||
|
||||
}
|
||||
|
||||
ul {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&.about {
|
||||
@include box-sizing(border-box);
|
||||
border-right: 1px solid #e5e5e5;
|
||||
margin-right: flex-gutter();
|
||||
padding-right: flex-gutter() / 2;
|
||||
width: flex-grid(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: 100%;
|
||||
border-right: 0;
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
section {
|
||||
@extend .clearfix;
|
||||
margin-bottom: lh();
|
||||
|
||||
p {
|
||||
width: flex-grid(4, 8);
|
||||
float: left;
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
float: none;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&:nth-child(odd) {
|
||||
margin-right: flex-gutter(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.intro {
|
||||
section {
|
||||
margin-bottom: 0;
|
||||
|
||||
&.intro-text {
|
||||
margin-right: flex-gutter(8);
|
||||
width: flex-grid(4, 8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-right: 0;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
p {
|
||||
margin-right: 0;
|
||||
width: auto;
|
||||
float: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.intro-video {
|
||||
width: flex-grid(4, 8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
a {
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
span {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.features {
|
||||
border-top: 1px solid #E5E5E5;
|
||||
padding-top: lh();
|
||||
margin-bottom: 0;
|
||||
|
||||
h2 {
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
color: #888;
|
||||
margin-bottom: lh();
|
||||
font-weight: normal;
|
||||
font-size: 14px;
|
||||
|
||||
span {
|
||||
text-transform: none;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
width: auto;
|
||||
clear: both;
|
||||
|
||||
strong {
|
||||
font-family: "Open sans";
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
a {
|
||||
color: $mit-red;
|
||||
text-decoration: none;
|
||||
@include transition();
|
||||
|
||||
&:hover, &:focus {
|
||||
color: darken($mit-red, 15%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
margin-bottom: 0;
|
||||
|
||||
li {
|
||||
line-height: lh();
|
||||
width: flex-grid(4, 8);
|
||||
float: left;
|
||||
margin-bottom: lh(.5);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: auto;
|
||||
float: none;
|
||||
}
|
||||
|
||||
&:nth-child(odd) {
|
||||
margin-right: flex-gutter(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.course, &.staff {
|
||||
width: flex-grid(4);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
h1 {
|
||||
color: #888;
|
||||
font: normal $body-font-size $body-font-family;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1px;
|
||||
margin-bottom: lh();
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font: 800 24px $header-font-family;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font: 400 18px $header-font-family;
|
||||
}
|
||||
|
||||
a {
|
||||
@extend .button;
|
||||
|
||||
span.arrow {
|
||||
color: rgba(#fff, .6);
|
||||
font-style: normal;
|
||||
@include inline-block();
|
||||
padding-left: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: none;
|
||||
|
||||
li {
|
||||
img {
|
||||
float: left;
|
||||
margin-right: lh(.5);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.course {
|
||||
h2 {
|
||||
padding-top: lh(5);
|
||||
background: url('../images/marketing/circuits-bg.jpg') 0 0 no-repeat;
|
||||
@include background-size(contain);
|
||||
|
||||
@media screen and (max-width: 998px) and (min-width: 781px){
|
||||
background: url('../images/marketing/circuits-medium-bg.jpg') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
padding-top: lh(5);
|
||||
background: url('../images/marketing/circuits-bg.jpg') 0 0 no-repeat;
|
||||
}
|
||||
|
||||
@media screen and (min-width: 500px) and (max-width: 781px) {
|
||||
padding-top: lh(8);
|
||||
}
|
||||
}
|
||||
|
||||
div.announcement {
|
||||
p.announcement-button {
|
||||
a {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
margin-bottom: lh();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// index
|
||||
//---------------------------------------- //
|
||||
&.about-course {
|
||||
@include box-sizing(border-box);
|
||||
border-right: 1px solid #e5e5e5;
|
||||
margin-right: flex-gutter();
|
||||
padding-right: flex-gutter() / 2;
|
||||
width: flex-grid(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: auto;
|
||||
border-right: 0;
|
||||
margin-right: 0;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
section {
|
||||
width: flex-grid(4, 8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&.about-info {
|
||||
margin-right: flex-gutter(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&.requirements {
|
||||
clear: both;
|
||||
width: 100%;
|
||||
border-top: 1px solid #E5E5E5;
|
||||
padding-top: lh();
|
||||
margin-bottom: 0;
|
||||
|
||||
p {
|
||||
float: left;
|
||||
width: flex-grid(4, 8);
|
||||
margin-right: flex-gutter(8);
|
||||
|
||||
@media screen and (max-width: 780px) {
|
||||
margin-right: 0;
|
||||
float: none;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&:nth-child(odd) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.cta {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
|
||||
a.enroll {
|
||||
@extend .button;
|
||||
padding: lh(.5) lh(2);
|
||||
@include inline-block();
|
||||
text-align: center;
|
||||
font: 800 18px $header-font-family;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.staff {
|
||||
h1 {
|
||||
margin-top: lh(1);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section.copyright, section.tos, section.privacy-policy, section.honor-code {
|
||||
@extend .subpage;
|
||||
}
|
||||
@@ -1,21 +0,0 @@
|
||||
// Variables
|
||||
//---------------------------------------- //
|
||||
// // grid
|
||||
$fg-column: 60px;
|
||||
$fg-gutter: 25px;
|
||||
$fg-max-columns: 12;
|
||||
$fg-max-width: 1400px;
|
||||
$fg-min-width: 781px;
|
||||
|
||||
$gw-column: 60px;
|
||||
$gw-gutter: 25px;
|
||||
|
||||
$body-font-family: Georgia, serif;
|
||||
$header-font-family: "Open Sans", Helvetica, Arial, sans-serif;
|
||||
|
||||
$body-font-size: 16px;
|
||||
$body-line-height: golden-ratio($body-font-size, 1);
|
||||
|
||||
// Colors
|
||||
$mit-red: #933;
|
||||
$cream: #F6EFD4;
|
||||
@@ -1 +0,0 @@
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
|
||||
<%include file="course_navigation.html" args="active_page='courseware'" />
|
||||
|
||||
<section class="main-content">
|
||||
<section class="container">
|
||||
<section class="outside-app">
|
||||
<h1>There has been an error on the <span class="edx">edX</span> servers</h1>
|
||||
<p>We're sorry, this module is temporarily unavailable. Our staff is working to fix it as soon as possible. Please email us at <a href="mailto:technical@mitx.mit.edu">technical@mitx.mit.edu</a> to report any problems or downtime.</p>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
</%block>
|
||||
|
||||
<%include file="navigation.html" args="active_page=''" />
|
||||
<section class="main-content">
|
||||
<section class="container">
|
||||
<div class="gradebook-wrapper">
|
||||
<section class="gradebook-content">
|
||||
<h1>Gradebook</h1>
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
</%block>
|
||||
|
||||
<%include file="navigation.html" args="active_page=''" />
|
||||
<section class="main-content">
|
||||
<section class="container">
|
||||
<div class="gradebook-wrapper">
|
||||
<section class="gradebook-content">
|
||||
<h1>Gradebook</h1>
|
||||
|
||||
@@ -11,25 +11,23 @@
|
||||
%>
|
||||
|
||||
<section class="container">
|
||||
<section class="course-content">
|
||||
<section class="courseware">
|
||||
<div class="info-wrapper">
|
||||
% if user.is_authenticated():
|
||||
<section class="updates">
|
||||
${get_course_info_section(course, 'updates')}
|
||||
</section>
|
||||
<section aria-label="Handout Navigation" class="handouts">
|
||||
${get_course_info_section(course, 'handouts')}
|
||||
</section>
|
||||
% else:
|
||||
<section class="updates">
|
||||
${get_course_info_section(course, 'guest_updates')}
|
||||
</section>
|
||||
<section aria-label="Handout Navigation" class="handouts">
|
||||
${get_course_info_section(course, 'guest_handouts')}
|
||||
</section>
|
||||
% endif
|
||||
</div>
|
||||
</section>
|
||||
<section class="courseware">
|
||||
<div class="info-wrapper">
|
||||
% if user.is_authenticated():
|
||||
<section class="updates">
|
||||
${get_course_info_section(course, 'updates')}
|
||||
</section>
|
||||
<section aria-label="Handout Navigation" class="handouts">
|
||||
${get_course_info_section(course, 'handouts')}
|
||||
</section>
|
||||
% else:
|
||||
<section class="updates">
|
||||
${get_course_info_section(course, 'guest_updates')}
|
||||
</section>
|
||||
<section aria-label="Handout Navigation" class="handouts">
|
||||
${get_course_info_section(course, 'guest_handouts')}
|
||||
</section>
|
||||
% endif
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
<%inherit file="main.html" />
|
||||
|
||||
<%block name="js_extra">
|
||||
<script>
|
||||
|
||||
$(document).ready(function(){
|
||||
//if(!page) {
|
||||
// cookie_page = $.cookie("book_page");
|
||||
// if(cookie_page) {
|
||||
// goto_page(cookie_page);
|
||||
// }
|
||||
//}
|
||||
|
||||
$(".handouts ol").treeview({collapsed:true, unique:true/*, cookieId: "treeview-book-nav", persist: "cookie"*/});
|
||||
});
|
||||
|
||||
</script>
|
||||
</%block>
|
||||
|
||||
<%block name="title"><title>MITx Home</title></%block>
|
||||
|
||||
<%include file="navigation.html" args="active_page='info'" />
|
||||
|
||||
<section class="main-content">
|
||||
<div class="info-wrapper">
|
||||
<section class="updates">
|
||||
<h2>Welcome to MITx</h2>
|
||||
<hr width="100%">
|
||||
<h3>Courses available:</h3>
|
||||
<ul>
|
||||
% for coursename, info in courseinfo.items():
|
||||
% if info['active']:
|
||||
<li><a href=${ MITX_ROOT_URL }/courseware/${coursename}/>${info['title']} (${coursename})</a></li>
|
||||
% endif
|
||||
% endfor
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,6 +1,5 @@
|
||||
<%inherit file="main.html" />
|
||||
<%include file="navigation.html" args="active_page=''" />
|
||||
<section class="main-content">
|
||||
<script>
|
||||
function name_confirm(id) {
|
||||
postJSON('/accept_name_change',{"id":id},
|
||||
@@ -25,6 +24,7 @@ function name_deny(id) {
|
||||
}
|
||||
</script>
|
||||
|
||||
<section class="container">
|
||||
<div class="gradebook-wrapper">
|
||||
<section class="gradebook-content">
|
||||
<h1>Pending name changes</h1>
|
||||
|
||||
@@ -83,7 +83,6 @@
|
||||
%endif
|
||||
|
||||
<section class="container">
|
||||
<section class="main-content">
|
||||
<div class="wiki-wrapper">
|
||||
<%block name="wiki_panel">
|
||||
<div aria-label="Wiki Navigation" id="wiki_panel">
|
||||
@@ -162,6 +161,4 @@
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</section>
|
||||
</%block>
|
||||
|
||||
@@ -62,7 +62,6 @@ $("#open_close_accordion a").click(function(){
|
||||
<%include file="course_navigation.html" args="active_page='book'" />
|
||||
|
||||
<section class="container">
|
||||
<section class="main-content">
|
||||
<div class="book-wrapper">
|
||||
|
||||
<section aria-label="Textbook Navigation" class="book-sidebar">
|
||||
@@ -105,4 +104,3 @@ $("#open_close_accordion a").click(function(){
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user