diff --git a/css/_vars.scss b/css/_vars.scss index ceadc65..59c2c85 100755 --- a/css/_vars.scss +++ b/css/_vars.scss @@ -15,6 +15,10 @@ $h4-font-size: 18; $h5-font-size: 16; $h6-font-size: 16; +// Media Queries + +$mobile: 640px; + // Lists $list-margin-left: 24; diff --git a/css/generic/_mixins.scss b/css/generic/_mixins.scss index 01a6cfa..0d93430 100755 --- a/css/generic/_mixins.scss +++ b/css/generic/_mixins.scss @@ -1,57 +1,13 @@ -@mixin breakpoint($point) { - @if $point == mobile { - @media screen and (max-width: 640px) { @content; } - } - @else if $point == tablet-portrait { - @media screen and (max-width: 768px) { @content; } - } - @else if $point == tablet-landscape { - @media screen and (max-width: 1024px) { @content; } - } - @else if $point == desktop { - @media screen and (max-width: 1200px) { @content; } - } -} - -@mixin border-radius ($radius: 5px) { - -webkit-border-radius: $radius; - -moz-border-radius: $radius; - -o-border-radius: $radius; - border-radius: $radius; -} - -@mixin box-sizing ($box-model: 'border-box') { - -webkit-box-sizing: $box-model; - -moz-box-sizing: $box-model; - box-sizing: $box-model; -} - -@mixin box-shadow($x-axis: 0, $y-axis: 2px, $blur: 2px, $alpha: 0.1) { - -webkit-box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha); - -moz-box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha); - box-shadow: $x-axis $y-axis $blur rgba(0, 0, 0, $alpha); -} - -@mixin transition($duration:0.2s, $ease:ease-out) { - -webkit-transition: all $duration $ease; - -moz-transition: all $duration $ease; - transition: all $duration $ease; -} - -@mixin gradient($from, $to) { - background-color: $from; - background-image: -webkit-linear-gradient($from, $to); - background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from($from), to($to)); - background-image: -moz-linear-gradient($from, $to); - background-image: -o-linear-gradient($from, $to); +@mixin media($size) { + @media screen and (max-width: $size) { @content; } } @function calculate-rem($size) { - $remSize: $size / 10; + $remSize: $size / $base-font-size; @return #{$remSize}rem; } @mixin font-size($size) { - font-size: $size + px; //Fallback in px + font-size: $size + px; font-size: calculate-rem($size); } \ No newline at end of file diff --git a/css/objects/_forms.scss b/css/objects/_forms.scss index 8a3cd93..faf47e9 100755 --- a/css/objects/_forms.scss +++ b/css/objects/_forms.scss @@ -1,13 +1,11 @@ -input, select, textarea, button { +input, select, textarea { display: inline-block; - font-family: $base-font-stack; - font-size: 1em; + font: inherit; line-height: $base-margin-bottom + px; padding: 4px 8px; color: $base-colour; background: $input-background; border: $input-border; - @include border-radius(3px); width: 208px; } @@ -15,16 +13,16 @@ textarea { min-height: ($base-margin-bottom * 4) + px; } -.control-group { +.form__group { margin-bottom: $base-margin-bottom + px; } -.control-label { +.form__label { float: left; width: 140px; } -.controls { +.form__controls { margin-left: 160px; @extend .clearfix; } @@ -36,12 +34,12 @@ textarea { .btn { background: $btn-background; border: $btn-border; - @include border-radius(3px); color: $btn-color; cursor: pointer; display: inline-block; - line-height: $base-margin-bottom + px; - padding: 5px 20px; + line-height: ($base-margin-bottom * 2) + px; + height: ($base-margin-bottom * 2) + px; + padding: 0 20px; width: auto; &:hover { background: $btn-background-hover; diff --git a/css/objects/_nav.scss b/css/objects/_nav.scss index c3d25a3..9fedfd5 100755 --- a/css/objects/_nav.scss +++ b/css/objects/_nav.scss @@ -1,13 +1,11 @@ .nav { list-style: none; margin-left: 0; -} - - .nav > li { - display: inline-block; - *display: inline; - } - - .nav > li > a { - display: block; - } \ No newline at end of file + >li { + display: inline-block; + *display: inline; + >a { + display: block; + } + } +} \ No newline at end of file diff --git a/css/objects/_scaffolding.scss b/css/objects/_scaffolding.scss index f1a3a77..d6997d7 100755 --- a/css/objects/_scaffolding.scss +++ b/css/objects/_scaffolding.scss @@ -5,7 +5,7 @@ @extend .clearfix; } -.container-fluid { +.container--fluid { width: 100%; @extend .clearfix; } @@ -14,7 +14,7 @@ margin-left: -($column-gutter / $container-max-width) * 100%; _overflow: hidden; @extend .clearfix; - @include breakpoint(mobile) { + @include media($mobile) { margin-left: 0; } } @@ -24,7 +24,7 @@ float: left; margin-left: ($column-gutter / $container-max-width) * 100%; vertical-align: top; - @include breakpoint(mobile) { + @include media($mobile) { display: block; float: none; margin-left: 0; @@ -39,12 +39,12 @@ } } -.row-no-gutters .column { +.row--no-gutters .column { margin-left: 0; } @for $i from 1 through $column-count { - .row-no-gutters .column-span-#{$i} { + .row--no-gutters .column-span-#{$i} { width: ((100 / $column-count) * $i) * 1%; *width: ((100 / $column-count) * $i) - .02 * 1%; } diff --git a/index.php b/index.php index f777b80..d1a06b7 100755 --- a/index.php +++ b/index.php @@ -11,9 +11,9 @@
>
-

