Using cross-browser mixin for calc
This commit is contained in:
parent
359e6703e4
commit
fc5ea429d2
4 changed files with 11 additions and 5 deletions
|
@ -29,3 +29,9 @@
|
||||||
box-shadow: $value;
|
box-shadow: $value;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@mixin calc($property, $expression) {
|
||||||
|
#{$property}: -webkit-calc(#{$expression});
|
||||||
|
#{$property}: -moz-calc(#{$expression});
|
||||||
|
#{$property}: calc(#{$expression});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
|
@ -29,7 +29,7 @@ body {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
||||||
// nav height hardcoded, calc won't support either CSS4 nor SASS vars
|
// nav height hardcoded, calc won't support either CSS4 nor SASS vars
|
||||||
height: calc(100vh - 4.8rem);
|
@include (height, 100vh - 4.8rem);
|
||||||
|
|
||||||
.plugins-container {
|
.plugins-container {
|
||||||
height: inherit;
|
height: inherit;
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
.media-plugin {
|
.media-plugin {
|
||||||
.results {
|
.results {
|
||||||
height: calc(100% - 16rem);
|
@include calc(100% - 16rem);
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
|
|
||||||
.empty {
|
.empty {
|
||||||
|
|
|
@ -61,7 +61,7 @@
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
flex: 0 1 auto;
|
flex: 0 1 auto;
|
||||||
order: 0;
|
order: 0;
|
||||||
height: calc(100% - 10.1rem);
|
@include calc(height, 100% - 10.1rem);
|
||||||
}
|
}
|
||||||
|
|
||||||
.browser {
|
.browser {
|
||||||
|
@ -109,7 +109,7 @@
|
||||||
.playlist {
|
.playlist {
|
||||||
.results {
|
.results {
|
||||||
position: relative; // For the dropdown menu
|
position: relative; // For the dropdown menu
|
||||||
height: calc(100% - 5.1rem);
|
@include calc(height, 100% - 5.1rem);
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -353,7 +353,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.results {
|
.results {
|
||||||
height: calc(100% - 4.7rem);
|
@include calc(height, 100% - 4.7rem);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue