From b0ce94d4f20cb26a1b9abf8fa11ff17a08012587 Mon Sep 17 00:00:00 2001 From: Builder Date: Mon, 11 Feb 2013 23:37:19 +0000 Subject: [PATCH] mobile project generated --- .gitignore | 16 + Mixer.lock | 1 + README.md | 10 + .../apple-touch-icon-114x114-precomposed.png | 0 assets/images/apple-touch-icon-114x114.png | 0 .../apple-touch-icon-57x57-precomposed.png | 0 assets/images/apple-touch-icon-57x57.png | 0 assets/images/favicon.ico | Bin 0 -> 1406 bytes assets/javascript/application.js | 1 + assets/javascript/bundles.yml | 12 + assets/javascript/main/stub.js | 1 + assets/stylesheets/devices/android.scss | 1 + assets/stylesheets/devices/blackberry.scss | 1 + assets/stylesheets/devices/ipad.scss | 1 + assets/stylesheets/devices/iphone.scss | 1 + assets/stylesheets/devices/webkit.scss | 1 + assets/stylesheets/globals/_base.scss | 39 +++ assets/stylesheets/globals/_reset.scss | 48 +++ assets/stylesheets/globals/_uranium.scss | 65 ++++ assets/stylesheets/globals/_variables.scss | 5 + .../globals/_vertical_rhythmic.scss | 220 ++++++++++++++ .../stylesheets/globals/bourbon/_bourbon.scss | 40 +++ .../globals/bourbon/addons/_button.scss | 273 +++++++++++++++++ .../globals/bourbon/addons/_clearfix.scss | 29 ++ .../globals/bourbon/addons/_font-face.scss | 12 + .../globals/bourbon/addons/_font-family.scss | 5 + .../globals/bourbon/addons/_hide-text.scss | 15 + .../bourbon/addons/_html5-input-types.scss | 36 +++ .../globals/bourbon/addons/_position.scss | 42 +++ .../bourbon/addons/_timing-functions.scss | 32 ++ .../globals/bourbon/css3/_animation.scss | 125 ++++++++ .../globals/bourbon/css3/_appearance.scss | 3 + .../bourbon/css3/_background-image.scss | 57 ++++ .../bourbon/css3/_background-size.scss | 11 + .../globals/bourbon/css3/_background.scss | 107 +++++++ .../globals/bourbon/css3/_border-image.scss | 56 ++++ .../globals/bourbon/css3/_border-radius.scss | 39 +++ .../globals/bourbon/css3/_box-shadow.scss | 12 + .../globals/bourbon/css3/_box-sizing.scss | 4 + .../globals/bourbon/css3/_columns.scss | 47 +++ .../globals/bourbon/css3/_flex-box.scss | 52 ++++ .../globals/bourbon/css3/_inline-block.scss | 8 + .../bourbon/css3/_linear-gradient.scss | 43 +++ .../globals/bourbon/css3/_prefixer.scss | 12 + .../bourbon/css3/_radial-gradient.scss | 76 +++++ .../globals/bourbon/css3/_transform.scss | 11 + .../globals/bourbon/css3/_transition.scss | 72 +++++ .../globals/bourbon/css3/_user-select.scss | 3 + .../_deprecated-webkit-gradient.scss | 44 +++ .../globals/bourbon/functions/_flex-grid.scss | 35 +++ .../bourbon/functions/_grid-width.scss | 13 + .../bourbon/functions/_linear-gradient.scss | 23 ++ .../bourbon/functions/_modular-scale.scss | 40 +++ .../bourbon/functions/_radial-gradient.scss | 62 ++++ .../bourbon/functions/_render-gradients.scss | 14 + .../bourbon/functions/_tint-shade.scss | 9 + .../functions/_transition-property-name.scss | 22 ++ assets/stylesheets/main.scss | 18 ++ assets/stylesheets/pages/_home.scss | 5 + assets/stylesheets/sections/_footer.scss | 3 + assets/stylesheets/sections/_header.scss | 3 + config.json | 6 + functions/main.ts | 287 ++++++++++++++++++ scripts/device_detection.ts | 19 ++ scripts/html.ts | 29 ++ scripts/main.ts | 23 ++ scripts/mappings.ts | 37 +++ scripts/pages/error.ts | 1 + scripts/pages/home.ts | 1 + scripts/sections/footer.ts | 5 + scripts/sections/header.ts | 5 + 71 files changed, 2349 insertions(+) create mode 100644 .gitignore create mode 100644 Mixer.lock create mode 100644 README.md create mode 100644 assets/images/apple-touch-icon-114x114-precomposed.png create mode 100644 assets/images/apple-touch-icon-114x114.png create mode 100644 assets/images/apple-touch-icon-57x57-precomposed.png create mode 100644 assets/images/apple-touch-icon-57x57.png create mode 100644 assets/images/favicon.ico create mode 100644 assets/javascript/application.js create mode 100644 assets/javascript/bundles.yml create mode 100644 assets/javascript/main/stub.js create mode 100644 assets/stylesheets/devices/android.scss create mode 100644 assets/stylesheets/devices/blackberry.scss create mode 100644 assets/stylesheets/devices/ipad.scss create mode 100644 assets/stylesheets/devices/iphone.scss create mode 100644 assets/stylesheets/devices/webkit.scss create mode 100644 assets/stylesheets/globals/_base.scss create mode 100644 assets/stylesheets/globals/_reset.scss create mode 100644 assets/stylesheets/globals/_uranium.scss create mode 100644 assets/stylesheets/globals/_variables.scss create mode 100644 assets/stylesheets/globals/_vertical_rhythmic.scss create mode 100644 assets/stylesheets/globals/bourbon/_bourbon.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_button.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_clearfix.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_font-face.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_font-family.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_hide-text.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_html5-input-types.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_position.scss create mode 100644 assets/stylesheets/globals/bourbon/addons/_timing-functions.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_animation.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_appearance.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_background-image.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_background-size.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_background.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_border-image.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_border-radius.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_box-shadow.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_box-sizing.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_columns.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_flex-box.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_inline-block.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_linear-gradient.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_prefixer.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_radial-gradient.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_transform.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_transition.scss create mode 100644 assets/stylesheets/globals/bourbon/css3/_user-select.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_deprecated-webkit-gradient.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_flex-grid.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_grid-width.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_linear-gradient.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_modular-scale.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_radial-gradient.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_render-gradients.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_tint-shade.scss create mode 100644 assets/stylesheets/globals/bourbon/functions/_transition-property-name.scss create mode 100644 assets/stylesheets/main.scss create mode 100644 assets/stylesheets/pages/_home.scss create mode 100644 assets/stylesheets/sections/_footer.scss create mode 100644 assets/stylesheets/sections/_header.scss create mode 100644 config.json create mode 100644 functions/main.ts create mode 100644 scripts/device_detection.ts create mode 100644 scripts/html.ts create mode 100644 scripts/main.ts create mode 100644 scripts/mappings.ts create mode 100644 scripts/pages/error.ts create mode 100644 scripts/pages/home.ts create mode 100644 scripts/sections/footer.ts create mode 100644 scripts/sections/header.ts diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8e73726 --- /dev/null +++ b/.gitignore @@ -0,0 +1,16 @@ +lib/*.ts +.rvmrc +tmp/ +log/ +*.swp +.sass-cache +.DS_Store +config/default.vcl +JENKINS +BUILD_VERSION +*~ +project.gemspec +assets/javascript/.remote/ +assets/javascript/main.js +assets/javascript/host_map.js +*.css diff --git a/Mixer.lock b/Mixer.lock new file mode 100644 index 0000000..5bd5795 --- /dev/null +++ b/Mixer.lock @@ -0,0 +1 @@ +simple-mobile (1.0.94) diff --git a/README.md b/README.md new file mode 100644 index 0000000..e6ba551 --- /dev/null +++ b/README.md @@ -0,0 +1,10 @@ +## Basics +This project works with the MoovSDK. + +See detailed documentation for the MoovSDK at http://console.moovweb.com + +## Domains +Remember to put all domains you're going to hit in your etc/hosts +or to run your server with the `-auto-hosts=true` option. + + 127.0.0.1 mlocal.teamquest.com diff --git a/assets/images/apple-touch-icon-114x114-precomposed.png b/assets/images/apple-touch-icon-114x114-precomposed.png new file mode 100644 index 0000000..e69de29 diff --git a/assets/images/apple-touch-icon-114x114.png b/assets/images/apple-touch-icon-114x114.png new file mode 100644 index 0000000..e69de29 diff --git a/assets/images/apple-touch-icon-57x57-precomposed.png b/assets/images/apple-touch-icon-57x57-precomposed.png new file mode 100644 index 0000000..e69de29 diff --git a/assets/images/apple-touch-icon-57x57.png b/assets/images/apple-touch-icon-57x57.png new file mode 100644 index 0000000..e69de29 diff --git a/assets/images/favicon.ico b/assets/images/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..f490880fd69a6999109f747fb9b577f2e230062d GIT binary patch literal 1406 zcmeHHeJs>*82=pU6zPsgxEv)a>E&`I<#Z&a^e&a&gcEwxAFZ`ErD2Vv(ROAoJ5nUQ zP^5Gk$H~vRU%PI%qptH3xvjNZTgtkAcV;&AXMg&B_j$gb&-3j0KKnl3?Ez@iW-wr0 ziB^CU#e683Tx<$7SX0(a#?DEctsF&oSvQ`hIl`^ZfOldqD8CFN`gR9C5hA?JVWK6S z1>f=^C`1gz*DJy5_>BNr9(c_e5Qr5}N>ZT|0)&u>kgjTo8cIRlq#^j#Mf8+gKqUhF z6;ukX_J`r4T$J!71$px3d_Y z;;&%Ud_!(yF=8sz;7ZOT@O3;Cg&yF^AHcQ9fVK=aI)~Kw_|OIVdK-8P4G3zw0&C3( zh-^BNWId?LibUdj9hxpP(RqsvGSdoIYfBLOMvb7CS6tCKQbT55LKIm8?qXZdOhR? zOb`Rz;B*@y&!$0FO+$jb5tV%!3^wzj9O^@8YZ26ye$@S~(7XskNJBDI`abX_x$u&X zqV@s{LG5LbU1z{q@*OTp!ZTm6tw^MAY1OKZ7_6giwwsQ{7IK{IxPm#^X z*BqJW;xPB{#y~Gq4ew2HRx5*dte&|bdBZc{)bp&da{k7*(IHx=DW~lv4uJ0wr+Q7r29^f yrJS{AO^$s*^Vf&W^6}fsq(@E8{Yx8-fC*{z37E8m(&Nxl+~m_*QlO1tJns+4aQ$Tf literal 0 HcmV?d00001 diff --git a/assets/javascript/application.js b/assets/javascript/application.js new file mode 100644 index 0000000..33de3d5 --- /dev/null +++ b/assets/javascript/application.js @@ -0,0 +1 @@ +/* Default JS */ \ No newline at end of file diff --git a/assets/javascript/bundles.yml b/assets/javascript/bundles.yml new file mode 100644 index 0000000..f15d36f --- /dev/null +++ b/assets/javascript/bundles.yml @@ -0,0 +1,12 @@ +--- +- :output_file: main.js + :input_directory: main + :input_files: + - host_map.js + - http://d1topzp4nao5hp.cloudfront.net/uranium-upload/0.1.104/uranium-pretty.js + - http://d1topzp4nao5hp.cloudfront.net/plutonium-upload/0.1.73/gsub.js + - http://d1topzp4nao5hp.cloudfront.net/plutonium-upload/0.1.73/passthrough_ajax.js + - http://d1topzp4nao5hp.cloudfront.net/plutonium-upload/0.1.68/auto_scroll.js + + + diff --git a/assets/javascript/main/stub.js b/assets/javascript/main/stub.js new file mode 100644 index 0000000..2a69861 --- /dev/null +++ b/assets/javascript/main/stub.js @@ -0,0 +1 @@ +// Delete me when ready \ No newline at end of file diff --git a/assets/stylesheets/devices/android.scss b/assets/stylesheets/devices/android.scss new file mode 100644 index 0000000..29de244 --- /dev/null +++ b/assets/stylesheets/devices/android.scss @@ -0,0 +1 @@ +@import "webkit.scss"; \ No newline at end of file diff --git a/assets/stylesheets/devices/blackberry.scss b/assets/stylesheets/devices/blackberry.scss new file mode 100644 index 0000000..c7fa690 --- /dev/null +++ b/assets/stylesheets/devices/blackberry.scss @@ -0,0 +1 @@ +@import "../main.scss"; \ No newline at end of file diff --git a/assets/stylesheets/devices/ipad.scss b/assets/stylesheets/devices/ipad.scss new file mode 100644 index 0000000..29de244 --- /dev/null +++ b/assets/stylesheets/devices/ipad.scss @@ -0,0 +1 @@ +@import "webkit.scss"; \ No newline at end of file diff --git a/assets/stylesheets/devices/iphone.scss b/assets/stylesheets/devices/iphone.scss new file mode 100644 index 0000000..29de244 --- /dev/null +++ b/assets/stylesheets/devices/iphone.scss @@ -0,0 +1 @@ +@import "webkit.scss"; \ No newline at end of file diff --git a/assets/stylesheets/devices/webkit.scss b/assets/stylesheets/devices/webkit.scss new file mode 100644 index 0000000..c7fa690 --- /dev/null +++ b/assets/stylesheets/devices/webkit.scss @@ -0,0 +1 @@ +@import "../main.scss"; \ No newline at end of file diff --git a/assets/stylesheets/globals/_base.scss b/assets/stylesheets/globals/_base.scss new file mode 100644 index 0000000..c235a3e --- /dev/null +++ b/assets/stylesheets/globals/_base.scss @@ -0,0 +1,39 @@ +// Site-wide styles go here + +@import "bourbon/_bourbon"; + +@import "_vertical_rhythmic"; + +html { + height: 100%; + overflow: auto !important; +} + +body { + -webkit-text-size-adjust: none; + background: #fff; + color: #333; + font-family: "Helvetica Neue", Helvetica, Verdana; + position: relative; + min-height: 100%; +} + +a { + color: #369; + text-decoration: none; + word-wrap: break-word; +} + +a, a:link { + -webkit-tap-highlight-color: rgba(225, 244, 204, 0.5); +} + +img { + max-width: 100%; +} + +input[type="number"]::-webkit-outer-spin-button { + display: none; +} + + diff --git a/assets/stylesheets/globals/_reset.scss b/assets/stylesheets/globals/_reset.scss new file mode 100644 index 0000000..6dbd6d8 --- /dev/null +++ b/assets/stylesheets/globals/_reset.scss @@ -0,0 +1,48 @@ +// http://meyerweb.com/eric/tools/css/reset/ +// v2.0 | 20110126 +// License: none (public domain) + + +html, body, div, span, applet, object, iframe, +h1, h2, h3, h4, h5, h6, p, blockquote, pre, +a, abbr, acronym, address, big, cite, code, +del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, +b, u, i, center, +dl, dt, dd, ol, ul, li, +fieldset, form, label, legend, +table, caption, tbody, tfoot, thead, tr, th, td, +article, aside, canvas, details, embed, +figure, figcaption, footer, header, hgroup, +menu, nav, output, ruby, section, summary, +time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} +/* HTML5 display-role reset for older browsers */ +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} +body { + line-height: 1; +} +ol, ul { + list-style: none; +} +blockquote, q { + quotes: none; +} +blockquote:before, blockquote:after, +q:before, q:after { + content: ''; + content: none; +} +table { + border-collapse: collapse; + border-spacing: 0; +} \ No newline at end of file diff --git a/assets/stylesheets/globals/_uranium.scss b/assets/stylesheets/globals/_uranium.scss new file mode 100644 index 0000000..e428873 --- /dev/null +++ b/assets/stylesheets/globals/_uranium.scss @@ -0,0 +1,65 @@ +/* ####################################### + ####### URANIUM WIDGET STYLING ######## + ####################################### */ + +// Togglers (accordions) +[data-ur-toggler-component="content"] { + display: none; + &:not([data-ur-state]) { + display: none; + } + &[data-ur-state="enabled"] { + display: block; + } +} + +// Tabs +[data-ur-tabs-component="content"] { + display: none; + &:not([data-ur-state]) { + display: none; + } + &[data-ur-state="enabled"] { + display: block; + } +} + +// Simple Carousel +[data-ur-state="hide"] { + display: none !important; +} + +// Carousel +div[data-ur-carousel-component='view_container'] { + width:100%; + overflow-x: hidden; +} +div[data-ur-carousel-component="scroll_container"] { + display:block; + clear:both; + > * { + display:inline-block; + float:left; + } +} +a[data-ur-carousel-component="item"] { + img { + -webkit-user-drag: none; // needed to work on desktop + } +} +[data-ur-carousel-component="dots"] { + text-align:center; + margin-bottom:10px; +} +[data-ur-carousel-component="dot"] { + @include border-radius(7px); + background: black; + display: inline-block; + margin: 0 1px; + opacity: 0.8; + width: 10px; + height: 10px; + &[data-ur-state="inactive"] { + opacity: 0.3; + } +} \ No newline at end of file diff --git a/assets/stylesheets/globals/_variables.scss b/assets/stylesheets/globals/_variables.scss new file mode 100644 index 0000000..a7b1e16 --- /dev/null +++ b/assets/stylesheets/globals/_variables.scss @@ -0,0 +1,5 @@ + +// Vertical Rhythm +$base-font-size: 13px; +$base-line-height: 24px; +@include establish-baseline(); diff --git a/assets/stylesheets/globals/_vertical_rhythmic.scss b/assets/stylesheets/globals/_vertical_rhythmic.scss new file mode 100644 index 0000000..901068d --- /dev/null +++ b/assets/stylesheets/globals/_vertical_rhythmic.scss @@ -0,0 +1,220 @@ +/* + vertical-rhythmic + + Version : 0.3.1 + Original Author : Aurélien Delogu (dev@dreamysource.fr) + Additional Author: Jeff Patzer (jeff@patzer.us) + License : MIT +*/ + +/* + number $base-font-size: base font-size which will be applied to the body (default: 1em) +*/ +$base-font-size: 1em !default; + +/* + number $base-line-height: base line-height which will be applied to the body (default: 1.5em) +*/ +$base-line-height: 1.5em !default; + +/* + Adjust a unit to be relative if in PX to allow for arithmetic +*/ +@function relative-font-size($font-size:$base-font-size) { + @if unit($font-size) == px { + $font-size:$font-size / $base-font-size * 1em; + } + @return $font-size; +} + +/* + Initialize the rhythm +*/ +// Establishes a font baseline for the given font-size. +@mixin establish-baseline($font-size: $base-font-size) { + html, body { + font-size: $font-size; + line-height:relative-font-size($base-line-height); + } +} + + +/* + Return a rhythm + + Parameters + integer $lines : number of whitespace lines (default: 1) + You can specify "auto" value and it will generate a proportional value from the base line-height (especially useful when you want to set a good line-height value) + number $font-size : font size, in ems +*/ +@function rhythm($lines:1,$font-size:1em){ + @if $lines == auto { + $lines:ceil($font-size / $base-line-height); + } + @return $base-line-height / $font-size * $lines * 1em; +} + +/* + Return a rhythm from pixel unit + + Parameters + integer $width : width of the rhythm (without px unit) + number $font-size : font size, in ems +*/ +@function px-rhythm($width:1,$font-size:1em){ + // $relative-base-font-size: relative-font-size($base-font-size); + @if unit($width) == px { + $width:$width / 1px; + } + @return $width * 0.0625 / relative-font-size($base-font-size) / relative-font-size($font-size) * 1em * 1em * 1em; +} + +/* + Set a new font-size and automatically adapt the line-height + + Parameters + number $font-size : font size, in ems + integer $lines : number of whitespace lines for the line-height + Keeps base line proportions by default +*/ +@mixin font-size($font-size,$lines:()){ + @if $lines == () { + $lines: ceil($font-size / $base-line-height); + } + font-size:$font-size; + line-height:rhythm($lines,$font-size); +} + +/* + Add a margin around a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin margin($lines:1,$font-size:1em,$border-width:0){ + margin:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a top margin to a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin margin-top($lines:1,$font-size:1em,$border-width:0){ + margin-top:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a bottom margin to a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin margin-bottom($lines:1,$font-size:1em,$border-width:0){ + margin-bottom:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a padding around a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin padding($lines:1,$font-size:1em,$border-width:0){ + padding:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a top padding to a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin padding-top($lines:1,$font-size:1em,$border-width:0){ + padding-top:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a bottom padding to a box + + Parameters + integer $lines : number of whitespace lines (default: 1) + number $font-size : actual font-size, in ems, to calculate with (default: 1em) + integer $border-width : width of additionnal borders around the box + Useful to substract borders from the whitespace to not break the rhythm +*/ +@mixin padding-bottom($lines:1,$font-size:1em,$border-width:0){ + padding-bottom:relative-font-size(rhythm($lines,$font-size)) - px-rhythm($border-width,$font-size); +} + +/* + Add a top border around a box + + Parameters + string $color : color + number $font-size : font-size of the box (in em) + integer $width : border width + It quite equals to pixels but it depends on the base font-size of the browser, so it takes no unit + string $type : border type +*/ +@mixin border($color,$font-size:1em,$width:1,$type:solid){ + border:px-rhythm($width,$font-size) $type $color; +} + +/* + Add a top border to a box + + Parameters + string $color : color + number $font-size : font-size of the box (in em) + integer $width : border width + It quite equals to pixels but it depends on the base font-size of the browser, so it takes no unit + string $type : border type +*/ +@mixin border-top($color,$font-size:1em,$width:1,$type:solid){ + border-top:px-rhythm($width,$font-size) $type $color; +} + +/* + Add a bottom border to a box + + Parameters + string $color : color + number $font-size : font-size of the box (in em) + integer $width : border width + It quite equals to pixels but it depends on the base font-size of the browser, so it takes no unit + string $type : border type +*/ +@mixin border-bottom($color,$font-size:1em,$width:1,$type:solid){ + border-bottom:px-rhythm($width,$font-size) $type $color; +} + +/* + Add an outline around a box + + Parameters + string $color : color + number $font-size : font-size of the box (in em) + integer $width : border width + It quite equals to pixels but it depends on the base font-size of the browser, so it takes no unit + string $type : outline type +*/ +@mixin outline($color,$font-size:1em,$width:1,$type:solid){ + outline:px-rhythm($width,$font-size) $type $color; +} \ No newline at end of file diff --git a/assets/stylesheets/globals/bourbon/_bourbon.scss b/assets/stylesheets/globals/bourbon/_bourbon.scss new file mode 100644 index 0000000..6d4c699 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/_bourbon.scss @@ -0,0 +1,40 @@ +// Custom Functions +@import "functions/deprecated-webkit-gradient"; +@import "functions/flex-grid"; +@import "functions/grid-width"; +@import "functions/linear-gradient"; +@import "functions/modular-scale"; +@import "functions/radial-gradient"; +@import "functions/render-gradients"; +@import "functions/tint-shade"; +@import "functions/transition-property-name"; + +// CSS3 Mixins +@import "css3/animation"; +@import "css3/appearance"; +@import "css3/background"; +@import "css3/background-image"; +@import "css3/background-size"; +@import "css3/border-image"; +@import "css3/border-radius"; +@import "css3/box-shadow"; +@import "css3/box-sizing"; +@import "css3/columns"; +@import "css3/flex-box"; +@import "css3/inline-block"; +@import "css3/linear-gradient"; +@import "css3/prefixer"; +@import "css3/radial-gradient"; +@import "css3/transform"; +@import "css3/transition"; +@import "css3/user-select"; + +// Addons & other mixins +@import "addons/button"; +@import "addons/clearfix"; +@import "addons/font-face"; +@import "addons/font-family"; +@import "addons/hide-text"; +@import "addons/html5-input-types"; +@import "addons/position"; +@import "addons/timing-functions"; diff --git a/assets/stylesheets/globals/bourbon/addons/_button.scss b/assets/stylesheets/globals/bourbon/addons/_button.scss new file mode 100644 index 0000000..e2a589c --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_button.scss @@ -0,0 +1,273 @@ +@mixin button ($style: simple, $base-color: #4294f0) { + + @if type-of($style) == color { + $base-color: $style; + $style: simple; + } + + // Grayscale button + @if $base-color == grayscale($base-color) { + @if $style == simple { + @include simple($base-color, $grayscale: true); + } + + @else if $style == shiny { + @include shiny($base-color, $grayscale: true); + } + + @else if $style == pill { + @include pill($base-color, $grayscale: true); + } + } + + // Colored button + @else { + @if $style == simple { + @include simple($base-color); + } + + @else if $style == shiny { + @include shiny($base-color); + } + + @else if $style == pill { + @include pill($base-color); + } + } + + &:disabled { + opacity: 0.5; + cursor: not-allowed; + } +} + + +// Simple Button +//************************************************************************// +@mixin simple($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border: adjust-color($base-color, $saturation: 9%, $lightness: -14%); + $inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%); + $stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%); + $text-shadow: adjust-color($base-color, $saturation: 15%, $lightness: -18%); + + @if lightness($base-color) > 70% { + $color: hsl(0, 0, 20%); + $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); + } + + @if $grayscale == true { + $border: grayscale($border); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + + border: 1px solid $border; + @include border-radius (3px); + @include box-shadow (inset 0 1px 0 0 $inset-shadow); + color: $color; + display: inline-block; + font-size: 11px; + font-weight: bold; + @include linear-gradient ($base-color, $stop-gradient); + padding: 7px 18px; + text-decoration: none; + text-shadow: 0 1px 0 $text-shadow; + -webkit-background-clip: padding-box; + + &:hover:not(:disabled) { + $base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%); + $stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + } + + @include box-shadow (inset 0 1px 0 0 $inset-shadow-hover); + cursor: pointer; + @include linear-gradient ($base-color-hover, $stop-gradient-hover); + } + + &:active:not(:disabled) { + $border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%); + $inset-shadow-active: adjust-color($base-color, $saturation: 7%, $lightness: -17%); + + @if $grayscale == true { + $border-active: grayscale($border-active); + $inset-shadow-active: grayscale($inset-shadow-active); + } + + border: 1px solid $border-active; + @include box-shadow (inset 0 0 8px 4px $inset-shadow-active, inset 0 0 8px 4px $inset-shadow-active, 0 1px 1px 0 #eee); + } +} + + +// Shiny Button +//************************************************************************// +@mixin shiny($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81); + $border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122); + $fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46); + $inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12); + $second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33); + $text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114); + $third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48); + + @if lightness($base-color) > 70% { + $color: hsl(0, 0, 20%); + $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); + } + + @if $grayscale == true { + $border: grayscale($border); + $border-bottom: grayscale($border-bottom); + $fourth-stop: grayscale($fourth-stop); + $inset-shadow: grayscale($inset-shadow); + $second-stop: grayscale($second-stop); + $text-shadow: grayscale($text-shadow); + $third-stop: grayscale($third-stop); + } + + border: 1px solid $border; + border-bottom: 1px solid $border-bottom; + @include border-radius(5px); + @include box-shadow(inset 0 1px 0 0 $inset-shadow); + color: $color; + display: inline-block; + font-size: 14px; + font-weight: bold; + @include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%); + padding: 8px 20px; + text-align: center; + text-decoration: none; + text-shadow: 0 -1px 1px $text-shadow; + + &:hover:not(:disabled) { + $first-stop-hover: adjust-color($base-color, $red: -13, $green: -15, $blue: -18); + $second-stop-hover: adjust-color($base-color, $red: -66, $green: -62, $blue: -51); + $third-stop-hover: adjust-color($base-color, $red: -93, $green: -85, $blue: -66); + $fourth-stop-hover: adjust-color($base-color, $red: -86, $green: -80, $blue: -63); + + @if $grayscale == true { + $first-stop-hover: grayscale($first-stop-hover); + $second-stop-hover: grayscale($second-stop-hover); + $third-stop-hover: grayscale($third-stop-hover); + $fourth-stop-hover: grayscale($fourth-stop-hover); + } + + cursor: pointer; + @include linear-gradient(top, $first-stop-hover 0%, + $second-stop-hover 50%, + $third-stop-hover 50%, + $fourth-stop-hover 100%); + } + + &:active:not(:disabled) { + $inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122); + + @if $grayscale == true { + $inset-shadow-active: grayscale($inset-shadow-active); + } + + @include box-shadow(inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff); + } +} + + +// Pill Button +//************************************************************************// +@mixin pill($base-color, $grayscale: false) { + $color: hsl(0, 0, 100%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%); + $inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%); + $stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%); + $text-shadow: adjust-color($base-color, $hue: 5, $saturation: -19%, $lightness: -15%); + + @if lightness($base-color) > 70% { + $color: hsl(0, 0, 20%); + $text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%); + } + + @if $grayscale == true { + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow: grayscale($inset-shadow); + $stop-gradient: grayscale($stop-gradient); + $text-shadow: grayscale($text-shadow); + } + + border: 1px solid $border-top; + border-color: $border-top $border-sides $border-bottom; + @include border-radius(16px); + @include box-shadow(inset 0 1px 0 0 $inset-shadow, 0 1px 2px 0 #b3b3b3); + color: $color; + display: inline-block; + font-size: 11px; + font-weight: normal; + line-height: 1; + @include linear-gradient ($base-color, $stop-gradient); + padding: 5px 16px; + text-align: center; + text-decoration: none; + text-shadow: 0 -1px 1px $text-shadow; + -webkit-background-clip: padding-box; + + &:hover:not(:disabled) { + $base-color-hover: adjust-color($base-color, $lightness: -4.5%); + $border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%); + $border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%); + $border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%); + $inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%); + $stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%); + $text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%); + + @if $grayscale == true { + $base-color-hover: grayscale($base-color-hover); + $border-bottom: grayscale($border-bottom); + $border-sides: grayscale($border-sides); + $border-top: grayscale($border-top); + $inset-shadow-hover: grayscale($inset-shadow-hover); + $stop-gradient-hover: grayscale($stop-gradient-hover); + $text-shadow-hover: grayscale($text-shadow-hover); + } + + border: 1px solid $border-top; + border-color: $border-top $border-sides $border-bottom; + @include box-shadow(inset 0 1px 0 0 $inset-shadow-hover); + cursor: pointer; + @include linear-gradient ($base-color-hover, $stop-gradient-hover); + text-shadow: 0 -1px 1px $text-shadow-hover; + -webkit-background-clip: padding-box; + } + + &:active:not(:disabled) { + $active-color: adjust-color($base-color, $hue: 4, $saturation: -12%, $lightness: -10%); + $border-active: adjust-color($base-color, $hue: 6, $saturation: -2.5%, $lightness: -30%); + $border-bottom-active: adjust-color($base-color, $hue: 11, $saturation: 6%, $lightness: -31%); + $inset-shadow-active: adjust-color($base-color, $hue: 9, $saturation: 2%, $lightness: -21.5%); + $text-shadow-active: adjust-color($base-color, $hue: 5, $saturation: -12%, $lightness: -21.5%); + + @if $grayscale == true { + $active-color: grayscale($active-color); + $border-active: grayscale($border-active); + $border-bottom-active: grayscale($border-bottom-active); + $inset-shadow-active: grayscale($inset-shadow-active); + $text-shadow-active: grayscale($text-shadow-active); + } + + background: $active-color; + border: 1px solid $border-active; + border-bottom: 1px solid $border-bottom-active; + @include box-shadow(inset 0 0 6px 3px $inset-shadow-active, 0 1px 0 0 #fff); + text-shadow: 0 -1px 1px $text-shadow-active; + } +} diff --git a/assets/stylesheets/globals/bourbon/addons/_clearfix.scss b/assets/stylesheets/globals/bourbon/addons/_clearfix.scss new file mode 100644 index 0000000..a9f6a79 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_clearfix.scss @@ -0,0 +1,29 @@ +// Micro clearfix provides an easy way to contain floats without adding additional markup +// +// Example usage: +// +// // Contain all floats within .wrapper +// .wrapper { +// @include clearfix; +// .content, +// .sidebar { +// float : left; +// } +// } + +@mixin clearfix { + zoom: 1; + + &:before, + &:after { + content: ""; + display: table; + } + + &:after { + clear: both; + } +} + +// Acknowledgements +// Micro clearfix: [Nicolas Gallagher](http://nicolasgallagher.com/micro-clearfix-hack/) diff --git a/assets/stylesheets/globals/bourbon/addons/_font-face.scss b/assets/stylesheets/globals/bourbon/addons/_font-face.scss new file mode 100644 index 0000000..de34a37 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_font-face.scss @@ -0,0 +1,12 @@ +@mixin font-face($font-family, $file-path, $weight: normal, $style: normal ) { + @font-face { + font-family: $font-family; + src: url('#{$file-path}.eot'); + src: url('#{$file-path}.eot?#iefix') format('embedded-opentype'), + url('#{$file-path}.woff') format('woff'), + url('#{$file-path}.ttf') format('truetype'), + url('#{$file-path}.svg##{$font-family}') format('svg'); + font-weight: $weight; + font-style: $style; + } +} \ No newline at end of file diff --git a/assets/stylesheets/globals/bourbon/addons/_font-family.scss b/assets/stylesheets/globals/bourbon/addons/_font-family.scss new file mode 100644 index 0000000..df8a80d --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_font-family.scss @@ -0,0 +1,5 @@ +$georgia: Georgia, Cambria, "Times New Roman", Times, serif; +$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif; +$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif; +$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace; +$verdana: Verdana, Geneva, sans-serif; diff --git a/assets/stylesheets/globals/bourbon/addons/_hide-text.scss b/assets/stylesheets/globals/bourbon/addons/_hide-text.scss new file mode 100644 index 0000000..e379c19 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_hide-text.scss @@ -0,0 +1,15 @@ +@mixin hide-text { + background-color: transparent; + border: 0; + color: transparent; + font: 0/0 a; + text-shadow: none; +} + +// A CSS image replacement method that does not require the use of text-indent. +// +// Examples +// +// .ir { +// @include hide-text; +// } diff --git a/assets/stylesheets/globals/bourbon/addons/_html5-input-types.scss b/assets/stylesheets/globals/bourbon/addons/_html5-input-types.scss new file mode 100644 index 0000000..9d86fbb --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_html5-input-types.scss @@ -0,0 +1,36 @@ +//************************************************************************// +// Generate a variable ($all-text-inputs) with a list of all html5 +// input types that have a text-based input, excluding textarea. +// http://diveintohtml5.org/forms.html +//************************************************************************// +$inputs-list: 'input[type="email"]', + 'input[type="number"]', + 'input[type="password"]', + 'input[type="search"]', + 'input[type="tel"]', + 'input[type="text"]', + 'input[type="url"]', + + // Webkit & Gecko may change the display of these in the future + 'input[type="color"]', + 'input[type="date"]', + 'input[type="datetime"]', + 'input[type="datetime-local"]', + 'input[type="month"]', + 'input[type="time"]', + 'input[type="week"]'; + +$unquoted-inputs-list: (); + +@each $input-type in $inputs-list { + $unquoted-inputs-list: append($unquoted-inputs-list, unquote($input-type), comma); +} + +$all-text-inputs: $unquoted-inputs-list; + +// You must use interpolation on the variable: +// #{$all-text-inputs} +//************************************************************************// +// #{$all-text-inputs}, textarea { +// border: 1px solid red; +// } diff --git a/assets/stylesheets/globals/bourbon/addons/_position.scss b/assets/stylesheets/globals/bourbon/addons/_position.scss new file mode 100644 index 0000000..faad1ca --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_position.scss @@ -0,0 +1,42 @@ +@mixin position ($position: relative, $coordinates: 0 0 0 0) { + + @if type-of($position) == list { + $coordinates: $position; + $position: relative; + } + + $top: nth($coordinates, 1); + $right: nth($coordinates, 2); + $bottom: nth($coordinates, 3); + $left: nth($coordinates, 4); + + position: $position; + + @if $top == auto { + top: $top; + } + @else if not(unitless($top)) { + top: $top; + } + + @if $right == auto { + right: $right; + } + @else if not(unitless($right)) { + right: $right; + } + + @if $bottom == auto { + bottom: $bottom; + } + @else if not(unitless($bottom)) { + bottom: $bottom; + } + + @if $left == auto { + left: $left; + } + @else if not(unitless($left)) { + left: $left; + } +} diff --git a/assets/stylesheets/globals/bourbon/addons/_timing-functions.scss b/assets/stylesheets/globals/bourbon/addons/_timing-functions.scss new file mode 100644 index 0000000..51b2410 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/addons/_timing-functions.scss @@ -0,0 +1,32 @@ +// CSS cubic-bezier timing functions. Timing functions courtesy of jquery.easie (github.com/jaukia/easie) +// Timing functions are the same as demo'ed here: http://jqueryui.com/demos/effect/easing.html + +// EASE IN +$ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530); +$ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190); +$ease-in-quart: cubic-bezier(0.895, 0.030, 0.685, 0.220); +$ease-in-quint: cubic-bezier(0.755, 0.050, 0.855, 0.060); +$ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715); +$ease-in-expo: cubic-bezier(0.950, 0.050, 0.795, 0.035); +$ease-in-circ: cubic-bezier(0.600, 0.040, 0.980, 0.335); +$ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045); + +// EASE OUT +$ease-out-quad: cubic-bezier(0.250, 0.460, 0.450, 0.940); +$ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000); +$ease-out-quart: cubic-bezier(0.165, 0.840, 0.440, 1.000); +$ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000); +$ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000); +$ease-out-expo: cubic-bezier(0.190, 1.000, 0.220, 1.000); +$ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000); +$ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275); + +// EASE IN OUT +$ease-in-out-quad: cubic-bezier(0.455, 0.030, 0.515, 0.955); +$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000); +$ease-in-out-quart: cubic-bezier(0.770, 0.000, 0.175, 1.000); +$ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000); +$ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950); +$ease-in-out-expo: cubic-bezier(1.000, 0.000, 0.000, 1.000); +$ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.150, 0.860); +$ease-in-out-back: cubic-bezier(0.680, -0.550, 0.265, 1.550); diff --git a/assets/stylesheets/globals/bourbon/css3/_animation.scss b/assets/stylesheets/globals/bourbon/css3/_animation.scss new file mode 100644 index 0000000..6309b9d --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_animation.scss @@ -0,0 +1,125 @@ +// http://www.w3.org/TR/css3-animations/#the-animation-name-property- +// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties. + +// Official animation shorthand property. +@mixin animation ($animation-1, + $animation-2: false, $animation-3: false, + $animation-4: false, $animation-5: false, + $animation-6: false, $animation-7: false, + $animation-8: false, $animation-9: false) + { + $full: compact($animation-1, $animation-2, $animation-3, $animation-4, + $animation-5, $animation-6, $animation-7, $animation-8, $animation-9); + + @include prefixer(animation, $full); +} + +// Individual Animation Properties +@mixin animation-name ($name-1, + $name-2: false, $name-3: false, + $name-4: false, $name-5: false, + $name-6: false, $name-7: false, + $name-8: false, $name-9: false) + { + $full: compact($name-1, $name-2, $name-3, $name-4, + $name-5, $name-6, $name-7, $name-8, $name-9); + + @include prefixer(animation-name, $full); +} + + +@mixin animation-duration ($time-1: 0, + $time-2: false, $time-3: false, + $time-4: false, $time-5: false, + $time-6: false, $time-7: false, + $time-8: false, $time-9: false) + { + $full: compact($time-1, $time-2, $time-3, $time-4, + $time-5, $time-6, $time-7, $time-8, $time-9); + + @include prefixer(animation-duration, $full); +} + + +@mixin animation-timing-function ($motion-1: ease, +// ease | linear | ease-in | ease-out | ease-in-out + $motion-2: false, $motion-3: false, + $motion-4: false, $motion-5: false, + $motion-6: false, $motion-7: false, + $motion-8: false, $motion-9: false) + { + $full: compact($motion-1, $motion-2, $motion-3, $motion-4, + $motion-5, $motion-6, $motion-7, $motion-8, $motion-9); + + @include prefixer(animation-timing-function, $full); +} + + +@mixin animation-iteration-count ($value-1: 1, +// infinite | + $value-2: false, $value-3: false, + $value-4: false, $value-5: false, + $value-6: false, $value-7: false, + $value-8: false, $value-9: false) + { + $full: compact($value-1, $value-2, $value-3, $value-4, + $value-5, $value-6, $value-7, $value-8, $value-9); + + @include prefixer(animation-iteration-count, $full); +} + + +@mixin animation-direction ($direction-1: normal, +// normal | alternate + $direction-2: false, $direction-3: false, + $direction-4: false, $direction-5: false, + $direction-6: false, $direction-7: false, + $direction-8: false, $direction-9: false) + { + $full: compact($direction-1, $direction-2, $direction-3, $direction-4, + $direction-5, $direction-6, $direction-7, $direction-8, $direction-9); + + @include prefixer(animation-direction, $full); +} + + +@mixin animation-play-state ($state-1: running, +// running | paused + $state-2: false, $state-3: false, + $state-4: false, $state-5: false, + $state-6: false, $state-7: false, + $state-8: false, $state-9: false) + { + $full: compact($state-1, $state-2, $state-3, $state-4, + $state-5, $state-6, $state-7, $state-8, $state-9); + + @include prefixer(animation-play-state, $full); +} + + +@mixin animation-delay ($time-1: 0, + $time-2: false, $time-3: false, + $time-4: false, $time-5: false, + $time-6: false, $time-7: false, + $time-8: false, $time-9: false) + { + $full: compact($time-1, $time-2, $time-3, $time-4, + $time-5, $time-6, $time-7, $time-8, $time-9); + + @include prefixer(animation-delay, $full); +} + + +@mixin animation-fill-mode ($mode-1: none, +// http://goo.gl/l6ckm +// none | forwards | backwards | both + $mode-2: false, $mode-3: false, + $mode-4: false, $mode-5: false, + $mode-6: false, $mode-7: false, + $mode-8: false, $mode-9: false) + { + $full: compact($mode-1, $mode-2, $mode-3, $mode-4, + $mode-5, $mode-6, $mode-7, $mode-8, $mode-9); + + @include prefixer(animation-fill-mode, $full); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_appearance.scss b/assets/stylesheets/globals/bourbon/css3/_appearance.scss new file mode 100644 index 0000000..87c89ad --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_appearance.scss @@ -0,0 +1,3 @@ +@mixin appearance ($value) { + @include prefixer(appearance, $value, webkit, moz, ms, o); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_background-image.scss b/assets/stylesheets/globals/bourbon/css3/_background-image.scss new file mode 100644 index 0000000..c23cef7 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_background-image.scss @@ -0,0 +1,57 @@ +//************************************************************************// +// Background-image property for adding multiple background images with +// gradients, or for stringing multiple gradients together. +//************************************************************************// + +@mixin background-image( + $image-1 , $image-2: false, + $image-3: false, $image-4: false, + $image-5: false, $image-6: false, + $image-7: false, $image-8: false, + $image-9: false, $image-10: false +) { + $images: compact($image-1, $image-2, + $image-3, $image-4, + $image-5, $image-6, + $image-7, $image-8, + $image-9, $image-10); + + background-image: add-prefix($images, webkit); + background-image: add-prefix($images, moz); + background-image: add-prefix($images, ms); + background-image: add-prefix($images, o); + background-image: add-prefix($images); +} + + +@function add-prefix($images, $vendor: false) { + $images-prefixed: (); + + @for $i from 1 through length($images) { + $type: type-of(nth($images, $i)); // Get type of variable - List or String + + // If variable is a list - Gradient + @if $type == list { + $gradient-type: nth(nth($images, $i), 1); // Get type of gradient (linear || radial) + $gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue) + + $gradient: render-gradients($gradient-args, $gradient-type, $vendor); + $images-prefixed: append($images-prefixed, $gradient, comma); + } + + // If variable is a string - Image + @else if $type == string { + $images-prefixed: join($images-prefixed, nth($images, $i), comma); + } + } + @return $images-prefixed; +} + + + +//Examples: + //@include background-image(linear-gradient(top, orange, red)); + //@include background-image(radial-gradient(50% 50%, cover circle, orange, red)); + //@include background-image(url("/images/a.png"), linear-gradient(orange, red)); + //@include background-image(url("image.png"), linear-gradient(orange, red), url("image.png")); + //@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red); diff --git a/assets/stylesheets/globals/bourbon/css3/_background-size.scss b/assets/stylesheets/globals/bourbon/css3/_background-size.scss new file mode 100644 index 0000000..079460f --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_background-size.scss @@ -0,0 +1,11 @@ +@mixin background-size ($length-1, + $length-2: false, $length-3: false, + $length-4: false, $length-5: false, + $length-6: false, $length-7: false, + $length-8: false, $length-9: false) + { + $full: compact($length-1, $length-2, $length-3, $length-4, + $length-5, $length-6, $length-7, $length-8, $length-9); + +@include prefixer(background-size, $full, webkit, moz, ms, o); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_background.scss b/assets/stylesheets/globals/bourbon/css3/_background.scss new file mode 100644 index 0000000..70d0d7e --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_background.scss @@ -0,0 +1,107 @@ +//************************************************************************// +// Background property for adding multiple backgrounds using shorthand +// notation. +//************************************************************************// + +@mixin background( + $background-1 , $background-2: false, + $background-3: false, $background-4: false, + $background-5: false, $background-6: false, + $background-7: false, $background-8: false, + $background-9: false, $background-10: false, + $fallback: false +) { + $backgrounds: compact($background-1, $background-2, + $background-3, $background-4, + $background-5, $background-6, + $background-7, $background-8, + $background-9, $background-10); + + $fallback-color: false; + @if (type-of($fallback) == color) or ($fallback == "transparent") { + $fallback-color: $fallback; + } + @else { + $fallback-color: extract-background-color($backgrounds); + } + + @if $fallback-color { + background-color: $fallback-color; + } + background: background-add-prefix($backgrounds, webkit); + background: background-add-prefix($backgrounds, moz); + background: background-add-prefix($backgrounds, ms); + background: background-add-prefix($backgrounds, o); + background: background-add-prefix($backgrounds); +} + +@function extract-background-color($backgrounds) { + $final-bg-layer: nth($backgrounds, length($backgrounds)); + @if type-of($final-bg-layer) == list { + @for $i from 1 through length($final-bg-layer) { + $value: nth($final-bg-layer, $i); + @if type-of($value) == color { + @return $value; + } + } + } + @return false; +} + + +@function background-add-prefix($backgrounds, $vendor: false) { + $backgrounds-prefixed: (); + + @for $i from 1 through length($backgrounds) { + $shorthand: nth($backgrounds, $i); // Get member for current index + $type: type-of($shorthand); // Get type of variable - List or String + + // If shorthand is a list + @if $type == list { + $first-member: nth($shorthand, 1); // Get first member of shorthand + + // Linear Gradient + @if index(linear radial, nth($first-member, 1)) { + $gradient-type: nth($first-member, 1); // linear || radial + + // Get actual gradient (red, blue) + $gradient-args: false; + $shorthand-start: false; + // Linear gradient and positioning, repeat, etc. values + @if type-of($first-member) == list { + $gradient-args: nth($first-member, 2); + $shorthand-start: 2; + } + // Linear gradient only + @else { + $gradient-args: nth($shorthand, 2); // Get actual gradient (red, blue) + $shorthand-start: 3; + } + + $gradient: render-gradients($gradient-args, $gradient-type, $vendor); + @for $j from $shorthand-start through length($shorthand) { + $gradient: join($gradient, nth($shorthand, $j), space); + } + $backgrounds-prefixed: append($backgrounds-prefixed, $gradient, comma); + } + + // Image with additional properties + @else { + $backgrounds-prefixed: append($backgrounds-prefixed, $shorthand, comma); + } + + } + + // If shorthand is a simple string, color or image + @else if $type == string { + $backgrounds-prefixed: join($backgrounds-prefixed, $shorthand, comma); + } + } + @return $backgrounds-prefixed; +} + +//Examples: + //@include background(linear-gradient(top, orange, red)); + //@include background(radial-gradient(50% 50%, cover circle, orange, red)); + //@include background(url("/images/a.png") no-repeat, linear-gradient(orange, red)); + //@include background(url("image.png") center center, linear-gradient(orange, red), url("image.png")); diff --git a/assets/stylesheets/globals/bourbon/css3/_border-image.scss b/assets/stylesheets/globals/bourbon/css3/_border-image.scss new file mode 100644 index 0000000..da4f20b --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_border-image.scss @@ -0,0 +1,56 @@ +@mixin border-image($images) { + -webkit-border-image: border-add-prefix($images, webkit); + -moz-border-image: border-add-prefix($images, moz); + -o-border-image: border-add-prefix($images, o); + border-image: border-add-prefix($images); +} + +@function border-add-prefix($images, $vendor: false) { + $border-image: (); + $images-type: type-of(nth($images, 1)); + $first-var: nth(nth($images, 1), 1); // Get type of Gradient (Linear || radial) + + // If input is a gradient + @if $images-type == string { + @if ($first-var == "linear") or ($first-var == "radial") { + @for $i from 2 through length($images) { + $gradient-type: nth($images, 1); // Get type of gradient (linear || radial) + $gradient-args: nth($images, $i); // Get actual gradient (red, blue) + $border-image: render-gradients($gradient-args, $gradient-type, $vendor); + } + } + + // If input is a URL + @else { + $border-image: $images; + } + } + + // If input is gradient or url + additional args + @else if $images-type == list { + @for $i from 1 through length($images) { + $type: type-of(nth($images, $i)); // Get type of variable - List or String + + // If variable is a list - Gradient + @if $type == list { + $gradient-type: nth(nth($images, $i), 1); // Get type of gradient (linear || radial) + $gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue) + $border-image: render-gradients($gradient-args, $gradient-type, $vendor); + } + + // If variable is a string - Image or number + @else if ($type == string) or ($type == number) { + $border-image: append($border-image, nth($images, $i)); + } + } + } + @return $border-image; +} + +//Examples: +// @include border-image(url("image.png")); +// @include border-image(url("image.png") 20 stretch); +// @include border-image(linear-gradient(45deg, orange, yellow)); +// @include border-image(linear-gradient(45deg, orange, yellow) stretch); +// @include border-image(linear-gradient(45deg, orange, yellow) 20 30 40 50 stretch round); +// @include border-image(radial-gradient(top, cover, orange, yellow, orange)); diff --git a/assets/stylesheets/globals/bourbon/css3/_border-radius.scss b/assets/stylesheets/globals/bourbon/css3/_border-radius.scss new file mode 100644 index 0000000..3802e6d --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_border-radius.scss @@ -0,0 +1,39 @@ +@mixin border-radius ($radii) { + @include prefixer(border-radius, $radii, webkit, not moz); +} + +@mixin border-top-left-radius($radii) { + @include prefixer(border-top-left-radius, $radii, webkit, not moz); +} + +@mixin border-top-right-radius($radii) { + @include prefixer(border-top-right-radius, $radii, webkit, not moz); +} + +@mixin border-bottom-left-radius($radii) { + @include prefixer(border-bottom-left-radius, $radii, webkit, not moz); +} + +@mixin border-bottom-right-radius($radii) { + @include prefixer(border-bottom-right-radius, $radii, webkit, not moz); +} + +@mixin border-top-radius($radii) { + @include border-top-left-radius($radii); + @include border-top-right-radius($radii); +} + +@mixin border-right-radius($radii) { + @include border-top-right-radius($radii); + @include border-bottom-right-radius($radii); +} + +@mixin border-bottom-radius($radii) { + @include border-bottom-left-radius($radii); + @include border-bottom-right-radius($radii); +} + +@mixin border-left-radius($radii) { + @include border-top-left-radius($radii); + @include border-bottom-left-radius($radii); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_box-shadow.scss b/assets/stylesheets/globals/bourbon/css3/_box-shadow.scss new file mode 100644 index 0000000..7f98117 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_box-shadow.scss @@ -0,0 +1,12 @@ +// Box-Shadow Mixin Requires Sass v3.1.1+ +@mixin box-shadow ($shadow-1, + $shadow-2: false, $shadow-3: false, + $shadow-4: false, $shadow-5: false, + $shadow-6: false, $shadow-7: false, + $shadow-8: false, $shadow-9: false) + { + $full: compact($shadow-1, $shadow-2, $shadow-3, $shadow-4, + $shadow-5, $shadow-6, $shadow-7, $shadow-8, $shadow-9); + + @include prefixer(box-shadow, $full, webkit, not moz); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_box-sizing.scss b/assets/stylesheets/globals/bourbon/css3/_box-sizing.scss new file mode 100644 index 0000000..8b629f9 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_box-sizing.scss @@ -0,0 +1,4 @@ +@mixin box-sizing ($box) { +// content-box | border-box | inherit + @include prefixer(box-sizing, $box); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_columns.scss b/assets/stylesheets/globals/bourbon/css3/_columns.scss new file mode 100644 index 0000000..8e06cb5 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_columns.scss @@ -0,0 +1,47 @@ +@mixin columns($arg: auto) { +// || + @include prefixer(columns, $arg); +} + +@mixin column-count($int: auto) { +// auto || integer + @include prefixer(column-count, $int); +} + +@mixin column-gap($length: normal) { +// normal || length + @include prefixer(column-gap, $length); +} + +@mixin column-fill($arg: auto) { +// auto || length + @include prefixer(columns-fill, $arg); +} + +@mixin column-rule($arg) { +// || || + @include prefixer(column-rule, $arg); +} + +@mixin column-rule-color($color) { + @include prefixer(column-rule-color, $color); +} + +@mixin column-rule-style($style: none) { +// none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid + @include prefixer(column-rule-style, $style); +} + +@mixin column-rule-width ($width: none) { + @include prefixer(column-rule-width, $width); +} + +@mixin column-span($arg: none) { +// none || all + @include prefixer(column-span, $arg); +} + +@mixin column-width($length: auto) { +// auto || length + @include prefixer(column-width, $length); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_flex-box.scss b/assets/stylesheets/globals/bourbon/css3/_flex-box.scss new file mode 100644 index 0000000..72c7dab --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_flex-box.scss @@ -0,0 +1,52 @@ +// CSS3 Flexible Box Model and property defaults + +// Custom shorthand notation for flexbox +@mixin box($orient: inline-axis, $pack: start, $align: stretch) { + @include display-box; + @include box-orient($orient); + @include box-pack($pack); + @include box-align($align); +} + +@mixin display-box { + display: -webkit-box; + display: -moz-box; + display: box; +} + +@mixin box-orient($orient: inline-axis) { +// horizontal|vertical|inline-axis|block-axis|inherit + @include prefixer(box-orient, $orient); +} + +@mixin box-pack($pack: start) { +// start|end|center|justify + @include prefixer(box-pack, $pack); +} + +@mixin box-align($align: stretch) { +// start|end|center|baseline|stretch + @include prefixer(box-align, $align); +} + +@mixin box-direction($direction: normal) { +// normal|reverse|inherit + @include prefixer(box-direction, $direction); +} + +@mixin box-lines($lines: single) { +// single|multiple + @include prefixer(box-lines, $lines); +} + +@mixin box-ordinal-group($int: 1) { + @include prefixer(box-ordinal-group, $int); +} + +@mixin box-flex($value: 0.0) { + @include prefixer(box-flex, $value); +} + +@mixin box-flex-group($int: 1) { + @include prefixer(box-flex-group, $int); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_inline-block.scss b/assets/stylesheets/globals/bourbon/css3/_inline-block.scss new file mode 100644 index 0000000..3272a00 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_inline-block.scss @@ -0,0 +1,8 @@ +// Legacy support for inline-block in IE7 (maybe IE6) +@mixin inline-block { + display: inline-block; + vertical-align: baseline; + zoom: 1; + *display: inline; + *vertical-align: auto; +} diff --git a/assets/stylesheets/globals/bourbon/css3/_linear-gradient.scss b/assets/stylesheets/globals/bourbon/css3/_linear-gradient.scss new file mode 100644 index 0000000..4d880d7 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_linear-gradient.scss @@ -0,0 +1,43 @@ +@mixin linear-gradient($pos, $G1, $G2: false, + $G3: false, $G4: false, + $G5: false, $G6: false, + $G7: false, $G8: false, + $G9: false, $G10: false, + $deprecated-pos1: left top, + $deprecated-pos2: left bottom, + $fallback: false) { + // Detect what type of value exists in $pos + $pos-type: type-of(nth($pos, 1)); + + // If $pos is missing from mixin, reassign vars and add default position + @if ($pos-type == color) or (nth($pos, 1) == "transparent") { + $G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5; + $G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos; + $pos: top; // Default position + } + + $full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10); + + // Set $G1 as the default fallback color + $fallback-color: nth($G1, 1); + + // If $fallback is a color use that color as the fallback color + @if (type-of($fallback) == color) or ($fallback == "transparent") { + $fallback-color: $fallback; + } + + background-color: $fallback-color; + background-image: deprecated-webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $full); // Safari <= 5.0 + background-image: -webkit-linear-gradient($pos, $full); // Safari 5.1+, Chrome + background-image: -moz-linear-gradient($pos, $full); + background-image: -ms-linear-gradient($pos, $full); + background-image: -o-linear-gradient($pos, $full); + background-image: unquote("linear-gradient(#{$pos}, #{$full})"); +} + + +// Usage: Gradient position is optional, default is top. Position can be a degree. Color stops are optional as well. +// @include linear-gradient(#1e5799, #2989d8); +// @include linear-gradient(#1e5799, #2989d8, $fallback:#2989d8); +// @include linear-gradient(top, #1e5799 0%, #2989d8 50%); +// @include linear-gradient(50deg, rgba(10, 10, 10, 0.5) 0%, #2989d8 50%, #207cca 51%, #7db9e8 100%); diff --git a/assets/stylesheets/globals/bourbon/css3/_prefixer.scss b/assets/stylesheets/globals/bourbon/css3/_prefixer.scss new file mode 100644 index 0000000..16b3ad6 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_prefixer.scss @@ -0,0 +1,12 @@ +@mixin prefixer ($property, $value, + $webkit: true, + $moz: true, + $ms: false, + $o: false, + $spec: true) { + @if $webkit { -webkit-#{$property}: $value; } + @if $moz { -moz-#{$property}: $value; } + @if $ms { -ms-#{$property}: $value; } + @if $o { -o-#{$property}: $value; } + @if $spec { #{$property}: $value; } +} diff --git a/assets/stylesheets/globals/bourbon/css3/_radial-gradient.scss b/assets/stylesheets/globals/bourbon/css3/_radial-gradient.scss new file mode 100644 index 0000000..5e32c1e --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_radial-gradient.scss @@ -0,0 +1,76 @@ +// Requires Sass 3.1+ +@mixin radial-gradient($G1, $G2, + $G3: false, $G4: false, + $G5: false, $G6: false, + $G7: false, $G8: false, + $G9: false, $G10: false, + $pos: 50% 50%, + $shape-size: ellipse cover, + $deprecated-pos1: center center, + $deprecated-pos2: center center, + $deprecated-radius1: 0, + $deprecated-radius2: 460, + $fallback: false) { + + @each $value in $G1, $G2 { + $first-val: nth($value, 1); + $pos-type: type-of($first-val); + + @if ($pos-type != color) or ($first-val != "transparent") { + @if ($pos-type == number) + or ($first-val == "center") + or ($first-val == "top") + or ($first-val == "right") + or ($first-val == "bottom") + or ($first-val == "left") { + + $pos: $value; + + @if $pos == $G1 { + $G1: false; + } + } + + @else if + ($first-val == "ellipse") + or ($first-val == "circle") + or ($first-val == "closest-side") + or ($first-val == "closest-corner") + or ($first-val == "farthest-side") + or ($first-val == "farthest-corner") + or ($first-val == "contain") + or ($first-val == "cover") { + + $shape-size: $value; + + @if $value == $G1 { + $G1: false; + } + + @else if $value == $G2 { + $G2: false; + } + } + } + } + + $full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10); + + $fallback-color: nth($G1, 1); + + @if (type-of($fallback) == color) or ($fallback == "transparent") { + $fallback-color: $fallback; + } + + background-color: $fallback-color; + background-image: deprecated-webkit-gradient(radial, $deprecated-pos1, $deprecated-pos2, $full, $deprecated-radius1, $deprecated-radius2); // Safari <= 5.0 + background-image: -webkit-radial-gradient($pos, $shape-size, $full); + background-image: -moz-radial-gradient($pos, $shape-size, $full); + background-image: -ms-radial-gradient($pos, $shape-size, $full); + background-image: -o-radial-gradient($pos, $shape-size, $full); + background-image: unquote("radial-gradient(#{$pos}, #{$shape-size}, #{$full})"); +} + +// Usage: Gradient position and shape-size are required. Color stops are optional. +// @include radial-gradient(50% 50%, circle cover, #1e5799, #efefef); +// @include radial-gradient(50% 50%, circle cover, #eee 10%, #1e5799 30%, #efefef); diff --git a/assets/stylesheets/globals/bourbon/css3/_transform.scss b/assets/stylesheets/globals/bourbon/css3/_transform.scss new file mode 100644 index 0000000..35737ad --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_transform.scss @@ -0,0 +1,11 @@ +@mixin transform($property: none) { +// none | + @include prefixer(transform, $property, webkit, moz, ms, o); +} + +@mixin transform-origin($axes: 50%) { +// x-axis - left | center | right | length | % +// y-axis - top | center | bottom | length | % +// z-axis - length + @include prefixer(transform-origin, $axes, webkit, moz, ms, o); +} diff --git a/assets/stylesheets/globals/bourbon/css3/_transition.scss b/assets/stylesheets/globals/bourbon/css3/_transition.scss new file mode 100644 index 0000000..e736978 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_transition.scss @@ -0,0 +1,72 @@ +// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable. +// Example: @include transition (all, 2.0s, ease-in-out); +// @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s)); +// @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s)); + +@mixin transition ($prop-1: all 0.15s ease-out 0, + $prop-2: false, $prop-3: false, + $prop-4: false, $prop-5: false, + $prop-6: false, $prop-7: false, + $prop-8: false, $prop-9: false) + { + $full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5, + $prop-6, $prop-7, $prop-8, $prop-9); + + @include prefixer(transition, $full, webkit, moz, ms, o); +} + + + +@mixin transition-property ($prop-1: all, + $prop-2: false, $prop-3: false, + $prop-4: false, $prop-5: false, + $prop-6: false, $prop-7: false, + $prop-8: false, $prop-9: false) + { + $full: compact($prop-1, $prop-2, $prop-3, $prop-4, $prop-5, + $prop-6, $prop-7, $prop-8, $prop-9); + + -webkit-transition-property: transition-property-names($full, 'webkit'); + -moz-transition-property: transition-property-names($full, 'moz'); + -ms-transition-property: transition-property-names($full, 'ms'); + -o-transition-property: transition-property-names($full, 'o'); + transition-property: transition-property-names($full, false); +} + +@mixin transition-duration ($time-1: 0, + $time-2: false, $time-3: false, + $time-4: false, $time-5: false, + $time-6: false, $time-7: false, + $time-8: false, $time-9: false) + { + $full: compact($time-1, $time-2, $time-3, $time-4, $time-5, + $time-6, $time-7, $time-8, $time-9); + + @include prefixer(transition-duration, $full, webkit, moz, ms, o); +} + +@mixin transition-timing-function ($motion-1: ease, + $motion-2: false, $motion-3: false, + $motion-4: false, $motion-5: false, + $motion-6: false, $motion-7: false, + $motion-8: false, $motion-9: false) + { + $full: compact($motion-1, $motion-2, $motion-3, $motion-4, $motion-5, + $motion-6, $motion-7, $motion-8, $motion-9); + +// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier() + @include prefixer(transition-timing-function, $full, webkit, moz, ms, o); +} + +@mixin transition-delay ($time-1: 0, + $time-2: false, $time-3: false, + $time-4: false, $time-5: false, + $time-6: false, $time-7: false, + $time-8: false, $time-9: false) + { + $full: compact($time-1, $time-2, $time-3, $time-4, $time-5, + $time-6, $time-7, $time-8, $time-9); + + @include prefixer(transition-delay, $full, webkit, moz, ms, o); +} + diff --git a/assets/stylesheets/globals/bourbon/css3/_user-select.scss b/assets/stylesheets/globals/bourbon/css3/_user-select.scss new file mode 100644 index 0000000..66cd0e3 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/css3/_user-select.scss @@ -0,0 +1,3 @@ +@mixin user-select($arg: none) { + @include prefixer(user-select, $arg, webkit, moz, ms); +} diff --git a/assets/stylesheets/globals/bourbon/functions/_deprecated-webkit-gradient.scss b/assets/stylesheets/globals/bourbon/functions/_deprecated-webkit-gradient.scss new file mode 100644 index 0000000..16747d6 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_deprecated-webkit-gradient.scss @@ -0,0 +1,44 @@ +// Render Deprecated Webkit Gradient - Linear || Radial +//************************************************************************// +@function deprecated-webkit-gradient($type, + $deprecated-pos1, $deprecated-pos2, + $full, + $deprecated-radius1: false, $deprecated-radius2: false) { + $gradient-list: (); + $gradient: false; + $full-length: length($full); + $percentage: false; + $gradient-type: $type; + + @for $i from 1 through $full-length { + $gradient: nth($full, $i); + + @if length($gradient) == 2 { + $color-stop: color-stop(nth($gradient, 2), nth($gradient, 1)); + $gradient-list: join($gradient-list, $color-stop, comma); + } + + @else { + @if $i == $full-length { + $percentage: 100%; + } + + @else { + $percentage: ($i - 1) * (100 / ($full-length - 1)) + "%"; + } + + $color-stop: color-stop(unquote($percentage), $gradient); + $gradient-list: join($gradient-list, $color-stop, comma); + } + } + + @if $type == radial { + $gradient: -webkit-gradient(radial, $deprecated-pos1, $deprecated-radius1, $deprecated-pos2, $deprecated-radius2, $gradient-list); + } + + @else if $type == linear { + $gradient: -webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $gradient-list); + } + + @return $gradient; +} diff --git a/assets/stylesheets/globals/bourbon/functions/_flex-grid.scss b/assets/stylesheets/globals/bourbon/functions/_flex-grid.scss new file mode 100644 index 0000000..707f994 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_flex-grid.scss @@ -0,0 +1,35 @@ +// Flexible grid +@function flex-grid($columns, $container-columns: $fg-max-columns) { + $width: $columns * $fg-column + ($columns - 1) * $fg-gutter; + $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter; + @return percentage($width / $container-width); +} + +// Flexible gutter +@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) { + $container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter; + @return percentage($gutter / $container-width); +} + +// The $fg-column, $fg-gutter and $fg-max-columns variables must be defined in your base stylesheet to properly use the flex-grid function. +// This function takes the fluid grid equation (target / context = result) and uses columns to help define each. +// +// $fg-column: 60px; // Column Width +// $fg-gutter: 25px; // Gutter Width +// $fg-max-columns: 12; // Total Columns For Main Container +// +// div { +// width: flex-grid(4); // returns (315px / 1020px) = 30.882353%; +// margin-left: flex-gutter(); // returns (25px / 1020px) = 2.45098%; +// +// p { +// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%; +// float: left; +// margin: flex-gutter(4); // returns (25px / 315px) = 7.936508%; +// } +// +// blockquote { +// float: left; +// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%; +// } +// } diff --git a/assets/stylesheets/globals/bourbon/functions/_grid-width.scss b/assets/stylesheets/globals/bourbon/functions/_grid-width.scss new file mode 100644 index 0000000..8e63d83 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_grid-width.scss @@ -0,0 +1,13 @@ +@function grid-width($n) { + @return $n * $gw-column + ($n - 1) * $gw-gutter; +} + +// The $gw-column and $gw-gutter variables must be defined in your base stylesheet to properly use the grid-width function. +// +// $gw-column: 100px; // Column Width +// $gw-gutter: 40px; // Gutter Width +// +// div { +// width: grid-width(4); // returns 520px; +// margin-left: $gw-gutter; // returns 40px; +// } diff --git a/assets/stylesheets/globals/bourbon/functions/_linear-gradient.scss b/assets/stylesheets/globals/bourbon/functions/_linear-gradient.scss new file mode 100644 index 0000000..3b10ca8 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_linear-gradient.scss @@ -0,0 +1,23 @@ +@function linear-gradient($pos: top, $G1: false, $G2: false, + $G3: false, $G4: false, + $G5: false, $G6: false, + $G7: false, $G8: false, + $G9: false, $G10: false) { + + // Detect what type of value exists in $pos + $pos-type: type-of(nth($pos, 1)); + + // If $pos is missing from mixin, reassign vars and add default position + @if ($pos-type == color) or (nth($pos, 1) == "transparent") { + $G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5; + $G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos; + $pos: top; // Default position + } + + $type: linear; + $gradient: compact($pos, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10); + $type-gradient: append($type, $gradient, comma); + + @return $type-gradient; +} + diff --git a/assets/stylesheets/globals/bourbon/functions/_modular-scale.scss b/assets/stylesheets/globals/bourbon/functions/_modular-scale.scss new file mode 100644 index 0000000..dddccb5 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_modular-scale.scss @@ -0,0 +1,40 @@ +@function modular-scale($value, $increment, $ratio) { + @if $increment > 0 { + @for $i from 1 through $increment { + $value: ($value * $ratio); + } + } + + @if $increment < 0 { + $increment: abs($increment); + @for $i from 1 through $increment { + $value: ($value / $ratio); + } + } + + @return $value; +} + +// div { +// Increment Up GR with positive value +// font-size: modular-scale(14px, 1, 1.618); // returns: 22.652px +// +// Increment Down GR with negative value +// font-size: modular-scale(14px, -1, 1.618); // returns: 8.653px +// +// Can be used with ceil(round up) or floor(round down) +// font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px +// font-size: ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px +// } +// +// modularscale.com + +@function golden-ratio($value, $increment) { + @return modular-scale($value, $increment, 1.618) +} + +// div { +// font-size: golden-ratio(14px, 1); // returns: 22.652px +// } +// +// goldenratiocalculator.com diff --git a/assets/stylesheets/globals/bourbon/functions/_radial-gradient.scss b/assets/stylesheets/globals/bourbon/functions/_radial-gradient.scss new file mode 100644 index 0000000..1f45441 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_radial-gradient.scss @@ -0,0 +1,62 @@ +// This function is required and used by the background-image mixin. +@function radial-gradient($G1, $G2, + $G3: false, $G4: false, + $G5: false, $G6: false, + $G7: false, $G8: false, + $G9: false, $G10: false, + $pos: 50% 50%, + $shape-size: ellipse cover, + $deprecated-pos1: center center, + $deprecated-pos2: center center, + $deprecated-radius1: 0, + $deprecated-radius2: 50, + $fallback: false) { + + @each $value in $G1, $G2 { + $first-val: nth($value, 1); + $pos-type: type-of($first-val); + + @if ($pos-type != color) or ($first-val != "transparent") { + @if ($pos-type == number) + or ($first-val == "center") + or ($first-val == "top") + or ($first-val == "right") + or ($first-val == "bottom") + or ($first-val == "left") { + + $pos: $value; + + @if $pos == $G1 { + $G1: false; + } + } + + @else if + ($first-val == "ellipse") + or ($first-val == "circle") + or ($first-val == "closest-side") + or ($first-val == "closest-corner") + or ($first-val == "farthest-side") + or ($first-val == "farthest-corner") + or ($first-val == "contain") + or ($first-val == "cover") { + + $shape-size: $value; + + @if $value == $G1 { + $G1: false; + } + + @else if $value == $G2 { + $G2: false; + } + } + } + } + + $type: radial; + $gradient: compact($pos, $shape-size, $G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10); + $type-gradient: append($type, $gradient, comma); + + @return $type-gradient; +} diff --git a/assets/stylesheets/globals/bourbon/functions/_render-gradients.scss b/assets/stylesheets/globals/bourbon/functions/_render-gradients.scss new file mode 100644 index 0000000..fe7c799 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_render-gradients.scss @@ -0,0 +1,14 @@ +// User for linear and radial gradients within background-image or border-image properties + +@function render-gradients($gradients, $gradient-type, $vendor: false) { + $vendor-gradients: false; + @if $vendor { + $vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient($gradients); + } + + @else if $vendor == false { + $vendor-gradients: "#{$gradient-type}-gradient(#{$gradients})"; + $vendor-gradients: unquote($vendor-gradients); + } + @return $vendor-gradients; +} diff --git a/assets/stylesheets/globals/bourbon/functions/_tint-shade.scss b/assets/stylesheets/globals/bourbon/functions/_tint-shade.scss new file mode 100644 index 0000000..f717200 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_tint-shade.scss @@ -0,0 +1,9 @@ +// Add percentage of white to a color +@function tint($color, $percent){ + @return mix(white, $color, $percent); +} + +// Add percentage of black to a color +@function shade($color, $percent){ + @return mix(black, $color, $percent); +} diff --git a/assets/stylesheets/globals/bourbon/functions/_transition-property-name.scss b/assets/stylesheets/globals/bourbon/functions/_transition-property-name.scss new file mode 100644 index 0000000..54cd422 --- /dev/null +++ b/assets/stylesheets/globals/bourbon/functions/_transition-property-name.scss @@ -0,0 +1,22 @@ +// Return vendor-prefixed property names if appropriate +// Example: transition-property-names((transform, color, background), moz) -> -moz-transform, color, background +//************************************************************************// +@function transition-property-names($props, $vendor: false) { + $new-props: (); + + @each $prop in $props { + $new-props: append($new-props, transition-property-name($prop, $vendor), comma); + } + + @return $new-props; +} + +@function transition-property-name($prop, $vendor: false) { + // put other properties that need to be prefixed here aswell + @if $vendor and $prop == transform { + @return unquote('-'+$vendor+'-'+$prop); + } + @else { + @return $prop; + } +} \ No newline at end of file diff --git a/assets/stylesheets/main.scss b/assets/stylesheets/main.scss new file mode 100644 index 0000000..ccedc29 --- /dev/null +++ b/assets/stylesheets/main.scss @@ -0,0 +1,18 @@ +// Reset file for standardizing the page +// @import "globals/_reset"; + +// Base file contains all the global styles +@import "globals/_base"; + +// File for global Uranium stylings +@import "globals/_uranium.scss"; + +// Site wide variables +@import "globals/_variables.scss"; + +// Header & Footer +@import "sections/_header"; +@import "sections/_footer"; + +// Pages +@import "pages/_home"; diff --git a/assets/stylesheets/pages/_home.scss b/assets/stylesheets/pages/_home.scss new file mode 100644 index 0000000..8a14dc2 --- /dev/null +++ b/assets/stylesheets/pages/_home.scss @@ -0,0 +1,5 @@ +// Every page should have a class on the body +// Scope that in each file at the start +._home { + +} \ No newline at end of file diff --git a/assets/stylesheets/sections/_footer.scss b/assets/stylesheets/sections/_footer.scss new file mode 100644 index 0000000..ee2a027 --- /dev/null +++ b/assets/stylesheets/sections/_footer.scss @@ -0,0 +1,3 @@ +footer._footer { + +} \ No newline at end of file diff --git a/assets/stylesheets/sections/_header.scss b/assets/stylesheets/sections/_header.scss new file mode 100644 index 0000000..edccda2 --- /dev/null +++ b/assets/stylesheets/sections/_header.scss @@ -0,0 +1,3 @@ +header._header { + +} \ No newline at end of file diff --git a/config.json b/config.json new file mode 100644 index 0000000..03abde3 --- /dev/null +++ b/config.json @@ -0,0 +1,6 @@ +{ + "host_map": [ + "$.teamquest.com => www.teamquest.com", + "$.teamquest.com => teamquest.com" + ] +} diff --git a/functions/main.ts b/functions/main.ts new file mode 100644 index 0000000..a9bfc7a --- /dev/null +++ b/functions/main.ts @@ -0,0 +1,287 @@ +#################### +### Site Functions +#################### + +# BTN DELEGATE +# +# EXAMPLE CSS +# .mw_hide2 { +# visibility: hidden!important; +# position: absolute!important; +# left: -99999px!important; +# } + +# EXAMPLE TS +# +# $(".//input[@type='submit']") { +# attributes(id: "mw_id", alt: "mw_alt") +# +# btn_delegate() { +# add_class("mw_btn_500000000050") +# // in a pinch you can do other scoping in here +# } +# } + +@func XMLNode.btn_delegate() { + %class = fetch("./@class") + %mw_id = concat("mw_", name(), "_", fetch("./@id")) + %text = fetch("./@alt") + + %text { + replace(/_/, " ") + } + + insert_before("div", %text, class: %class) { + attributes(onclick: concat("var event=arguments[0]||window.event;event.preventDefault;event.stopPropagation;x$('[data-mw-btn-id=\"", %mw_id, "\"]').click()")) + + yield() + } + + attributes(data-mw-btn-id: %mw_id) + add_class("mw_hide2") +} + + +# A compendium of ways to "dump" tables +# +# +# EXAMPLE:: +# +# table_dump(".//table") { +# $("./div[class='some_class']") { +# add_class("mw_more_scopes") +# } +# } +# +# +@func XMLNode.table_dump(Text %xpath){ + $(%xpath) { + name("div") + add_class("mw_was_table") + + $(".//table | .//tr | .//td | .//th | .//thead | .//tfoot | .//tbody | .//col | .//colgroup | .//caption") { + %i = index() + %n = name() + name("div") + attributes(data-mw-id: concat("mw_dump_", %n, %i), width: "") + add_class(concat("mw_was_", %n)) + } + + yield() + } +} + + + +# Remove Styles Functions +@func XMLNode.remove_external_styles() { + remove(".//link[@rel='stylesheet'][not(@data-mw-keep)]") +} +@func XMLNode.remove_internal_styles() { + remove(".//style") +} +@func XMLNode.remove_all_styles() { + remove(".//link[@rel='stylesheet'][not(@data-mw-keep)]|.//style") +} + +# Remove Scripts +@func XMLNode.remove_external_scripts() { + remove(".//script[@src]") +} +@func XMLNode.remove_internal_scripts() { + remove(".//script[not(@src)]") +} +@func XMLNode.remove_scripts() { + remove(".//script") +} +@func XMLNode.remove_desktop_js() { + remove("//script[@src and (not(@data-keep) or @data-keep='false')]") +} + +# Remove HTML Comment Tags +@func XMLNode.remove_html_comments() { + remove(".//comment()") +} + +# Remove existing conflicting meta tags +@func XMLNode.remove_meta_tags() { + # Remove only existing meta tags for which we will add our own + remove(".//meta[@name='viewport']|.//meta[@name='format-detection']") +} + +# Add Meta Tags +@func XMLNode.insert_mobile_meta_tags() { + $("/html/head") { + insert("meta", http-equiv: "Content-Type", content: "text/html") + insert("meta", name: "viewport", content: "width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0") + insert("meta", name: "format-detection", content: "telephone=no") + } +} + +# Add Canonical Tag +@func XMLNode.add_canonical_tag() { + $("/html/head") { + # Inject a canonical link as long as there isn't already one. + $canonical_found = "false" + $(".//link[@rel='canonical']") { + $canonical_found = "true" + } + match($canonical_found) { + with(/false/) { + insert("link", rel: "canonical", href: concat("http://", $source_host, $path)) + } + } + } +} + +# Clean Meta Tags +@func XMLNode.clean_mobile_meta_tags() { + remove_meta_tags() + insert_mobile_meta_tags() + add_canonical_tag() +} + +# Add the favicon +@func XMLNode.add_favicon() { + $("/html/head") { + insert("link", rel: "shortcut icon", href: asset("images/favicon.ico")) + } +} + +# Add home screen icons +@func XMLNode.add_apple_touch_icons() { + $("/html/head") { + # The images below are placeholders, get real ones from the client + # Change to -precomposed to not have the glass effect on the icons + insert("link", rel: "apple-touch-icon", href: asset("images/apple-touch-icon-57x57.png")) + insert("link", rel: "apple-touch-icon", href: asset("images/apple-touch-icon-114x114.png")) + } +} + +# Add the generated stylesheet +@func XMLNode.add_mobile_stylesheet() { + $("/html/head") { + insert("link", rel: "stylesheet", type: "text/css", href: sass($device_stylesheet), data-mw-keep: "true") + } +} + +# Add the mobile javascript +# Using the variable-setting logic as relying solely on presence of script tags +# is dangerous when removing js or simply on sites with no js. +@func XMLNode.add_mobile_javascript() { + $("/html/head") { + $noscript="true" + $("./script[1]") { + $noscript="false" + insert_before("script", data-keep: "true", type: "text/javascript", src: asset("javascript/main.js")) + } + match($noscript) { + with("true") { + insert_bottom("script", data-keep: "true", type: "text/javascript", src: asset("javascript/main.js")) + } + } + } +} + +# Add in our Assets +@func XMLNode.add_assets() { + add_favicon() + add_apple_touch_icons() + add_mobile_stylesheet() + add_mobile_javascript() +} + +# Rewrite items +@func XMLNode.rewrite_links() { + $rewriter_url = "false" + $("./body") { + # Rewrite links + $(".//a") { + attribute("href") { + value() { + rewrite("link") + } + } + } + $("/html/head/base[@href]") { + $rewriter_url = fetch("./@href") + $rewriter_url { + replace(/.*(\/\/[\w\.]+\/).*/, "\\1") + } + attribute("href") { + value() { + rewrite("link") + } + } + } + # Rewrite form actions + $(".//form") { + attribute("action") { + value() { + rewrite("link") + } + } + } + } +} + +# Absolutize Items +@func XMLNode.absolutize_srcs() { + # Absolutize IMG and SCRIPT SRCs + var("slash_path") { + # the 'slash_path' is the path of this page without anything following it's last slash + set($path) + replace(/[^\/]+$/, "") + # turn empty string into a single slash because this is the only thing separating the host from the path relative path + replace(/^$/, "/") + } + # Find images and scripts that link to an external host + $(".//img|.//script[@src]") { + # GOTCHAS :: Watch out for captcha images, they most likely should + # not be absolutized + $src = fetch("./@src") + match($rewriter_url) { + not(/false/) { + # Do nothing :: Use base tag value + } + else() { + $rewriter_url = $source_host + } + } + # skip URLs which: are empty, have a host (//www.example.com), or have a protocol (http:// or mailto:) + match($src, /^(?![a-z]+\:)(?!\/\/)(?!$)/) { + attribute("src") { + value() { + match($src) { + with(/^\//) { + # host-relative URL: just add the host + prepend(concat("//", $rewriter_url)) + } + else() { + # path-relative URL: add the host and the path + prepend(concat("//", $rewriter_url, $slash_path)) + } + } + } + } + } + } +} + +@func XMLNode.relocate_scripts() { + $("/html/body/script") { + move_to("/html/body", "bottom") + } +} + +# This function lateloads all images and moves scripts to the bottom of the body, place function at end of html.ts +@func XMLNode.lateload() { + $(".//script") { + move_to("//html/body") + } + $(".//img") { + attribute("src") { + name("data-ur-ll-src") + } + } +} diff --git a/scripts/device_detection.ts b/scripts/device_detection.ts new file mode 100644 index 0000000..d7499fb --- /dev/null +++ b/scripts/device_detection.ts @@ -0,0 +1,19 @@ + +$device_stylesheet = "main" +match($user_agent) { + with(/Android/) { + $device_stylesheet="devices/android" + } + with(/Blackberry/) { + $device_stylesheet="devices/blackberry" + } + with(/iPhone/) { + $device_stylesheet="devices/iphone" + } + with(/iPad/) { + $device_stylesheet="devices/ipad" + } + with(/WebKit/) { + $device_stylesheet="devices/webkit" + } +} \ No newline at end of file diff --git a/scripts/html.ts b/scripts/html.ts new file mode 100644 index 0000000..ac8ed45 --- /dev/null +++ b/scripts/html.ts @@ -0,0 +1,29 @@ +# HTML Transformations go here + +$("/html") { + rewrite_links() + absolutize_srcs() + + + # Add the mobile meta tags + clean_mobile_meta_tags() + + + # Needed to begin mobilizing + remove_all_styles() + remove_html_comments() + + # Late load all the images on the site + # lateload() + + + + + add_assets() + + @import sections/header.ts + @import sections/footer.ts + + @import mappings.ts +} + diff --git a/scripts/main.ts b/scripts/main.ts new file mode 100644 index 0000000..bff1cfd --- /dev/null +++ b/scripts/main.ts @@ -0,0 +1,23 @@ +# The main file executed by Tritium. The start of all other files. + +match($content_type) { + with(/html/) { + replace(/fb:/, "fbn_") # Rewrite the xmlns facebook nodes before the html parser clobbers them + + # Force UTF-8 encoding. If you'd like to auto-detect the encoding, + # simply remove the "UTF-8" argument. e.g. html(){ ... } + html("UTF-8") { + @import device_detection.ts + + @import html.ts + } + + replace(/fbn_/, "fb:") # Rewrite the xmlns facebook nodes to restore them + } + # with(/javascript/) { + # @import ajax.ts + # } + else() { + log(concat("Passing through ", $content_type, " unmodified")) + } +} diff --git a/scripts/mappings.ts b/scripts/mappings.ts new file mode 100644 index 0000000..5a75e6d --- /dev/null +++ b/scripts/mappings.ts @@ -0,0 +1,37 @@ +/* + Mappings + + Mappings are matchers that we use to determine if we should execute a + bit of Tritium during an execution. Aka, run something when we are + are on a certain page. + + Example starting code: +*/ + +match($status) { + + with(/302/) { + log("--> STATUS: 302") # redirect: just let it go through + } + + with(/200/) { + log("--> STATUS: 200") + + match($path) { + with(/^\/$|^\/\?/) { + log("--> Importing pages/home.ts in mappings.ts") + @import pages/home.ts + } + else() { + log("--> No page match in mappings.ts") + } + } + } + + else() { + # not 200 or 302 response status + log("--> STATUS: " + $status + " assuming its an error code pages/error.ts") + @import pages/error.ts + } + +} diff --git a/scripts/pages/error.ts b/scripts/pages/error.ts new file mode 100644 index 0000000..3f62598 --- /dev/null +++ b/scripts/pages/error.ts @@ -0,0 +1 @@ +# Place holder/example file \ No newline at end of file diff --git a/scripts/pages/home.ts b/scripts/pages/home.ts new file mode 100644 index 0000000..3f62598 --- /dev/null +++ b/scripts/pages/home.ts @@ -0,0 +1 @@ +# Place holder/example file \ No newline at end of file diff --git a/scripts/sections/footer.ts b/scripts/sections/footer.ts new file mode 100644 index 0000000..643c764 --- /dev/null +++ b/scripts/sections/footer.ts @@ -0,0 +1,5 @@ +# $("./body") { +# insert_bottom("footer", class: "_footer") { +# Move stuff here +# } +# } diff --git a/scripts/sections/header.ts b/scripts/sections/header.ts new file mode 100644 index 0000000..ee5be01 --- /dev/null +++ b/scripts/sections/header.ts @@ -0,0 +1,5 @@ +# $('./body') { +# insert_top("header", class: "_header") { +# Move stuff here +# } +# } \ No newline at end of file