-

-

+

+ +

@@ -22,10 +22,14 @@ - + str_replace( 99999999, '%#%', esc_url( get_pagenum_link( 99999999 ) ) ), + 'format' => '?paged=%#%', + 'current' => max( 1, get_query_var('paged') ), + 'total' => $jobs->max_num_pages + )); + ?> @@ -37,4 +41,4 @@ - + \ No newline at end of file diff --git a/style.css b/style.css index fe8d88b..1557450 100644 --- a/style.css +++ b/style.css @@ -1 +1 @@ -body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,dfn,th,var{font-style:normal;font-weight:normal}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:bold}q:before,q:after{content:''}abbr,acronym{border:0}html{background-color:#fff;color:#333;font-size:62.5%}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-size:1.4rem;line-height:1.5}h1,h2,h3,h4,h5,h6,p,ul,ol,table,pre,fieldset{margin-bottom:21px}h1{font-size:28px;font-size:2.8rem}h2{font-size:1.71429em;line-height:0.875em}h3{font-size:1.5em;line-height:1em}h4{font-size:1.28571em;line-height:1.16667em}h5{font-size:1.14286em;line-height:1.3125em}h6{font-size:1.14286em;line-height:1.3125em}ul,ol{margin-left:24px}ul ul,ol ol{margin-bottom:0}img{display:block;max-width:100%;height:auto}.alignleft{float:left}img.alignleft{margin-right:20px}.alignright{float:right}img.alignright{margin-left:20px}.aligncenter{display:block;margin-left:auto;margin-right:auto}.clearfix,.controls,.container,.container-fluid,.row{*zoom:1}.clearfix:before,.controls:before,.container:before,.container-fluid:before,.row:before,.clearfix:after,.controls:after,.container:after,.container-fluid:after,.row:after{content:" ";display:table}.clearfix:after,.controls:after,.container:after,.container-fluid:after,.row:after{clear:both}input,select,textarea,button{display:inline-block;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:1em;line-height:21px;padding:4px 8px;color:#333;background:#fff;border:solid 1px #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;-o-border-radius:3px;border-radius:3px;width:208px}textarea{min-height:84px}.control-group{margin-bottom:21px}.control-label{float:left;width:140px}.controls{margin-left:160px}.checkbox input{width:auto}.btn{background:#eee;border:solid 1px #ccc;-webkit-border-radius:3px;-moz-border-radius:3px;-o-border-radius:3px;border-radius:3px;color:#333;cursor:pointer;display:inline-block;line-height:21px;padding:5px 20px;width:auto}.btn:hover{background:#ddd}.container{margin:0 auto;max-width:940px;padding:0 20px}.container-fluid{width:100%}.row{margin-left:-2.08333%;_overflow:hidden}@media screen and (max-width: 640px){.row{margin-left:0}}.column{display:inline;float:left;margin-left:2.08333%;vertical-align:top}@media screen and (max-width: 640px){.column{display:block;float:none;margin-left:0;width:auto !important}}.column-span-1{width:6.25%;*width:6.23%}.column-span-2{width:14.58333%;*width:14.56333%}.column-span-3{width:22.91667%;*width:22.89667%}.column-span-4{width:31.25%;*width:31.23%}.column-span-5{width:39.58333%;*width:39.56333%}.column-span-6{width:47.91667%;*width:47.89667%}.column-span-7{width:56.25%;*width:56.23%}.column-span-8{width:64.58333%;*width:64.56333%}.column-span-9{width:72.91667%;*width:72.89667%}.column-span-10{width:81.25%;*width:81.23%}.column-span-11{width:89.58333%;*width:89.56333%}.column-span-12{width:97.91667%;*width:97.89667%}.row-no-gutters .column{margin-left:0}.row-no-gutters .column-span-1{width:8.33333%;*width:8.31333%}.row-no-gutters .column-span-2{width:16.66667%;*width:16.64667%}.row-no-gutters .column-span-3{width:25%;*width:24.98%}.row-no-gutters .column-span-4{width:33.33333%;*width:33.31333%}.row-no-gutters .column-span-5{width:41.66667%;*width:41.64667%}.row-no-gutters .column-span-6{width:50%;*width:49.98%}.row-no-gutters .column-span-7{width:58.33333%;*width:58.31333%}.row-no-gutters .column-span-8{width:66.66667%;*width:66.64667%}.row-no-gutters .column-span-9{width:75%;*width:74.98%}.row-no-gutters .column-span-10{width:83.33333%;*width:83.31333%}.row-no-gutters .column-span-11{width:91.66667%;*width:91.64667%}.row-no-gutters .column-span-12{width:100%;*width:99.98%}.nav{list-style:none;margin-left:0}.nav>li{display:inline-block;*display:inline}.nav>li>a{display:block}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;vertical-align:top;border-top:1px solid #ddd;padding:10.5px 10px}.table th{font-weight:bold;border-top:0}.table thead th{vertical-align:bottom} +body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,dfn,th,var{font-style:normal;font-weight:normal}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:bold}q:before,q:after{content:''}abbr,acronym{border:0}html{background-color:#fff;color:#333;font-size:62.5%}body{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;font-size:1rem;line-height:1.5}h1,h2,h3,h4,h5,h6,p,ul,ol,table,pre,fieldset{margin-bottom:21px}h1{font-size:28px;font-size:2rem}h2{font-size:1.71429em;line-height:0.875em}h3{font-size:1.5em;line-height:1em}h4{font-size:1.28571em;line-height:1.16667em}h5{font-size:1.14286em;line-height:1.3125em}h6{font-size:1.14286em;line-height:1.3125em}ul,ol{margin-left:24px}ul ul,ol ol{margin-bottom:0}img{display:block;max-width:100%;height:auto}.alignleft{float:left}img.alignleft{margin-right:20px}.alignright{float:right}img.alignright{margin-left:20px}.aligncenter{display:block;margin-left:auto;margin-right:auto}.clearfix,.form__controls,.container,.container-fluid,.row{*zoom:1}.clearfix:before,.form__controls:before,.container:before,.container-fluid:before,.row:before,.clearfix:after,.form__controls:after,.container:after,.container-fluid:after,.row:after{content:" ";display:table}.clearfix:after,.form__controls:after,.container:after,.container-fluid:after,.row:after{clear:both}input,select,textarea{display:inline-block;font:inherit;line-height:21px;padding:4px 8px;color:#333;background:#fff;border:solid 1px #ccc;width:208px}textarea{min-height:84px}.form__group{margin-bottom:21px}.form__label{float:left;width:140px}.form__controls{margin-left:160px}.checkbox input{width:auto}.btn{background:#eee;border:solid 1px #ccc;color:#333;cursor:pointer;display:inline-block;line-height:42px;height:42px;padding:0 20px;width:auto}.btn:hover{background:#ddd}.container{margin:0 auto;max-width:940px;padding:0 20px}.container-fluid{width:100%}.row{margin-left:-2.08333%;_overflow:hidden}@media screen and (max-width: 640px){.row{margin-left:0}}.column{display:inline;float:left;margin-left:2.08333%;vertical-align:top}@media screen and (max-width: 640px){.column{display:block;float:none;margin-left:0;width:auto !important}}.column-span-1{width:6.25%;*width:6.23%}.column-span-2{width:14.58333%;*width:14.56333%}.column-span-3{width:22.91667%;*width:22.89667%}.column-span-4{width:31.25%;*width:31.23%}.column-span-5{width:39.58333%;*width:39.56333%}.column-span-6{width:47.91667%;*width:47.89667%}.column-span-7{width:56.25%;*width:56.23%}.column-span-8{width:64.58333%;*width:64.56333%}.column-span-9{width:72.91667%;*width:72.89667%}.column-span-10{width:81.25%;*width:81.23%}.column-span-11{width:89.58333%;*width:89.56333%}.column-span-12{width:97.91667%;*width:97.89667%}.row-no-gutters .column{margin-left:0}.row-no-gutters .column-span-1{width:8.33333%;*width:8.31333%}.row-no-gutters .column-span-2{width:16.66667%;*width:16.64667%}.row-no-gutters .column-span-3{width:25%;*width:24.98%}.row-no-gutters .column-span-4{width:33.33333%;*width:33.31333%}.row-no-gutters .column-span-5{width:41.66667%;*width:41.64667%}.row-no-gutters .column-span-6{width:50%;*width:49.98%}.row-no-gutters .column-span-7{width:58.33333%;*width:58.31333%}.row-no-gutters .column-span-8{width:66.66667%;*width:66.64667%}.row-no-gutters .column-span-9{width:75%;*width:74.98%}.row-no-gutters .column-span-10{width:83.33333%;*width:83.31333%}.row-no-gutters .column-span-11{width:91.66667%;*width:91.64667%}.row-no-gutters .column-span-12{width:100%;*width:99.98%}.nav{list-style:none;margin-left:0}.nav>li{display:inline-block;*display:inline}.nav>li>a{display:block}.table{width:100%;border-collapse:collapse}.table th,.table td{text-align:left;vertical-align:top;border-top:1px solid #ddd;padding:10.5px 10px}.table th{font-weight:bold;border-top:0}.table thead th{vertical-align:bottom}