Skip to content
This repository was archived by the owner on Jan 13, 2025. It is now read-only.

Commit f16f15b

Browse files
EstebanG23EstebanG23
authored
fix(snackbar): adjust mixins to meet spec (#5477)
1 parent ccfb892 commit f16f15b

File tree

2 files changed

+41
-30
lines changed

2 files changed

+41
-30
lines changed

‎packages/mdc-snackbar/_mixins.scss

+13-2
Original file line numberDiff line numberDiff line change
@@ -94,6 +94,8 @@
9494

9595
.mdc-snackbar__surface {
9696
@include feature-targeting-mixins.targets($feat-structure) {
97+
@include rtl-mixins.reflexive-property(padding, 0, variables.$padding);
98+
9799
display: flex;
98100
align-items: center;
99101
justify-content: flex-start;
@@ -131,12 +133,15 @@
131133
@include typography-mixins.typography(variables.$label-type-scale, $query: $query);
132134

133135
@include feature-targeting-mixins.targets($feat-structure) {
136+
@include rtl-mixins.reflexive-property(padding, 16px, variables.$padding);
137+
134138
flex-grow: 1;
135139
box-sizing: border-box;
136140
margin: 0;
137141

138142
// 14px top/bottom padding needed to make the height 48px.
139-
padding: 14px 16px;
143+
padding-top: 14px;
144+
padding-bottom: 14px;
140145
}
141146
}
142147

@@ -151,7 +156,6 @@
151156

152157
.mdc-snackbar__actions {
153158
@include feature-targeting-mixins.targets($feat-structure) {
154-
@include rtl-mixins.reflexive-property(margin, 0, variables.$padding);
155159

156160
display: flex;
157161
flex-shrink: 0;
@@ -272,6 +276,13 @@
272276
@mixin layout-stacked($query: feature-targeting-functions.all()) {
273277
$feat-structure: feature-targeting-functions.create-target($query, structure);
274278

279+
.mdc-snackbar__label {
280+
@include feature-targeting-mixins.targets($feat-structure) {
281+
@include rtl-mixins.reflexive-property(padding, 16px, 0);
282+
padding-bottom: 12px;
283+
}
284+
}
285+
275286
.mdc-snackbar__surface {
276287
@include feature-targeting-mixins.targets($feat-structure) {
277288
flex-direction: column;

‎test/screenshot/golden.json

+28-28
Original file line numberDiff line numberDiff line change
@@ -528,11 +528,11 @@
528528
}
529529
},
530530
"spec/mdc-snackbar/classes/baseline-with-action.html": {
531-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/classes/baseline-with-action.html?utm_source=golden_json",
531+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/baseline-with-action.html?utm_source=golden_json",
532532
"screenshots": {
533-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/classes/baseline-with-action.html.windows_chrome_74.png",
534-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/classes/baseline-with-action.html.windows_firefox_67.png",
535-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/advorak/2018/11/13/01_26_33_478/spec/mdc-snackbar/classes/baseline-with-action.html.windows_ie_11.png"
533+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/baseline-with-action.html.windows_chrome_77.png",
534+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/baseline-with-action.html.windows_firefox_69.png",
535+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/baseline-with-action.html.windows_ie_11.png"
536536
}
537537
},
538538
"spec/mdc-snackbar/classes/baseline-without-action.html": {
@@ -552,35 +552,35 @@
552552
}
553553
},
554554
"spec/mdc-snackbar/classes/stacked.html": {
555-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/classes/stacked.html?utm_source=golden_json",
555+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/stacked.html?utm_source=golden_json",
556556
"screenshots": {
557-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/classes/stacked.html.windows_chrome_74.png",
558-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/classes/stacked.html.windows_firefox_67.png",
559-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/kfranqueiro/2018/12/20/16_29_02_542/spec/mdc-snackbar/classes/stacked.html.windows_ie_11.png"
557+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/stacked.html.windows_chrome_77.png",
558+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/stacked.html.windows_firefox_69.png",
559+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/classes/stacked.html.windows_ie_11.png"
560560
}
561561
},
562562
"spec/mdc-snackbar/mixins/elevation.html": {
563-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/elevation.html?utm_source=golden_json",
563+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/elevation.html?utm_source=golden_json",
564564
"screenshots": {
565-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/mixins/elevation.html.windows_chrome_74.png",
566-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/elevation.html.windows_firefox_67.png",
567-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/advorak/2018/11/13/01_26_33_478/spec/mdc-snackbar/mixins/elevation.html.windows_ie_11.png"
565+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/elevation.html.windows_chrome_77.png",
566+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/elevation.html.windows_firefox_69.png",
567+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/elevation.html.windows_ie_11.png"
568568
}
569569
},
570570
"spec/mdc-snackbar/mixins/fill-color.html": {
571-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/fill-color.html?utm_source=golden_json",
571+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/fill-color.html?utm_source=golden_json",
572572
"screenshots": {
573-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/mixins/fill-color.html.windows_chrome_74.png",
574-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/fill-color.html.windows_firefox_67.png",
575-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/advorak/2018/11/13/01_26_33_478/spec/mdc-snackbar/mixins/fill-color.html.windows_ie_11.png"
573+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/fill-color.html.windows_chrome_77.png",
574+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/fill-color.html.windows_firefox_69.png",
575+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/fill-color.html.windows_ie_11.png"
576576
}
577577
},
578578
"spec/mdc-snackbar/mixins/label-ink-color.html": {
579-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/label-ink-color.html?utm_source=golden_json",
579+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/label-ink-color.html?utm_source=golden_json",
580580
"screenshots": {
581-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/mixins/label-ink-color.html.windows_chrome_74.png",
582-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/label-ink-color.html.windows_firefox_67.png",
583-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/advorak/2018/11/13/01_26_33_478/spec/mdc-snackbar/mixins/label-ink-color.html.windows_ie_11.png"
581+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/label-ink-color.html.windows_chrome_77.png",
582+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/label-ink-color.html.windows_firefox_69.png",
583+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/label-ink-color.html.windows_ie_11.png"
584584
}
585585
},
586586
"spec/mdc-snackbar/mixins/max-width.html": {
@@ -600,19 +600,19 @@
600600
}
601601
},
602602
"spec/mdc-snackbar/mixins/shape-radius.html": {
603-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/11/01/19_04_45_233/spec/mdc-snackbar/mixins/shape-radius.html?utm_source=golden_json",
603+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/shape-radius.html?utm_source=golden_json",
604604
"screenshots": {
605-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/mixins/shape-radius.html.windows_chrome_74.png",
606-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/shape-radius.html.windows_firefox_67.png",
607-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/11/01/19_04_45_233/spec/mdc-snackbar/mixins/shape-radius.html.windows_ie_11.png"
605+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/shape-radius.html.windows_chrome_77.png",
606+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/shape-radius.html.windows_firefox_69.png",
607+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/shape-radius.html.windows_ie_11.png"
608608
}
609609
},
610610
"spec/mdc-snackbar/mixins/viewport-margin.html": {
611-
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/viewport-margin.html?utm_source=golden_json",
611+
"public_url": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/viewport-margin.html?utm_source=golden_json",
612612
"screenshots": {
613-
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/travis/2019/05/10/15_16_09_688/spec/mdc-snackbar/mixins/viewport-margin.html.windows_chrome_74.png",
614-
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/abhiomkar/2019/08/27/16_53_20_055/spec/mdc-snackbar/mixins/viewport-margin.html.windows_firefox_67.png",
615-
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/advorak/2018/11/13/01_26_33_478/spec/mdc-snackbar/mixins/viewport-margin.html.windows_ie_11.png"
613+
"desktop_windows_chrome@77": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/viewport-margin.html.windows_chrome_77.png",
614+
"desktop_windows_firefox@69": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/viewport-margin.html.windows_firefox_69.png",
615+
"desktop_windows_ie@11": "https://storage.googleapis.com/mdc-web-screenshot-tests/esgonzalez/2020/01/15/01_02_34_587/spec/mdc-snackbar/mixins/viewport-margin.html.windows_ie_11.png"
616616
}
617617
},
618618
"spec/mdc-switch/classes/baseline.html": {

0 commit comments

Comments
 (0)