Convert Assets
Assets have been converted as follows: - Change to gulp instead of grunt for build system - Remove bower and manage with npm instead - Change to postcss instead of sass - Change to Pure.css instead of foundation (lighter weight) - Update Icon Font - Initial rework of site styling (layout will be committed with updated style later) - Removed extra js which was not really needed - Built js and css will be in the assets/dist directory This really should have been probably 20 commits with a rebase or something...
This commit is contained in:
parent
c5c8876717
commit
44a02080a0
|
|
@ -1,2 +1,3 @@
|
||||||
/bower_components/*
|
/node_modules/*
|
||||||
/node_modules/*
|
"**/.*"
|
||||||
|
*.map
|
||||||
|
|
|
||||||
|
|
@ -1,58 +0,0 @@
|
||||||
module.exports = function(grunt) {
|
|
||||||
grunt.initConfig({
|
|
||||||
pkg: grunt.file.readJSON('package.json'),
|
|
||||||
|
|
||||||
sass: {
|
|
||||||
options: {
|
|
||||||
includePaths: ['bower_components/foundation/scss']
|
|
||||||
},
|
|
||||||
dist: {
|
|
||||||
options: {
|
|
||||||
outputStyle: 'compact',
|
|
||||||
lineNumbers: true
|
|
||||||
},
|
|
||||||
files: {
|
|
||||||
'css/app.css': 'scss/app.scss'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
concat: {
|
|
||||||
app: {
|
|
||||||
src: ['bower_components/jquery/jquery.min.js', 'bower_components/foundation/js/foundation.min.js', 'js/app.js'],
|
|
||||||
dest: 'js/app-concat.js'
|
|
||||||
},
|
|
||||||
},
|
|
||||||
|
|
||||||
copy: {
|
|
||||||
main: {
|
|
||||||
expand: true,
|
|
||||||
flatten: true,
|
|
||||||
src: ['bower_components/modernizr/modernizr.js', 'bower_components/jquery/jquery.min.map'],
|
|
||||||
dest: 'js/'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
watch: {
|
|
||||||
grunt: { files: ['Gruntfile.js'] },
|
|
||||||
|
|
||||||
sass: {
|
|
||||||
files: 'scss/**/*.scss',
|
|
||||||
tasks: ['sass']
|
|
||||||
},
|
|
||||||
|
|
||||||
concat: {
|
|
||||||
files: 'js/app.js',
|
|
||||||
tasks: ['concat']
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
grunt.loadNpmTasks('grunt-sass');
|
|
||||||
grunt.loadNpmTasks('grunt-contrib-concat');
|
|
||||||
grunt.loadNpmTasks('grunt-contrib-copy');
|
|
||||||
grunt.loadNpmTasks('grunt-contrib-watch');
|
|
||||||
|
|
||||||
grunt.registerTask('build', ['sass', 'concat', 'copy']);
|
|
||||||
grunt.registerTask('default', ['build','watch']);
|
|
||||||
}
|
|
||||||
|
|
@ -1,6 +0,0 @@
|
||||||
{
|
|
||||||
"name": "foundation-libsass-template",
|
|
||||||
"dependencies": {
|
|
||||||
"foundation": "zurb/bower-foundation"
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,25 +0,0 @@
|
||||||
# Require any additional compass plugins here.
|
|
||||||
add_import_path "bower_components/foundation/scss"
|
|
||||||
|
|
||||||
# Set this to the root of your project when deployed:
|
|
||||||
http_path = "/"
|
|
||||||
css_dir = "css"
|
|
||||||
sass_dir = "scss"
|
|
||||||
images_dir = "images"
|
|
||||||
javascripts_dir = "js"
|
|
||||||
|
|
||||||
# You can select your preferred output style here (can be overridden via the command line):
|
|
||||||
output_style = :compact
|
|
||||||
|
|
||||||
# To enable relative paths to assets via compass helper functions. Uncomment:
|
|
||||||
# relative_assets = true
|
|
||||||
|
|
||||||
# To disable debugging comments that display the original location of your selectors. Uncomment:
|
|
||||||
# line_comments = false
|
|
||||||
|
|
||||||
|
|
||||||
# If you prefer the indented syntax, you might want to regenerate this
|
|
||||||
# project again passing --syntax sass, or you can uncomment this:
|
|
||||||
# preferred_syntax = :sass
|
|
||||||
# and then run:
|
|
||||||
# sass-convert -R --from scss --to sass sass scss && rm -rf sass && mv scss sass
|
|
||||||
|
|
@ -0,0 +1,25 @@
|
||||||
|
.icon-fork:before { content: '\e800'; } /* '' */
|
||||||
|
.icon-lightbulb:before { content: '\e801'; } /* '' */
|
||||||
|
.icon-bug:before { content: '\e802'; } /* '' */
|
||||||
|
.icon-leaf:before { content: '\e803'; } /* '' */
|
||||||
|
.icon-database:before { content: '\e804'; } /* '' */
|
||||||
|
.icon-up-open:before { content: '\e805'; } /* '' */
|
||||||
|
.icon-award:before { content: '\e806'; } /* '' */
|
||||||
|
.icon-key:before { content: '\e807'; } /* '' */
|
||||||
|
.icon-megaphone:before { content: '\e808'; } /* '' */
|
||||||
|
.icon-linkedin:before { content: '\e809'; } /* '' */
|
||||||
|
.icon-github:before { content: '\e80a'; } /* '' */
|
||||||
|
.icon-gamepad:before { content: '\e80b'; } /* '' */
|
||||||
|
.icon-plug:before { content: '\e80c'; } /* '' */
|
||||||
|
.icon-terminal:before { content: '\e80d'; } /* '' */
|
||||||
|
.icon-beaker:before { content: '\e80e'; } /* '' */
|
||||||
|
.icon-gauge:before { content: '\e80f'; } /* '' */
|
||||||
|
.icon-suitcase:before { content: '\e810'; } /* '' */
|
||||||
|
.icon-music:before { content: '\e811'; } /* '' */
|
||||||
|
.icon-videocam:before { content: '\e812'; } /* '' */
|
||||||
|
.icon-camera:before { content: '\e813'; } /* '' */
|
||||||
|
.icon-book:before { content: '\e814'; } /* '' */
|
||||||
|
.icon-tasks:before { content: '\e815'; } /* '' */
|
||||||
|
.icon-chart-bar:before { content: '\e816'; } /* '' */
|
||||||
|
.icon-bookmark:before { content: '\e817'; } /* '' */
|
||||||
|
.icon-tag:before { content: '\e818'; } /* '' */
|
||||||
|
|
@ -0,0 +1,130 @@
|
||||||
|
/*
|
||||||
|
* PostCss Icon Fonts
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Main File icons.css
|
||||||
|
* Version: 0.5
|
||||||
|
* Created By: Andrew Senetar
|
||||||
|
* Date: August, 7 2013
|
||||||
|
* Used: Font Awesome Styles, Foundation Icon Fonts Scss as Starting; animation from Fontello
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Defaults
|
||||||
|
*/
|
||||||
|
:root {
|
||||||
|
--set: voltaicideas;
|
||||||
|
|
||||||
|
/* Colors (from Font Awesome) */
|
||||||
|
--iconBorderColor: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "var(--set)";
|
||||||
|
src: url("../fonts/var(--set)");
|
||||||
|
src: url("../fonts/var(--set).eot#iefix") format('embedded-opentype'),
|
||||||
|
url("../fonts/var(--set).woff") format('woff'),
|
||||||
|
url("../fonts/var(--set).ttf") format('truetype'),
|
||||||
|
url("../fonts/var(--set).svg#fontello") format('svg');
|
||||||
|
font-weight: normal;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* global icon styles (from Foundation Icons + Font Awesome)
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* Icon font Styles */
|
||||||
|
[class*='icon-'] {
|
||||||
|
background-image: none;
|
||||||
|
background-position: 0% 0%;
|
||||||
|
background-repeat: repeat;
|
||||||
|
display: inline;
|
||||||
|
height: auto;
|
||||||
|
width: auto;
|
||||||
|
vertical-align: baseline;
|
||||||
|
line-height: 1;
|
||||||
|
margin-top: 0;
|
||||||
|
speak: none;
|
||||||
|
font-family: "var(--set)";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
font-variant: normal;
|
||||||
|
text-transform: none;
|
||||||
|
text-decoration: inherit;
|
||||||
|
font-smoothing: antialiased;
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*='icon-']:before {
|
||||||
|
text-decoration: inherit;
|
||||||
|
display: inline-block;
|
||||||
|
speak: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Icon borders (from Font Awesome) */
|
||||||
|
|
||||||
|
[class*="border icon-"] {
|
||||||
|
border: solid 1px var(--iconBorderColor);
|
||||||
|
padding: .2em .25em .15em;
|
||||||
|
border-radius: 3px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Icon sizes (from Font Awesome) */
|
||||||
|
|
||||||
|
[class*="large icon-"]:before {
|
||||||
|
vertical-align: -10%;
|
||||||
|
font-size: 1.333em;
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*="huge icon-"]:before {
|
||||||
|
vertical-align: -17%;
|
||||||
|
font-size: 1.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*="2x icon-"] {
|
||||||
|
font-size: 2em;
|
||||||
|
& .border {
|
||||||
|
border-width: 2px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*="3x icon-"] {
|
||||||
|
font-size: 3em;
|
||||||
|
& .border {
|
||||||
|
border-width: 3px;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*="4x icon-"] {
|
||||||
|
font-size: 4em;
|
||||||
|
& .border {
|
||||||
|
border-width: 4px;
|
||||||
|
border-radius: 6px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[class*="5x icon-"] {
|
||||||
|
font-size: 5em;
|
||||||
|
& .border {
|
||||||
|
border-width: 5px;
|
||||||
|
border-radius: 7px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Fixes
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* makes sure icons active on rollover in links (from Font Awesome) */
|
||||||
|
|
||||||
|
a [class*="icon-"]:before {
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Actual Icons
|
||||||
|
*/
|
||||||
|
@import "_icon_codes";
|
||||||
|
|
@ -0,0 +1,36 @@
|
||||||
|
.highlight{
|
||||||
|
font-size: 14px;
|
||||||
|
padding: 0;
|
||||||
|
font-family: 'Source Code Pro', 'Consolas', Monaco, monospace;
|
||||||
|
overflow: auto;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
pre{
|
||||||
|
tab-size: 4;
|
||||||
|
white-space: pre;
|
||||||
|
font-family: inherit;
|
||||||
|
background-color: var(--secondaryColor);
|
||||||
|
border-radius: var(--globalRadius);
|
||||||
|
padding: 3px;
|
||||||
|
padding-left: 5px;
|
||||||
|
line-height: 23px;
|
||||||
|
overflow-x: auto;
|
||||||
|
word-break: inherit;
|
||||||
|
margin: 0;
|
||||||
|
|
||||||
|
code {
|
||||||
|
border: none;
|
||||||
|
background: none;
|
||||||
|
|
||||||
|
&.language-text {
|
||||||
|
color: color(var(--secondaryColor) contrast(75%));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
code {
|
||||||
|
background: var(--secondaryColor);
|
||||||
|
color: color(var(--secondaryColor) contrast(75%));
|
||||||
|
padding: 3px 7px;
|
||||||
|
border-radius: var(--globalRadius);
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
/*
* Generated on: 6/9/2015 from Pygments
*/
.highlight {
.hll { background-color: #ffffcc }
.c { color: #60a0b0; font-style: italic } /* Comment */
.err { border: 1px solid #FF0000 } /* Error */
.k { color: #007020; font-weight: bold } /* Keyword */
.o { color: #666666 } /* Operator */
.cm { color: #60a0b0; font-style: italic } /* Comment.Multiline */
.cp { color: #007020 } /* Comment.Preproc */
.c1 { color: #60a0b0; font-style: italic } /* Comment.Single */
.cs { color: #60a0b0; background-color: #fff0f0 } /* Comment.Special */
.gd { color: #A00000 } /* Generic.Deleted */
.ge { font-style: italic } /* Generic.Emph */
.gr { color: #FF0000 } /* Generic.Error */
.gh { color: #000080; font-weight: bold } /* Generic.Heading */
.gi { color: #00A000 } /* Generic.Inserted */
.go { color: #888888 } /* Generic.Output */
.gp { color: #c65d09; font-weight: bold } /* Generic.Prompt */
.gs { font-weight: bold } /* Generic.Strong */
.gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.gt { color: #0044DD } /* Generic.Traceback */
.kc { color: #007020; font-weight: bold } /* Keyword.Constant */
.kd { color: #007020; font-weight: bold } /* Keyword.Declaration */
.kn { color: #007020; font-weight: bold } /* Keyword.Namespace */
.kp { color: #007020 } /* Keyword.Pseudo */
.kr { color: #007020; font-weight: bold } /* Keyword.Reserved */
.kt { color: #902000 } /* Keyword.Type */
.m { color: #40a070 } /* Literal.Number */
.s { color: #4070a0 } /* Literal.String */
.na { color: #4070a0 } /* Name.Attribute */
.nb { color: #007020 } /* Name.Builtin */
.nc { color: #0e84b5; font-weight: bold } /* Name.Class */
.no { color: #60add5 } /* Name.Constant */
.nd { color: #555555; font-weight: bold } /* Name.Decorator */
.ni { color: #d55537; font-weight: bold } /* Name.Entity */
.ne { color: #007020 } /* Name.Exception */
.nf { color: #06287e } /* Name.Function */
.nl { color: #002070; font-weight: bold } /* Name.Label */
.nn { color: #0e84b5; font-weight: bold } /* Name.Namespace */
.nt { color: #062873; font-weight: bold } /* Name.Tag */
.nv { color: #bb60d5 } /* Name.Variable */
.ow { color: #007020; font-weight: bold } /* Operator.Word */
.w { color: #bbbbbb } /* Text.Whitespace */
.mb { color: #40a070 } /* Literal.Number.Bin */
.mf { color: #40a070 } /* Literal.Number.Float */
.mh { color: #40a070 } /* Literal.Number.Hex */
.mi { color: #40a070 } /* Literal.Number.Integer */
.mo { color: #40a070 } /* Literal.Number.Oct */
.sb { color: #4070a0 } /* Literal.String.Backtick */
.sc { color: #4070a0 } /* Literal.String.Char */
.sd { color: #4070a0; font-style: italic } /* Literal.String.Doc */
.s2 { color: #4070a0 } /* Literal.String.Double */
.se { color: #4070a0; font-weight: bold } /* Literal.String.Escape */
.sh { color: #4070a0 } /* Literal.String.Heredoc */
.si { color: #70a0d0; font-style: italic } /* Literal.String.Interpol */
.sx { color: #c65d09 } /* Literal.String.Other */
.sr { color: #235388 } /* Literal.String.Regex */
.s1 { color: #4070a0 } /* Literal.String.Single */
.ss { color: #517918 } /* Literal.String.Symbol */
.bp { color: #007020 } /* Name.Builtin.Pseudo */
.vc { color: #bb60d5 } /* Name.Variable.Class */
.vg { color: #bb60d5 } /* Name.Variable.Global */
.vi { color: #bb60d5 } /* Name.Variable.Instance */
.il { color: #40a070 } /* Literal.Number.Integer.Long */
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
/*
|
||||||
|
* Settings for Stylesheets
|
||||||
|
*/
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--primaryColor: #9b160d;
|
||||||
|
--secondaryColor: #e7e7e7;
|
||||||
|
--globalBgColor: #ffffff;
|
||||||
|
--globalRadius: 3px;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,255 @@
|
||||||
|
/*
|
||||||
|
* Layout modified from the Pure.css Responsive Side Menu Example
|
||||||
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Variables
|
||||||
|
*/
|
||||||
|
:root {
|
||||||
|
--menuWidth: 220px;
|
||||||
|
--menuSelectedColor: var(--primaryColor);
|
||||||
|
--menuBgColor: var(--secondaryColor);
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Add transition to containers so they can push in and out.
|
||||||
|
*/
|
||||||
|
#layout,
|
||||||
|
#menu,
|
||||||
|
.menu-link {
|
||||||
|
transition: all 0.2s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* This is the parent `<div>` that contains the menu and the content area.
|
||||||
|
*/
|
||||||
|
#layout {
|
||||||
|
position: relative;
|
||||||
|
padding-left: 0;
|
||||||
|
|
||||||
|
&.active {
|
||||||
|
#menu {
|
||||||
|
left: var(--menuWidth);
|
||||||
|
width: var(--menuWidth);
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-link {
|
||||||
|
left: var(--menuWidth);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
* Main area of the page containing the header, content, and footer.
|
||||||
|
*/
|
||||||
|
#main {
|
||||||
|
background-color: var(--globalBgColor);
|
||||||
|
|
||||||
|
/* Main Header of the page with title and subtitle */
|
||||||
|
#mainHeader {
|
||||||
|
margin: 0;
|
||||||
|
color: color(var(--globalBgColor) contrast(60%));
|
||||||
|
text-align: center;
|
||||||
|
padding: 2.5em 2em 0;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
margin: 0.2em 0;
|
||||||
|
font-size: 3em;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2, h3 {
|
||||||
|
font-weight: 300;
|
||||||
|
color: color(var(--globalBgColor) contrast(0%) l(+30%));
|
||||||
|
padding: 0;
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Main content area of the page */
|
||||||
|
#mainContent {
|
||||||
|
position: relative;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding: 0 2em;
|
||||||
|
max-width: 800px;
|
||||||
|
margin-bottom: 50px;
|
||||||
|
line-height: 1.6em;
|
||||||
|
|
||||||
|
.content-subhead {
|
||||||
|
margin: 50px 0 20px 0;
|
||||||
|
font-weight: 300;
|
||||||
|
color: color(var(--globalBgColor) contrast(0%));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
The `#menu` `<div>` is the parent `<div>` that contains the `.pure-menu` that
|
||||||
|
appears on the left side of the page.
|
||||||
|
*/
|
||||||
|
|
||||||
|
#menu {
|
||||||
|
margin-left: -var(--menuWidth); /* "#menu" width */
|
||||||
|
width: var(--menuWidth);
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 1000; /* so the menu or its navicon stays above all content */
|
||||||
|
background: var(--menuBgColor);
|
||||||
|
overflow-y: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
/*
|
||||||
|
* All anchors inside the menu should be styled like this.
|
||||||
|
*/
|
||||||
|
a {
|
||||||
|
color: color(var(--menuBgColor) contrast(40%));
|
||||||
|
border: none;
|
||||||
|
padding: 0.6em 0 0.6em 0.6em;
|
||||||
|
}
|
||||||
|
|
||||||
|
/*
|
||||||
|
*Remove all background/borders, since we are applying them to #menu.
|
||||||
|
*/
|
||||||
|
.pure-menu {
|
||||||
|
/* Header item */
|
||||||
|
.pure-menu-heading {
|
||||||
|
background: var(--menuSelectedColor);
|
||||||
|
font-size: 110%;
|
||||||
|
color: color(var(--menuSelectedColor) contrast(100%));
|
||||||
|
margin: 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul {
|
||||||
|
border: none;
|
||||||
|
background: transparent;
|
||||||
|
border-top: 1px solid #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
/* Hover and focus background */
|
||||||
|
a:hover, a:focus {
|
||||||
|
background: color(var(--menuBgColor) l(+5%));
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Border to divide groups */
|
||||||
|
.menu-item-divided {
|
||||||
|
border-top: 1px solid #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Selected item */
|
||||||
|
.pure-menu-selected {
|
||||||
|
background: var(--menuSelectedColor);
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: color(var(--menuSelectedColor) contrast(75%) s(0%));
|
||||||
|
|
||||||
|
&:hover, &:focus {
|
||||||
|
background-color: color(var(--menuSelectedColor) l(+5%));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* -- Dynamic Button For Responsive Menu -------------------------------------*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
The button to open/close the Menu is custom-made and not part of Pure. Here's
|
||||||
|
how it works:
|
||||||
|
*/
|
||||||
|
|
||||||
|
/*
|
||||||
|
`.menu-link` represents the responsive menu toggle that shows/hides on
|
||||||
|
small screens.
|
||||||
|
*/
|
||||||
|
.menu-link {
|
||||||
|
position: fixed;
|
||||||
|
display: block; /* show this only on small screens */
|
||||||
|
top: 0;
|
||||||
|
left: 0; /* "#menu width" */
|
||||||
|
background: color(var(--globalBgColor) contrast(100%));
|
||||||
|
background: color(var(--globalBgColor)B3 contrast(100%));
|
||||||
|
font-size: 10px; /* change this value to increase/decrease button size */
|
||||||
|
z-index: 10;
|
||||||
|
width: 2em;
|
||||||
|
height: auto;
|
||||||
|
padding: 2.1em 1.6em;
|
||||||
|
|
||||||
|
&:hover, &:focus {
|
||||||
|
background: color(var(--globalBgColor) contrast(100%));
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
span, span:before, span:after {
|
||||||
|
background-color: color(var(--globalBgColor) s(0%));
|
||||||
|
width: 100%;
|
||||||
|
height: 0.2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
span:before, span:after {
|
||||||
|
position: absolute;
|
||||||
|
margin-top: -0.6em;
|
||||||
|
content: " ";
|
||||||
|
}
|
||||||
|
|
||||||
|
span:after {
|
||||||
|
margin-top: 0.6em;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* -- Responsive Styles (Media Queries) ------------------------------------- */
|
||||||
|
|
||||||
|
/*
|
||||||
|
Hides the menu at `48em`, but modify this based on your app's needs.
|
||||||
|
*/
|
||||||
|
@media (min-width: 48em) {
|
||||||
|
|
||||||
|
.header,
|
||||||
|
.content {
|
||||||
|
padding-left: 2em;
|
||||||
|
padding-right: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#layout {
|
||||||
|
padding-left: var(--menuWidth); /* left col width "#menu" */
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
#menu {
|
||||||
|
left: var(--menuWidth);
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-link {
|
||||||
|
position: fixed;
|
||||||
|
left: var(--menuWidth);
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#layout.active .menu-link {
|
||||||
|
left: var(--menuWidth);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 48em) {
|
||||||
|
/* Only apply this when the window is small. Otherwise, the following
|
||||||
|
case results in extra padding on the left:
|
||||||
|
* Make the window small.
|
||||||
|
* Tap the menu to trigger the active state.
|
||||||
|
* Make the window large again.
|
||||||
|
*/
|
||||||
|
#layout.active {
|
||||||
|
position: relative;
|
||||||
|
left: 0; /* var(--menuWidth); */
|
||||||
|
}
|
||||||
|
}
|
||||||
5422
assets/css/app.css
5422
assets/css/app.css
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
|
@ -1,23 +1,36 @@
|
||||||
<?xml version="1.0" standalone="no"?>
|
<?xml version="1.0" standalone="no"?>
|
||||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
<svg xmlns="http://www.w3.org/2000/svg">
|
<svg xmlns="http://www.w3.org/2000/svg">
|
||||||
<metadata>Copyright (C) 2014 by original authors @ fontello.com</metadata>
|
<metadata>Copyright (C) 2015 by original authors @ fontello.com</metadata>
|
||||||
<defs>
|
<defs>
|
||||||
<font id="voltaicideas" horiz-adv-x="1000" >
|
<font id="fontello" horiz-adv-x="1000" >
|
||||||
<font-face font-family="voltaicideas" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
|
||||||
<missing-glyph horiz-adv-x="1000" />
|
<missing-glyph horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="bookmark" unicode="" d="m650 779q12 0 24-5q19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4q-27 0-47 18l-246 236l-246-236q-20-19-46-19q-13 0-25 5q-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
|
<glyph glyph-name="fork" unicode="" d="m161 29q0 22-16 38t-38 15-38-15-15-38 15-38 38-16 38 16 16 38z m0 642q0 23-16 38t-38 16-38-16-15-38 15-38 38-15 38 15 16 38z m357-71q0 22-16 38t-38 16-38-16-15-38 15-38 38-16 38 16 16 38z m53 0q0-29-14-54t-39-39q-1-160-126-231-38-21-114-45-71-22-94-39t-23-56v-15q24-14 39-39t14-53q0-45-31-76t-76-32-76 32-31 76q0 29 15 53t39 39v458q-25 14-39 39t-15 53q0 45 31 76t76 32 76-32 31-76q0-29-14-53t-39-39v-278q30 15 86 32 30 10 49 17t39 17 33 22 22 29 16 38 5 51q-25 14-39 39t-15 54q0 45 31 76t76 31 76-31 31-76z" horiz-adv-x="571.4" />
|
||||||
<glyph glyph-name="youtube" unicode="" d="m542 156v-118q0-37-22-37q-13 0-25 12v168q12 12 25 12q22 0 22-37z m188-1v-25h-50v25q0 38 25 38t25-38z m-539 122h60v52h-174v-52h59v-318h55v318z m161-318h50v276h-50v-211q-17-23-32-23q-10 0-11 11q-1 2-1 20v203h-50v-218q0-28 5-41q7-21 32-21q27 0 57 34v-30z m240 83v110q0 41-5 55q-10 31-40 31q-28 0-52-30v121h-50v-370h50v27q25-31 52-31q30 0 40 31q5 15 5 56z m188 6v7h-51q0-29-1-34q-4-20-22-20q-26 0-26 38v49h100v57q0 44-15 65q-22 28-59 28q-38 0-60-28q-15-21-15-65v-96q0-44 16-65q22-29 60-29q40 0 60 30q10 15 12 30q1 5 1 33z m-339 509v117q0 39-24 39t-24-39v-117q0-39 24-39t24 39z m401-419q0-131-14-195q-8-33-33-56t-57-25q-102-12-309-12t-310 12q-32 3-57 25t-32 56q-15 62-15 195q0 131 15 195q7 33 32 56t57 26q103 11 310 11t309-11q33-4 57-26t33-56q14-62 14-195z m-557 712h57l-67-223v-151h-56v151q-8 42-34 119q-21 57-37 104h60l39-147z m207-186v-97q0-46-16-66q-21-29-59-29q-38 0-59 29q-15 21-15 66v97q0 45 15 65q21 29 59 29q38 0 59-29q16-20 16-65z m187 91v-279h-51v31q-30-35-58-35q-25 0-33 21q-4 13-4 42v220h51v-205q0-19 0-20q2-12 12-12q15 0 32 24v213h51z" horiz-adv-x="857.1" />
|
<glyph glyph-name="lightbulb" unicode="" d="m411 529q0-8-6-13t-12-5-13 5-5 13q0 25-30 39t-59 14q-8 0-13 5t-5 13 5 13 13 5q28 0 55-9t49-30 21-50z m89 0q0 40-19 74t-50 57-69 35-76 12-76-12-69-35-50-57-20-74q0-57 38-101 6-6 17-18t17-19q72-85 79-166h127q8 81 79 166 6 6 17 19t17 18q38 44 38 101z m71 0q0-87-57-150-25-27-42-49t-33-53-19-60q26-15 26-46 0-20-14-35 14-15 14-36 0-29-25-45 8-13 8-26 0-26-18-40t-43-14q-11-25-34-39t-48-15-49 15-33 39q-26 0-44 14t-17 40q0 13 7 26-25 16-25 45 0 21 14 36-14 15-14 35 0 31 26 46-2 28-19 60t-33 53-41 49q-58 63-58 150 0 55 25 103t65 79 92 49 104 19 104-19 91-49 66-79 24-103z" horiz-adv-x="571.4" />
|
||||||
<glyph glyph-name="code" unicode="" d="m344 69l-28-28q-5-5-12-5t-13 5l-260 260q-6 6-6 13t6 13l260 260q5 6 13 6t12-6l28-28q6-5 6-13t-6-12l-219-220l219-219q6-6 6-13t-6-13z m330 596l-208-721q-2-7-9-11t-13-1l-34 9q-8 3-11 9t-2 14l208 720q3 8 9 11t13 2l35-10q7-2 11-9t1-13z m367-364l-260-260q-6-5-13-5t-13 5l-28 28q-5 6-5 13t5 13l219 219l-219 220q-5 5-5 12t5 13l28 28q6 6 13 6t13-6l260-260q5-5 5-13t-5-13z" horiz-adv-x="1071.4" />
|
<glyph glyph-name="bug" unicode="" d="m911 314q0-14-11-25t-25-10h-125q0-96-37-162l116-117q10-11 10-25t-10-25q-10-11-25-11t-26 11l-110 110q-3-3-8-7t-24-16-36-21-46-16-54-7v500h-71v-500q-29 0-57 7t-49 19-36 22-25 18l-8 8-102-116q-11-12-27-12-13 0-24 9-11 10-11 25t8 26l113 127q-32 63-32 153h-125q-15 0-25 10t-11 25 11 25 25 11h125v164l-97 97q-11 10-11 25t11 25 25 10 25-10l97-97h471l96 97q11 10 25 10t26-10 10-25-10-25l-97-97v-164h125q15 0 25-11t11-25z m-268 322h-357q0 74 52 126t126 52 127-52 52-126z" horiz-adv-x="928.6" />
|
||||||
<glyph glyph-name="up-big" unicode="" d="m899 308q0-28-21-50l-42-42q-21-21-50-21q-30 0-51 21l-164 164v-393q0-29-20-47t-51-19h-71q-30 0-51 19t-21 47v393l-164-164q-20-21-50-21t-50 21l-42 42q-21 21-21 50q0 30 21 51l363 363q20 21 50 21q30 0 51-21l363-363q21-22 21-51z" horiz-adv-x="928.6" />
|
<glyph glyph-name="leaf" unicode="" d="m714 457q0 15-10 25t-25 11q-96 0-178-28t-145-75-131-122q-11-12-11-25 0-15 11-25t25-11q13 0 25 11 15 13 41 39t38 37q76 69 150 98t175 29q14 0 25 11t10 25z m286 111q0-53-11-108-26-125-103-214t-200-149q-119-61-244-61-83 0-160 27-8 2-49 23t-53 21q-9 0-22-18t-25-39-30-39-33-18q-17 0-29 6t-17 13-15 24q-1 2-3 6t-3 6-2 5-1 7q0 20 17 41t38 37 38 31 18 27q0 2-8 21t-9 25q-5 28-5 58 0 64 24 123t66 103 96 77 113 53q31 10 81 15t100 5 100 3 91 13 64 32l16 16t17 16 15 11 20 9 24 3q22 0 40-26t26-63 14-69 4-53z" horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="bitbucket" unicode="" d="m455 371q4-35-28-57t-63-3q-21 9-29 32t-1 46t29 32q20 10 41 7t35-20t16-37z m62 11q-8 60-63 92t-110 7q-35-15-56-49t-20-72q3-51 44-87t92-31q51 4 85 47t28 93z m133 303q-11 15-31 25t-32 12t-40 7q-162 26-316-1q-24-4-37-7t-30-12t-28-24q16-16 42-26t41-12t49-6q127-17 250-1q35 5 50 7t40 12t42 26z m32-578q-5-14-9-42t-8-47t-15-39t-33-32q-48-27-106-40t-112-12t-113 10q-25 5-45 10t-43 15t-41 25t-29 34q-14 54-31 163l3 9l10 5q124-83 283-83t283 83q12-3 13-13t-3-25t-4-21z m101 537q-15-94-62-366q-3-17-15-31t-24-23t-31-17q-140-70-340-49q-139 15-220 78q-8 6-14 14t-10 20t-5 19t-3 22t-3 19q-5 28-15 84t-16 90t-13 83t-12 88q2 14 10 27t17 21t26 17t25 12t27 10q70 26 175 36q211 21 377-28q86-25 120-68q9-11 9-28t-3-30z" horiz-adv-x="785.7" />
|
<glyph glyph-name="database" unicode="" d="m429 421q132 0 247 24t181 71v-95q0-38-57-71t-157-52-214-20-215 20-156 52-58 71v95q66-47 181-71t248-24z m0-428q132 0 247 24t181 71v-95q0-39-57-72t-157-52-214-19-215 19-156 52-58 72v95q66-47 181-71t248-24z m0 214q132 0 247 24t181 71v-95q0-38-57-71t-157-52-214-20-215 20-156 52-58 71v95q66-47 181-71t248-24z m0 643q116 0 214-19t157-52 57-72v-71q0-39-57-72t-157-52-214-19-215 19-156 52-58 72v71q0 39 58 72t156 52 215 19z" horiz-adv-x="857.1" />
|
||||||
<glyph glyph-name="css3" unicode="" d="m153 779h840l-148-744l-449-149l-389 149l39 198h166l-16-82l235-89l272 89l38 190h-675l33 165h674l22 107h-674z" horiz-adv-x="1000" />
|
<glyph glyph-name="up-open" unicode="" d="m939 107l-92-92q-11-10-26-10t-25 10l-296 297-296-297q-11-10-25-10t-26 10l-92 92q-11 11-11 26t11 25l414 414q11 10 25 10t25-10l414-414q11-11 11-25t-11-26z" horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="bookmark-empty" unicode="" d="m643 707h-572v-693l237 227l49 47l50-47l236-227v693z m7 72q12 0 24-5q19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4q-27 0-47 18l-246 236l-246-236q-20-19-46-19q-13 0-25 5q-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
|
<glyph glyph-name="award" unicode="" d="m256 357q-42 91-42 207h-143v-53q0-44 53-91t132-63z m601 154v53h-143q0-116-41-207 79 16 131 63t53 91z m72 71v-71q0-40-24-80t-62-73-97-54-120-25q-23-30-53-53-21-19-29-40t-8-50q0-30 17-51t54-21q42 0 75-25t32-64v-36q0-8-5-13t-13-5h-464q-8 0-13 5t-5 13v36q0 39 33 64t74 25q38 0 55 21t17 51q0 28-8 50t-30 40q-29 23-53 53-63 3-120 25t-96 54-63 73-23 80v71q0 22 16 38t38 16h160v53q0 37 27 63t63 27h321q37 0 63-27t26-63v-53h161q22 0 38-16t16-38z" horiz-adv-x="928.6" />
|
||||||
<glyph glyph-name="gplus" unicode="" d="m489 33q0 11-3 22t-5 20t-10 19t-11 17t-15 17t-16 14t-17 14t-18 13t-18 13t-17 12q-10 1-28 1q-30 0-59-4t-60-14t-55-26t-39-41t-15-60q0-38 20-68t52-47t67-25t71-9q33 0 63 7t56 22t42 41t15 62z m-67 481q0 33-9 71t-27 72t-46 59t-67 22q-52 0-80-38t-29-92q0-26 7-55t19-58t32-53t43-37t54-15q54 0 79 34t24 90z m-73 265h244l-76-45h-75q40-25 61-70t22-94q0-41-13-74t-31-51t-37-36t-31-34t-13-38q0-14 9-28t24-27t33-27t36-31t32-37t24-47t10-60q0-89-79-157q-84-73-234-73q-33 0-67 6t-68 18t-60 33t-43 49t-17 68q0 34 21 75q18 36 53 62t81 40t87 20t83 7q-35 47-35 83q0 7 1 14t3 10t4 12t4 12q-22-2-39-2q-83 0-143 54t-59 138q0 78 53 139t130 79q53 11 105 11z m580-143v-72h-143v-143h-72v143h-143v72h143v143h72v-143h143z" horiz-adv-x="928.6" />
|
<glyph glyph-name="key" unicode="" d="m464 564q0 45-31 76t-76 31-76-31-31-76q0-23 11-46-23 11-47 11-44 0-76-32t-31-76 31-75 76-32 76 32 31 75q0 24-10 47 23-11 46-11 45 0 76 31t31 76z m475-393q0-9-27-36t-37-28q-5 0-16 9t-20 19-22 22-13 14l-54-53 123-123q15-15 15-38 0-23-21-45t-46-22q-22 0-38 16l-374 374q-98-73-204-73-91 0-148 57t-57 149q0 89 53 174t138 139 175 53q91 0 148-58t57-148q0-105-73-203l198-199 54 54q-2 2-15 14t-22 21-18 21-9 15q0 10 27 37t37 28q7 0 13-6 3-3 26-25t45-44 49-48 40-44 16-23z" horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="html5" unicode="" d="m631 517l9 98h-494l26-298h342l-12-128l-110-29l-110 29l-7 78h-98l13-155l202-55h2v0l200 55l28 304h-359l-9 101h377z m-631 262h786l-72-803l-322-90l-321 90z" horiz-adv-x="785.7" />
|
<glyph glyph-name="megaphone" unicode="" d="m929 493q29 0 50-21t21-51-21-50-50-21v-214q0-29-22-50t-50-22q-233 194-453 212-32-10-51-36t-17-57 22-51q-11-19-13-37t4-32 18-31 27-28 35-28q-17-32-63-46t-94-7-73 31q-4 13-17 49t-18 53-12 50-9 56 2 55 12 62h-68q-36 0-63 26t-26 63v107q0 37 26 63t63 26h268q243 0 500 215 29 0 50-22t22-50v-214z m-72-337v532q-220-168-428-191v-151q210-23 428-190z" horiz-adv-x="1000" />
|
||||||
<glyph glyph-name="linkedin" unicode="" d="m195 501v-553h-184v553h184z m12 171q0-41-29-68t-75-27h-1q-46 0-74 27t-28 68q0 41 29 68t75 27t74-27t29-68z m650-407v-317h-183v296q0 59-23 92t-71 33q-35 0-58-19t-36-48q-6-17-6-45v-309h-184q1 223 1 361t0 165l-1 27h184v-80h-1q11 18 23 31t31 29t49 24t64 9q95 0 153-63t58-186z" horiz-adv-x="857.1" />
|
<glyph glyph-name="linkedin" unicode="" d="m195 501v-553h-184v553h184z m12 171q0-41-29-68t-75-27h-1q-46 0-74 27t-28 68q0 41 29 68t75 27 74-27 29-68z m650-407v-317h-183v296q0 59-23 92t-71 33q-35 0-58-19t-36-48q-6-17-6-45v-309h-184q1 223 1 361t0 165l-1 27h184v-80h-1q11 18 23 31t31 29 49 24 64 9q95 0 153-63t58-186z" horiz-adv-x="857.1" />
|
||||||
<glyph glyph-name="twitter" unicode="" d="m904 622q-37-54-90-93q0-8 0-23q0-73-21-145t-64-139t-103-117t-144-82t-181-30q-151 0-276 81q19-3 43-3q126 0 224 77q-59 2-105 36t-64 89q19-2 34-2q24 0 48 6q-63 13-104 62t-41 115v2q38-21 82-23q-37 25-59 64t-22 86q0 49 25 91q68-83 164-133t208-55q-5 21-5 41q0 75 53 127t127 53q79 0 132-57q61 12 114 44q-20-64-79-100q52 6 104 28z" horiz-adv-x="928.6" />
|
<glyph glyph-name="github" unicode="" d="m357 171q0-22-7-45t-24-43-40-19-41 19-24 43-7 45 7 46 24 43 41 19 40-19 24-43 7-46z m357 0q0-22-7-45t-24-43-40-19-41 19-24 43-7 45 7 46 24 43 41 19 40-19 24-43 7-46z m90 0q0 67-39 114t-104 47q-23 0-109-12-40-6-88-6t-87 6q-85 12-109 12-66 0-104-47t-39-114q0-49 18-85t45-58 68-33 78-17 83-4h94q46 0 83 4t78 17 69 33 45 58 18 85z m125 99q0-116-34-185-22-43-59-74t-79-48-95-27-96-12-93-3q-43 0-79 2t-82 7-85 17-77 28-67 46-48 64q-35 69-35 185 0 132 76 221-15 45-15 94 0 65 28 122 61 0 106-22t106-69q82 20 172 20 83 0 156-18 59 46 105 67t105 22q29-57 29-122 0-48-15-93 76-90 76-222z" horiz-adv-x="928.6" />
|
||||||
<glyph glyph-name="github" unicode="" d="m357 171q0-22-7-45t-24-43t-40-19t-41 19t-24 43t-7 45t7 46t24 43t41 19t40-19t24-43t7-46z m357 0q0-22-7-45t-24-43t-40-19t-41 19t-24 43t-7 45t7 46t24 43t41 19t40-19t24-43t7-46z m90 0q0 67-39 114t-104 47q-23 0-109-12q-40-6-88-6t-87 6q-85 12-109 12q-66 0-104-47t-39-114q0-49 18-85t45-58t68-33t78-17t83-4h94q46 0 83 4t78 17t69 33t45 58t18 85z m125 99q0-116-34-185q-22-43-59-74t-79-48t-95-27t-96-12t-93-3q-43 0-79 2t-82 7t-85 17t-77 28t-67 46t-48 64q-35 69-35 185q0 132 76 221q-15 45-15 94q0 65 28 122q61 0 106-22t106-69q82 20 172 20q83 0 156-18q59 46 105 67t105 22q29-57 29-122q0-48-15-93q76-90 76-222z" horiz-adv-x="928.6" />
|
<glyph glyph-name="gamepad" unicode="" d="m464 243v71q0 8-5 13t-13 5h-107v107q0 8-5 13t-13 5h-71q-8 0-13-5t-5-13v-107h-107q-8 0-13-5t-5-13v-71q0-8 5-13t13-5h107v-107q0-8 5-13t13-5h71q8 0 13 5t5 13v107h107q8 0 13 5t5 13z m322-36q0 30-21 51t-51 21-50-21-21-51 21-50 50-21 51 21 21 50z m143 143q0 30-21 51t-51 20-50-20-21-51 21-50 50-21 51 21 21 50z m142-71q0-119-83-202t-202-84q-107 0-189 71h-123q-81-71-188-71-119 0-202 84t-84 202 84 202 202 83h500q118 0 202-83t83-202z" horiz-adv-x="1071.4" />
|
||||||
|
<glyph glyph-name="plug" unicode="" d="m979 597q21-20 21-50t-21-51l-223-223 83-84-89-89q-91-91-217-104t-230 56l-202-202h-101v101l202 202q-69 103-56 230t104 217l89 89 84-83 223 223q21 21 51 21t50-21 21-50-21-51l-223-224 131-130 223 223q22 21 51 21t50-21z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="terminal" unicode="" d="m326 301l-260-260q-5-5-12-5t-13 5l-28 28q-6 6-6 13t6 13l219 219-219 220q-6 5-6 12t6 13l28 28q5 6 13 6t12-6l260-260q6-5 6-13t-6-13z m603-255v-35q0-8-5-13t-13-5h-536q-8 0-13 5t-5 13v35q0 8 5 13t13 5h536q8 0 13-5t5-13z" horiz-adv-x="928.6" />
|
||||||
|
<glyph glyph-name="beaker" unicode="" d="m852 42q31-50 12-85t-78-36h-643q-59 0-79 36t12 85l281 442v223h-36q-14 0-25 11t-10 25 10 25 25 11h286q15 0 25-11t11-25-11-25-25-11h-36v-223z m-435 405l-151-240h397l-152 240-11 17v243h-71v-243z" horiz-adv-x="928.6" />
|
||||||
|
<glyph glyph-name="gauge" unicode="" d="m214 207q0 30-21 51t-50 21-51-21-21-51 21-50 51-21 50 21 21 50z m107 250q0 30-20 51t-51 21-50-21-21-51 21-50 50-21 51 21 20 50z m239-268l57 213q3 14-5 27t-21 16-27-3-17-22l-56-213q-33-3-60-25t-35-55q-11-43 11-81t66-50 81 11 50 66q9 33-4 65t-40 51z m369 18q0 30-21 51t-51 21-50-21-21-51 21-50 50-21 51 21 21 50z m-358 357q0 30-20 51t-51 21-50-21-21-51 21-50 50-21 51 21 20 50z m250-107q0 30-20 51t-51 21-50-21-21-51 21-50 50-21 51 21 20 50z m179-250q0-145-79-269-10-17-30-17h-782q-20 0-30 17-79 123-79 269 0 102 40 194t106 160 160 107 194 39 194-39 160-107 106-160 40-194z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="suitcase" unicode="" d="m357 636h286v71h-286v-71z m-196 0v-715h-36q-51 0-88 37t-37 88v465q0 51 37 88t88 37h36z m625 0v-715h-572v715h72v89q0 22 15 38t38 16h322q22 0 38-16t15-38v-89h72z m214-125v-465q0-51-37-88t-88-37h-36v715h36q51 0 88-37t37-88z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="music" unicode="" d="m857 725v-625q0-28-19-50t-48-33-58-18-53-6-54 6-58 18-48 33-19 50 19 50 48 33 58 18 54 6q58 0 107-22v300l-429-132v-396q0-28-19-50t-48-33-58-18-53-6-54 6-58 18-48 33-19 50 19 50 48 34 58 17 54 6q58 0 107-21v539q0 17 10 32t28 19l464 143q7 3 16 3 22 0 38-16t15-38z" horiz-adv-x="857.1" />
|
||||||
|
<glyph glyph-name="videocam" unicode="" d="m1000 654v-608q0-23-22-32-7-3-14-3-15 0-25 10l-225 225v-92q0-67-47-114t-113-47h-393q-67 0-114 47t-47 114v392q0 67 47 114t114 47h393q66 0 113-47t47-114v-92l225 225q10 10 25 10 7 0 14-3 22-9 22-32z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="camera" unicode="" d="m536 475q66 0 113-47t47-114-47-113-113-47-114 47-47 113 47 114 114 47z m393 232q59 0 101-42t41-101v-500q0-59-41-101t-101-42h-786q-59 0-101 42t-42 101v500q0 59 42 101t101 42h125l28 76q11 27 39 47t58 20h286q29 0 57-20t39-47l29-76h125z m-393-643q103 0 176 74t74 176-74 177-176 73-177-73-73-177 73-176 177-74z" horiz-adv-x="1071.4" />
|
||||||
|
<glyph glyph-name="book" unicode="" d="m915 583q22-32 10-72l-154-505q-10-36-42-60t-69-25h-515q-43 0-83 30t-55 74q-14 37-1 71 0 2 1 15t3 20q0 5-2 12t-2 11q1 6 5 12t9 13 9 13q13 21 25 51t17 51q2 6 0 17t0 16q2 6 9 15t10 13q12 20 23 51t14 51q1 5-1 17t0 16q2 7 12 17t13 13q10 14 23 47t16 54q0 4-2 14t-1 15q1 4 5 10t10 13 10 11q4 7 9 17t8 20 9 20 11 18 15 13 20 6 26-3l0-1q21 5 28 5h425q41 0 63-32t10-72l-152-506q-20-66-40-85t-72-20h-485q-15 0-21-8-6-9-1-24 14-39 81-39h515q16 0 31 9t19 23l168 550q4 13 3 32 21-8 33-24z m-594-1q-2-7 1-12t11-6h339q8 0 15 6t9 12l12 36q2 7-2 12t-11 6h-339q-7 0-14-6t-9-12z m-46-143q-3-7 1-12t11-6h339q7 0 14 6t10 12l11 36q3 7-1 13t-11 5h-339q-8 0-14-5t-10-13z" horiz-adv-x="928.6" />
|
||||||
|
<glyph glyph-name="tasks" unicode="" d="m571 64h358v72h-358v-72z m-214 286h572v71h-572v-71z m357 286h215v71h-215v-71z m286-465v-142q0-15-11-25t-25-11h-928q-15 0-25 11t-11 25v142q0 15 11 26t25 10h928q15 0 25-10t11-26z m0 286v-143q0-14-11-25t-25-10h-928q-15 0-25 10t-11 25v143q0 15 11 25t25 11h928q15 0 25-11t11-25z m0 286v-143q0-15-11-25t-25-11h-928q-15 0-25 11t-11 25v143q0 14 11 25t25 11h928q15 0 25-11t11-25z" horiz-adv-x="1000" />
|
||||||
|
<glyph glyph-name="chart-bar" unicode="" d="m357 350v-286h-143v286h143z m214 286v-572h-142v572h142z m572-643v-72h-1143v858h71v-786h1072z m-357 500v-429h-143v429h143z m214 214v-643h-143v643h143z" horiz-adv-x="1142.9" />
|
||||||
|
<glyph glyph-name="bookmark" unicode="" d="m650 779q12 0 24-5 19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4-27 0-47 18l-246 236-246-236q-20-19-46-19-13 0-25 5-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
|
||||||
|
<glyph glyph-name="tag" unicode="" d="m250 600q0 30-21 51t-50 20-51-20-21-51 21-50 51-21 50 21 21 50z m595-321q0-30-20-51l-274-274q-22-21-51-21-30 0-50 21l-399 399q-21 21-36 57t-15 65v232q0 29 21 50t50 22h233q29 0 65-15t57-36l399-399q20-21 20-50z" horiz-adv-x="857.1" />
|
||||||
</font>
|
</font>
|
||||||
</defs>
|
</defs>
|
||||||
</svg>
|
</svg>
|
||||||
|
Before Width: | Height: | Size: 6.1 KiB After Width: | Height: | Size: 11 KiB |
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,65 @@
|
||||||
|
// Requires
|
||||||
|
var gulp = require('gulp');
|
||||||
|
var del = require('del');
|
||||||
|
var runSequence = require('run-sequence');
|
||||||
|
var postcss = require('gulp-postcss');
|
||||||
|
var processors = [
|
||||||
|
require('postcss-import'),
|
||||||
|
require('postcss-mixins'),
|
||||||
|
require('postcss-nested'),
|
||||||
|
function(css) { /* Function to change some .pure classes to base elements */
|
||||||
|
css.eachRule(function (rule){
|
||||||
|
rule.selector = rule.selector.replace(/\.pure-table(\s+|-striped|$)/g,'table ');
|
||||||
|
rule.selector = rule.selector.replace(/\.pure-img/,'img');
|
||||||
|
});
|
||||||
|
},
|
||||||
|
require('cssnext')({
|
||||||
|
browsers: ['last 1 version', '> 5%'],
|
||||||
|
import: false,
|
||||||
|
compress: true
|
||||||
|
}),
|
||||||
|
require('csswring')({
|
||||||
|
removeAllComments: true
|
||||||
|
})
|
||||||
|
];
|
||||||
|
|
||||||
|
var sourcemaps = require('gulp-sourcemaps');
|
||||||
|
var concat = require('gulp-concat');
|
||||||
|
var uglify = require('gulp-uglify');
|
||||||
|
|
||||||
|
// Configuration
|
||||||
|
var config = {
|
||||||
|
'cssDir': 'css',
|
||||||
|
'jsDir': 'js',
|
||||||
|
'distDir': 'dist'
|
||||||
|
};
|
||||||
|
|
||||||
|
gulp.task('default', function(callback) {
|
||||||
|
return runSequence('clean',
|
||||||
|
['css', 'js'],
|
||||||
|
callback);
|
||||||
|
});
|
||||||
|
|
||||||
|
gulp.task('clean', function() {
|
||||||
|
del([config.distDir+'/**/*']);
|
||||||
|
});
|
||||||
|
|
||||||
|
gulp.task('css', function() {
|
||||||
|
return gulp.src([config.cssDir+'/app.css'])
|
||||||
|
.pipe(sourcemaps.init())
|
||||||
|
.pipe(postcss(processors))
|
||||||
|
.on('error', function (error) {
|
||||||
|
console.log(error);
|
||||||
|
})
|
||||||
|
.pipe(sourcemaps.write('./'))
|
||||||
|
.pipe(gulp.dest(config.distDir));
|
||||||
|
});
|
||||||
|
|
||||||
|
gulp.task('js', function() {
|
||||||
|
return gulp.src([config.jsDir+'/*.js'])
|
||||||
|
.pipe(concat('app.js'))
|
||||||
|
.pipe(sourcemaps.init())
|
||||||
|
.pipe(uglify({mangle: false}))
|
||||||
|
.pipe(sourcemaps.write('./'))
|
||||||
|
.pipe(gulp.dest(config.distDir));
|
||||||
|
});
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1 +1,38 @@
|
||||||
$(document).foundation();
|
/* TODO */
|
||||||
|
|
||||||
|
/* Menu Code */
|
||||||
|
(function (window, document) {
|
||||||
|
|
||||||
|
var layout = document.getElementById('layout'),
|
||||||
|
menu = document.getElementById('menu'),
|
||||||
|
menuLink = document.getElementById('menuLink');
|
||||||
|
|
||||||
|
function toggleClass(element, className) {
|
||||||
|
var classes = element.className.split(/\s+/),
|
||||||
|
length = classes.length,
|
||||||
|
i = 0;
|
||||||
|
|
||||||
|
for(; i < length; i++) {
|
||||||
|
if (classes[i] === className) {
|
||||||
|
classes.splice(i, 1);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// The className is not found
|
||||||
|
if (length === classes.length) {
|
||||||
|
classes.push(className);
|
||||||
|
}
|
||||||
|
|
||||||
|
element.className = classes.join(' ');
|
||||||
|
}
|
||||||
|
|
||||||
|
menuLink.onclick = function (e) {
|
||||||
|
var active = 'active';
|
||||||
|
|
||||||
|
e.preventDefault();
|
||||||
|
toggleClass(layout, active);
|
||||||
|
toggleClass(menu, active);
|
||||||
|
toggleClass(menuLink, active);
|
||||||
|
};
|
||||||
|
|
||||||
|
}(this, this.document));
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
|
|
@ -1,10 +1,26 @@
|
||||||
{
|
{
|
||||||
"name": "foundation-libsass-template",
|
"name": "arsenetar.github.io",
|
||||||
"version": "0.0.1",
|
"version": "0.0.2",
|
||||||
|
"description": "Assets for the blog arsenetar.github.io (blog.voltaicideas.net).",
|
||||||
|
"author": "Andrew Senetar <arsenetar@gmail.com>",
|
||||||
|
"repository": {
|
||||||
|
"type": "git",
|
||||||
|
"url": "https://github.com/arsenetar/arsenetar.github.io"
|
||||||
|
},
|
||||||
|
"private": "true",
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"node-sass": "~0.7.0",
|
"cssnext": "^1.6.0",
|
||||||
"grunt": "~0.4.1",
|
"csswring": "^3.0.5",
|
||||||
"grunt-contrib-watch": "~0.5.3",
|
"del": "^1.2.0",
|
||||||
"grunt-sass": "~0.8.0"
|
"gulp": "^3.8.11",
|
||||||
|
"gulp-concat": "^2.5.2",
|
||||||
|
"gulp-postcss": "^5.1.8",
|
||||||
|
"gulp-sourcemaps": "^1.5.2",
|
||||||
|
"gulp-uglify": "^1.2.0",
|
||||||
|
"postcss-import": "^5.2.2",
|
||||||
|
"postcss-mixins": "^0.3.0",
|
||||||
|
"postcss-nested": "^0.3.2",
|
||||||
|
"purecss": "^0.6.0",
|
||||||
|
"run-sequence": "^1.1.0"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,995 +0,0 @@
|
||||||
//
|
|
||||||
// FOUNDATION SETTINGS
|
|
||||||
//
|
|
||||||
|
|
||||||
// Uncomment to use rem-calc() in your settings
|
|
||||||
@import "foundation/functions";
|
|
||||||
|
|
||||||
// $experimental: true;
|
|
||||||
|
|
||||||
// The default font-size is set to 100% of the browser style sheet (usually 16px)
|
|
||||||
// for compatibility with brower-based text zoom or user-set defaults.
|
|
||||||
|
|
||||||
// Since the typical default browser font-size is 16px, that makes the calculation for grid size.
|
|
||||||
// If you want your base font-size to be different and not have it affect the grid breakpoints,
|
|
||||||
// set $rem-base to $base-font-size and make sure $base-font-size is a px value.
|
|
||||||
// $base-font-size: 100%;
|
|
||||||
|
|
||||||
// The $base-line-height is 100% while $base-font-size is 150%
|
|
||||||
// $base-line-height: 150%;
|
|
||||||
|
|
||||||
// This is the default html and body font-size for the base rem value.
|
|
||||||
// $rem-base: 16px;
|
|
||||||
|
|
||||||
// We use this to control whether or not CSS classes come through in the gem files.
|
|
||||||
// $include-html-classes: true;
|
|
||||||
// $include-print-styles: true;
|
|
||||||
// $include-html-global-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// Grid
|
|
||||||
|
|
||||||
// $include-html-grid-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// $row-width: rem-calc(1000);
|
|
||||||
// $column-gutter: rem-calc(30);
|
|
||||||
// $total-columns: 12;
|
|
||||||
|
|
||||||
// We use these to control various global styles
|
|
||||||
// $body-bg: #fff;
|
|
||||||
// $body-font-color: #222;
|
|
||||||
// $body-font-family: "Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
|
|
||||||
// $body-font-weight: normal;
|
|
||||||
// $body-font-style: normal;
|
|
||||||
|
|
||||||
// We use this to control font-smoothing
|
|
||||||
// $font-smoothing: antialiased;
|
|
||||||
|
|
||||||
// We use these to control text direction settings
|
|
||||||
// $text-direction: ltr;
|
|
||||||
// $opposite-direction: right;
|
|
||||||
// $default-float: left;
|
|
||||||
|
|
||||||
// We use these as default colors throughout
|
|
||||||
$primary-color: #9b160d;
|
|
||||||
$secondary-color: #e7e7e7;
|
|
||||||
// $alert-color: #f04124;
|
|
||||||
// $success-color: #43AC6A;
|
|
||||||
// $warning-color: #f08a24;
|
|
||||||
// $info-color: #a0d3e8;
|
|
||||||
|
|
||||||
// We use these to make sure border radius matches unless we want it different.
|
|
||||||
// $global-radius: 3px;
|
|
||||||
// $global-rounded: 1000px;
|
|
||||||
|
|
||||||
// We use these to control inset shadow shiny edges and depressions.
|
|
||||||
// $shiny-edge-size: 0 1px 0;
|
|
||||||
// $shiny-edge-color: rgba(#fff, .5);
|
|
||||||
// $shiny-edge-active-color: rgba(#000, .2);
|
|
||||||
|
|
||||||
// Media Query Ranges
|
|
||||||
// $small-range: (0em, 40em);
|
|
||||||
// $medium-range: (40.063em, 64em);
|
|
||||||
// $large-range: (64.063em, 90em);
|
|
||||||
// $xlarge-range: (90.063em, 120em);
|
|
||||||
// $xxlarge-range: (120.063em);
|
|
||||||
|
|
||||||
// $screen: "only screen";
|
|
||||||
|
|
||||||
// $landscape: "#{$screen} and (orientation: landscape)";
|
|
||||||
// $portrait: "#{$screen} and (orientation: portrait)";
|
|
||||||
|
|
||||||
// $small-up: $screen;
|
|
||||||
// $small-only: "#{$screen} and (max-width: #{upper-bound($small-range)})";
|
|
||||||
|
|
||||||
// $medium-up: "#{$screen} and (min-width:#{lower-bound($medium-range)})";
|
|
||||||
// $medium-only: "#{$screen} and (min-width:#{lower-bound($medium-range)}) and (max-width:#{upper-bound($medium-range)})";
|
|
||||||
|
|
||||||
// $large-up: "#{$screen} and (min-width:#{lower-bound($large-range)})";
|
|
||||||
// $large-only: "#{$screen} and (min-width:#{lower-bound($large-range)}) and (max-width:#{upper-bound($large-range)})";
|
|
||||||
|
|
||||||
// $xlarge-up: "#{$screen} and (min-width:#{lower-bound($xlarge-range)})";
|
|
||||||
// $xlarge-only: "#{$screen} and (min-width:#{lower-bound($xlarge-range)}) and (max-width:#{upper-bound($xlarge-range)})";
|
|
||||||
|
|
||||||
// $xxlarge-up: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)})";
|
|
||||||
// $xxlarge-only: "#{$screen} and (min-width:#{lower-bound($xxlarge-range)}) and (max-width:#{upper-bound($xxlarge-range)})";
|
|
||||||
|
|
||||||
// Legacy
|
|
||||||
// $small: $medium-up;
|
|
||||||
// $medium: $medium-up;
|
|
||||||
// $large: $large-up;
|
|
||||||
|
|
||||||
//We use this as cursors values for enabling the option of having custom cursors in the whole site's stylesheet
|
|
||||||
// $cursor-crosshair-value: crosshair;
|
|
||||||
// $cursor-default-value: default;
|
|
||||||
// $cursor-pointer-value: pointer;
|
|
||||||
// $cursor-help-value: help;
|
|
||||||
// $cursor-text-value: text;
|
|
||||||
|
|
||||||
// Accordion
|
|
||||||
|
|
||||||
// $include-html-accordion-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// $accordion-navigation-padding: rem-calc(16);
|
|
||||||
// $accordion-navigation-bg-color: #efefef ;
|
|
||||||
// $accordion-navigation-hover-bg-color: darken($accordion-navigation-bg-color, 5%);
|
|
||||||
// $accordion-navigation-active-bg-color: darken($accordion-navigation-bg-color, 3%);
|
|
||||||
// $accordion-navigation-font-color: #222;
|
|
||||||
// $accordion-navigation-font-size: rem-calc(16);
|
|
||||||
// $accordion-navigation-font-family: $body-font-family;
|
|
||||||
|
|
||||||
// $accordion-content-padding: $column-gutter/2;
|
|
||||||
// $accordion-content-active-bg-color: #fff;
|
|
||||||
|
|
||||||
// Alert Boxes
|
|
||||||
|
|
||||||
// $include-html-alert-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to control alert padding.
|
|
||||||
// $alert-padding-top: rem-calc(14);
|
|
||||||
// $alert-padding-default-float: $alert-padding-top;
|
|
||||||
// $alert-padding-opposite-direction: $alert-padding-top + rem-calc(10);
|
|
||||||
// $alert-padding-bottom: $alert-padding-top;
|
|
||||||
|
|
||||||
// We use these to control text style.
|
|
||||||
// $alert-font-weight: normal;
|
|
||||||
// $alert-font-size: rem-calc(13);
|
|
||||||
// $alert-font-color: #fff;
|
|
||||||
// $alert-font-color-alt: darken($secondary-color, 60%);
|
|
||||||
|
|
||||||
// We use this for close hover effect.
|
|
||||||
// $alert-function-factor: 5%;
|
|
||||||
|
|
||||||
// We use these to control border styles.
|
|
||||||
// $alert-border-style: solid;
|
|
||||||
// $alert-border-width: 1px;
|
|
||||||
// $alert-border-color: darken($primary-color, $alert-function-factor);
|
|
||||||
// $alert-bottom-margin: rem-calc(20);
|
|
||||||
|
|
||||||
// We use these to style the close buttons
|
|
||||||
// $alert-close-color: #333;
|
|
||||||
// $alert-close-top: 50%;
|
|
||||||
// $alert-close-position: rem-calc(5);
|
|
||||||
// $alert-close-font-size: rem-calc(22);
|
|
||||||
// $alert-close-opacity: 0.3;
|
|
||||||
// $alert-close-opacity-hover: 0.5;
|
|
||||||
// $alert-close-padding: 9px 6px 4px;
|
|
||||||
|
|
||||||
// We use this to control border radius
|
|
||||||
// $alert-radius: $global-radius;
|
|
||||||
|
|
||||||
// Block Grid
|
|
||||||
|
|
||||||
// $include-html-grid-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to control the maximum number of block grid elements per row
|
|
||||||
// $block-grid-elements: 12;
|
|
||||||
// $block-grid-default-spacing: rem-calc(20);
|
|
||||||
|
|
||||||
// Enables media queries for block-grid classes. Set to false if writing semantic HTML.
|
|
||||||
// $block-grid-media-queries: true;
|
|
||||||
|
|
||||||
// Breadcrumbs
|
|
||||||
|
|
||||||
// $include-html-nav-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to set the background color for the breadcrumb container.
|
|
||||||
// $crumb-bg: lighten($secondary-color, 5%);
|
|
||||||
|
|
||||||
// We use these to set the padding around the breadcrumbs.
|
|
||||||
// $crumb-padding: rem-calc(9 14 9);
|
|
||||||
// $crumb-side-padding: rem-calc(12);
|
|
||||||
|
|
||||||
// We use these to control border styles.
|
|
||||||
// $crumb-function-factor: 10%;
|
|
||||||
// $crumb-border-size: 1px;
|
|
||||||
// $crumb-border-style: solid;
|
|
||||||
// $crumb-border-color: darken($crumb-bg, $crumb-function-factor);
|
|
||||||
// $crumb-radius: $global-radius;
|
|
||||||
|
|
||||||
// We use these to set various text styles for breadcrumbs.
|
|
||||||
// $crumb-font-size: rem-calc(11);
|
|
||||||
// $crumb-font-color: $primary-color;
|
|
||||||
// $crumb-font-color-current: #333;
|
|
||||||
// $crumb-font-color-unavailable: #999;
|
|
||||||
// $crumb-font-transform: uppercase;
|
|
||||||
// $crumb-link-decor: underline;
|
|
||||||
|
|
||||||
// We use these to control the slash between breadcrumbs
|
|
||||||
// $crumb-slash-color: #aaa;
|
|
||||||
// $crumb-slash: "/";
|
|
||||||
|
|
||||||
// Button Groups
|
|
||||||
|
|
||||||
// $include-html-button-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// Sets the margin for the right side by default, and the left margin if right-to-left direction is used
|
|
||||||
// $button-bar-margin-opposite: rem-calc(10);
|
|
||||||
// $button-group-border-width: 1px;
|
|
||||||
|
|
||||||
// Clearing
|
|
||||||
|
|
||||||
// $include-html-clearing-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to set the background colors for parts of Clearing.
|
|
||||||
// $clearing-bg: #333;
|
|
||||||
// $clearing-caption-bg: $clearing-bg;
|
|
||||||
// $clearing-carousel-bg: rgba (51,51,51,0.8);
|
|
||||||
// $clearing-img-bg: $clearing-bg;
|
|
||||||
|
|
||||||
// We use these to style the close button
|
|
||||||
// $clearing-close-color: #ccc;
|
|
||||||
// $clearing-close-size: 30px;
|
|
||||||
|
|
||||||
// We use these to style the arrows
|
|
||||||
// $clearing-arrow-size: 12px;
|
|
||||||
// $clearing-arrow-color: $clearing-close-color;
|
|
||||||
|
|
||||||
// We use these to style captions
|
|
||||||
// $clearing-caption-font-color: #ccc;
|
|
||||||
// $clearing-caption-font-size: 0.875em;
|
|
||||||
// $clearing-caption-padding: 10px 30px 20px;
|
|
||||||
|
|
||||||
// We use these to make the image and carousel height and style
|
|
||||||
// $clearing-active-img-height: 85%;
|
|
||||||
// $clearing-carousel-height: 120px;
|
|
||||||
// $clearing-carousel-thumb-width: 120px;
|
|
||||||
// $clearing-carousel-thumb-active-border: 1px solid rgb(255,255,255);
|
|
||||||
|
|
||||||
// Dropdown
|
|
||||||
|
|
||||||
// $include-html-button-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to controls height and width styles.
|
|
||||||
// $f-dropdown-max-width: 200px;
|
|
||||||
// $f-dropdown-height: auto;
|
|
||||||
// $f-dropdown-max-height: none;
|
|
||||||
// $f-dropdown-margin-top: 2px;
|
|
||||||
|
|
||||||
// We use this to control the background color
|
|
||||||
// $f-dropdown-bg: #fff;
|
|
||||||
|
|
||||||
// We use this to set the border styles for dropdowns.
|
|
||||||
// $f-dropdown-border-style: solid;
|
|
||||||
// $f-dropdown-border-width: 1px;
|
|
||||||
// $f-dropdown-border-color: darken(#fff, 20%);
|
|
||||||
|
|
||||||
// We use these to style the triangle pip.
|
|
||||||
// $f-dropdown-triangle-size: 6px;
|
|
||||||
// $f-dropdown-triangle-color: #fff;
|
|
||||||
// $f-dropdown-triangle-side-offset: 10px;
|
|
||||||
|
|
||||||
// We use these to control styles for the list elements.
|
|
||||||
// $f-dropdown-list-style: none;
|
|
||||||
// $f-dropdown-font-color: #555;
|
|
||||||
// $f-dropdown-font-size: rem-calc(14);
|
|
||||||
// $f-dropdown-list-padding: rem-calc(5, 10);
|
|
||||||
// $f-dropdown-line-height: rem-calc(18);
|
|
||||||
// $f-dropdown-list-hover-bg: #eeeeee ;
|
|
||||||
// $dropdown-mobile-default-float: 0;
|
|
||||||
|
|
||||||
// We use this to control the styles for when the dropdown has custom content.
|
|
||||||
// $f-dropdown-content-padding: rem-calc(20);
|
|
||||||
|
|
||||||
// Dropdown Buttons
|
|
||||||
|
|
||||||
// $include-html-button-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to set the color of the pip in dropdown buttons
|
|
||||||
// $dropdown-button-pip-color: #fff;
|
|
||||||
// $dropdown-button-pip-color-alt: #333;
|
|
||||||
|
|
||||||
// $button-pip-tny: rem-calc(6);
|
|
||||||
// $button-pip-sml: rem-calc(7);
|
|
||||||
// $button-pip-med: rem-calc(9);
|
|
||||||
// $button-pip-lrg: rem-calc(11);
|
|
||||||
|
|
||||||
// We use these to style tiny dropdown buttons
|
|
||||||
// $dropdown-button-padding-tny: $button-pip-tny * 7;
|
|
||||||
// $dropdown-button-pip-size-tny: $button-pip-tny;
|
|
||||||
// $dropdown-button-pip-opposite-tny: $button-pip-tny * 3;
|
|
||||||
// $dropdown-button-pip-top-tny: -$button-pip-tny / 2 + rem-calc(1);
|
|
||||||
|
|
||||||
// We use these to style small dropdown buttons
|
|
||||||
// $dropdown-button-padding-sml: $button-pip-sml * 7;
|
|
||||||
// $dropdown-button-pip-size-sml: $button-pip-sml;
|
|
||||||
// $dropdown-button-pip-opposite-sml: $button-pip-sml * 3;
|
|
||||||
// $dropdown-button-pip-top-sml: -$button-pip-sml / 2 + rem-calc(1);
|
|
||||||
|
|
||||||
// We use these to style medium dropdown buttons
|
|
||||||
// $dropdown-button-padding-med: $button-pip-med * 6 + rem-calc(3);
|
|
||||||
// $dropdown-button-pip-size-med: $button-pip-med - rem-calc(3);
|
|
||||||
// $dropdown-button-pip-opposite-med: $button-pip-med * 2.5;
|
|
||||||
// $dropdown-button-pip-top-med: -$button-pip-med / 2 + rem-calc(2);
|
|
||||||
|
|
||||||
// We use these to style large dropdown buttons
|
|
||||||
// $dropdown-button-padding-lrg: $button-pip-lrg * 5 + rem-calc(3);
|
|
||||||
// $dropdown-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);
|
|
||||||
// $dropdown-button-pip-opposite-lrg: $button-pip-lrg * 2.5;
|
|
||||||
// $dropdown-button-pip-top-lrg: -$button-pip-lrg / 2 + rem-calc(3);
|
|
||||||
|
|
||||||
// Flex Video
|
|
||||||
|
|
||||||
// $include-html-media-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control video container padding and margins
|
|
||||||
// $flex-video-padding-top: rem-calc(25);
|
|
||||||
// $flex-video-padding-bottom: 67.5%;
|
|
||||||
// $flex-video-margin-bottom: rem-calc(16);
|
|
||||||
|
|
||||||
// We use this to control widescreen bottom padding
|
|
||||||
// $flex-video-widescreen-padding-bottom: 57.25%;
|
|
||||||
|
|
||||||
// Forms
|
|
||||||
|
|
||||||
// $include-html-form-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to set the base for lots of form spacing and positioning styles
|
|
||||||
// $form-spacing: rem-calc(16);
|
|
||||||
|
|
||||||
// We use these to style the labels in different ways
|
|
||||||
// $form-label-pointer: pointer;
|
|
||||||
// $form-label-font-size: rem-calc(14);
|
|
||||||
// $form-label-font-weight: normal;
|
|
||||||
// $form-label-font-color: lighten(#000, 30%);
|
|
||||||
// $form-label-bottom-margin: rem-calc(8);
|
|
||||||
// $input-font-family: inherit;
|
|
||||||
// $input-font-color: rgba(0,0,0,0.75);
|
|
||||||
// $input-font-size: rem-calc(14);
|
|
||||||
// $input-bg-color: #fff;
|
|
||||||
// $input-focus-bg-color: darken(#fff, 2%);
|
|
||||||
// $input-border-color: darken(#fff, 20%);
|
|
||||||
// $input-focus-border-color: darken(#fff, 40%);
|
|
||||||
// $input-border-style: solid;
|
|
||||||
// $input-border-width: 1px;
|
|
||||||
// $input-disabled-bg: #ddd;
|
|
||||||
// $input-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
|
|
||||||
// $input-include-glowing-effect: true;
|
|
||||||
|
|
||||||
// We use these to style the fieldset border and spacing.
|
|
||||||
// $fieldset-border-style: solid;
|
|
||||||
// $fieldset-border-width: 1px;
|
|
||||||
// $fieldset-border-color: #ddd;
|
|
||||||
// $fieldset-padding: rem-calc(20);
|
|
||||||
// $fieldset-margin: rem-calc(18 0);
|
|
||||||
|
|
||||||
// We use these to style the legends when you use them
|
|
||||||
// $legend-bg: #fff;
|
|
||||||
// $legend-font-weight: bold;
|
|
||||||
// $legend-padding: rem-calc(0 3);
|
|
||||||
|
|
||||||
// We use these to style the prefix and postfix input elements
|
|
||||||
// $input-prefix-bg: darken(#fff, 5%);
|
|
||||||
// $input-prefix-border-color: darken(#fff, 20%);
|
|
||||||
// $input-prefix-border-size: 1px;
|
|
||||||
// $input-prefix-border-type: solid;
|
|
||||||
// $input-prefix-overflow: hidden;
|
|
||||||
// $input-prefix-font-color: #333;
|
|
||||||
// $input-prefix-font-color-alt: #fff;
|
|
||||||
|
|
||||||
// We use these to style the error states for inputs and labels
|
|
||||||
// $input-error-message-padding: rem-calc(6 9 9);
|
|
||||||
// $input-error-message-top: -1px;
|
|
||||||
// $input-error-message-font-size: rem-calc(12);
|
|
||||||
// $input-error-message-font-weight: normal;
|
|
||||||
// $input-error-message-font-style: italic;
|
|
||||||
// $input-error-message-font-color: #fff;
|
|
||||||
// $input-error-message-font-color-alt: #333;
|
|
||||||
|
|
||||||
// We use this to style the glowing effect of inputs when focused
|
|
||||||
// $glowing-effect-fade-time: 0.45s;
|
|
||||||
// $glowing-effect-color: $input-focus-border-color;
|
|
||||||
|
|
||||||
// Select variables
|
|
||||||
// $select-bg-color: #fafafa ;
|
|
||||||
|
|
||||||
// Inline Lists
|
|
||||||
|
|
||||||
// $include-html-inline-list-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to control the margins and padding of the inline list.
|
|
||||||
// $inline-list-top-margin: 0;
|
|
||||||
// $inline-list-opposite-margin: 0;
|
|
||||||
// $inline-list-bottom-margin: rem-calc(17);
|
|
||||||
// $inline-list-default-float-margin: rem-calc(-22);
|
|
||||||
|
|
||||||
// $inline-list-padding: 0;
|
|
||||||
|
|
||||||
// We use this to control the overflow of the inline list.
|
|
||||||
// $inline-list-overflow: hidden;
|
|
||||||
|
|
||||||
// We use this to control the list items
|
|
||||||
// $inline-list-display: block;
|
|
||||||
|
|
||||||
// We use this to control any elments within list items
|
|
||||||
// $inline-list-children-display: block;
|
|
||||||
|
|
||||||
// Joyride
|
|
||||||
|
|
||||||
// $include-html-joyride-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// Controlling default Joyride styles
|
|
||||||
// $joyride-tip-bg: #333;
|
|
||||||
// $joyride-tip-default-width: 300px;
|
|
||||||
// $joyride-tip-padding: rem-calc(18 20 24);
|
|
||||||
// $joyride-tip-border: solid 1px #555;
|
|
||||||
// $joyride-tip-radius: 4px;
|
|
||||||
// $joyride-tip-position-offset: 22px;
|
|
||||||
|
|
||||||
// Here, we're setting the tip dont styles
|
|
||||||
// $joyride-tip-font-color: #fff;
|
|
||||||
// $joyride-tip-font-size: rem-calc(14);
|
|
||||||
// $joyride-tip-header-weight: bold;
|
|
||||||
|
|
||||||
// This changes the nub size
|
|
||||||
// $joyride-tip-nub-size: 10px;
|
|
||||||
|
|
||||||
// This adjusts the styles for the timer when its enabled
|
|
||||||
// $joyride-tip-timer-width: 50px;
|
|
||||||
// $joyride-tip-timer-height: 3px;
|
|
||||||
// $joyride-tip-timer-color: #666;
|
|
||||||
|
|
||||||
// This changes up the styles for the close button
|
|
||||||
// $joyride-tip-close-color: #777;
|
|
||||||
// $joyride-tip-close-size: 24px;
|
|
||||||
// $joyride-tip-close-weight: normal;
|
|
||||||
|
|
||||||
// When Joyride is filling the screen, we use this style for the bg
|
|
||||||
// $joyride-screenfill: rgba(0,0,0,0.5);
|
|
||||||
|
|
||||||
// Keystrokes
|
|
||||||
|
|
||||||
// $include-html-type-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control text styles.
|
|
||||||
// $keystroke-font: "Consolas", "Menlo", "Courier", monospace;
|
|
||||||
// $keystroke-font-size: rem-calc(14);
|
|
||||||
// $keystroke-font-color: #222;
|
|
||||||
// $keystroke-font-color-alt: #fff;
|
|
||||||
// $keystroke-function-factor: 7%;
|
|
||||||
|
|
||||||
// We use this to control keystroke padding.
|
|
||||||
// $keystroke-padding: rem-calc(2 4 0);
|
|
||||||
|
|
||||||
// We use these to control background and border styles.
|
|
||||||
// $keystroke-bg: darken(#fff, $keystroke-function-factor);
|
|
||||||
// $keystroke-border-style: solid;
|
|
||||||
// $keystroke-border-width: 1px;
|
|
||||||
// $keystroke-border-color: darken($keystroke-bg, $keystroke-function-factor);
|
|
||||||
// $keystroke-radius: $global-radius;
|
|
||||||
|
|
||||||
// Labels
|
|
||||||
|
|
||||||
// $include-html-label-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to style the labels
|
|
||||||
// $label-padding: rem-calc(4 8 6);
|
|
||||||
// $label-radius: $global-radius;
|
|
||||||
|
|
||||||
// We use these to style the label text
|
|
||||||
// $label-font-sizing: rem-calc(11);
|
|
||||||
// $label-font-weight: normal;
|
|
||||||
// $label-font-color: #333;
|
|
||||||
// $label-font-color-alt: #fff;
|
|
||||||
// $label-font-family: $body-font-family;
|
|
||||||
|
|
||||||
// Magellan
|
|
||||||
|
|
||||||
// $include-html-magellan-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// $magellan-bg: #fff;
|
|
||||||
// $magellan-padding: 10px;
|
|
||||||
|
|
||||||
// Off-canvas
|
|
||||||
|
|
||||||
// $tabbar-bg: #333;
|
|
||||||
// $tabbar-height: rem-calc(45);
|
|
||||||
// $tabbar-line-height: $tabbar-height;
|
|
||||||
// $tabbar-color: #FFF;
|
|
||||||
// $tabbar-middle-padding: 0 rem-calc(10);
|
|
||||||
|
|
||||||
// Off Canvas Divider Styles
|
|
||||||
// $tabbar-right-section-border: solid 1px lighten($tabbar-bg, 10%);
|
|
||||||
// $tabbar-left-section-border: solid 1px darken($tabbar-bg, 10%);
|
|
||||||
|
|
||||||
// Off Canvas Tab Bar Headers
|
|
||||||
// $tabbar-header-color: #FFF;
|
|
||||||
// $tabbar-header-weight: bold;
|
|
||||||
// $tabbar-header-line-height: $tabbar-height;
|
|
||||||
// $tabbar-header-margin: 0;
|
|
||||||
|
|
||||||
// Off Canvas Menu Variables
|
|
||||||
// $off-canvas-width: 250px;
|
|
||||||
// $off-canvas-bg: #333;
|
|
||||||
|
|
||||||
// Off Canvas Menu List Variables
|
|
||||||
// $off-canvas-label-padding: 0.3rem rem-calc(15);
|
|
||||||
// $off-canvas-label-color: #999;
|
|
||||||
// $off-canvas-label-text-transform: uppercase;
|
|
||||||
// $off-canvas-label-font-weight: bold;
|
|
||||||
// $off-canvas-label-bg: #444;
|
|
||||||
// $off-canvas-label-border-top: 1px solid lighten(#444, 10%);
|
|
||||||
// $off-canvas-label-border-bottom: none;
|
|
||||||
// $off-canvas-label-margin:0;
|
|
||||||
// $off-canvas-link-padding: rem-calc(10, 15);
|
|
||||||
// $off-canvas-link-color: rgba(#FFF, 0.7);
|
|
||||||
// $off-canvas-link-border-bottom: 1px solid darken($off-canvas-bg, 5%);
|
|
||||||
|
|
||||||
// Off Canvas Menu Icon Variables
|
|
||||||
// $tabbar-menu-icon-color: #FFF;
|
|
||||||
// $tabbar-menu-icon-hover: darken($tabbar-menu-icon-color, 30%);
|
|
||||||
|
|
||||||
// $tabbar-menu-icon-text-indent: rem-calc(35);
|
|
||||||
// $tabbar-menu-icon-width: $tabbar-height;
|
|
||||||
// $tabbar-menu-icon-height: $tabbar-height;
|
|
||||||
// $tabbar-menu-icon-line-height: rem-calc(33);
|
|
||||||
// $tabbar-menu-icon-padding: 0;
|
|
||||||
|
|
||||||
// $tabbar-hamburger-icon-width: rem-calc(16);
|
|
||||||
// $tabbar-hamburger-icon-left: rem-calc(13);
|
|
||||||
// $tabbar-hamburger-icon-top: rem-calc(5);
|
|
||||||
|
|
||||||
// Off Canvas Back-Link Overlay
|
|
||||||
// $off-canvas-overlay-transition: background 300ms ease;
|
|
||||||
// $off-canvas-overlay-cursor: pointer;
|
|
||||||
// $off-canvas-overlay-box-shadow: -4px 0 4px rgba(#000, 0.5), 4px 0 4px rgba(#000, 0.5);
|
|
||||||
// $off-canvas-overlay-background: rgba(#FFF, 0.2);
|
|
||||||
// $off-canvas-overlay-background-hover: rgba(#FFF, 0.05);
|
|
||||||
|
|
||||||
// Transition Variabls
|
|
||||||
// $menu-slide: "transform 500ms ease";
|
|
||||||
|
|
||||||
// Orbit
|
|
||||||
|
|
||||||
// $include-html-orbit-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control the caption styles
|
|
||||||
// $orbit-container-bg: none;
|
|
||||||
// $orbit-caption-bg: rgba(51,51,51, 0.8);
|
|
||||||
// $orbit-caption-font-color: #fff;
|
|
||||||
// $orbit-caption-font-size: rem-calc(14);
|
|
||||||
// $orbit-caption-position: "bottom"; // Supported values: "bottom", "under"
|
|
||||||
// $orbit-caption-padding: rem-calc(10,14);
|
|
||||||
// $orbit-caption-height: auto;
|
|
||||||
|
|
||||||
// We use these to control the left/right nav styles
|
|
||||||
// $orbit-nav-bg: none;
|
|
||||||
// $orbit-nav-bg-hover: rgba(0,0,0,0.3);
|
|
||||||
// $orbit-nav-arrow-color: #fff;
|
|
||||||
// $orbit-nav-arrow-color-hover: #fff;
|
|
||||||
|
|
||||||
// We use these to control the timer styles
|
|
||||||
// $orbit-timer-bg: rgba(255,255,255,0.3);
|
|
||||||
// $orbit-timer-show-progress-bar: true;
|
|
||||||
|
|
||||||
// We use these to control the bullet nav styles
|
|
||||||
// $orbit-bullet-nav-color: #ccc;
|
|
||||||
// $orbit-bullet-nav-color-active: #999;
|
|
||||||
// $orbit-bullet-radius: rem-calc(9);
|
|
||||||
|
|
||||||
// We use these to controls the style of slide numbers
|
|
||||||
// $orbit-slide-number-bg: rgba(0,0,0,0);
|
|
||||||
// $orbit-slide-number-font-color: #fff;
|
|
||||||
// $orbit-slide-number-padding: rem-calc(5);
|
|
||||||
|
|
||||||
// Graceful Loading Wrapper and preloader
|
|
||||||
// $wrapper-class: "slideshow-wrapper";
|
|
||||||
// $preloader-class: "preloader";
|
|
||||||
|
|
||||||
// Pagination
|
|
||||||
|
|
||||||
// $include-html-nav-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control the pagination container
|
|
||||||
// $pagination-height: rem-calc(24);
|
|
||||||
// $pagination-margin: rem-calc(-5);
|
|
||||||
|
|
||||||
// We use these to set the list-item properties
|
|
||||||
// $pagination-li-float: $default-float;
|
|
||||||
// $pagination-li-height: rem-calc(24);
|
|
||||||
// $pagination-li-font-color: #222;
|
|
||||||
// $pagination-li-font-size: rem-calc(14);
|
|
||||||
// $pagination-li-margin: rem-calc(5);
|
|
||||||
|
|
||||||
// We use these for the pagination anchor links
|
|
||||||
// $pagination-link-pad: rem-calc(1 10 1);
|
|
||||||
// $pagination-link-font-color: #999;
|
|
||||||
// $pagination-link-active-bg: darken(#fff, 10%);
|
|
||||||
|
|
||||||
// We use these for disabled anchor links
|
|
||||||
// $pagination-link-unavailable-cursor: default;
|
|
||||||
// $pagination-link-unavailable-font-color: #999;
|
|
||||||
// $pagination-link-unavailable-bg-active: transparent;
|
|
||||||
|
|
||||||
// We use these for currently selected anchor links
|
|
||||||
// $pagination-link-current-background: $primary-color;
|
|
||||||
// $pagination-link-current-font-color: #fff;
|
|
||||||
// $pagination-link-current-font-weight: bold;
|
|
||||||
// $pagination-link-current-cursor: default;
|
|
||||||
// $pagination-link-current-active-bg: $primary-color;
|
|
||||||
|
|
||||||
// Panels
|
|
||||||
|
|
||||||
// $include-html-panel-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control the background and border styles
|
|
||||||
// $panel-bg: darken(#fff, 5%);
|
|
||||||
// $panel-border-style: solid;
|
|
||||||
// $panel-border-size: 1px;
|
|
||||||
|
|
||||||
// We use this % to control how much we darken things on hover
|
|
||||||
// $panel-function-factor: 10%;
|
|
||||||
// $panel-border-color: darken($panel-bg, $panel-function-factor);
|
|
||||||
|
|
||||||
// We use these to set default inner padding and bottom margin
|
|
||||||
// $panel-margin-bottom: rem-calc(20);
|
|
||||||
// $panel-padding: rem-calc(20);
|
|
||||||
|
|
||||||
// We use these to set default font colors
|
|
||||||
// $panel-font-color: #333;
|
|
||||||
// $panel-font-color-alt: #fff;
|
|
||||||
|
|
||||||
// $panel-header-adjust: true;
|
|
||||||
// $callout-panel-link-color: $primary-color;
|
|
||||||
|
|
||||||
// Pricing Tables
|
|
||||||
|
|
||||||
// $include-html-pricing-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to control the border color
|
|
||||||
// $price-table-border: solid 1px #ddd;
|
|
||||||
|
|
||||||
// We use this to control the bottom margin of the pricing table
|
|
||||||
// $price-table-margin-bottom: rem-calc(20);
|
|
||||||
|
|
||||||
// We use these to control the title styles
|
|
||||||
// $price-title-bg: #333;
|
|
||||||
// $price-title-padding: rem-calc(15 20);
|
|
||||||
// $price-title-align: center;
|
|
||||||
// $price-title-color: #eee;
|
|
||||||
// $price-title-weight: normal;
|
|
||||||
// $price-title-size: rem-calc(16);
|
|
||||||
// $price-title-font-family: $body-font-family;
|
|
||||||
|
|
||||||
// We use these to control the price styles
|
|
||||||
// $price-money-bg: #f6f6f6 ;
|
|
||||||
// $price-money-padding: rem-calc(15 20);
|
|
||||||
// $price-money-align: center;
|
|
||||||
// $price-money-color: #333;
|
|
||||||
// $price-money-weight: normal;
|
|
||||||
// $price-money-size: rem-calc(32);
|
|
||||||
// $price-money-font-family: $body-font-family;
|
|
||||||
|
|
||||||
|
|
||||||
// We use these to control the description styles
|
|
||||||
// $price-bg: #fff;
|
|
||||||
// $price-desc-color: #777;
|
|
||||||
// $price-desc-padding: rem-calc(15);
|
|
||||||
// $price-desc-align: center;
|
|
||||||
// $price-desc-font-size: rem-calc(12);
|
|
||||||
// $price-desc-weight: normal;
|
|
||||||
// $price-desc-line-height: 1.4;
|
|
||||||
// $price-desc-bottom-border: dotted 1px #ddd;
|
|
||||||
|
|
||||||
// We use these to control the list item styles
|
|
||||||
// $price-item-color: #333;
|
|
||||||
// $price-item-padding: rem-calc(15);
|
|
||||||
// $price-item-align: center;
|
|
||||||
// $price-item-font-size: rem-calc(14);
|
|
||||||
// $price-item-weight: normal;
|
|
||||||
// $price-item-bottom-border: dotted 1px #ddd;
|
|
||||||
|
|
||||||
// We use these to control the CTA area styles
|
|
||||||
// $price-cta-bg: #fff;
|
|
||||||
// $price-cta-align: center;
|
|
||||||
// $price-cta-padding: rem-calc(20 20 0);
|
|
||||||
|
|
||||||
// Progress Meters
|
|
||||||
|
|
||||||
// $include-html-media-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to se the prog bar height
|
|
||||||
// $progress-bar-height: rem-calc(25);
|
|
||||||
// $progress-bar-color: #f6f6f6 ;
|
|
||||||
|
|
||||||
// We use these to control the border styles
|
|
||||||
// $progress-bar-border-color: darken(#fff, 20%);
|
|
||||||
// $progress-bar-border-size: 1px;
|
|
||||||
// $progress-bar-border-style: solid;
|
|
||||||
// $progress-bar-border-radius: $global-radius;
|
|
||||||
|
|
||||||
// We use these to control the margin & padding
|
|
||||||
// $progress-bar-pad: rem-calc(2);
|
|
||||||
// $progress-bar-margin-bottom: rem-calc(10);
|
|
||||||
|
|
||||||
// We use these to set the meter colors
|
|
||||||
// $progress-meter-color: $primary-color;
|
|
||||||
// $progress-meter-secondary-color: $secondary-color;
|
|
||||||
// $progress-meter-success-color: $success-color;
|
|
||||||
// $progress-meter-alert-color: $alert-color;
|
|
||||||
|
|
||||||
// Reveal
|
|
||||||
|
|
||||||
// $include-html-reveal-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control the style of the reveal overlay.
|
|
||||||
// $reveal-overlay-bg: rgba(#000, .45);
|
|
||||||
// $reveal-overlay-bg-old: #000;
|
|
||||||
|
|
||||||
// We use these to control the style of the modal itself.
|
|
||||||
// $reveal-modal-bg: #fff;
|
|
||||||
// $reveal-position-top: 50px;
|
|
||||||
// $reveal-default-width: 80%;
|
|
||||||
// $reveal-modal-padding: rem-calc(20);
|
|
||||||
// $reveal-box-shadow: 0 0 10px rgba(#000,.4);
|
|
||||||
|
|
||||||
// We use these to style the reveal close button
|
|
||||||
// $reveal-close-font-size: rem-calc(22);
|
|
||||||
// $reveal-close-top: rem-calc(8);
|
|
||||||
// $reveal-close-side: rem-calc(11);
|
|
||||||
// $reveal-close-color: #aaa;
|
|
||||||
// $reveal-close-weight: bold;
|
|
||||||
|
|
||||||
// We use these to control the modal border
|
|
||||||
// $reveal-border-style: solid;
|
|
||||||
// $reveal-border-width: 1px;
|
|
||||||
// $reveal-border-color: #666;
|
|
||||||
|
|
||||||
// $reveal-modal-class: "reveal-modal";
|
|
||||||
// $close-reveal-modal-class: "close-reveal-modal";
|
|
||||||
|
|
||||||
// Side Nav
|
|
||||||
|
|
||||||
// $include-html-nav-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use this to control padding.
|
|
||||||
// $side-nav-padding: rem-calc(14 0);
|
|
||||||
|
|
||||||
// We use these to control list styles.
|
|
||||||
// $side-nav-list-type: none;
|
|
||||||
// $side-nav-list-position: inside;
|
|
||||||
// $side-nav-list-margin: rem-calc(0 0 7 0);
|
|
||||||
|
|
||||||
// We use these to control link styles.
|
|
||||||
// $side-nav-link-color: $primary-color;
|
|
||||||
// $side-nav-link-color-active: lighten(#000, 30%);
|
|
||||||
// $side-nav-font-size: rem-calc(14);
|
|
||||||
// $side-nav-font-weight: normal;
|
|
||||||
// $side-nav-font-family: $body-font-family;
|
|
||||||
// $side-nav-active-font-family: $side-nav-font-family;
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// We use these to control border styles
|
|
||||||
// $side-nav-divider-size: 1px;
|
|
||||||
// $side-nav-divider-style: solid;
|
|
||||||
// $side-nav-divider-color: darken(#fff, 10%);
|
|
||||||
|
|
||||||
// Split Buttons
|
|
||||||
|
|
||||||
// $include-html-button-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control different shared styles for Split Buttons
|
|
||||||
// $split-button-function-factor: 10%;
|
|
||||||
// $split-button-pip-color: #fff;
|
|
||||||
// $split-button-pip-color-alt: #333;
|
|
||||||
// $split-button-active-bg-tint: rgba(0,0,0,0.1);
|
|
||||||
|
|
||||||
// We use these to control tiny split buttons
|
|
||||||
// $split-button-padding-tny: $button-pip-tny * 10;
|
|
||||||
// $split-button-span-width-tny: $button-pip-tny * 6;
|
|
||||||
// $split-button-pip-size-tny: $button-pip-tny;
|
|
||||||
// $split-button-pip-top-tny: $button-pip-tny * 2;
|
|
||||||
// $split-button-pip-default-float-tny: rem-calc(-6);
|
|
||||||
|
|
||||||
// We use these to control small split buttons
|
|
||||||
// $split-button-padding-sml: $button-pip-sml * 10;
|
|
||||||
// $split-button-span-width-sml: $button-pip-sml * 6;
|
|
||||||
// $split-button-pip-size-sml: $button-pip-sml;
|
|
||||||
// $split-button-pip-top-sml: $button-pip-sml * 1.5;
|
|
||||||
// $split-button-pip-default-float-sml: rem-calc(-6);
|
|
||||||
|
|
||||||
// We use these to control medium split buttons
|
|
||||||
// $split-button-padding-med: $button-pip-med * 9;
|
|
||||||
// $split-button-span-width-med: $button-pip-med * 5.5;
|
|
||||||
// $split-button-pip-size-med: $button-pip-med - rem-calc(3);
|
|
||||||
// $split-button-pip-top-med: $button-pip-med * 1.5;
|
|
||||||
// $split-button-pip-default-float-med: rem-calc(-6);
|
|
||||||
|
|
||||||
// We use these to control large split buttons
|
|
||||||
// $split-button-padding-lrg: $button-pip-lrg * 8;
|
|
||||||
// $split-button-span-width-lrg: $button-pip-lrg * 5;
|
|
||||||
// $split-button-pip-size-lrg: $button-pip-lrg - rem-calc(6);
|
|
||||||
// $split-button-pip-top-lrg: $button-pip-lrg + rem-calc(5);
|
|
||||||
// $split-button-pip-default-float-lrg: rem-calc(-6);
|
|
||||||
|
|
||||||
// Sub Nav
|
|
||||||
|
|
||||||
// $include-html-nav-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control margin and padding
|
|
||||||
// $sub-nav-list-margin: rem-calc(-4 0 18);
|
|
||||||
// $sub-nav-list-padding-top: rem-calc(4);
|
|
||||||
|
|
||||||
// We use this to control the definition
|
|
||||||
// $sub-nav-font-family: $body-font-family;
|
|
||||||
// $sub-nav-font-size: rem-calc(14);
|
|
||||||
// $sub-nav-font-color: #999;
|
|
||||||
// $sub-nav-font-weight: normal;
|
|
||||||
// $sub-nav-text-decoration: none;
|
|
||||||
// $sub-nav-border-radius: 3px;
|
|
||||||
// $sub-nav-font-color-hover: darken($sub-nav-font-color, 15%);
|
|
||||||
|
|
||||||
|
|
||||||
// We use these to control the active item styles
|
|
||||||
|
|
||||||
// $sub-nav-active-font-weight: normal;
|
|
||||||
// $sub-nav-active-bg: $primary-color;
|
|
||||||
// $sub-nav-active-bg-hover: darken($sub-nav-active-bg, 5%);
|
|
||||||
// $sub-nav-active-color: #fff;
|
|
||||||
// $sub-nav-active-padding: rem-calc(3 16);
|
|
||||||
// $sub-nav-active-cursor: default;
|
|
||||||
|
|
||||||
// $sub-nav-item-divider: "";
|
|
||||||
// $sub-nav-item-divider-margin: rem-calc(12);
|
|
||||||
|
|
||||||
// Tables
|
|
||||||
|
|
||||||
// $include-html-table-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// These control the background color for the table and even rows
|
|
||||||
// $table-bg: #fff;
|
|
||||||
// $table-even-row-bg: #f9f9f9 ;
|
|
||||||
|
|
||||||
// These control the table cell border style
|
|
||||||
// $table-border-style: solid;
|
|
||||||
// $table-border-size: 1px;
|
|
||||||
// $table-border-color: #ddd;
|
|
||||||
|
|
||||||
// These control the table head styles
|
|
||||||
// $table-head-bg: #f5f5f5 ;
|
|
||||||
// $table-head-font-size: rem-calc(14);
|
|
||||||
// $table-head-font-color: #222;
|
|
||||||
// $table-head-font-weight: bold;
|
|
||||||
// $table-head-padding: rem-calc(8 10 10);
|
|
||||||
|
|
||||||
// These control the row padding and font styles
|
|
||||||
// $table-row-padding: rem-calc(9 10);
|
|
||||||
// $table-row-font-size: rem-calc(14);
|
|
||||||
// $table-row-font-color: #222;
|
|
||||||
// $table-line-height: rem-calc(18);
|
|
||||||
|
|
||||||
// These are for controlling the display and margin of tables
|
|
||||||
// $table-display: table-cell;
|
|
||||||
// $table-margin-bottom: rem-calc(20);
|
|
||||||
|
|
||||||
//
|
|
||||||
// TABS
|
|
||||||
//
|
|
||||||
|
|
||||||
// $include-html-tabs-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// $tabs-navigation-padding: rem-calc(16);
|
|
||||||
// $tabs-navigation-bg-color: #efefef ;
|
|
||||||
// $tabs-navigation-hover-bg-color: darken($tabs-navigation-bg-color, 5%);
|
|
||||||
// $tabs-navigation-font-color: #222;
|
|
||||||
// $tabs-navigation-font-size: rem-calc(16);
|
|
||||||
// $tabs-navigation-font-family: $body-font-family;
|
|
||||||
|
|
||||||
// $tabs-content-margin-bottom: rem-calc(24);
|
|
||||||
// $tabs-content-padding: $column-gutter/2;
|
|
||||||
|
|
||||||
// $tabs-vertical-navigation-margin-bottom: 1.25rem;
|
|
||||||
|
|
||||||
//
|
|
||||||
// THUMBNAILS
|
|
||||||
//
|
|
||||||
|
|
||||||
// $include-html-media-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// We use these to control border styles
|
|
||||||
// $thumb-border-style: solid;
|
|
||||||
// $thumb-border-width: 4px;
|
|
||||||
// $thumb-border-color: #fff;
|
|
||||||
// $thumb-box-shadow: 0 0 0 1px rgba(#000,.2);
|
|
||||||
// $thumb-box-shadow-hover: 0 0 6px 1px rgba($primary-color,0.5);
|
|
||||||
|
|
||||||
// Radius and transition speed for thumbs
|
|
||||||
// $thumb-radius: $global-radius;
|
|
||||||
// $thumb-transition-speed: 200ms;
|
|
||||||
|
|
||||||
//
|
|
||||||
// TOOLTIPS
|
|
||||||
//
|
|
||||||
|
|
||||||
// $include-html-tooltip-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// $has-tip-border-bottom: dotted 1px #ccc;
|
|
||||||
// $has-tip-font-weight: bold;
|
|
||||||
// $has-tip-font-color: #333;
|
|
||||||
// $has-tip-border-bottom-hover: dotted 1px darken($primary-color, 20%);
|
|
||||||
// $has-tip-font-color-hover: $primary-color;
|
|
||||||
// $has-tip-cursor-type: help;
|
|
||||||
|
|
||||||
// $tooltip-padding: rem-calc(12);
|
|
||||||
// $tooltip-bg: #333;
|
|
||||||
// $tooltip-font-size: rem-calc(14);
|
|
||||||
// $tooltip-font-weight: normal;
|
|
||||||
// $tooltip-font-color: #fff;
|
|
||||||
// $tooltip-line-height: 1.3;
|
|
||||||
// $tooltip-close-font-size: rem-calc(10);
|
|
||||||
// $tooltip-close-font-weight: normal;
|
|
||||||
// $tooltip-close-font-color: #777;
|
|
||||||
// $tooltip-font-size-sml: rem-calc(14);
|
|
||||||
// $tooltip-radius: $global-radius;
|
|
||||||
// $tooltip-pip-size: 5px;
|
|
||||||
|
|
||||||
//
|
|
||||||
// TOP BAR
|
|
||||||
//
|
|
||||||
|
|
||||||
// $include-html-top-bar-classes: $include-html-classes;
|
|
||||||
|
|
||||||
// Background color for the top bar
|
|
||||||
$topbar-bg-color: #f3f3f3;
|
|
||||||
$topbar-bg: linear-gradient(#f9f9f9, #f3f3f3);
|
|
||||||
|
|
||||||
// Height and margin
|
|
||||||
// $topbar-height: 45px;
|
|
||||||
// $topbar-margin-bottom: 0;
|
|
||||||
|
|
||||||
// Control Input height for top bar
|
|
||||||
|
|
||||||
// Controlling the styles for the title in the top bar
|
|
||||||
// $topbar-title-weight: 500;
|
|
||||||
// $topbar-title-font-size: rem-calc(17);
|
|
||||||
|
|
||||||
// Style the top bar dropdown elements
|
|
||||||
$topbar-dropdown-bg: darken($topbar-bg-color, 2%);
|
|
||||||
// $topbar-dropdown-link-color: #fff;
|
|
||||||
// $topbar-dropdown-link-bg: #333;
|
|
||||||
// $topbar-dropdown-toggle-size: 5px;
|
|
||||||
// $topbar-dropdown-toggle-color: #fff;
|
|
||||||
// $topbar-dropdown-toggle-alpha: 0.4;
|
|
||||||
|
|
||||||
// Set the link colors and styles for top-level nav
|
|
||||||
$topbar-link-color: $primary-color;
|
|
||||||
$topbar-link-color-hover: darken($primary-color, 10%);
|
|
||||||
$topbar-link-color-active: darken($primary-color, 10%);
|
|
||||||
// $topbar-link-weight: normal;
|
|
||||||
// $topbar-link-font-size: rem-calc(13);
|
|
||||||
$topbar-link-hover-lightness: -20%; // Darken by 20%
|
|
||||||
$topbar-link-bg-hover: darken($topbar-bg-color, 5%);
|
|
||||||
$topbar-link-bg-active: darken($topbar-bg-color, 5%);
|
|
||||||
$topbar-link-bg-active-hover: darken($topbar-bg-color, 10%);
|
|
||||||
// $topbar-link-font-family: $body-font-family;
|
|
||||||
|
|
||||||
// $topbar-button-font-size: 0.75rem;
|
|
||||||
|
|
||||||
// $topbar-dropdown-label-color: #777;
|
|
||||||
// $topbar-dropdown-label-text-transform: uppercase;
|
|
||||||
// $topbar-dropdown-label-font-weight: bold;
|
|
||||||
// $topbar-dropdown-label-font-size: rem-calc(10);
|
|
||||||
// $topbar-dropdown-label-bg: #333;
|
|
||||||
|
|
||||||
// Top menu icon styles
|
|
||||||
// $topbar-menu-link-transform: uppercase;
|
|
||||||
// $topbar-menu-link-font-size: rem-calc(13);
|
|
||||||
// $topbar-menu-link-weight: bold;
|
|
||||||
$topbar-menu-link-color: $topbar-link-color;
|
|
||||||
$topbar-menu-icon-color: $topbar-link-color;
|
|
||||||
$topbar-menu-link-color-toggled: $topbar-link-color-active;
|
|
||||||
$topbar-menu-icon-color-toggled: $topbar-link-color-active;
|
|
||||||
|
|
||||||
// Transitions and breakpoint styles
|
|
||||||
// $topbar-transition-speed: 300ms;
|
|
||||||
// Using rem-calc for the below breakpoint causes issues with top bar
|
|
||||||
// $topbar-breakpoint: #{upper-bound($medium-range)}; // Change to 9999px for always mobile layout
|
|
||||||
// $topbar-media-query: "only screen and (min-width: #{upper-bound($medium-range)})";
|
|
||||||
|
|
||||||
// Divider Styles
|
|
||||||
// $topbar-divider-border-bottom: solid 1px lighten($topbar-bg-color, 10%);
|
|
||||||
// $topbar-divider-border-top: solid 1px darken($topbar-bg-color, 10%);
|
|
||||||
|
|
||||||
// Sticky Class
|
|
||||||
// $topbar-sticky-class: ".sticky";
|
|
||||||
// $topbar-arrows: true; //Set false to remove the triangle icon from the menu item
|
|
||||||
|
|
@ -1,130 +0,0 @@
|
||||||
@import "settings";
|
|
||||||
@import "foundation";
|
|
||||||
|
|
||||||
@import "voltaicideas/pygments";
|
|
||||||
@import "voltaicideas/pygments_github";
|
|
||||||
|
|
||||||
@import "voltaicideas/icons";
|
|
||||||
|
|
||||||
#footer {
|
|
||||||
color: darken($secondary-color, 20%);
|
|
||||||
a {
|
|
||||||
color: desaturate($primary-color, 50%);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
#disqus_thread {
|
|
||||||
border-top: 1px solid $secondary-color;
|
|
||||||
border-bottom: 1px solid $secondary-color;
|
|
||||||
padding-top: 7px;
|
|
||||||
margin-bottom: 7px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.social a{
|
|
||||||
i { display: none; }
|
|
||||||
}
|
|
||||||
|
|
||||||
.contain-to-grid {
|
|
||||||
border-bottom: 1px solid #e5e5e5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.imageHeader {
|
|
||||||
padding: 0;
|
|
||||||
.imageCredit {
|
|
||||||
@include label(7px 16px, 0.7rem, rgba(0,0,0,0.5), 0px);
|
|
||||||
position: absolute;
|
|
||||||
color: darken(#fff, 10%);
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
a {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.pageHeader {
|
|
||||||
border-bottom: 1px solid $secondary-color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content {
|
|
||||||
padding-left: 0.5rem;
|
|
||||||
padding-right: 0.5rem;
|
|
||||||
a {
|
|
||||||
text-decoration: underline;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.tag {
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.25rem 0.75rem;
|
|
||||||
font-size: 0.6875rem;
|
|
||||||
color: desaturate($primary-color, 20%);
|
|
||||||
background-color: $secondary-color;
|
|
||||||
@include border-radius($global-radius);
|
|
||||||
&:hover {
|
|
||||||
background-color: darken($secondary-color, 10%);
|
|
||||||
}
|
|
||||||
span {
|
|
||||||
@include border-radius($global-radius);
|
|
||||||
display: inline-block;
|
|
||||||
margin-left: 5px;
|
|
||||||
background-color: lighten($secondary-color, 5%);
|
|
||||||
padding: 2px 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
article {
|
|
||||||
header {
|
|
||||||
border-bottom: 1px dashed $secondary-color;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
border-bottom: 1px dashed $secondary-color;
|
|
||||||
img {
|
|
||||||
max-height: 800px;
|
|
||||||
max-width: 800px;
|
|
||||||
display: block;
|
|
||||||
margin-right: auto;
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
table {
|
|
||||||
margin-right: auto;
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
footer {
|
|
||||||
color: darken($secondary-color, 20%);
|
|
||||||
a {
|
|
||||||
color: desaturate($primary-color, 50%);
|
|
||||||
}
|
|
||||||
margin-bottom: 7px;
|
|
||||||
.meta {
|
|
||||||
display: block;
|
|
||||||
margin-top: 7px;
|
|
||||||
margin-bottom: 7px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
&.excerpt {
|
|
||||||
border-bottom: 1px solid $secondary-color;
|
|
||||||
margin-bottom: 7px;
|
|
||||||
padding-bottom: 7px;
|
|
||||||
header {
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
border-bottom: none;
|
|
||||||
}
|
|
||||||
footer {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media #{$medium-up} {
|
|
||||||
.social a {
|
|
||||||
padding: 0 9px !important;
|
|
||||||
span { display: none; }
|
|
||||||
i { display: inline }
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,12 +0,0 @@
|
||||||
.icon-bookmark:before { content: '\e80a'; } /* '' */
|
|
||||||
.icon-youtube:before { content: '\e800'; } /* '' */
|
|
||||||
.icon-code:before { content: '\e80b'; } /* '' */
|
|
||||||
.icon-up-big:before { content: '\e808'; } /* '' */
|
|
||||||
.icon-bitbucket:before { content: '\e807'; } /* '' */
|
|
||||||
.icon-css3:before { content: '\e806'; } /* '' */
|
|
||||||
.icon-bookmark-empty:before { content: '\e809'; } /* '' */
|
|
||||||
.icon-gplus:before { content: '\e804'; } /* '' */
|
|
||||||
.icon-html5:before { content: '\e803'; } /* '' */
|
|
||||||
.icon-linkedin:before { content: '\e802'; } /* '' */
|
|
||||||
.icon-twitter:before { content: '\e801'; } /* '' */
|
|
||||||
.icon-github:before { content: '\e805'; } /* '' */
|
|
||||||
|
|
@ -1,156 +0,0 @@
|
||||||
//
|
|
||||||
// Sass Icon Fonts
|
|
||||||
//
|
|
||||||
|
|
||||||
// Main File icons.scss
|
|
||||||
// Version: 0.4
|
|
||||||
// Created By: Andrew Senetar
|
|
||||||
// Date: August, 7 2013
|
|
||||||
// Used: Font Awesome Styles, Foundation Icon Fonts Scss as Starting; animation from Fontello
|
|
||||||
|
|
||||||
/* Defaults */
|
|
||||||
$set: "voltaicideas";
|
|
||||||
|
|
||||||
// Colors (from Font Awesome)
|
|
||||||
$iconBorderColor: #eee !default;
|
|
||||||
$iconMuted: #eee !default;
|
|
||||||
$iconLight: #fff !default;
|
|
||||||
$iconDark: #333 !default;
|
|
||||||
|
|
||||||
/* Mixins */
|
|
||||||
// Mixin for creating individual icon classes
|
|
||||||
@mixin i-class($name, $pau) {
|
|
||||||
.icon-#{$name}:before {
|
|
||||||
content: "\e#{$pau}";
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Mixin to simplify font face creation
|
|
||||||
@mixin face($set) {
|
|
||||||
@font-face {
|
|
||||||
font-family: "#{$set}";
|
|
||||||
src: url("../fonts/#{$set}");
|
|
||||||
src: url("../fonts/#{$set}.eot#iefix") format('embedded-opentype'),
|
|
||||||
url("../fonts/#{$set}.woff") format('woff'),
|
|
||||||
url("../fonts/#{$set}.ttf") format('truetype'),
|
|
||||||
url("../fonts/#{$set}.svg#fontello") format('svg');
|
|
||||||
font-weight: normal;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@mixin border-radius($radius) {
|
|
||||||
-webkit-border-radius: $radius;
|
|
||||||
-moz-border-radius: $radius;
|
|
||||||
-ms-border-radius: $radius;
|
|
||||||
-o-border-radius: $radius;
|
|
||||||
border-radius: $radius;
|
|
||||||
}
|
|
||||||
|
|
||||||
@include face(#{$set}); //@font-face
|
|
||||||
|
|
||||||
//// global icon styles (from Foundation Icons + Font Awesome)
|
|
||||||
/* Icon font Styles */
|
|
||||||
[class*='icon-'] {
|
|
||||||
background-image: none;
|
|
||||||
background-position: 0% 0%;
|
|
||||||
background-repeat: repeat;
|
|
||||||
display: inline;
|
|
||||||
height: auto;
|
|
||||||
width: auto;
|
|
||||||
vertical-align: baseline;
|
|
||||||
line-height: 1;
|
|
||||||
margin-top: 0;
|
|
||||||
speak: none;
|
|
||||||
font-family: '#{$set}';
|
|
||||||
font-style: normal;
|
|
||||||
font-weight: normal;
|
|
||||||
font-variant: normal;
|
|
||||||
text-transform: none;
|
|
||||||
text-decoration: inherit;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*='icon-']:before {
|
|
||||||
text-decoration: inherit;
|
|
||||||
display: inline-block;
|
|
||||||
speak: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
//// Icon borders (from Font Awesome)
|
|
||||||
|
|
||||||
[class*="border icon-"] {
|
|
||||||
border: solid 1px $iconBorderColor;
|
|
||||||
padding: .2em .25em .15em;
|
|
||||||
@include border-radius(3px);
|
|
||||||
}
|
|
||||||
|
|
||||||
//// Icon sizes (from Font Awesome)
|
|
||||||
|
|
||||||
[class*="large icon-"]:before {
|
|
||||||
vertical-align: -10%;
|
|
||||||
font-size: 1.333em;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="huge icon-"]:before {
|
|
||||||
vertical-align: -17%;
|
|
||||||
font-size: 1.75em;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="2x icon-"] {
|
|
||||||
font-size: 2em;
|
|
||||||
& .border {
|
|
||||||
border-width: 2px;
|
|
||||||
@include border-radius(4px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="3x icon-"] {
|
|
||||||
font-size: 3em;
|
|
||||||
& .border {
|
|
||||||
border-width: 3px;
|
|
||||||
@include border-radius(5px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="4x icon-"] {
|
|
||||||
font-size: 4em;
|
|
||||||
& .border {
|
|
||||||
border-width: 4px;
|
|
||||||
@include border-radius(6px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="5x icon-"] {
|
|
||||||
font-size: 5em;
|
|
||||||
& .border {
|
|
||||||
border-width: 5px;
|
|
||||||
@include border-radius(7px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
//// Colors (from Font Awesome)
|
|
||||||
|
|
||||||
[class*="muted icon-"]{
|
|
||||||
color: $iconMuted;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="light icon-"]{
|
|
||||||
color: $iconLight;
|
|
||||||
}
|
|
||||||
|
|
||||||
[class*="dark icon-"]{
|
|
||||||
color: $iconDark;
|
|
||||||
}
|
|
||||||
|
|
||||||
//// Fixes
|
|
||||||
|
|
||||||
//// makes sure icons active on rollover in links (from Font Awesome)
|
|
||||||
|
|
||||||
a [class*="icon-"]:before {
|
|
||||||
display: inline;
|
|
||||||
}
|
|
||||||
|
|
||||||
//// Actual Icons
|
|
||||||
/* Icon Font List */
|
|
||||||
@import "_icon_codes.scss";
|
|
||||||
|
|
@ -1,24 +0,0 @@
|
||||||
.highlight{
|
|
||||||
font-size: rem-calc(14px);
|
|
||||||
padding: 0;
|
|
||||||
font-family: 'Source Code Pro', 'Consolas', Monaco, monospace;
|
|
||||||
overflow: auto;
|
|
||||||
margin-bottom: rem-calc(16px);
|
|
||||||
pre{
|
|
||||||
tab-size: 4;
|
|
||||||
white-space: pre;
|
|
||||||
font-family: inherit;
|
|
||||||
background-color: lighten($secondary-color, 5%);
|
|
||||||
border-radius: 0;
|
|
||||||
padding: rem-calc(3px);
|
|
||||||
padding-left: rem-calc(5px);
|
|
||||||
line-height: 23px;
|
|
||||||
overflow-x: auto;
|
|
||||||
word-break: inherit;
|
|
||||||
code {
|
|
||||||
&.text {
|
|
||||||
color: #555;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
@ -1,65 +0,0 @@
|
||||||
/* Pygments Code Highlight */
|
|
||||||
|
|
||||||
.highlight {
|
|
||||||
.hll { background-color: #ffffcc }
|
|
||||||
.c { color: #999988; font-style: italic } // Comment
|
|
||||||
.err { color: #a61717; background-color: #e3d2d2 } // Error
|
|
||||||
.k { color: #000000; font-weight: bold } // Keyword
|
|
||||||
.o { color: #000000; font-weight: bold } // Operator
|
|
||||||
.cm { color: #999988; font-style: italic } // Comment.Multiline
|
|
||||||
.cp { color: #999999; font-weight: bold; font-style: italic } // Comment.Preproc
|
|
||||||
.c1 { color: #999988; font-style: italic } // Comment.Single
|
|
||||||
.cs { color: #999999; font-weight: bold; font-style: italic } // Comment.Special
|
|
||||||
.gd { color: #000000; background-color: #ffdddd } // Generic.Deleted
|
|
||||||
.ge { color: #000000; font-style: italic } // Generic.Emph
|
|
||||||
.gr { color: #aa0000 } // Generic.Error
|
|
||||||
.gh { color: #999999 } // Generic.Heading
|
|
||||||
.gi { color: #000000; background-color: #ddffdd } // Generic.Inserted
|
|
||||||
.go { color: #888888 } // Generic.Output
|
|
||||||
.gp { color: #555555 } // Generic.Prompt
|
|
||||||
.gs { font-weight: bold } // Generic.Strong
|
|
||||||
.gu { color: #aaaaaa } // Generic.Subheading
|
|
||||||
.gt { color: #aa0000 } // Generic.Traceback
|
|
||||||
.kc { color: #000000; font-weight: bold } // Keyword.Constant
|
|
||||||
.kd { color: #000000; font-weight: bold } // Keyword.Declaration
|
|
||||||
.kn { color: #000000; font-weight: bold } // Keyword.Namespace
|
|
||||||
.kp { color: #000000; font-weight: bold } // Keyword.Pseudo
|
|
||||||
.kr { color: #000000; font-weight: bold } // Keyword.Reserved
|
|
||||||
.kt { color: #445588; font-weight: bold } // Keyword.Type
|
|
||||||
.m { color: #009999 } // Literal.Number
|
|
||||||
.s { color: #d01040 } // Literal.String
|
|
||||||
.na { color: #008080 } // Name.Attribute
|
|
||||||
.nb { color: #0086B3 } // Name.Builtin
|
|
||||||
.nc { color: #445588; font-weight: bold } // Name.Class
|
|
||||||
.no { color: #008080 } // Name.Constant
|
|
||||||
.nd { color: #3c5d5d; font-weight: bold } // Name.Decorator
|
|
||||||
.ni { color: #800080 } // Name.Entity
|
|
||||||
.ne { color: #990000; font-weight: bold } // Name.Exception
|
|
||||||
.nf { color: #990000; font-weight: bold } // Name.Function
|
|
||||||
.nl { color: #990000; font-weight: bold } // Name.Label
|
|
||||||
.nn { color: #555555 } // Name.Namespace
|
|
||||||
.nt { color: #000080 } // Name.Tag
|
|
||||||
.nv { color: #008080 } // Name.Variable
|
|
||||||
.ow { color: #000000; font-weight: bold } // Operator.Word
|
|
||||||
.w { color: #bbbbbb } // Text.Whitespace
|
|
||||||
.mf { color: #009999 } // Literal.Number.Float
|
|
||||||
.mh { color: #009999 } // Literal.Number.Hex
|
|
||||||
.mi { color: #009999 } // Literal.Number.Integer
|
|
||||||
.mo { color: #009999 } // Literal.Number.Oct
|
|
||||||
.sb { color: #d01040 } // Literal.String.Backtick
|
|
||||||
.sc { color: #d01040 } // Literal.String.Char
|
|
||||||
.sd { color: #d01040 } // Literal.String.Doc
|
|
||||||
.s2 { color: #d01040 } // Literal.String.Double
|
|
||||||
.se { color: #d01040 } // Literal.String.Escape
|
|
||||||
.sh { color: #d01040 } // Literal.String.Heredoc
|
|
||||||
.si { color: #d01040 } // Literal.String.Interpol
|
|
||||||
.sx { color: #d01040 } // Literal.String.Other
|
|
||||||
.sr { color: #009926 } // Literal.String.Regex
|
|
||||||
.s1 { color: #d01040 } // Literal.String.Single
|
|
||||||
.ss { color: #990073 } // Literal.String.Symbol
|
|
||||||
.bp { color: #999999 } // Name.Builtin.Pseudo
|
|
||||||
.vc { color: #008080 } // Name.Variable.Class
|
|
||||||
.vg { color: #008080 } // Name.Variable.Global
|
|
||||||
.vi { color: #008080 } // Name.Variable.Instance
|
|
||||||
.il { color: #009999 } // Literal.Number.Integer.Long
|
|
||||||
}
|
|
||||||
Loading…
Reference in New Issue