Wrapping CSS calcs in calc(); TODO: Remove FontAwesome

This commit is contained in:
James Barnsley
2022-09-04 20:48:15 +12:00
parent e3989c2d15
commit 9633a899e5
5 changed files with 9 additions and 9 deletions

View File

@ -243,7 +243,7 @@ $bp_shallow: 650px;
**/
@mixin grid_item($cols, $gap: 2%, $bottom_margin: 3%) {
width: (0% + (100 / $cols) - ($gap * 2) + (($gap * 2) / $cols));
width: (0% + calc(100 / $cols) - ($gap * 2) + calc(calc($gap * 2) / $cols));
box-sizing: border-box;
margin: 0 $gap $bottom_margin;
@ -265,9 +265,9 @@ $bp_shallow: 650px;
@mixin resolution($pixel_ratio: 2) {
@media only screen and (-webkit-min-device-pixel-ratio: $pixel_ratio),
only screen and ( min--moz-device-pixel-ratio: $pixel_ratio),
only screen and ( -o-min-device-pixel-ratio: $pixel_ratio/1),
only screen and ( -o-min-device-pixel-ratio: calc($pixel_ratio/1)),
only screen and ( min-device-pixel-ratio: $pixel_ratio),
only screen and ( min-resolution: #{$pixel_ratio * 96}dpi),
only screen and ( min-resolution: #{calc($pixel_ratio * 96)}dpi),
only screen and ( min-resolution: #{$pixel_ratio}dppx) {
@content;
}

View File

@ -1,6 +1,6 @@
// Fixed Width Icons
// -------------------------
.#{$fa-css-prefix}-fw {
width: (18em / 14);
width: calc(18em / 14);
text-align: center;
}

View File

@ -3,8 +3,8 @@
/* makes the font 33% larger relative to the icon container */
.#{$fa-css-prefix}-lg {
font-size: (4em / 3);
line-height: (3em / 4);
font-size: calc(4em / 3);
line-height: calc(3em / 4);
vertical-align: -15%;
}
.#{$fa-css-prefix}-2x { font-size: 2em; }

View File

@ -11,9 +11,9 @@
position: absolute;
left: -$fa-li-width;
width: $fa-li-width;
top: (2em / 14);
top: calc(2em / 14);
text-align: center;
&.#{$fa-css-prefix}-lg {
left: -$fa-li-width + (4em / 14);
left: -$fa-li-width + calc(4em / 14);
}
}

View File

@ -9,7 +9,7 @@ $fa-css-prefix: fa !default;
$fa-version: "4.7.0" !default;
$fa-border-color: #eee !default;
$fa-inverse: #fff !default;
$fa-li-width: (30em / 14) !default;
$fa-li-width: calc(30em / 14) !default;
$fa-var-500px: "\f26e";
$fa-var-address-book: "\f2b9";