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