Newer
Older
---
---
//----------------------------------------
// Colors.
//----------------------------------------
// branding
$color-brand: #2b3990 !default;
// code boxes
$color-error: #bd2c00 !default;
$color-output: #303030 !default;
$color-source: #6e5494 !default;
// blockquotes
$color-callout: #f4fd9c !default;
$color-challenge: #eec275 !default;
$color-checklist: #dfd2a0 !default;
$color-discussion: #eec275 !default;
$color-keypoints: #7ae78e !default;
$color-objectives: #daee84 !default;
$color-prereq: #9cd6dc !default;
$color-solution: #ded4b9 !default;
$color-testimonial: #fc8dc1 !default;
//----------------------------------------
// Specialized code blocks.
//----------------------------------------
@mixin cdSetup($color) {
color: $color;
border-left: solid 5px $color;
margin: 15px;
border-radius: 4px 0 0 4px;
}
.error { @include cdSetup($color-error); }
.output { @include cdSetup($color-output); }
.source { @include cdSetup($color-source); }
.bash, .language-bash { @include cdSetup($color-source); }
.make, .language-make { @include cdSetup($color-source); }
.matlab, .language-matlab { @include cdSetup($color-source); }
.python, .language-python { @include cdSetup($color-source); }
.r, .language-r { @include cdSetup($color-source); }
.sql, .langauge-sql { @include cdSetup($color-source); }
.error pre,
.output pre,
.source pre,
.bash pre,
border-radius: 0 4px 4px 0;
}
//----------------------------------------
// Specialized blockquote environments for learning objectives, callouts, etc.
//----------------------------------------
$codeblock-padding: 5px !default;
@mixin bkSetup($color, $glyph) {
$gradientcolor1: $color;
$gradientcolor2: scale-color($color, $lightness: 10%);
padding-left: $codeblock-padding;
padding-top: 0;
padding-bottom: 0;
padding-right: 0;
border: 1px solid;
border-color: $color;
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
h2 {
padding-top: $codeblock-padding;
padding-bottom: $codeblock-padding;
font-size: 20px;
background: linear-gradient(to bottom, $gradientcolor1, $gradientcolor2);
border-color: $color;
margin-top: 0px;
margin-left: -$codeblock-padding; // to move back to the left margin of the enclosing blockquote
}
h2:before {
font-family: 'Glyphicons Halflings';
content: $glyph;
float: left;
padding-left: $codeblock-padding;
padding-right: $codeblock-padding;
display: inline-block;
-webkit-font-smoothing: antialiased;
}
}
.callout{ @include bkSetup($color-callout, "\e146"); }
.challenge{ @include bkSetup($color-challenge, "\270f"); }
.checklist{ @include bkSetup($color-checklist, "\e067"); }
.discussion{ @include bkSetup($color-discussion, "\e123"); }
.keypoints{ @include bkSetup($color-keypoints, "\e101"); }
.objectives{ @include bkSetup($color-objectives, "\e085"); }
.prereq{ @include bkSetup($color-prereq, "\e124"); }
.solution{ @include bkSetup($color-solution, "\e105"); }
.testimonial{ @include bkSetup($color-testimonial, "\e143"); }
.callout h3,
.challenge h3,
.checklist h3,
.discussion h3,
.keypoints h3,
.objectives h3,
.prereq h3,
.solution h3,
.testimonial h3 {
font-size: 18px;
}
blockquote p {
margin: 5px;
}
//----------------------------------------
// Override Bootstrap settings.
//----------------------------------------
code {
padding: 2px 5px;
color: #3d90d9;
background-color: #e7e7e7;
//----------------------------------------
// Miscellaneous.
//----------------------------------------
.maintitle {
text-align: center;
}
.footertext {
text-align: center;
}
footer .copyright,
footer .help-links
{
margin-top: 10px;
margin-bottom: 10px;
font-weight: 500;
line-height: 1.1;
}
img.navbar-logo {
height: 40px; // synchronize with height of navbar
padding-top: 5px;
padding-right: 10px;
}
div.branding {
color: $color-brand;
}
ul,
ol {
}
span.fold-unfold {
margin-left: 1em;
opacity: 0.5;
}
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
//----------------------------------------
// Life cycle box
//----------------------------------------
div.life-cycle {
position: -webkit-sticky; /* Safari */
position: sticky;
top: 0;
z-index: 100;
font-size: 1.2em;
text-align: center;
margin-bottom: -1px;
border-radius: 0;
}
.pre-alpha {
color: #a94442;
background: #f2dede;
}
.alpha {
color: #8a6d3b;
background: #fcf8e3;
}
.beta {
color: #31708f;
background: #d9edf7;
}
//----------------------------------------
// keyboard key style, from StackExchange.
//----------------------------------------
display: inline-block;
margin: 0 .1em;
padding: .1em .6em;
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
font-size: 11px;
line-height: 1.4;
color: #242729;
text-shadow: 0 1px 0 #FFF;
background-color: #e1e3e5;
border: 1px solid #adb3b9;
border-radius: 3px;
box-shadow: 0 1px 0 rgba(12,13,14,0.2), 0 0 0 2px #FFF inset;
white-space: nowrap;
font-style: normal;
}