BitGoblin/Bones
1
0
Fork 0
Code Issues 5 Pull Requests Packages Projects Releases Wiki Activity

Wherever possible fixed CSSLint warnings.

Browse Source 
Had to exclude some unfeasible rules however.
This commit is contained in:
Nick Pack
2013-05-17 13:01:58 +01:00
parent 9db2cff433
commit 26b0b91551
14 changed files with 184 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
scss/_forms.scss
View File

@ -40,14 +40,14 @@ input[type="button"]:active {
border: $form_button_active_border;
}
.button.full-width,
.button .full-width,
button.full-width,
input[type="submit"].full-width,
input[type="reset"].full-width,
input[type="button"].full-width {
width: 100%;
padding-left: 0 !important;
padding-right: 0 !important;
padding-left: 0;
padding-right: 0;
text-align: center;
}
@ -86,7 +86,6 @@ textarea,
select {
border: $form_input_border;
padding: $form_input_padding;
outline: none;
@include border-radius(2px);
font: $form_input_font_size $form_element_font;
color: $form_input_text_colour;
@ -111,6 +110,7 @@ input[type="tel"]:focus,
textarea:focus {
border: $form_input_focus_border;
color: $form_input_focus_text_colour;
outline: none;
@include box-shadow(0, 0, 3px, rgba(0, 0, 0, .2))
}

53
scss/_grid.scss
View File

@ -2,15 +2,14 @@
position: relative;
margin: 0 auto;
padding: 0;
& .alpha { margin-left: 0; }
& .omega { margin-right: 0; }
}
.column, .columns {
float: left;
display: inline;
margin-left: $gutter/2;
margin-right: $gutter/2;
&.alpha { margin-left: 0; }
&.omega { margin-right: 0; }
}
.row { margin-bottom: $gutter; }
@ -22,13 +21,13 @@
@media only screen and (max-width: 959px) {
@include grid($tablet-container-width, $column-count, $gutter);
.container { width: $tablet-container-width; }
.container {
width: $tablet-container-width;
& .alpha { margin-right: 10px; }
& .omega { margin-left: 10px; }
}
.column, .columns {
&.alpha { margin-right: 10px; }
&.omega { margin-left: 10px; } }
.alpha.omega {
.alpha, .omega {
margin-right: 0;
margin-left: 0; }
}
@ -37,27 +36,27 @@
@media only screen and (max-width: 767px) {
.container {
width: $mobile-container-width;
& .one,
& .two,
& .three,
& .four,
& .five,
& .six,
& .seven,
& .eight,
& .nine,
& .ten,
& .eleven,
& .twelve,
& .thirteen,
& .fourteen,
& .fifteen,
& .sixteen,
& .one-third,
& .two-thirds { width: $mobile-column-width; }
.column, .columns {
margin: 0;
&.one,
&.two,
&.three,
&.four,
&.five,
&.six,
&.seven,
&.eight,
&.nine,
&.ten,
&.eleven,
&.twelve,
&.thirteen,
&.fourteen,
&.fifteen,
&.sixteen,
&.one-third,
&.two-thirds { width: $mobile-column-width; }
}
.offset-by-one,

2
scss/_images.scss
View File

@ -1,7 +1,7 @@
/* #Images
================================================== */
img.scale-with-grid {
.scale-with-grid {
max-width: 100%;
height: auto;
}

2
scss/_links.scss
View File

@ -3,12 +3,12 @@
a, a:visited {
color: $link_colour;
text-decoration: $link_decoration;
outline: $link_outline;
}
a:hover, a:focus {
color: $link_hover_colour;
text-decoration: $link_hover_decoration;
outline: $link_outline;
}
p a, p a:visited {

2
scss/_lists.scss
View File

@ -39,7 +39,7 @@ li {
margin: $list_item_margin;
}
ul.large li {
.large li {
line-height: $list_large_line_height;
}

61
scss/_mixins.scss
View File

@ -5,12 +5,12 @@
}
@mixin col-count($colCount, $colSpacing) {
column-count: $colCount;
column-gap: $colSpacing;
-webkit-column-count: $colCount;
-webkit-column-gap: $colSpacing;
-moz-column-count: $colCount;
-moz-column-gap: $colSpacing;
column-count: $colCount;
column-gap: $colSpacing;
}
@mixin size($height, $width) {
@ -23,33 +23,33 @@
}
@mixin border-radius($radius) {
border-radius: $radius;
-webkit-border-radius: $radius;
-moz-border-radius: $radius;
border-radius: $radius;
}
@mixin border-top-left-radius($radius) {
border-top-left-radius: $radius;
-webkit-border-top-left-radius: $radius;
-moz-border-radius-topleft: $radius;
border-top-left-radius: $radius;
}
@mixin border-top-right-radius($radius) {
border-top-right-radius: $radius;
-webkit-border-top-right-radius: $radius;
-moz-border-radius-topright: $radius;
border-top-right-radius: $radius;
}
@mixin border-bottom-right-radius($radius) {
border-bottom-right-radius: $radius;
-webkit-border-bottom-right-radius: $radius;
-moz-border-radius-bottomright: $radius;
border-bottom-right-radius: $radius;
}
@mixin border-bottom-left-radius($radius) {
border-bottom-left-radius: $radius;
-webkit-border-bottom-left-radius: $radius;
-moz-border-radius-bottomleft: $radius;
border-bottom-left-radius: $radius;
}
@mixin border-top-radius($radius) {
@ -73,23 +73,23 @@
}
@mixin background-size($size){
background-size: $size;
-webkit-background-size: $size;
-moz-background-size: $size;
-o-background-size: $size;
background-size: $size;
}
@mixin box-sizing($boxsize) {
box-sizing: $boxsize;
-webkit-box-sizing: $boxsize;
-moz-box-sizing: $boxsize;
-ms-box-sizing: $boxsize;
-o-box-sizing: $boxsize;
-khtml-box-sizing: $boxsize;
box-sizing: $boxsize;
}
@mixin horizontal-gradient($startColour, $endColour) {
background-color: $endColour;
background-color: $fallback_hex_gradient_bg;
background-image: linear-gradient(to right, $startColour, $endColour);
background-image: -webkit-gradient(linear, 0 0, 100% 0, from($startColour), to($endColour));
background-image: -webkit-linear-gradient(left, $startColour, $endColour);
@ -99,6 +99,7 @@
}
@mixin vertical-gradient($startColour, $endColour) {
background-color: $fallback_hex_gradient_bg;
background-color: mix($startColour, $endColour, 60%);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColour), to($endColour));
background-image: -webkit-linear-gradient(top, $startColour, $endColour);
@ -120,26 +121,26 @@
.container {
width: $grid-container-width;
.columns, .column {
&.one { width: (1*$grid-column-width - $grid-gutter); }
&.two { width: (2*$grid-column-width - $grid-gutter); }
&.three { width: (3*$grid-column-width - $grid-gutter); }
&.four { width: (4*$grid-column-width - $grid-gutter); }
&.five { width: (5*$grid-column-width - $grid-gutter); }
&.six { width: (6*$grid-column-width - $grid-gutter); }
&.seven { width: (7*$grid-column-width - $grid-gutter); }
&.eight { width: (8*$grid-column-width - $grid-gutter); }
&.nine { width: (9*$grid-column-width - $grid-gutter); }
&.ten { width: (10*$grid-column-width - $grid-gutter); }
&.eleven { width: (11*$grid-column-width - $grid-gutter); }
&.twelve { width: (12*$grid-column-width - $grid-gutter); }
&.thirteen { width: (13*$grid-column-width - $grid-gutter); }
&.fourteen { width: (14*$grid-column-width - $grid-gutter); }
&.fifteen { width: (15*$grid-column-width - $grid-gutter); }
&.sixteen { width: (16*$grid-column-width - $grid-gutter); }
&.one-third { width: ($grid-container-width/3) - $grid-gutter; }
&.two-thirds { width: (($grid-container-width/3)*2) - $grid-gutter; }
}
.one { width: (1*$grid-column-width - $grid-gutter); }
.two { width: (2*$grid-column-width - $grid-gutter); }
.three { width: (3*$grid-column-width - $grid-gutter); }
.four { width: (4*$grid-column-width - $grid-gutter); }
.five { width: (5*$grid-column-width - $grid-gutter); }
.six { width: (6*$grid-column-width - $grid-gutter); }
.seven { width: (7*$grid-column-width - $grid-gutter); }
.eight { width: (8*$grid-column-width - $grid-gutter); }
.nine { width: (9*$grid-column-width - $grid-gutter); }
.ten { width: (10*$grid-column-width - $grid-gutter); }
.eleven { width: (11*$grid-column-width - $grid-gutter); }
.twelve { width: (12*$grid-column-width - $grid-gutter); }
.thirteen { width: (13*$grid-column-width - $grid-gutter); }
.fourteen { width: (14*$grid-column-width - $grid-gutter); }
.fifteen { width: (15*$grid-column-width - $grid-gutter); }
.sixteen { width: (16*$grid-column-width - $grid-gutter); }
.one-third { width: ($grid-container-width/3) - $grid-gutter; }
.two-thirds { width: (($grid-container-width/3)*2) - $grid-gutter; }
.offset-by-one { padding-left: $grid-column-width; }
.offset-by-two { padding-left: $grid-column-width*2; }

6
scss/_reset.scss
View File

@ -39,13 +39,13 @@ table {
/* #Misc
================================================== */
.remove-bottom {
margin-bottom: 0 !important;
margin-bottom: 0;
}
.half-bottom {
margin-bottom: 10px !important;
margin-bottom: 10px;
}
.add-bottom {
margin-bottom: 20px !important;
margin-bottom: 20px;
}

26
scss/_typography.scss
View File

@ -11,46 +11,58 @@
font-style: normal; }
*/
h1, h2, h3, h4, h5, h6 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
font-weight: inherit;
}
h1 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading1_font_size;
line-height: $heading1_line_height;
margin: $heading1_margin;
}
h2 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading2_font_size;
line-height: $heading2_line_height;
margin: $heading2_margin;
}
h3 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading3_font_size;
line-height: $heading3_line_height;
margin: $heading3_margin;
}
h4 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading4_font_size;
line-height: $heading4_line_height;
margin: $heading4_margin;
}
h5 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading5_font_size;
line-height: $heading5_line_height;
}
h6 {
color: $heading_colour;
font-family: $heading_font;
font-weight: $heading_font_weight;
font-size: $heading6_font_size;
line-height: $heading6_line_height;
}
@ -67,7 +79,7 @@ p img {
margin: $paragraph_image_margin;
}
p.lead {
.lead {
font-size: $paragraph_lead_font_size;
line-height: $paragraph_lead_line_height;
color: $paragraph_lead_colour;

2
scss/_variables.scss
View File

@ -117,3 +117,5 @@ $list_item_line_height: 18px;
$list_item_margin: 0 0 12px 0;
$list_item_paragraph_line_height: 21px;
$fallback_hex_gradient_bg: #CCC;

1
scss/skeleton.scss vendored
View File

@ -21,6 +21,7 @@ body {
font: 14px/21px $body_font_family;
color: #444;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
/* #Forms