Skip to content

Commit 38306ee

Browse files
committed
refactor(multiple): remove usages of external density utilities
Reworks a few leftover places where we were using external utilities for dealing with density.
1 parent 62b6263 commit 38306ee

File tree

3 files changed

+19
-35
lines changed

3 files changed

+19
-35
lines changed

src/material/core/tokens/m2/mat/_form-field.scss

Lines changed: 9 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
@use 'sass:math';
22
@use 'sass:map';
33
@use '@material/textfield' as mdc-textfield;
4-
@use '@material/density' as mdc-density;
54
@use '../../token-utils';
65
@use '../../../style/sass-utils';
76
@use '../../../theming/theming';
@@ -105,12 +104,16 @@ $prefix: (mat, form-field);
105104

106105
// Tokens that can be configured through Angular Material's density theming API.
107106
@function get-density-tokens($theme) {
108-
$density-scale: theming.clamp-density(inspection.get-theme-density($theme), -4);
109-
$height: mdc-density.prop-value(
110-
$density-config: mdc-textfield.$density-config,
111-
$density-scale: inspection.get-theme-density($theme),
112-
$property-name: height,
107+
$density-scale: theming.clamp-density(inspection.get-theme-density($theme), -5);
108+
$size-scale: (
109+
0: 56px,
110+
-1: 52px,
111+
-2: 48px,
112+
-3: 44px,
113+
-4: 40px,
114+
-5: 36px,
113115
);
116+
$height: map.get($size-scale, $density-scale);
114117
$hide-label: $height < mdc-textfield.$minimum-height-for-filled-label;
115118

116119
// We computed the desired height of the form-field using the density configuration. The

src/material/core/tokens/m2/mat/_paginator.scss

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
@use 'sass:math';
22
@use 'sass:map';
33
@use '@material/textfield' as mdc-textfield;
4-
@use '@material/density' as mdc-density;
54
@use '../../token-utils';
65
@use '../../../theming/theming';
76
@use '../../../theming/inspection';
@@ -51,12 +50,17 @@ $prefix: (mat, paginator);
5150
-4: 40px,
5251
-5: 40px,
5352
);
54-
$form-field-density-scale: if($density-scale > -4, -4, $density-scale);
55-
$form-field-height: mdc-density.prop-value(
56-
$density-config: mdc-textfield.$density-config,
57-
$density-scale: $form-field-density-scale,
58-
$property-name: height,
53+
$form-field-size-scale: (
54+
0: 56px,
55+
-1: 52px,
56+
-2: 48px,
57+
-3: 44px,
58+
-4: 40px,
59+
-5: 36px,
5960
);
61+
$form-field-density-scale: if($density-scale > -4, -4, $density-scale);
62+
$form-field-height: map.get($form-field-size-scale, $form-field-density-scale);
63+
6064
// We computed the desired height of the form-field using the density configuration. The
6165
// spec only describes vertical spacing/alignment in non-dense mode. This means that we
6266
// cannot update the spacing to explicit numbers based on the density scale. Instead, we

src/material/list/_list-option-trailing-avatar-compat.scss

Lines changed: 0 additions & 23 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
@use '@material/feature-targeting/feature-targeting';
2-
@use '@material/density/functions' as density-functions;
32
@use '@material/list/evolution-mixins' as mdc-list;
4-
@use '@material/list/evolution-variables' as mdc-list-variables;
53
@use '../core/mdc-helpers/mdc-helpers';
64

75
// For compatibility with the non-MDC selection list, we support avatars that are
@@ -59,24 +57,3 @@
5957
}
6058
}
6159
}
62-
63-
@mixin density-styles($density-scale) {
64-
$one-line-tall-height: density-functions.prop-value(
65-
$density-config: mdc-list-variables.$one-line-item-tall-density-config,
66-
$density-scale: $density-scale,
67-
$property-name: height,
68-
);
69-
70-
$two-line-tall-height: density-functions.prop-value(
71-
$density-config: mdc-list-variables.$two-line-item-tall-density-config,
72-
$density-scale: $density-scale,
73-
$property-name: height,
74-
);
75-
76-
@include mdc-helpers.disable-mdc-fallback-declarations {
77-
.mat-mdc-list-option-with-trailing-avatar {
78-
@include mdc-list.one-line-item-height($one-line-tall-height);
79-
@include mdc-list.two-line-item-height($two-line-tall-height);
80-
}
81-
}
82-
}

0 commit comments

Comments
 (0)