diff --git a/packages/mdc-snackbar/_mixins.scss b/packages/mdc-snackbar/_mixins.scss index 2ffc3278ab3..a7784447470 100644 --- a/packages/mdc-snackbar/_mixins.scss +++ b/packages/mdc-snackbar/_mixins.scss @@ -94,6 +94,8 @@ .mdc-snackbar__surface { @include feature-targeting-mixins.targets($feat-structure) { + @include rtl-mixins.reflexive-property(padding, 0, variables.$padding); + display: flex; align-items: center; justify-content: flex-start; @@ -131,12 +133,15 @@ @include typography-mixins.typography(variables.$label-type-scale, $query: $query); @include feature-targeting-mixins.targets($feat-structure) { + @include rtl-mixins.reflexive-property(padding, 16px, variables.$padding); + flex-grow: 1; box-sizing: border-box; margin: 0; // 14px top/bottom padding needed to make the height 48px. - padding: 14px 16px; + padding-top: 14px; + padding-bottom: 14px; } } @@ -151,7 +156,6 @@ .mdc-snackbar__actions { @include feature-targeting-mixins.targets($feat-structure) { - @include rtl-mixins.reflexive-property(margin, 0, variables.$padding); display: flex; flex-shrink: 0; @@ -272,6 +276,13 @@ @mixin layout-stacked($query: feature-targeting-functions.all()) { $feat-structure: feature-targeting-functions.create-target($query, structure); + .mdc-snackbar__label { + @include feature-targeting-mixins.targets($feat-structure) { + @include rtl-mixins.reflexive-property(padding, 16px, 0); + padding-bottom: 12px; + } + } + .mdc-snackbar__surface { @include feature-targeting-mixins.targets($feat-structure) { flex-direction: column; diff --git a/test/screenshot/golden.json b/test/screenshot/golden.json index 28d572ba962..e60a4b8b7ed 100644 --- a/test/screenshot/golden.json +++ b/test/screenshot/golden.json @@ -528,11 +528,11 @@ } }, "spec/mdc-snackbar/classes/baseline-with-action.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/classes/baseline-without-action.html": { @@ -552,35 +552,35 @@ } }, "spec/mdc-snackbar/classes/stacked.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/mixins/elevation.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/mixins/fill-color.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/mixins/label-ink-color.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/mixins/max-width.html": { @@ -600,19 +600,19 @@ } }, "spec/mdc-snackbar/mixins/shape-radius.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-snackbar/mixins/viewport-margin.html": { - "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", + "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", "screenshots": { - "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", - "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", - "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" + "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", + "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", + "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" } }, "spec/mdc-switch/classes/baseline.html": {