Skip to content
This repository was archived by the owner on Sep 5, 2024. It is now read-only.

Commit 6515e6c

Browse files
Splaktarmmalerba
authored andcommitted
fix(layout): remove some duplicate layout > flex styles (#11613)
<!-- Filling out this template is required! Do not delete it when submitting a Pull Request! Without this information, your Pull Request may be auto-closed. --> ## PR Checklist Please check that your PR fulfills the following requirements: - [x] The commit message follows [our guidelines](https://github.com/angular/material/blob/master/.github/CONTRIBUTING.md#-commit-message-format) - [ ] Tests for the changes have been added or this is not a bug fix / enhancement - [x] Docs have been added, updated, or were not required ## PR Type What kind of change does this PR introduce? <!-- Please check the one that applies to this PR using "x". --> ``` [ ] Bugfix [ ] Enhancement [ ] Documentation content changes [ ] Code style update (formatting, local variables) [x] Refactoring (no functional changes, no api changes) [ ] Build related changes [ ] CI related changes [ ] Infrastructure changes [ ] Other... Please describe: ``` ## What is the current behavior? Some styles like `.layout-row > .flex-50` are duplicated in the final CSS output. <!-- Please describe the current behavior that you are modifying and link to one or more relevant issues. --> Issue Number: Fixes #11609 ## What is the new behavior? - removed some duplicate layout > flex styles - reduced unminified CSS size by 5KB ## Does this PR introduce a breaking change? ``` [ ] Yes [x] No ``` <!-- If this PR contains a breaking change, please describe the impact and migration path for existing applications below. --> <!-- Note that breaking changes are highly unlikely to get merged to master unless the validation is clear and the use case is critical. --> ## Other information
1 parent b3b8d21 commit 6515e6c

File tree

1 file changed

+22
-19
lines changed

1 file changed

+22
-19
lines changed

src/core/style/layout.scss

Lines changed: 22 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -105,6 +105,7 @@
105105

106106
@mixin flex-properties-for-name($name: null) {
107107
$flexName: 'flex';
108+
// $name would be something like xs, sm, md, lg, xl
108109
@if $name != null {
109110
$flexName: 'flex-#{$name}';
110111
$name : '-#{$name}';
@@ -149,24 +150,26 @@
149150
box-sizing: border-box;
150151
}
151152

152-
.layout#{$name}-row > .#{$flexName}-#{$i * 5} {
153-
flex: 1 1 100%;
154-
max-width: #{$value};
155-
max-height: 100%;
156-
box-sizing: border-box;
157-
158-
// Required by Chrome M48+ due to http://crbug.com/546034
159-
@if $i == 0 { min-width: 0; }
160-
}
161-
162-
.layout#{$name}-column > .#{$flexName}-#{$i * 5} {
163-
flex: 1 1 100%;
164-
max-width: 100%;
165-
max-height: #{$value};
166-
box-sizing: border-box;
167-
168-
// Required by Chrome M48+ due to http://crbug.com/546034
169-
@if $i == 0 { min-height: 0; }
153+
@if ($name != '') {
154+
.layout#{$name}-row > .#{$flexName}-#{$i * 5} {
155+
flex: 1 1 100%;
156+
max-width: #{$value};
157+
max-height: 100%;
158+
box-sizing: border-box;
159+
160+
// Required by Chrome M48+ due to http://crbug.com/546034
161+
@if $i == 0 { min-width: 0; }
162+
}
163+
164+
.layout#{$name}-column > .#{$flexName}-#{$i * 5} {
165+
flex: 1 1 100%;
166+
max-width: 100%;
167+
max-height: #{$value};
168+
box-sizing: border-box;
169+
170+
// Required by Chrome M48+ due to http://crbug.com/546034
171+
@if $i == 0 { min-height: 0; }
172+
}
170173
}
171174
}
172175

@@ -190,7 +193,7 @@
190193
> .#{$flexName}-66 { flex: 1 1 100%; max-width: 66.66%; max-height: 100%; box-sizing: border-box; }
191194

192195
// Required by Chrome M48+ due to http://crbug.com/546034
193-
> .flex { min-width: 0; }
196+
> .flex { min-width: 0; }
194197
}
195198

196199
.layout#{$name}-column {

0 commit comments

Comments
 (0)