mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Fix deprecated sass (#43753)
This commit is contained in:
parent
2550baba3e
commit
6a558582d5
@ -202,8 +202,8 @@ input[type='checkbox'].cr1:checked + label {
|
||||
.form-control-danger {
|
||||
padding-right: $space-xl;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center right ($input-height / 4);
|
||||
background-size: ($input-height / 2) ($input-height / 2);
|
||||
background-position: center right calc($input-height / 4);
|
||||
background-size: calc($input-height / 2) calc($input-height / 2);
|
||||
}
|
||||
|
||||
// Form validation states
|
||||
|
@ -90,7 +90,7 @@ dt {
|
||||
font-weight: $font-weight-semi-bold;
|
||||
}
|
||||
dd {
|
||||
margin-left: $line-height-base / 2;
|
||||
margin-left: calc($line-height-base / 2);
|
||||
}
|
||||
// Horizontal layout (like forms)
|
||||
.dl-horizontal {
|
||||
|
@ -1,6 +1,6 @@
|
||||
// Fixed Width Icons
|
||||
// -------------------------
|
||||
.#{$fa-css-prefix}-fw {
|
||||
width: (18em / 14);
|
||||
width: calc(18em / 14);
|
||||
text-align: center;
|
||||
}
|
||||
|
4
public/sass/base/font-awesome/_larger.scss
vendored
4
public/sass/base/font-awesome/_larger.scss
vendored
@ -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 {
|
||||
|
4
public/sass/base/font-awesome/_list.scss
vendored
4
public/sass/base/font-awesome/_list.scss
vendored
@ -13,9 +13,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);
|
||||
}
|
||||
}
|
||||
|
@ -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';
|
||||
|
@ -316,7 +316,7 @@
|
||||
.dropdown-menu.dropdown-menu--new {
|
||||
li a,
|
||||
li button {
|
||||
padding: $spacer/2 $spacer;
|
||||
padding: calc($spacer/2) $spacer;
|
||||
border-left: 2px solid $side-menu-bg;
|
||||
background: $side-menu-bg;
|
||||
|
||||
|
@ -1,3 +1,4 @@
|
||||
@use "sass:list";
|
||||
$input-border: 1px solid $input-border-color;
|
||||
|
||||
.gf-form {
|
||||
@ -261,7 +262,7 @@ $input-border: 1px solid $input-border-color;
|
||||
font-size: 11px;
|
||||
background-color: transparent;
|
||||
color: $text-color;
|
||||
font: normal normal normal $font-size-sm/1 FontAwesome;
|
||||
font: normal normal normal list.slash($font-size-sm, 1) FontAwesome;
|
||||
content: '\f0d7';
|
||||
pointer-events: none;
|
||||
}
|
||||
@ -345,7 +346,7 @@ $input-border: 1px solid $input-border-color;
|
||||
right: 11px;
|
||||
background-color: transparent;
|
||||
color: $text-color;
|
||||
font: normal normal normal $font-size-sm/1 FontAwesome;
|
||||
font: normal normal normal list.slash($font-size-sm, 1) FontAwesome;
|
||||
content: '\f0d7';
|
||||
pointer-events: none;
|
||||
font-size: 11px;
|
||||
@ -391,7 +392,7 @@ $input-border: 1px solid $input-border-color;
|
||||
right: $space-sm;
|
||||
background-color: transparent;
|
||||
color: $input-color;
|
||||
font: normal normal normal $font-size-sm/1 FontAwesome;
|
||||
font: normal normal normal list.slash($font-size-sm, 1) FontAwesome;
|
||||
content: '\f0d7';
|
||||
pointer-events: none;
|
||||
font-size: 11px;
|
||||
|
@ -114,7 +114,7 @@
|
||||
.confirm-modal-buttons {
|
||||
margin-bottom: $spacer;
|
||||
button {
|
||||
margin-right: $spacer/2;
|
||||
margin-right: calc($spacer/2);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -5,9 +5,9 @@ $progress-line-uncompleted: lightOrDark($gray-3, $gray-1);
|
||||
|
||||
// Sizing
|
||||
$marker-size: 60px !default;
|
||||
$marker-size-half: ($marker-size / 2);
|
||||
$marker-size-half: calc($marker-size / 2);
|
||||
$path-height: 2px !default;
|
||||
$path-position: $marker-size-half - ($path-height / 2);
|
||||
$path-position: $marker-size-half - calc($path-height / 2);
|
||||
|
||||
.progress-tracker-container {
|
||||
height: 100%;
|
||||
|
@ -14,7 +14,7 @@
|
||||
.pluginlist-icon {
|
||||
vertical-align: sub;
|
||||
font-size: $font-size-h1;
|
||||
margin-right: $spacer / 2;
|
||||
margin-right: calc($spacer / 2);
|
||||
}
|
||||
|
||||
.pluginlist-image {
|
||||
@ -22,7 +22,7 @@
|
||||
}
|
||||
|
||||
.pluginlist-title {
|
||||
margin-right: $spacer / 3;
|
||||
margin-right: calc($spacer / 3);
|
||||
}
|
||||
|
||||
.pluginlist-version {
|
||||
|
@ -12,7 +12,7 @@
|
||||
|
||||
.gf-tabs-link {
|
||||
padding: $tabs-padding;
|
||||
margin-right: $spacer/2;
|
||||
margin-right: calc($spacer/2);
|
||||
position: relative;
|
||||
display: block;
|
||||
border: solid transparent;
|
||||
|
@ -15,8 +15,8 @@
|
||||
flex-grow: 1;
|
||||
max-width: 100%;
|
||||
min-height: 1px;
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: calc($grid-gutter-width / 2);
|
||||
padding-left: calc($grid-gutter-width / 2);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -5,8 +5,8 @@
|
||||
@mixin make-container($gutter: $grid-gutter-width) {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
padding-left: ($gutter / 2);
|
||||
padding-right: ($gutter / 2);
|
||||
padding-left: calc($gutter / 2);
|
||||
padding-right: calc($gutter / 2);
|
||||
@if not $enable-flex {
|
||||
@include clearfix();
|
||||
}
|
||||
@ -28,38 +28,38 @@
|
||||
} @else {
|
||||
@include clearfix();
|
||||
}
|
||||
margin-left: ($gutter / -2);
|
||||
margin-right: ($gutter / -2);
|
||||
margin-left: calc($gutter / -2);
|
||||
margin-right: calc($gutter / -2);
|
||||
}
|
||||
|
||||
@mixin make-col($size, $columns: $grid-columns) {
|
||||
position: relative;
|
||||
min-height: 1px;
|
||||
padding-right: ($grid-gutter-width / 2);
|
||||
padding-left: ($grid-gutter-width / 2);
|
||||
padding-right: calc($grid-gutter-width / 2);
|
||||
padding-left: calc($grid-gutter-width / 2);
|
||||
|
||||
@if $enable-flex {
|
||||
flex: 0 0 percentage($size / $columns);
|
||||
flex: 0 0 percentage(calc($size / $columns));
|
||||
// Add a `max-width` to ensure content within each column does not blow out
|
||||
// the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
|
||||
// do not appear to require this.
|
||||
max-width: percentage($size / $columns);
|
||||
max-width: percentage(calc($size / $columns));
|
||||
} @else {
|
||||
float: left;
|
||||
width: percentage($size / $columns);
|
||||
width: percentage(calc($size / $columns));
|
||||
}
|
||||
}
|
||||
|
||||
@mixin make-col-offset($size, $columns: $grid-columns) {
|
||||
margin-left: percentage($size / $columns);
|
||||
margin-left: percentage(calc($size / $columns));
|
||||
}
|
||||
|
||||
@mixin make-col-push($size, $columns: $grid-columns) {
|
||||
left: if($size > 0, percentage($size / $columns), auto);
|
||||
left: if($size > 0, percentage(calc($size / $columns)), auto);
|
||||
}
|
||||
|
||||
@mixin make-col-pull($size, $columns: $grid-columns) {
|
||||
right: if($size > 0, percentage($size / $columns), auto);
|
||||
right: if($size > 0, percentage(calc($size / $columns)), auto);
|
||||
}
|
||||
|
||||
@mixin make-col-modifier($type, $size, $columns) {
|
||||
|
@ -245,7 +245,7 @@
|
||||
|
||||
// Opacity
|
||||
@mixin opacity($opacity) {
|
||||
opacity: $opacity / 100;
|
||||
opacity: calc($opacity / 100);
|
||||
}
|
||||
|
||||
// BACKGROUNDS
|
||||
|
Loading…
Reference in New Issue
Block a user