Migrate /-as-division to math.div

If google3 is the source-of-truth for this third_party code (or if this is legacy code that is no longer synced with an external source), just LGTM this CL and Rosie will submit it. If not, you should patch the upstream source of these files, since we will be disabling support for /-as-division in google3 before support is formally removed from the language.

See go/lsc-slash-as-division-deprecation.

Tested:
    TAP found no affected targets. No targets were built or tested.
    http://test/OCL:380056637:BASE:380052721:1623976139468:f2fd2cbd
PiperOrigin-RevId: 380140762
This commit is contained in:
olly 2021-06-18 09:58:38 +01:00 committed by Oliver Woodman
parent 46645a9d47
commit 4c10d2bd4c
5 changed files with 27 additions and 17 deletions

View File

@ -1,3 +1,5 @@
@use 'sass:list';
@mixin block-elements {
h1, h2, h3, h4, h5, h6, p,
hr, blockquote, figure, pre, .highlighter-rouge,
@ -33,7 +35,7 @@ html {
body {
padding: 0;
margin: 0;
font: map-get($base, font-weight) #{map-get($base, font-size)}/#{map-get($base, line-height)} map-get($base, font-family);
font: map-get($base, font-weight) list.slash(map-get($base, font-size), map-get($base, line-height)) map-get($base, font-family);
::-moz-selection {
background: $select-color;
}
@ -51,7 +53,7 @@ body {
}
input, textarea, select, button {
font: map-get($base, font-weight) #{map-get($base, font-size)}/#{map-get($base, line-height)} map-get($base, font-family);
font: map-get($base, font-weight) list.slash(map-get($base, font-size), map-get($base, line-height)) map-get($base, font-family);
color: $text-color;
}

View File

@ -1,3 +1,5 @@
@use 'sass:math';
$base: (
font-family: (-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif),
font-family-code: (Menlo, Monaco, Consolas, Andale Mono, lucida console, Courier New, monospace),
@ -114,16 +116,16 @@ $button-height-sm: 1.5rem;
$button-height-xs: 1.2rem;
$button: (
padding-y-xl: ($button-height-xl - map-get($base, font-size-xl)) / 2,
padding-x-xl: $button-height-xl / 3,
padding-y-lg: ($button-height-lg - map-get($base, font-size-lg)) / 2,
padding-x-lg: $button-height-lg / 3,
padding-y: ($button-height - map-get($base, font-size)) / 2,
padding-x: $button-height / 3,
padding-y-sm: ($button-height-sm - map-get($base, font-size-sm)) / 2,
padding-x-sm: $button-height-sm / 3,
padding-y-xs: ($button-height-xs - map-get($base, font-size-xs)) / 2,
padding-x-xs: $button-height-xs / 3,
padding-y-xl: math.div($button-height-xl - map-get($base, font-size-xl), 2),
padding-x-xl: math.div($button-height-xl, 3),
padding-y-lg: math.div($button-height-lg - map-get($base, font-size-lg), 2),
padding-x-lg: math.div($button-height-lg, 3),
padding-y: math.div($button-height - map-get($base, font-size), 2),
padding-x: math.div($button-height, 3),
padding-y-sm: math.div($button-height-sm - map-get($base, font-size-sm), 2),
padding-x-sm: math.div($button-height-sm, 3),
padding-y-xs: math.div($button-height-xs - map-get($base, font-size-xs), 2),
padding-x-xs: math.div($button-height-xs, 3),
pill-radius: 6rem,

View File

@ -1,3 +1,5 @@
@use 'sass:math';
$grid-columns: 12;
.grid-container {
@ -18,7 +20,7 @@ $grid-columns: 12;
@include flex(1);
} @else {
@include flex(none);
width: percentage($columns / $grid-columns);
width: percentage(math.div($columns, $grid-columns));
}
}

View File

@ -1,3 +1,5 @@
@use 'sass:math';
ul.toc {
display: block;
margin: 0;
@ -13,7 +15,7 @@ ul.toc {
}
a {
display: inline-block;
margin: map-get($spacers, 1) / 4 0;
margin: math.div(map-get($spacers, 1), 4) 0;
text-decoration: none !important;
@include link-colors($text-color, $main-color-1);
}

View File

@ -1,3 +1,5 @@
@use 'sass:math';
.extensions {
margin: map-get($spacers, 3) 0;
@extend .d-print-none;
@ -17,16 +19,16 @@
}
.extensions--video {
padding-top: percentage(315 / 560);
padding-top: percentage(math.div(315, 560));
}
.extensions--slide {
padding-top: percentage(487 / 599);
padding-top: percentage(math.div(487, 599));
}
.extensions--demo {
min-height: 340px;
padding-top: percentage(315 / 560);
padding-top: percentage(math.div(315, 560));
}
.extensions--audio {