i(r,p)&&l.push(p);return f&&c(r),l}function ut(n,t,e,r){r=(r||0)-1;for(var u=n?n.length:0,o=[];++r=b&&f===n,h=u||v?a():s;
18 | for(v&&(h=o(h),f=t);++if(h,y))&&((u||v)&&h.push(y),s.push(g))}return v?(l(h.k),c(h)):u&&l(h),s}function lt(n){return function(t,e,r){var u={};e=J.createCallback(e,r,3),r=-1;var o=t?t.length:0;if(typeof o=="number")for(;++re?Ie(0,o+e):e)||0,Te(n)?i=-1o&&(o=a)}}else t=null==t&&kt(n)?r:J.createCallback(t,e,3),St(n,function(n,e,r){e=t(n,e,r),e>u&&(u=e,o=n)});return o}function Dt(n,t,e,r){if(!n)return e;var u=3>arguments.length;t=J.createCallback(t,r,4);var o=-1,i=n.length;if(typeof i=="number")for(u&&(e=n[++o]);++oarguments.length;return t=J.createCallback(t,r,4),Et(n,function(n,r,o){e=u?(u=false,n):t(e,n,r,o)}),e}function Tt(n){var t=-1,e=n?n.length:0,r=Xt(typeof e=="number"?e:0);return St(n,function(n){var e=at(0,++t);r[t]=r[e],r[e]=n}),r}function Ft(n,t,e){var r;t=J.createCallback(t,e,3),e=-1;var u=n?n.length:0;if(typeof u=="number")for(;++er?Ie(0,u+r):r||0}else if(r)return r=zt(t,e),t[r]===e?r:-1;return n(t,e,r)}function qt(n,t,e){if(typeof t!="number"&&null!=t){var r=0,u=-1,o=n?n.length:0;for(t=J.createCallback(t,e,3);++u>>1,e(n[r])e?0:e);++t=v;
29 | m?(i&&(i=ve(i)),s=f,a=n.apply(l,o)):i||(i=_e(r,v))}return m&&c?c=ve(c):c||t===h||(c=_e(u,t)),e&&(m=true,a=n.apply(l,o)),!m||c||i||(o=l=null),a}}function Ut(n){return n}function Gt(n,t,e){var r=true,u=t&&bt(t);t&&(e||u.length)||(null==e&&(e=t),o=Q,t=n,n=J,u=bt(t)),false===e?r=false:wt(e)&&"chain"in e&&(r=e.chain);var o=n,i=dt(o);St(u,function(e){var u=n[e]=t[e];i&&(o.prototype[e]=function(){var t=this.__chain__,e=this.__wrapped__,i=[e];if(be.apply(i,arguments),i=u.apply(n,i),r||t){if(e===i&&wt(i))return this;
30 | i=new o(i),i.__chain__=t}return i})})}function Ht(){}function Jt(n){return function(t){return t[n]}}function Qt(){return this.__wrapped__}e=e?Y.defaults(G.Object(),e,Y.pick(G,A)):G;var Xt=e.Array,Yt=e.Boolean,Zt=e.Date,ne=e.Function,te=e.Math,ee=e.Number,re=e.Object,ue=e.RegExp,oe=e.String,ie=e.TypeError,ae=[],fe=re.prototype,le=e._,ce=fe.toString,pe=ue("^"+oe(ce).replace(/[.*+?^${}()|[\]\\]/g,"\\$&").replace(/toString| for [^\]]+/g,".*?")+"$"),se=te.ceil,ve=e.clearTimeout,he=te.floor,ge=ne.prototype.toString,ye=vt(ye=re.getPrototypeOf)&&ye,me=fe.hasOwnProperty,be=ae.push,_e=e.setTimeout,de=ae.splice,we=ae.unshift,je=function(){try{var n={},t=vt(t=re.defineProperty)&&t,e=t(n,n,n)&&t
31 | }catch(r){}return e}(),ke=vt(ke=re.create)&&ke,xe=vt(xe=Xt.isArray)&&xe,Ce=e.isFinite,Oe=e.isNaN,Ne=vt(Ne=re.keys)&&Ne,Ie=te.max,Se=te.min,Ee=e.parseInt,Re=te.random,Ae={};Ae[$]=Xt,Ae[T]=Yt,Ae[F]=Zt,Ae[B]=ne,Ae[q]=re,Ae[W]=ee,Ae[z]=ue,Ae[P]=oe,Q.prototype=J.prototype;var De=J.support={};De.funcDecomp=!vt(e.a)&&E.test(s),De.funcNames=typeof ne.name=="string",J.templateSettings={escape:/<%-([\s\S]+?)%>/g,evaluate:/<%([\s\S]+?)%>/g,interpolate:N,variable:"",imports:{_:J}},ke||(nt=function(){function n(){}return function(t){if(wt(t)){n.prototype=t;
32 | var r=new n;n.prototype=null}return r||e.Object()}}());var $e=je?function(n,t){M.value=t,je(n,"__bindData__",M)}:Ht,Te=xe||function(n){return n&&typeof n=="object"&&typeof n.length=="number"&&ce.call(n)==$||false},Fe=Ne?function(n){return wt(n)?Ne(n):[]}:H,Be={"&":"&","<":"<",">":">",'"':""","'":"'"},We=_t(Be),qe=ue("("+Fe(We).join("|")+")","g"),ze=ue("["+Fe(Be).join("")+"]","g"),Pe=ye?function(n){if(!n||ce.call(n)!=q)return false;var t=n.valueOf,e=vt(t)&&(e=ye(t))&&ye(e);return e?n==e||ye(n)==e:ht(n)
33 | }:ht,Ke=lt(function(n,t,e){me.call(n,e)?n[e]++:n[e]=1}),Le=lt(function(n,t,e){(me.call(n,e)?n[e]:n[e]=[]).push(t)}),Me=lt(function(n,t,e){n[e]=t}),Ve=Rt,Ue=vt(Ue=Zt.now)&&Ue||function(){return(new Zt).getTime()},Ge=8==Ee(d+"08")?Ee:function(n,t){return Ee(kt(n)?n.replace(I,""):n,t||0)};return J.after=function(n,t){if(!dt(t))throw new ie;return function(){return 1>--n?t.apply(this,arguments):void 0}},J.assign=U,J.at=function(n){for(var t=arguments,e=-1,r=ut(t,true,false,1),t=t[2]&&t[2][t[1]]===n?1:r.length,u=Xt(t);++e=b&&o(r?e[r]:s)))}var p=e[0],h=-1,g=p?p.length:0,y=[];n:for(;++h(m?t(m,v):f(s,v))){for(r=u,(m||s).push(v);--r;)if(m=i[r],0>(m?t(m,v):f(e[r],v)))continue n;y.push(v)}}for(;u--;)(m=i[u])&&c(m);return l(i),l(s),y},J.invert=_t,J.invoke=function(n,t){var e=p(arguments,2),r=-1,u=typeof t=="function",o=n?n.length:0,i=Xt(typeof o=="number"?o:0);return St(n,function(n){i[++r]=(u?t:n[t]).apply(n,e)}),i},J.keys=Fe,J.map=Rt,J.mapValues=function(n,t,e){var r={};
39 | return t=J.createCallback(t,e,3),h(n,function(n,e,u){r[e]=t(n,e,u)}),r},J.max=At,J.memoize=function(n,t){function e(){var r=e.cache,u=t?t.apply(this,arguments):m+arguments[0];return me.call(r,u)?r[u]:r[u]=n.apply(this,arguments)}if(!dt(n))throw new ie;return e.cache={},e},J.merge=function(n){var t=arguments,e=2;if(!wt(n))return n;if("number"!=typeof t[2]&&(e=t.length),3e?Ie(0,r+e):Se(e,r-1))+1);r--;)if(n[r]===t)return r;return-1},J.mixin=Gt,J.noConflict=function(){return e._=le,this},J.noop=Ht,J.now=Ue,J.parseInt=Ge,J.random=function(n,t,e){var r=null==n,u=null==t;return null==e&&(typeof n=="boolean"&&u?(e=n,n=1):u||typeof t!="boolean"||(e=t,u=true)),r&&u&&(t=1),n=+n||0,u?(t=n,n=0):t=+t||0,e||n%1||t%1?(e=Re(),Se(n+e*(t-n+parseFloat("1e-"+((e+"").length-1))),t)):at(n,t)
50 | },J.reduce=Dt,J.reduceRight=$t,J.result=function(n,t){if(n){var e=n[t];return dt(e)?n[t]():e}},J.runInContext=s,J.size=function(n){var t=n?n.length:0;return typeof t=="number"?t:Fe(n).length},J.some=Ft,J.sortedIndex=zt,J.template=function(n,t,e){var r=J.templateSettings;n=oe(n||""),e=_({},e,r);var u,o=_({},e.imports,r.imports),r=Fe(o),o=xt(o),a=0,f=e.interpolate||S,l="__p+='",f=ue((e.escape||S).source+"|"+f.source+"|"+(f===N?x:S).source+"|"+(e.evaluate||S).source+"|$","g");n.replace(f,function(t,e,r,o,f,c){return r||(r=o),l+=n.slice(a,c).replace(R,i),e&&(l+="'+__e("+e+")+'"),f&&(u=true,l+="';"+f+";\n__p+='"),r&&(l+="'+((__t=("+r+"))==null?'':__t)+'"),a=c+t.length,t
51 | }),l+="';",f=e=e.variable,f||(e="obj",l="with("+e+"){"+l+"}"),l=(u?l.replace(w,""):l).replace(j,"$1").replace(k,"$1;"),l="function("+e+"){"+(f?"":e+"||("+e+"={});")+"var __t,__p='',__e=_.escape"+(u?",__j=Array.prototype.join;function print(){__p+=__j.call(arguments,'')}":";")+l+"return __p}";try{var c=ne(r,"return "+l).apply(v,o)}catch(p){throw p.source=l,p}return t?c(t):(c.source=l,c)},J.unescape=function(n){return null==n?"":oe(n).replace(qe,gt)},J.uniqueId=function(n){var t=++y;return oe(null==n?"":n)+t
52 | },J.all=Ot,J.any=Ft,J.detect=It,J.findWhere=It,J.foldl=Dt,J.foldr=$t,J.include=Ct,J.inject=Dt,Gt(function(){var n={};return h(J,function(t,e){J.prototype[e]||(n[e]=t)}),n}(),false),J.first=Bt,J.last=function(n,t,e){var r=0,u=n?n.length:0;if(typeof t!="number"&&null!=t){var o=u;for(t=J.createCallback(t,e,3);o--&&t(n[o],o,n);)r++}else if(r=t,null==r||e)return n?n[u-1]:v;return p(n,Ie(0,u-r))},J.sample=function(n,t,e){return n&&typeof n.length!="number"&&(n=xt(n)),null==t||e?n?n[at(0,n.length-1)]:v:(n=Tt(n),n.length=Se(Ie(0,t),n.length),n)
53 | },J.take=Bt,J.head=Bt,h(J,function(n,t){var e="sample"!==t;J.prototype[t]||(J.prototype[t]=function(t,r){var u=this.__chain__,o=n(this.__wrapped__,t,r);return u||null!=t&&(!r||e&&typeof t=="function")?new Q(o,u):o})}),J.VERSION="2.4.1",J.prototype.chain=function(){return this.__chain__=true,this},J.prototype.toString=function(){return oe(this.__wrapped__)},J.prototype.value=Qt,J.prototype.valueOf=Qt,St(["join","pop","shift"],function(n){var t=ae[n];J.prototype[n]=function(){var n=this.__chain__,e=t.apply(this.__wrapped__,arguments);
54 | return n?new Q(e,n):e}}),St(["push","reverse","sort","unshift"],function(n){var t=ae[n];J.prototype[n]=function(){return t.apply(this.__wrapped__,arguments),this}}),St(["concat","slice","splice"],function(n){var t=ae[n];J.prototype[n]=function(){return new Q(t.apply(this.__wrapped__,arguments),this.__chain__)}}),J}var v,h=[],g=[],y=0,m=+new Date+"",b=75,_=40,d=" \t\x0B\f\xa0\ufeff\n\r\u2028\u2029\u1680\u180e\u2000\u2001\u2002\u2003\u2004\u2005\u2006\u2007\u2008\u2009\u200a\u202f\u205f\u3000",w=/\b__p\+='';/g,j=/\b(__p\+=)''\+/g,k=/(__e\(.*?\)|\b__t\))\+'';/g,x=/\$\{([^\\}]*(?:\\.[^\\}]*)*)\}/g,C=/\w*$/,O=/^\s*function[ \n\r\t]+\w/,N=/<%=([\s\S]+?)%>/g,I=RegExp("^["+d+"]*0+(?=.$)"),S=/($^)/,E=/\bthis\b/,R=/['\n\r\t\u2028\u2029\\]/g,A="Array Boolean Date Function Math Number Object RegExp String _ attachEvent clearTimeout isFinite isNaN parseInt setTimeout".split(" "),D="[object Arguments]",$="[object Array]",T="[object Boolean]",F="[object Date]",B="[object Function]",W="[object Number]",q="[object Object]",z="[object RegExp]",P="[object String]",K={};
55 | K[B]=false,K[D]=K[$]=K[T]=K[F]=K[W]=K[q]=K[z]=K[P]=true;var L={leading:false,maxWait:0,trailing:false},M={configurable:false,enumerable:false,value:null,writable:false},V={"boolean":false,"function":true,object:true,number:false,string:false,undefined:false},U={"\\":"\\","'":"'","\n":"n","\r":"r","\t":"t","\u2028":"u2028","\u2029":"u2029"},G=V[typeof window]&&window||this,H=V[typeof exports]&&exports&&!exports.nodeType&&exports,J=V[typeof module]&&module&&!module.nodeType&&module,Q=J&&J.exports===H&&H,X=V[typeof global]&&global;!X||X.global!==X&&X.window!==X||(G=X);
56 | var Y=s();typeof define=="function"&&typeof define.amd=="object"&&define.amd?(G._=Y, define(function(){return Y})):H&&J?Q?(J.exports=Y)._=Y:H._=Y:G._=Y}).call(this);
--------------------------------------------------------------------------------
/js/scripts.js:
--------------------------------------------------------------------------------
1 | ;(function( $ ){
2 |
3 | /**
4 | * In genereal you should avoid to use jQuery code in AngularJS
5 | * apps, if you need any jQuery functionality create a directive
6 | *
7 | */
8 | $(document).ready(function() {
9 |
10 | });
11 |
12 |
13 | })( jQuery );
14 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "angularjs-boilerplate",
3 | "version": "1.3.0",
4 | "license": "MIT",
5 | "description": "Simple AngularJS Boilerplate to kick start your new project with SASS support and Gulp watch/build tasks",
6 | "main": "app/app.js",
7 | "devDependencies": {
8 | "browser-sync": "^1.9.1",
9 | "connect": "^3.3.1",
10 | "connect-livereload": "^0.5.0",
11 | "del": "^1.1.1",
12 | "gulp": "^3.8.10",
13 | "gulp-angular-templatecache": "^1.6.0",
14 | "gulp-autoprefixer": "^2.1.0",
15 | "gulp-changed": "^1.1.1",
16 | "gulp-concat": "^2.4.3",
17 | "gulp-filter": "^2.0.0",
18 | "gulp-html-replace": "^1.4.4",
19 | "gulp-load-plugins": "^0.10.0",
20 | "gulp-minify-css": "^1.2.4",
21 | "gulp-minify-html": "^0.1.8",
22 | "gulp-notify": "^2.1.0",
23 | "gulp-rename": "^1.2.0",
24 | "gulp-rev": "^3.0.1",
25 | "gulp-size": "^1.2.0",
26 | "gulp-sourcemaps": "^1.3.0",
27 | "gulp-uglify": "^1.1.0",
28 | "gulp-uncss": "^1.0.0",
29 | "gulp-usemin": "^0.3.11",
30 | "opn": "^1.0.0",
31 | "run-sequence": "^1.0.2",
32 | "serve-index": "^1.5.0",
33 | "serve-static": "^1.7.1",
34 | "tiny-lr": "^0.1.4",
35 | "watch": "^0.13.0"
36 | },
37 | "scripts": {
38 | "start": "gulp",
39 | "build": "gulp build",
40 | "server": "gulp server",
41 | "serverbuild": "gulp server-build",
42 | "postinstall": "npm install gulp-sass gulp-imagemin --save&&bower install --no-interactive"
43 | },
44 | "repository": {
45 | "type": "git",
46 | "url": "https://github.com/jbutko/AngularJS-Boilerplate.git"
47 | },
48 | "keywords": [
49 | "angular",
50 | "angularjs",
51 | "boilerplate",
52 | "front-end",
53 | "app",
54 | "single-page",
55 | "spa"
56 | ],
57 | "author": "Jozef Butko",
58 | "docs": "https://github.com/jbutko/AngularJS-Boilerplate/blob/master/README.md",
59 | "bugs": {
60 | "url": "https://github.com/jbutko/AngularJS-Boilerplate/issues"
61 | },
62 | "homepage": "https://github.com/jbutko/AngularJS-Boilerplate",
63 | "dependencies": {
64 | "gulp-imagemin": "^3.2.0",
65 | "gulp-sass": "^3.1.0"
66 | }
67 | }
68 |
--------------------------------------------------------------------------------
/styles/breakpoints/_1030up.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | 1030px and up
4 |
5 | ******************************************************************/
6 |
7 | .container {
8 | width: 1040px;
9 | margin: 0 auto;
10 | }
11 |
12 | /*********************
13 | HEADER STYLES
14 | *********************/
15 |
16 | #inner-header {
17 | width: 1000px;
18 | }
19 |
20 | #logo {
21 | display: block;
22 | }
23 |
24 | /*********************
25 | NAVIGATION STYLES
26 | *********************/
27 |
28 | .main-nav {
29 | display: block;
30 | }
31 |
32 |
33 | /*********************
34 | RESPONSIVE NAV
35 | *********************/
36 |
37 | .hamburger {
38 | display: none;
39 | }
40 |
41 | .responsive-nav {
42 | display: none;
43 | }
--------------------------------------------------------------------------------
/styles/breakpoints/_1240up.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | 1240px and up
4 |
5 | ******************************************************************/
6 |
7 | .container {
8 | width: 1240px;
9 | }
--------------------------------------------------------------------------------
/styles/breakpoints/_481up.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | 481px and up
4 |
5 | ******************************************************************/
6 |
7 | /*********************
8 | POSTS & CONTENT STYLES
9 | *********************/
10 |
11 | .container {
12 | width: 480px;
13 | }
--------------------------------------------------------------------------------
/styles/breakpoints/_768up.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | 768px and up
4 |
5 | ******************************************************************/
6 |
7 | /*********************
8 | GENERAL STYLES
9 | *********************/
10 |
11 | body {
12 | font-family: $font;
13 | }
14 |
15 | /*********************
16 | LAYOUT & GRID STYLES
17 | *********************/
18 |
19 | .container {
20 | width: 760px;
21 | }
22 |
23 | /*********************
24 | HEADER STYLES
25 | *********************/
26 |
27 | .header {
28 |
29 | a {
30 | font-weight: $bold;
31 | }
32 | }
33 |
34 | #logo {
35 | margin: 0;
36 | line-height: 1;
37 | }
38 |
39 | /*********************
40 | NAVIGATION STYLES
41 | *********************/
42 |
43 | .nav {
44 | border: 0;
45 |
46 | ul {
47 | background:$black;
48 | margin-top:0;
49 | }
50 |
51 | li {
52 | position: relative;
53 |
54 | a {
55 | border-bottom: 0;
56 |
57 | &:hover, &:focus {
58 | color: $white;
59 | text-decoration: underline;
60 | }
61 | }
62 | }
63 | }
--------------------------------------------------------------------------------
/styles/breakpoints/_base.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Mobile
4 |
5 | ******************************************************************/
6 |
7 | /*********************
8 | GENERAL STYLES
9 | *********************/
10 |
11 | body {
12 | -moz-osx-font-smoothing: grayscale;
13 | -webkit-font-smoothing: antialiased;
14 | background-color: $gray;
15 | color: $text-color;
16 | font-family: $font;
17 | font-size: 100%;
18 | line-height: 1.5;
19 | }
20 |
21 | html {
22 | height: 100%;
23 | box-sizing: border-box;
24 | }
25 |
26 | *, *:before, *:after {
27 | box-sizing: inherit;
28 | }
29 |
30 | ul {
31 | list-style-type: none;
32 | margin: 0;
33 | padding: 0;
34 | }
35 |
36 | /*********************
37 | LAYOUT & GRID STYLES
38 | *********************/
39 |
40 | .wrap {
41 | width: 96%;
42 | margin: 0 auto;
43 | }
44 |
45 | /*********************
46 | LINK STYLES
47 | *********************/
48 |
49 | a, a:visited {
50 | color: $link-color;
51 | text-decoration: none;
52 |
53 | /* on hover */
54 | &:hover, &:focus {
55 | color: $link-hover;
56 | text-decoration: underline;
57 | }
58 |
59 | /* on click */
60 | &:active {
61 |
62 | }
63 |
64 | /* mobile tap color */
65 | &:link {
66 | /*
67 | this highlights links on iPhones/iPads.
68 | so it basically works like the :hover selector
69 | for mobile devices.
70 | */
71 | -webkit-tap-highlight-color : rgba( 0, 0, 0, 0.3 );
72 | }
73 | }
74 |
75 | /******************************************************************
76 | H1, H2, H3, H4, H5 STYLES
77 | ******************************************************************/
78 |
79 | h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5 {
80 | text-rendering: optimizelegibility;
81 | font-weight: 500;
82 |
83 | a {
84 | text-decoration: none;
85 | }
86 | }
87 |
88 | h1, .h1 {
89 | font-size: 2.5em;
90 | line-height: 1.333em;
91 | }
92 |
93 | h2, .h2 {
94 | font-size: 1.75em;
95 | line-height: 1.4em;
96 | margin-bottom: 0.375em;
97 | }
98 |
99 | h3, .h3 {
100 | font-size: 1.75rem;
101 | }
102 |
103 | h4, .h4 {
104 | font-size: 0.875rem;
105 | font-weight: 700;
106 | }
107 |
108 | /*********************
109 | HEADER STYLES
110 | *********************/
111 |
112 | .header {
113 | background-color: $white;
114 | }
115 |
116 | #inner-header {
117 | width: 100%;
118 | padding: 0 50px;
119 | text-align: center;
120 |
121 | a {
122 | font-size: $small;
123 | color: $black;
124 | }
125 |
126 | ul {
127 | list-style-type: none;
128 | margin: 0;
129 | padding: 0;
130 | }
131 |
132 | li {
133 | display: inline-block;
134 | margin-right: 50px;
135 | line-height: 50px;
136 |
137 | &:last-child {
138 | margin-right: 0;
139 | }
140 | }
141 | }
142 |
143 | #logo {
144 | margin: 0.75em 0;
145 | display: none;
146 |
147 | a {
148 | color: $white;
149 | }
150 | }
151 |
152 | /*********************
153 | NAVIGATION STYLES
154 | *********************/
155 |
156 | .main-nav {
157 | border-bottom: 0;
158 | margin: 0;
159 | display: none;
160 |
161 | li {
162 |
163 | a {
164 | display: block;
165 | color: $white;
166 | text-decoration: none;
167 | padding: 0.75em;
168 | }
169 | }
170 | }
171 |
172 |
173 | /*********************
174 | RESPONSIVE NAV
175 | *********************/
176 |
177 | .hamburger {
178 |
179 | &:hover,
180 | &:focus {
181 | text-decoration: none;
182 | }
183 |
184 | &:before {
185 | content:'\2261';
186 | font-size: 24px;
187 | font-weight: bold;
188 | color: #555;
189 | }
190 | }
191 |
192 | .responsive-wrapper {
193 |
194 | display: none;
195 |
196 | a {
197 | display: block;
198 | width: 100%;
199 | line-height: 2;
200 | text-align: center;
201 | background: #fff;
202 | color: $text-color;
203 | }
204 | }
205 |
206 | /*********************
207 | MAIN PAGE
208 | *********************/
209 |
210 | #content {
211 | margin-top: 1.5em;
212 | }
213 |
214 | // slider
215 | .slider {
216 | margin-bottom: 30px;
217 | }
218 |
219 | .image-slider {
220 | max-height: 400px;
221 |
222 | img {
223 | width: 100%;
224 | }
225 | }
226 |
227 | /*********************
228 | FOOTER STYLES
229 | *********************/
230 |
231 | .footer {
232 | clear: both;
233 | background-color: $black;
234 | color: $light-gray;
235 | }
--------------------------------------------------------------------------------
/styles/modules/_alerts.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Alerts
4 |
5 | Based on: Bones - github.com/eddiemachado/bones
6 |
7 | ******************************************************************/
8 |
9 | // alerts and notices
10 | %alert {
11 | background: #fcf8e3;
12 | color: #8a6d3b;
13 | }
14 |
15 | .alert-help {
16 | @extend %alert;
17 | }
--------------------------------------------------------------------------------
/styles/modules/_buttons.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Buttons
4 |
5 | ******************************************************************/
6 |
7 |
--------------------------------------------------------------------------------
/styles/modules/_forms.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Forms
4 |
5 | Based on: Bones - github.com/eddiemachado/bones
6 |
7 | ******************************************************************/
8 |
9 | /*********************
10 | INPUTS
11 | *********************/
12 |
13 | // setting up defaults
14 | input[type="text"],
15 | input[type="password"],
16 | input[type="datetime"],
17 | input[type="datetime-local"],
18 | input[type="date"],
19 | input[type="month"],
20 | input[type="time"],
21 | input[type="week"],
22 | input[type="number"],
23 | input[type="email"],
24 | input[type="url"],
25 | input[type="search"],
26 | input[type="tel"],
27 | input[type="color"],
28 | select,
29 | textarea,
30 | .field {
31 | display: block;
32 | height: 40px;
33 | line-height: 40px;
34 | padding: 0 12px;
35 | margin-bottom: 14px;
36 | font-size: 1em;
37 | color: $text-color;
38 | border-radius: 3px;
39 | vertical-align: middle;
40 | box-shadow: none;
41 | border: 0;
42 | width: 100%;
43 | max-width: 400px;
44 | font-family: $font;
45 | background-color: $gray;
46 | @include transition(background-color 0.24s ease-in-out);
47 |
48 | // a focused input (or hovered on)
49 | &:focus,
50 | &:active {
51 | background-color: lighten($gray, 4%);
52 | outline: none;
53 | } // end hover or focus
54 |
55 | // error notification
56 | &.error,
57 | &.is-invalid {
58 | color: $alert-red;
59 | border-color: $alert-red;
60 | background-color: $white;
61 | background-position: 99% center;
62 | background-repeat: no-repeat;
63 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NDM0NDREQkYwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NDM0NDREQ0YwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjQ3ODRGRkE2RjA0QTExRTI5MjhERkZBMTMzMDYwNzI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY0MzQ0NERBRjA0QjExRTI5MjhERkZBMTMzMDYwNzI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+U8iT5wAAAedJREFUeNqk1U9I02Ecx/HtV3aIFAc1hcRDUoGXRAq0oNLA2CrsEFmHbikZu0iQYIFGYAiegkCpLipBxPpDEBMUzB0EhSG2LhG7hMR2GviPgUTvB57Bw8P3+U23B16HPX8+e/b8nt93wezZSMCnhXETF3AcB5BDCnH8Dq98ExcGHcFn8Ah3cdDni+fxnPDv9oAnTB7CKu6VCFXtChZy56LxUjt+jfuB8toSOth9wd7xWAWhqrUjYR/FRTwWJm+iIPT/w7bQf5ljiZnBg45dtKFX6H+LU8gIY8OEV6vgTkStwXWE8BPTGDHGPqNPz2mCfSOOYkA99TvCt1bhGPL68zMcwmncMuape10jrI+q4BbHi/FLn31S9z2x5tRhTc+1W506ipM+T3oRD4X+8+qtc4SqFvL0z/Fr14S+Szjis8bz9Lvvaq8cwS/wwGfdlqfPSWqTiFlX77o13u9Ym1PBs8JAytpRoy44X9Ft9E/gvbA+rYKn8NcaaMVc8UHgBw4b9/iqUQZ6hOAJFbyDcUflmsEX4a6+wTtHGfhAIUqa1U29Zc2BytouThD8x6xuN5CtMPi2CrXLZkZf/HyZoRFCP7n+QVR4PV7uI/AjGghN7OU/r1ilnqILtfpNC+o6vIFljBKYlhb/F2AAgaBsWR5wRiIAAAAASUVORK5CYII=);
64 | outline-color: $alert-red;
65 | } // end invalid input
66 |
67 | // success notification
68 | &.success,
69 | &.is-valid {
70 | color: $alert-green;
71 | border-color: $alert-green;
72 | background-color: $white;
73 | background-position: 99% center;
74 | background-repeat: no-repeat;
75 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NDM0NDRERkYwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NDM0NDRFMEYwNEIxMUUyOTI4REZGQTEzMzA2MDcyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY0MzQ0NERERjA0QjExRTI5MjhERkZBMTMzMDYwNzI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY0MzQ0NERFRjA0QjExRTI5MjhERkZBMTMzMDYwNzI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+7olkTQAAAfhJREFUeNqklU9oE0EUhzdroWjw0tBeWlDxkEaIp55TsCU9VKIgCrHBelA8CQ1Kr1WPbZrQ3gqtQqvGqxpQc2jBk6BIIaAGD4qNCKURpDSKiPi98gLDsJt//uBjsztvfnk7895sIPAw6/joGMThFJyAXn2+A+9gA57/TaY/eU0OeBgfhGm4DiGnsb7DAszxBz/NAdcKjMJLuNWCqagHbsscN5+L+hmH4QkMOe1L5jzFfNA2PgT34ajTuY7AGuZB0/hmh5m+gS0r8xv1zRvg+gGCHZiOwnF4DP3iB3sQkYxPd2C6CWfhB9Xwlus5+K1j4jXuaq3a+gM1H9OPcAa+7q9lPidZJqHbiIm7Wg22rsEI7FrPSzAMX/T+ADyAKSsu7Fr1KplehLvwCs5DvfBf65p+MypqRbO1FXK9utH4/QKuaqYTsG3E3INJv00Q46px3+XxanJ/Ute2/vqP4FKDza2KcdljIKdnhS0xXYULTaqmLMZFn8FFSFtvt6x70ExFCS5oUXspq2ssa7oEl1swFa+CGFdgtkHgPDyDKy02zyxNU6lXRUZb1EuHYayNNs+Yh5B0WQo+/8fpJnNTZFuzz2OpjoQ2QruSOQlMy35fEGmEGMxY9e1brxobw7TkWA1h6xfckUPb+JhGoE/Hpfvew7qUld/H9J8AAwDpw3WYrxcZ3QAAAABJRU5ErkJggg==);
76 | outline-color: $alert-green;
77 | } // end valid input
78 |
79 | // a disabled input
80 | &[disabled],
81 | &.is-disabled {
82 | cursor: not-allowed;
83 | border-color: $disabled-gray;
84 | opacity: 0.6;
85 |
86 | &:focus,
87 | &:active {
88 | background-color: $alert-blue;
89 | } // end disabled focus
90 |
91 | } // end disabled input
92 |
93 | } // end input defaults
94 |
95 | // spacing out the password (thx @murtaugh)
96 | input[type="password"] {
97 | letter-spacing: 0.3em;
98 | }
99 |
100 | // textareas
101 | textarea {
102 | max-width: 100%;
103 | min-height: 120px;
104 | line-height: 1.5em;
105 | }
106 |
107 | // selects
108 | select {
109 | -webkit-appearance: none; /* 1 */
110 | // Base64 encoded little arrow
111 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAHCAYAAADXhRcnAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEOEZCMjYxMEYwNUUxMUUyOTI4REZGQTEzMzA2MDcyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEOEZCMjYxMUYwNUUxMUUyOTI4REZGQTEzMzA2MDcyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkQ4RkIyNjBFRjA1RTExRTI5MjhERkZBMTMzMDYwNzI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkQ4RkIyNjBGRjA1RTExRTI5MjhERkZBMTMzMDYwNzI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+Vxkp9gAAAI9JREFUeNpidHFxucHAwKAOxE+AmJmBMPgLxDJAfJMFSKwD4kqoAClgA+P///8ZXF1dPaCGcBKh6QcQB+3evXs7WDMIAA2QB1I7gFgDj0aQFz2BGh+AOEwwUaDAQyBlCMR7cGjcC5KHaQQBuM3IAOiKTiBVhiTUDdRUhq4Oq2aoAelAahIQ5wM1zsCmBiDAADhYMJXVZ9u9AAAAAElFTkSuQmCC);
112 | background-repeat: no-repeat;
113 | background-position: 97.5% center;
114 | }
115 |
116 |
117 |
--------------------------------------------------------------------------------
/styles/partials/_functions.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Functions
4 |
5 | ******************************************************************/
--------------------------------------------------------------------------------
/styles/partials/_grid.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Grid
4 |
5 | ******************************************************************/
--------------------------------------------------------------------------------
/styles/partials/_helpers.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Helpers
4 |
5 | ******************************************************************/
6 |
7 | .block {
8 | display: block;
9 | }
10 |
11 | .italic {
12 | font-style:italic;
13 | }
14 |
15 | .hidden {
16 | display:none !important;
17 | }
18 |
19 | .cf:before,
20 | .cf:after {
21 | content: " "; /* 1 */
22 | display: table; /* 2 */
23 | }
24 |
25 | .cf:after {
26 | clear: both;
27 | }
28 |
29 | /**
30 | * For IE 6/7 only
31 | * Include this rule to trigger hasLayout and contain floats.
32 | */
33 | .cf {
34 | *zoom: 1;
35 | }
36 |
37 | .overflow-fix {
38 | overflow: hidden;
39 | }
40 |
41 | .nounderline {
42 | text-decoration: none !important;
43 | }
44 |
45 | .text-left {
46 | text-align: left;
47 | }
48 |
49 | .text-center {
50 | text-align: center;
51 | }
52 |
53 | .text-right {
54 | text-align: right;
55 | }
56 |
57 | .lowercase {
58 | text-transform: lowercase !important;
59 | }
60 |
61 | small {
62 | font-size: 80%;
63 | }
64 |
65 | strong {
66 | font-weight: 600;
67 | }
68 |
69 | .container {
70 | position: relative;
71 | }
72 |
73 | .image-circle {
74 | border-radius: 50%;
75 | }
76 |
77 | .image-responsive {
78 | max-width: 100%;
79 | height: auto;
80 | }
81 |
82 | .pull-left {
83 | float: left;
84 | }
85 |
86 | .pull-right {
87 | float: right;
88 | }
89 |
90 | // HW accelerator
91 | .hw {
92 | -webkit-transform: translate3d(0, 0, 0);
93 | -moz-transform: translate3d(0, 0, 0);
94 | -ms-transform: translate3d(0, 0, 0);
95 | transform: translate3d(0, 0, 0);
96 | -webkit-backface-visibility: hidden;
97 | -moz-backface-visibility: hidden;
98 | -ms-backface-visibility: hidden;
99 | backface-visibility: hidden;
100 | -webkit-perspective: 1000;
101 | -moz-perspective: 1000;
102 | -ms-perspective: 1000;
103 | perspective: 1000;
104 | }
105 |
106 | .last {
107 | margin-right: 0 !important;
108 | }
109 |
110 | /*
111 | * Image replacement
112 | */
113 | .ir {
114 | background-color: transparent;
115 | border: 0;
116 | overflow: hidden;
117 | /* IE 6/7 fallback */
118 | *text-indent: -9999px;
119 | }
120 |
121 | .ir:before {
122 | content: "";
123 | display: block;
124 | width: 0;
125 | height: 150%;
126 | }
127 |
128 | .text-hide {
129 | color: transparent;
130 | font-size: 0;
131 | text-shadow: none;
132 | vertical-align: middle;
133 | }
134 |
135 | .fixed {
136 | position: fixed;
137 | }
138 |
139 | .relative {
140 | position: relative;
141 | }
142 |
143 | .absolute {
144 | position: absolute;
145 | }
146 |
147 | .full-width {
148 | width: 100%;
149 | }
150 | .half-width {
151 | width: 50%;
152 | }
153 |
154 | .center {
155 | margin: 0 auto;
156 | }
157 |
158 | .smooth {
159 | -webkit-transition: all 0.2s ease;
160 | -moz-transition: all 0.2s ease;
161 | -ms-transition: all 0.2s ease;
162 | -o-transition: all 0.2s ease;
163 | }
--------------------------------------------------------------------------------
/styles/partials/_mixins.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Mixins
4 |
5 | Based on: Bones - github.com/eddiemachado/bones
6 |
7 | ******************************************************************/
8 |
9 | /*
10 | USAGE: @include transition(all 0.2s ease-in-out);
11 | */
12 |
13 | @mixin transition($transition...) {
14 | // defining prefixes so we can use them in mixins below
15 | $prefixes: ("-webkit-", "" );
16 | @each $prefix in $prefixes {
17 | #{$prefix}transition: $transition;
18 | }
19 | }
20 |
21 | /*********************
22 | CSS3 GRADIENTS
23 | *********************/
24 |
25 | /* @include css-gradient(#dfdfdf,#f8f8f8); */
26 | @mixin css-gradient($from: #dfdfdf, $to: #f8f8f8) {
27 | background-color: $to;
28 | background-image: -webkit-gradient(linear, left top, left bottom, from($from), to($to));
29 | background-image: -webkit-linear-gradient(top, $from, $to);
30 | background-image: -moz-linear-gradient(top, $from, $to);
31 | background-image: -o-linear-gradient(top, $from, $to);
32 | background-image: linear-gradient(to bottom, $from, $to);
33 | }
34 |
35 | /*********************
36 | BOX SIZING
37 | *********************/
38 |
39 | /* @include box-sizing(border-box); */
40 | @mixin box-sizing($type: border-box) {
41 | -webkit-box-sizing: $type;
42 | -moz-box-sizing: $type;
43 | -ms-box-sizing: $type;
44 | box-sizing: $type;
45 | }
46 |
47 |
48 |
--------------------------------------------------------------------------------
/styles/partials/_normalize.scss:
--------------------------------------------------------------------------------
1 | /*! normalize.css v3.0.2 | MIT License | git.io/normalize */html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background-color:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{height:auto}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:700}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}
--------------------------------------------------------------------------------
/styles/partials/_print.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Print stylesheet
4 |
5 | ******************************************************************/
6 |
7 | * {
8 | background: transparent !important;
9 | color: black !important;
10 | text-shadow: none !important;
11 | filter:none !important;
12 | -ms-filter: none !important;
13 | }
14 |
15 | a, a:visited {
16 | color: #444 !important;
17 | text-decoration: underline;
18 |
19 | // show links on printed pages
20 | &:after {
21 | content: " (" attr(href) ")";
22 | }
23 |
24 | // show title too
25 | abbr[title]:after {
26 | content: " (" attr(title) ")";
27 | }
28 | }
29 |
30 | .ir a:after,
31 | a[href^="javascript:"]:after,
32 | a[href^="#"]:after {
33 | content: "";
34 | }
35 |
36 | pre, blockquote {
37 | border: 1px solid #999;
38 | page-break-inside: avoid;
39 | }
40 |
41 | thead {
42 | display: table-header-group;
43 | }
44 |
45 | tr, img {
46 | page-break-inside: avoid;
47 | }
48 |
49 | img {
50 | max-width: 100% !important;
51 | }
52 |
53 | @page {
54 | margin: 0.5cm;
55 | }
56 |
57 | p, h2, h3 {
58 | orphans: 3;
59 | widows: 3;
60 | }
61 |
62 | h2,
63 | h3 {
64 | page-break-after: avoid;
65 | }
66 |
67 | // hide content people who print don't need to see
68 | .sidebar,
69 | .page-navigation,
70 | .wp-prev-next,
71 | .respond-form,
72 | nav {
73 | display: none;
74 | }
75 |
--------------------------------------------------------------------------------
/styles/partials/_typography.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Typography
4 |
5 | ******************************************************************/
6 |
7 | // Web fonts definitions goes here as well
8 |
9 |
10 | /* ===============================
11 | fonts
12 | =============================== */
13 | $font: "Open Sans", Helvetica, Arial, sans-serif;
14 | $font-italic: Cambria, Times New Roman, Times, serif;
15 | $font-bold: Helvetica, Arial, sans-serif;
16 | $font-semibold: Helvetica, Arial, sans-serif;
17 | $font-extrabold: Helvetica, Arial, sans-serif;
18 | $font-extralightitalic: Helvetica, Arial, sans-serif;
19 |
20 | /* ===============================
21 | sizes
22 | =============================== */
23 | $large: 28px;
24 | $medium: 20px;
25 | $small: 14px;
26 |
27 | /* ===============================
28 | weights
29 | =============================== */
30 | $thin: 300;
31 | $normal: 400;
32 | $semi-bold: 600;
33 | $bold: 700;
34 | $extra-bold: 900;
35 |
36 | /*
37 | some nice typographical defaults
38 | more here: http://www.newnet-soft.com/blog/csstypography
39 | */
40 | p {
41 | -ms-word-wrap: break-word;
42 | word-break: break-word; //non-standart css for webkit
43 | word-wrap: break-word;
44 | // cleaning up the ragged lines and breaks
45 | -webkit-hyphens: auto;
46 | -moz-hyphens: auto;
47 | hyphens: auto;
48 | // sets a minimum number of characters before and after the break
49 | -webkit-hyphenate-before: 2;
50 | -webkit-hyphenate-after: 3;
51 | hyphenate-lines: 3;
52 | // enabling fancy ligatures when available
53 | -webkit-font-feature-settings: "liga", "dlig";
54 | -moz-font-feature-settings: "liga=1, dlig=1";
55 | -ms-font-feature-settings: "liga", "dlig";
56 | -o-font-feature-settings: "liga", "dlig";
57 | font-feature-settings: "liga", "dlig";
58 | }
59 |
60 |
--------------------------------------------------------------------------------
/styles/partials/_variables.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Variables
4 |
5 | ******************************************************************/
6 |
7 | $black: #231f20;
8 | $white: #fff;
9 |
10 | $light-gray: #f8f9fa;
11 | $gray: #eaedf2;
12 | $text-color: #5c6b80;
13 |
14 | $link-color: $black;
15 | $link-hover: darken($link-color, 9%);
16 |
17 | $border-color: #ccc;
18 | $disabled-gray: #cfcfcf;
19 | $alert-red: red;
20 | $alert-green: #645564;
21 | $alert-blue: blue;
--------------------------------------------------------------------------------
/styles/style.scss:
--------------------------------------------------------------------------------
1 | /******************************************************************
2 |
3 | Site Name: AngularJS Boilerplate
4 | Code: Jozef Butko - jozefbutko.com/resume
5 | Date: Mar 2015
6 |
7 | ******************************************************************/
8 |
9 | // normalize: http://necolas.github.io/normalize.css/
10 | @import "partials/normalize";
11 |
12 | // Sass variables
13 | @import "partials/variables";
14 |
15 | // Helpers
16 | @import "partials/helpers";
17 |
18 | // typography
19 | @import "partials/typography";
20 |
21 | // Sass functions
22 | @import "partials/functions";
23 |
24 | // import mixins
25 | @import "partials/mixins";
26 |
27 | // the grid
28 | @import "partials/grid";
29 |
30 | /*********************
31 | IMPORTING MODULES
32 | *********************/
33 |
34 | // alert boxes
35 | @import "modules/alerts";
36 |
37 | // buttons
38 | @import "modules/buttons";
39 |
40 | // forms (inputs & labels)
41 | @import "modules/forms";
42 |
43 | /*********************
44 | BASE (MOBILE) SIZE
45 | *********************/
46 |
47 | // styles in base.scss
48 | @import "breakpoints/base";
49 |
50 | /*********************
51 | LARGER MOBILE DEVICES
52 | *********************/
53 | @media only screen and (min-width: 481px) {
54 |
55 | // styles in 481up.scss
56 | @import "breakpoints/481up";
57 |
58 | } // end of media query
59 |
60 | /*********************
61 | TABLET & SMALLER LAPTOPS
62 | *********************/
63 | @media only screen and (min-width: 768px) {
64 |
65 | // styles in 768up.scss
66 | @import "breakpoints/768up";
67 |
68 | } // end of media query
69 |
70 | /*********************
71 | DESKTOP
72 | *********************/
73 | @media only screen and (min-width: 1030px) {
74 |
75 | // styles in 1030up.scss
76 | @import "breakpoints/1030up";
77 |
78 | } // end of media query
79 |
80 | /*********************
81 | LARGE VIEWING SIZE
82 | *********************/
83 | @media only screen and (min-width: 1240px) {
84 |
85 | // styles in 1240up.scss
86 | @import "breakpoints/1240up";
87 |
88 | } // end of media query
89 |
90 | /*********************
91 | RETINA (2x RESOLUTION DEVICES)
92 | *********************/
93 | // @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
94 | // only screen and (min--moz-device-pixel-ratio: 1.5),
95 | // only screen and (min-device-pixel-ratio: 1.5) {
96 |
97 | // // styles in 2x.scss
98 | // @import "breakpoints/2x";
99 |
100 | // } // end of media query
101 |
102 | /*********************
103 | PRINT STYLESHEET
104 | *********************/
105 | @media print {
106 |
107 | // styles in print.scss
108 | @import "partials/print";
109 |
110 | }
111 |
--------------------------------------------------------------------------------
/views/404.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
Page Not Found
4 | 404
5 |
6 |
--------------------------------------------------------------------------------
/views/contact.html:
--------------------------------------------------------------------------------
1 | Contact
2 |
3 |
11 |
--------------------------------------------------------------------------------
/views/home.html:
--------------------------------------------------------------------------------
1 | AngularJS Boilerplate
2 |
3 |
4 |
23 |
24 | Features
25 |
26 |
27 |
28 | - * SASS support including sourceMaps
29 | - * Minimal CSS styling of the view
30 | - * Gulp watch, build and local server tasks
31 | - * Responsive navigation
32 | - * Owl slider directive
33 | - * Responsive navigation
34 | - * localStorage service for set, get, remove data
35 | - * queryService $http wrapper to handle calls
36 | - * clear folder structure
37 | - * less than 10 request in build version
38 | - * minified CSS and JS build files
39 | - * google analytics snippet
40 |
41 |
42 |
43 |
44 |
45 |
Images courtesy of unsplash.com
46 |
47 |
48 |
--------------------------------------------------------------------------------
/views/setup.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
Download
4 |
5 | bower install angularjs-boilerplate
6 | or
7 | git clone https://github.com/jbutko/AngularJS-Boilerplate.git
8 |
9 | 1. Setup
10 | npm install
11 | - install all npm and bower dependencies
12 | Note: If npm install fails during dependency installation it will be likely caused by gulp-imagemin. In that case remove gulp-imagemin dependency from package.json, run npm install again and then install gulp-imagemin separately with following command: npm install gulp-imagemin --save-dev
13 |
14 | 2. Watch files
15 | gulp
16 | - all SCSS/HTML will be watched for changes and injected into browser thanks to BrowserSync
17 |
18 | 3. Build production version
19 | gulp build
20 | - this will process following tasks:
21 | * clean _build folder
22 | * compile SASS files, minify and uncss compiled css
23 | * copy and optimize images
24 | * minify and copy all HTML files into $templateCache
25 | * build index.html
26 | * minify and copy all JS files
27 | * copy fonts
28 | * show build folder size
29 |
30 | 4. Start webserver without watch task
31 | gulp server
32 |
33 | 5. Start webserver from build folder
34 | gulp server-build
35 |
36 |
37 |
--------------------------------------------------------------------------------