clean code
This commit is contained in:
Simon Constans
parent
447c3910eb
commit
f3b67e8a25
|
|
@ -1,8 +1,6 @@
|
||||||
|
/* -----------------------------
|
||||||
|
flexbox classes
|
||||||
/* ----------------------------- */
|
----------------------------- */
|
||||||
/* ==flexbox classes */
|
|
||||||
/* ----------------------------- */
|
|
||||||
|
|
||||||
/* flexbox layout context on container */
|
/* flexbox layout context on container */
|
||||||
.flex {
|
.flex {
|
||||||
|
|
@ -12,6 +10,7 @@
|
||||||
display: -webkit-flex;
|
display: -webkit-flex;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* horizontal alignment */
|
/* horizontal alignment */
|
||||||
.flex-h {
|
.flex-h {
|
||||||
-webkit-box-orient: horizontal;
|
-webkit-box-orient: horizontal;
|
||||||
|
|
@ -20,6 +19,7 @@
|
||||||
-ms-flex-direction: row;
|
-ms-flex-direction: row;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* vertical alignment */
|
/* vertical alignment */
|
||||||
.flex-v {
|
.flex-v {
|
||||||
-webkit-box-orient: vertical;
|
-webkit-box-orient: vertical;
|
||||||
|
|
@ -28,6 +28,7 @@
|
||||||
-ms-flex-direction: column;
|
-ms-flex-direction: column;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* for fluid items */
|
/* for fluid items */
|
||||||
.flex-fluid {
|
.flex-fluid {
|
||||||
-moz-box-flex: 1;
|
-moz-box-flex: 1;
|
||||||
|
|
@ -36,6 +37,7 @@
|
||||||
-ms-flex: 1;
|
-ms-flex: 1;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* for items that must appear first */
|
/* for items that must appear first */
|
||||||
.flex-start {
|
.flex-start {
|
||||||
-webkit-box-ordinal-group: -1;
|
-webkit-box-ordinal-group: -1;
|
||||||
|
|
@ -45,6 +47,7 @@
|
||||||
-moz-order: -1;
|
-moz-order: -1;
|
||||||
order: -1;
|
order: -1;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* for items that must appear middle */
|
/* for items that must appear middle */
|
||||||
.flex-mid {
|
.flex-mid {
|
||||||
-webkit-box-ordinal-group: 1;
|
-webkit-box-ordinal-group: 1;
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,12 @@
|
||||||
|
/* -----------------------------
|
||||||
|
Forms
|
||||||
|
-----------------------------
|
||||||
|
|
||||||
/* ----------------------------- */
|
thanks to :
|
||||||
/* ==forms */
|
* HTML5boilerplate
|
||||||
/* ----------------------------- */
|
* github.com/nathansmith/formalize
|
||||||
|
* www.sitepen.com
|
||||||
/* thanks to HTML5boilerplate, github.com/nathansmith/formalize and www.sitepen.com */
|
*/
|
||||||
|
|
||||||
|
|
||||||
/* buttons */
|
/* buttons */
|
||||||
.btn { display: inline-block; }
|
.btn { display: inline-block; }
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,6 @@
|
||||||
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
grids
|
||||||
/* ==grids */
|
----------------------------- */
|
||||||
/* ----------------------------- */
|
|
||||||
|
|
||||||
/* equal grids with 2% gutter */
|
/* equal grids with 2% gutter */
|
||||||
[class^=grid]:after {
|
[class^=grid]:after {
|
||||||
|
|
@ -27,12 +26,12 @@
|
||||||
.grid3-1 > *:first-child,
|
.grid3-1 > *:first-child,
|
||||||
.grid1-3 > * + * { width: 74.5%; }
|
.grid1-3 > * + * { width: 74.5%; }
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==autogrids */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
autogrids
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* auto-justified equal grids */
|
/* auto-justified equal grids */
|
||||||
|
|
||||||
[class*="autogrid"] {
|
[class*="autogrid"] {
|
||||||
text-align: justify;
|
text-align: justify;
|
||||||
font-size: 1px; letter-spacing: -1px; /* whitespace fix part 1 */
|
font-size: 1px; letter-spacing: -1px; /* whitespace fix part 1 */
|
||||||
|
|
@ -59,7 +58,6 @@
|
||||||
.autogrid12 > * {width: 6.4%}
|
.autogrid12 > * {width: 6.4%}
|
||||||
|
|
||||||
/* Responsiv-o-matic */
|
/* Responsiv-o-matic */
|
||||||
|
|
||||||
@media (max-width: 1024px) {
|
@media (max-width: 1024px) {
|
||||||
.autogrid5 > *,
|
.autogrid5 > *,
|
||||||
.autogrid6 > *,
|
.autogrid6 > *,
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,6 @@
|
||||||
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
icons and bullets
|
||||||
/* ==icons and bullets */
|
----------------------------- */
|
||||||
/* ----------------------------- */
|
|
||||||
|
|
||||||
.icon {display: inline-block;}
|
.icon {display: inline-block;}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,11 +1,11 @@
|
||||||
/*
|
/**
|
||||||
* www.KNACSS.com V2.6n (2013-07) @author: Raphael Goetter, Alsacreations
|
* www.KNACSS.com V2.6n (2013-07) @author: Raphael Goetter, Alsacreations
|
||||||
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
|
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* ----------------------------- */
|
/* -----------------------------
|
||||||
/* ==reset */
|
reset
|
||||||
/* ----------------------------- */
|
----------------------------- */
|
||||||
|
|
||||||
/* base font-size corresponds to 10px and is adapted to rem unit */
|
/* base font-size corresponds to 10px and is adapted to rem unit */
|
||||||
html {
|
html {
|
||||||
|
|
@ -209,9 +209,10 @@ body > script {display: none !important;}
|
||||||
position: static;
|
position: static;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==layout and modules */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
layout and modules
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* switching box model for all elements */
|
/* switching box model for all elements */
|
||||||
* {
|
* {
|
||||||
|
|
@ -260,8 +261,10 @@ body > script {display: none !important;}
|
||||||
vertical-align: top;
|
vertical-align: top;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* alignments (blocks and inline) */
|
|
||||||
/* ------------------------------ */
|
/* ------------------------------
|
||||||
|
alignments
|
||||||
|
------------------------------ */
|
||||||
|
|
||||||
/* left elements */
|
/* left elements */
|
||||||
.left {
|
.left {
|
||||||
|
|
@ -381,9 +384,11 @@ source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
|
||||||
|
|
||||||
.desktop-hidden { display: none; } /* hidden on desktop */
|
.desktop-hidden { display: none; } /* hidden on desktop */
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==forms */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
forms
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
form,
|
form,
|
||||||
fieldset {
|
fieldset {
|
||||||
border: none;
|
border: none;
|
||||||
|
|
@ -403,9 +408,10 @@ textarea {
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==iefix */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
iefix
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* hasLayout for IE6/IE7 */
|
/* hasLayout for IE6/IE7 */
|
||||||
.ie67 .clearfix,
|
.ie67 .clearfix,
|
||||||
|
|
@ -436,9 +442,10 @@ textarea {
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==print */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
print
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* quick print reset */
|
/* quick print reset */
|
||||||
@media print {
|
@media print {
|
||||||
|
|
@ -468,13 +475,12 @@ textarea {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==own stylesheet */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
own stylesheet
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* Here should go your own CSS styles */
|
/* Here should go your own CSS styles */
|
||||||
/* You can link them with an @import or, better for webperf, just paste them here */
|
/* You can link them with an @import or, better for webperf, just paste them here */
|
||||||
|
|
||||||
/* @import url(my-styles.css); */
|
/* @import url(my-styles.css); */
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,7 @@
|
||||||
/* quick print reset */
|
/* -----------------------------
|
||||||
|
quick print reset
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
@media print {
|
@media print {
|
||||||
* {
|
* {
|
||||||
background: transparent !important;
|
background: transparent !important;
|
||||||
|
|
|
||||||
20
css/rwd.css
20
css/rwd.css
|
|
@ -1,7 +1,7 @@
|
||||||
|
/* -----------------------------
|
||||||
|
viewport fixing for RWD
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==viewport fixing for RWD */
|
|
||||||
/* ----------------------------- */
|
|
||||||
@-webkit-viewport {
|
@-webkit-viewport {
|
||||||
width: device-width;
|
width: device-width;
|
||||||
zoom: 1.0;
|
zoom: 1.0;
|
||||||
|
|
@ -23,9 +23,10 @@
|
||||||
zoom: 1.0;
|
zoom: 1.0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==desktop and retina medias */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
desktop and retina medias
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
@media (min-width: 641px) {
|
@media (min-width: 641px) {
|
||||||
/* here go rules for big resources and big screens like: background-images, font-faces, etc. */
|
/* here go rules for big resources and big screens like: background-images, font-faces, etc. */
|
||||||
|
|
@ -34,9 +35,10 @@
|
||||||
/* Style adjustments for retina devices */
|
/* Style adjustments for retina devices */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---------------------------------- */
|
|
||||||
/* ==Responsive large / small / tiny */
|
/* ----------------------------------
|
||||||
/* ---------------------------------- */
|
Responsive large / small / tiny
|
||||||
|
---------------------------------- */
|
||||||
|
|
||||||
@media (min-width: 1280px) {
|
@media (min-width: 1280px) {
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,6 @@
|
||||||
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
tables
|
||||||
/* ==tables */
|
----------------------------- */
|
||||||
/* ----------------------------- */
|
|
||||||
|
|
||||||
table,
|
table,
|
||||||
.table {
|
.table {
|
||||||
|
|
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
/*
|
/**
|
||||||
* www.KNACSS.com V2.6n (2013-07) @author: Raphael Goetter, Alsacreations
|
* www.KNACSS.com V2.6n (2013-07) @author: Raphael Goetter, Alsacreations
|
||||||
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
|
* Licence CC-BY http://creativecommons.org/licenses/by/3.0/fr/
|
||||||
*/
|
*/
|
||||||
|
|
@ -30,9 +30,10 @@
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==reset */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
reset
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* base font-size corresponds to 10px and is adapted to rem unit */
|
/* base font-size corresponds to 10px and is adapted to rem unit */
|
||||||
html {
|
html {
|
||||||
|
|
@ -207,9 +208,10 @@ body > script {display: none !important;}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==layout and modules */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
layout and modules
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* switching box model for all elements */
|
/* switching box model for all elements */
|
||||||
* {
|
* {
|
||||||
|
|
@ -312,8 +314,10 @@ body > script {display: none !important;}
|
||||||
order : 42;
|
order : 42;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* alignments (blocks and inline) */
|
|
||||||
/* ------------------------------ */
|
/* ------------------------------
|
||||||
|
alignments
|
||||||
|
------------------------------ */
|
||||||
|
|
||||||
/* left elements */
|
/* left elements */
|
||||||
.left {
|
.left {
|
||||||
|
|
@ -340,8 +344,11 @@ img.left, img.right {
|
||||||
.txtright { text-align: right; }
|
.txtright { text-align: right; }
|
||||||
.txtcenter { text-align: center; }
|
.txtcenter { text-align: center; }
|
||||||
|
|
||||||
/* grids */
|
|
||||||
/* ------------------------------ */
|
/* ------------------------------
|
||||||
|
grids
|
||||||
|
------------------------------ */
|
||||||
|
|
||||||
[class^=grid]:after {
|
[class^=grid]:after {
|
||||||
content: "";
|
content: "";
|
||||||
display: table;
|
display: table;
|
||||||
|
|
@ -383,9 +390,10 @@ img.left, img.right {
|
||||||
width: (100%-@gutter) * 3 / 4;
|
width: (100%-@gutter) * 3 / 4;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==autogrids */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
autogrids
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* auto-justified equal grids */
|
/* auto-justified equal grids */
|
||||||
|
|
||||||
|
|
@ -532,9 +540,11 @@ source https://github.com/stubbornella/oocss/blob/master/core/spacing/space.css
|
||||||
/* hidden on mobile */
|
/* hidden on mobile */
|
||||||
.mobile-hidden { display: block; }
|
.mobile-hidden { display: block; }
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==forms */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
forms
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
form,
|
form,
|
||||||
fieldset {
|
fieldset {
|
||||||
border: none;
|
border: none;
|
||||||
|
|
@ -554,9 +564,10 @@ textarea {
|
||||||
font-size: inherit;
|
font-size: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==iefix */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
iefix
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* haslayout for IE6/IE7 */
|
/* haslayout for IE6/IE7 */
|
||||||
.ie67 .clearfix,
|
.ie67 .clearfix,
|
||||||
|
|
@ -587,9 +598,10 @@ textarea {
|
||||||
}
|
}
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==print */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
print
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* quick print reset */
|
/* quick print reset */
|
||||||
@media print {
|
@media print {
|
||||||
|
|
@ -611,9 +623,10 @@ textarea {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ----------------------------- */
|
|
||||||
/* ==own stylesheet */
|
/* -----------------------------
|
||||||
/* ----------------------------- */
|
own stylesheet
|
||||||
|
----------------------------- */
|
||||||
|
|
||||||
/* Here should go your own CSS styles */
|
/* Here should go your own CSS styles */
|
||||||
/* You can link them with an @import or, better for webperf, just paste them here */
|
/* You can link them with an @import or, better for webperf, just paste them here */
|
||||||
|
|
@ -621,9 +634,9 @@ textarea {
|
||||||
/* @import url(my-styles.css); */
|
/* @import url(my-styles.css); */
|
||||||
|
|
||||||
|
|
||||||
/* ----------------------------- */
|
/* -----------------------------
|
||||||
/* ==desktop and retina medias */
|
desktop and retina medias
|
||||||
/* ----------------------------- */
|
----------------------------- */
|
||||||
|
|
||||||
@media (min-width: @smallscreen) {
|
@media (min-width: @smallscreen) {
|
||||||
/* here go rules for big resources and big screens like: background-images, font-faces, etc. */
|
/* here go rules for big resources and big screens like: background-images, font-faces, etc. */
|
||||||
|
|
@ -632,9 +645,10 @@ textarea {
|
||||||
/* Style adjustments for retina devices */
|
/* Style adjustments for retina devices */
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ---------------------------------- */
|
|
||||||
/* ==Responsive large / medium / tiny */
|
/* ----------------------------------
|
||||||
/* ---------------------------------- */
|
Responsive large / medium / tiny
|
||||||
|
---------------------------------- */
|
||||||
|
|
||||||
@media (min-width: @largescreen) {
|
@media (min-width: @largescreen) {
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user