suppression des mixins less et sass inutiles
.rem(), .em() et .px() (si compatibilité anciens navigateurs nécessaires, il faudra désormais passer par des task runners pour convertir les rem en em/px)
This commit is contained in:
parent
8e038c2210
commit
51ef45846b
4 changed files with 64 additions and 90 deletions
|
@ -47,19 +47,3 @@
|
|||
|
||||
// misc (choose unit you prefer)
|
||||
@gutter : 20px; // gutter value for grid layouts. Unit can be: %, px, em, rem
|
||||
|
||||
// LESS mixins : don't touch or you'll be banned ;)
|
||||
// px to em/rem
|
||||
.rem(@size, @bf: @base-font-size){
|
||||
@rem: @size / 10;
|
||||
font-size: unit(round(@base-font-size * @size /10), px);
|
||||
font-size: unit(@rem, rem);
|
||||
}
|
||||
.em(@size, @bf: @base-font-size){
|
||||
@em: @size / @bf;
|
||||
font-size: unit(round(@em,2), em);
|
||||
}
|
||||
.px(@size, @bf: @base-font-size){
|
||||
@px: @size * @bf;
|
||||
font-size: unit(round(@px,2), px);
|
||||
}
|
||||
|
|
|
@ -149,23 +149,23 @@ h6,
|
|||
|
||||
/* alternate font-sizing */
|
||||
.smaller {
|
||||
.em(@base-font-size - 4);
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.small {
|
||||
.em(@base-font-size - 2);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.big {
|
||||
.em(@base-font-size + 2);
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.bigger {
|
||||
.em(@base-font-size + 4);
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.biggest {
|
||||
.em(@base-font-size + 6);
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
code,
|
||||
|
@ -338,6 +338,33 @@ body > script {
|
|||
/* alignments (blocks and inline) */
|
||||
/* ------------------------------ */
|
||||
|
||||
/* blocks alignment */
|
||||
.left {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* text and contents alignment */
|
||||
.txtleft {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.txtright {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.txtcenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* left (or starting) elements */
|
||||
.left,
|
||||
.start {
|
||||
|
@ -366,20 +393,3 @@ img.start,
|
|||
img.end {
|
||||
margin-bottom: @tiny-value;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.txtleft {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.txtright {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.txtcenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
@ -47,34 +47,3 @@ $ultra-large-screen : 1920px; // ultra large screens
|
|||
|
||||
// misc (choose unit you prefer)
|
||||
$gutter : 20px; // gutter value for grid layouts. Unit can be: %, px, em, rem
|
||||
|
||||
// Sass mixins : don't touch or you'll be banned ;)
|
||||
// px to em/rem
|
||||
|
||||
@mixin rem($size) {
|
||||
@if unitless($size) {
|
||||
font-size: ($size * 1rem) / 1rem * $base-font-size;
|
||||
font-size: $size * 1rem;
|
||||
}
|
||||
@else {
|
||||
@warn "Please make sure `$size` is unitless."
|
||||
}
|
||||
}
|
||||
@mixin em($size) {
|
||||
@if unitless($size) {
|
||||
$bf: $base-font-size / 1px;
|
||||
font-size: $size / $bf * 1em;
|
||||
}
|
||||
@else {
|
||||
@warn "Please make sure `$size` is unitless."
|
||||
}
|
||||
}
|
||||
@mixin px($size) {
|
||||
@if unitless($size) {
|
||||
$bf: $base-font-size / 1px;
|
||||
font-size: $size * $bf * 1px;
|
||||
}
|
||||
@else {
|
||||
@warn "Please make sure `$size` is unitless."
|
||||
}
|
||||
}
|
|
@ -142,23 +142,23 @@ h6, .h6-like {
|
|||
|
||||
/* alternate font-sizing */
|
||||
.smaller {
|
||||
@include em($base-font-size / 1px - 4);
|
||||
font-size: 0.6em;
|
||||
}
|
||||
|
||||
.small {
|
||||
@include em($base-font-size / 1px - 2);
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
.big {
|
||||
@include em($base-font-size / 1px + 2);
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.bigger {
|
||||
@include em($base-font-size / 1px + 4);
|
||||
font-size: 1.5em;
|
||||
}
|
||||
|
||||
.biggest {
|
||||
@include em($base-font-size / 1px + 6);
|
||||
font-size: 2em;
|
||||
}
|
||||
|
||||
code,
|
||||
|
@ -332,6 +332,33 @@ body > script {
|
|||
/* alignments (blocks and inline) */
|
||||
/* ------------------------------ */
|
||||
|
||||
/* blocks alignment */
|
||||
.left {
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.right {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
/* text and contents alignment */
|
||||
.txtleft {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.txtright {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.txtcenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* left (or starting) elements */
|
||||
.left,
|
||||
.start {
|
||||
|
@ -361,19 +388,3 @@ img.end {
|
|||
margin-bottom: $tiny-value;
|
||||
}
|
||||
|
||||
.center {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.txtleft {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.txtright {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.txtcenter {
|
||||
text-align: center;
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue