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

Commit 7b8acac

Browse files
fix(layout): standalone layout css flex-grow and flex-shrink updated
flexboxes should be 50% on flex-md=50 breakpoint and 33% on flex-gt-md=33 breakpoint,etc change flex-grow and flew-shrink values from '0' to '1'. See SHA 9f70430.
1 parent f8a8b3c commit 7b8acac

File tree

1 file changed

+11
-11
lines changed

1 file changed

+11
-11
lines changed

src/core/services/layout/layout.attributes.scss

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -144,40 +144,40 @@ $layout-breakpoint-lg: 1200px !default;
144144
$value : #{$i * 5 + '%'};
145145

146146
[#{$flexName}="#{$i * 5}"] {
147-
flex: 0 0 #{$value};
147+
flex: 1 1 #{$value};
148148
max-width: #{$value};
149149
max-height: 100%;
150150
box-sizing: border-box;
151151
}
152152

153153
[layout="row"] > [#{$flexName}="#{$i * 5}"],
154154
[layout#{$name}="row"] > [#{$flexName}="#{$i * 5}"] {
155-
flex: 0 0 #{$value};
155+
flex: 1 1 #{$value};
156156
max-width: #{$value};
157157
max-height: 100%;
158158
box-sizing: border-box;
159159
}
160160

161161
[layout="column"] > [#{$flexName}="#{$i * 5}"],
162162
[layout#{$name}="column"] > [#{$flexName}="#{$i * 5}"] {
163-
flex: 0 0 #{$value};
163+
flex: 1 1 #{$value};
164164
max-width: 100%;
165165
max-height: #{$value};
166166
box-sizing: border-box;
167167
}
168168
}
169169

170170
[layout="row"], [layout#{$name}="row"] {
171-
> [#{$flexName}="33"] , > [#{$flexName}="33"] { flex: 0 0 33%; max-width: 33%; max-height: 100%; box-sizing: border-box; }
172-
> [#{$flexName}="34"] , > [#{$flexName}="34"] { flex: 0 0 34%; max-width: 34%; max-height: 100%; box-sizing: border-box; }
173-
> [#{$flexName}="66"] , > [#{$flexName}="66"] { flex: 0 0 66%; max-width: 66%; max-height: 100%; box-sizing: border-box; }
174-
> [#{$flexName}="67"] , > [#{$flexName}="67"] { flex: 0 0 67%; max-width: 67%; max-height: 100%; box-sizing: border-box; }
171+
> [#{$flexName}="33"] , > [#{$flexName}="33"] { flex: 1 1 33%; max-width: 33%; max-height: 100%; box-sizing: border-box; }
172+
> [#{$flexName}="34"] , > [#{$flexName}="34"] { flex: 1 1 34%; max-width: 34%; max-height: 100%; box-sizing: border-box; }
173+
> [#{$flexName}="66"] , > [#{$flexName}="66"] { flex: 1 1 66%; max-width: 66%; max-height: 100%; box-sizing: border-box; }
174+
> [#{$flexName}="67"] , > [#{$flexName}="67"] { flex: 1 1 67%; max-width: 67%; max-height: 100%; box-sizing: border-box; }
175175
}
176176
[layout="column"], [layout#{$name}="column"] {
177-
> [#{$flexName}="33"] , > [#{$flexName}="33"] { flex: 0 0 33%; max-width: 100%; max-height: 33%; box-sizing: border-box; }
178-
> [#{$flexName}="34"] , > [#{$flexName}="34"] { flex: 0 0 34%; max-width: 100%; max-height: 34%; box-sizing: border-box; }
179-
> [#{$flexName}="66"] , > [#{$flexName}="66"] { flex: 0 0 66%; max-width: 100%; max-height: 66%; box-sizing: border-box; }
180-
> [#{$flexName}="67"] , > [#{$flexName}="67"] { flex: 0 0 67%; max-width: 100%; max-height: 67%; box-sizing: border-box; }
177+
> [#{$flexName}="33"] , > [#{$flexName}="33"] { flex: 1 1 33%; max-width: 100%; max-height: 33%; box-sizing: border-box; }
178+
> [#{$flexName}="34"] , > [#{$flexName}="34"] { flex: 1 1 34%; max-width: 100%; max-height: 34%; box-sizing: border-box; }
179+
> [#{$flexName}="66"] , > [#{$flexName}="66"] { flex: 1 1 66%; max-width: 100%; max-height: 66%; box-sizing: border-box; }
180+
> [#{$flexName}="67"] , > [#{$flexName}="67"] { flex: 1 1 67%; max-width: 100%; max-height: 67%; box-sizing: border-box; }
181181
}
182182

183183
}

0 commit comments

Comments
 (0)