@material/linear-progress
Version:
The Material Components for the web linear progress indicator component
1 lines • 53 kB
Source Map (JSON)
{"version":3,"sources":["webpack:///./packages/mdc-linear-progress/mdc-linear-progress.scss","webpack:///mdc-linear-progress.scss","webpack:///./packages/material-components-web/node_modules/@material/theme/_css.scss","webpack:///./packages/material-components-web/node_modules/@material/theme/_gss.scss","webpack:///./packages/mdc-linear-progress/_mixins.scss","webpack:///./packages/material-components-web/node_modules/@material/dom/_dom.scss","webpack:///./packages/material-components-web/node_modules/@material/rtl/_rtl.scss","webpack:///./packages/mdc-linear-progress/_variables.scss"],"names":[],"mappings":";;;;;;;AAyBE;EACE;IACE;YAAA;ECxBJ;ED2BE;IACE;YAAA;IACA;YAAA;ECzBJ;ED4BE;IACE;YAAA;IE8BA;YAAA;ICZF;IDwBA;YAAA;EDjEF;EDqCE;IEgBE;YAAA;ICZF;IDwBA;YAAA;ED5DF;AACF;ADME;EACE;IACE;YAAA;ECxBJ;ED2BE;IACE;YAAA;IACA;YAAA;ECzBJ;ED4BE;IACE;YAAA;IE8BA;YAAA;ICZF;IDwBA;YAAA;EDjEF;EDqCE;IEgBE;YAAA;ICZF;IDwBA;YAAA;ED5DF;AACF;AD0CE;EACE;IACE;YAAA;ECxCJ;ED2CE;IACE;YAAA;IACA;YAAA;ECzCJ;ED4CE;IACE;YAAA;IACA;YAAA;EC1CJ;ED6CE;IACE;YAAA;EC3CJ;AACF;AD0BE;EACE;IACE;YAAA;ECxCJ;ED2CE;IACE;YAAA;IACA;YAAA;ECzCJ;ED4CE;IACE;YAAA;IACA;YAAA;EC1CJ;ED6CE;IACE;YAAA;EC3CJ;AACF;ADgDE;EACE;IACE;YAAA;IACA;YAAA;EC9CJ;EDiDE;IACE;YAAA;IExBA;YAAA;ICZF;IDwBA;YAAA;EDhCF;EDoDE;IACE;YAAA;IEjCA;YAAA;ICZF;IDwBA;YAAA;ED1BF;EDuDE;IEzCE;YAAA;ICZF;IDwBA;YAAA;EDrBF;AACF;ADyBE;EACE;IACE;YAAA;IACA;YAAA;EC9CJ;EDiDE;IACE;YAAA;IExBA;YAAA;ICZF;IDwBA;YAAA;EDhCF;EDoDE;IACE;YAAA;IEjCA;YAAA;ICZF;IDwBA;YAAA;ED1BF;EDuDE;IEzCE;YAAA;ICZF;IDwBA;YAAA;EDrBF;AACF;AD4DE;EACE;IACE;YAAA;IAMA;YAAA;EC/DJ;EDkEE;IACE;YAAA;IAMA;YAAA;ECrEJ;EDwEE;IACE;YAAA;IAMA;YAAA;EC3EJ;ED8EE;IACE;YAAA;EC5EJ;AACF;AD2CE;EACE;IACE;YAAA;IAMA;YAAA;EC/DJ;EDkEE;IACE;YAAA;IAMA;YAAA;ECrEJ;EDwEE;IACE;YAAA;IAMA;YAAA;EC3EJ;ED8EE;IACE;YAAA;EC5EJ;AACF;ADiFE;EACE;IAIE;YAAA;EClFJ;AACF;AD4EE;EACE;IAIE;YAAA;EClFJ;AACF;ADuFE;EACE;IACE;YAAA;ECrFJ;EDwFE;IACE;YAAA;IACA;YAAA;ECtFJ;EDyFE;IACE;YAAA;IEhHA;YAAA;ICZF;IDwBA;YAAA;EDgBF;EDiGE;IE7HE;YAAA;ICZF;IDwBA;YAAA;EDqBF;AACF;ADmEE;EACE;IACE;YAAA;ECrFJ;EDwFE;IACE;YAAA;IACA;YAAA;ECtFJ;EDyFE;IACE;YAAA;IEhHA;YAAA;ICZF;IDwBA;YAAA;EDgBF;EDiGE;IE7HE;YAAA;ICZF;IDwBA;YAAA;EDqBF;AACF;ADsGE;EACE;IACE;YAAA;IACA;YAAA;ECpGJ;EDuGE;IACE;YAAA;IE/IA;YAAA;ICZF;IDwBA;YAAA;EDiCF;ED0GE;IACE;YAAA;IExJA;YAAA;ICZF;IDwBA;YAAA;EDuCF;ED6GE;IEhKE;YAAA;ICZF;IDwBA;YAAA;ED4CF;AACF;AD+EE;EACE;IACE;YAAA;IACA;YAAA;ECpGJ;EDuGE;IACE;YAAA;IE/IA;YAAA;ICZF;IDwBA;YAAA;EDiCF;ED0GE;IACE;YAAA;IExJA;YAAA;ICZF;IDwBA;YAAA;EDuCF;ED6GE;IEhKE;YAAA;ICZF;IDwBA;YAAA;ED4CF;AACF;ADkHE;EACE;IACE;YAAA;EChHJ;AACF;AD6GE;EACE;IACE;YAAA;EChHJ;AACF;AG1EE;EAEI;EACA;EACA;UAAA;EAEA;EACA;EAQA;AHmEN;AI1CI;EDxCF;IAUM;EH4EN;AACF;AGrEI;EAEI;EACA;EACA;EACA;UAAA;EACA;UAAA;EAIA;EAAA;EAAA;AHmER;AG/DI;EAEI;EACA;EACA;EACA;UAAA;EAGA;AH8DR;AG1DI;EAEI;EACA;EACA;EACA;AH2DR;AGvDI;EAEI;EAEA;EACA;UAAA;EAIA;UAAA;AHoDR;AGhDI;EAEI;EAIA;AH8CR;AG1CI;EAEI;UAAA;AH2CR;AGvCI;EAEI;AHwCR;AGwEI;EAEI;AHvER;AG2EI;EAEI;AH1ER;AG8EI;EAEI;EACA;AH7ER;AGkFM;EAEI;UAAA;AHjFV;AGqFQ;EAEI;UAAA;AHpFZ;AG0FM;EAEI;UAAA;AHzFV;AG6FQ;EAEI;UAAA;AH5FZ;AKxHM;EACE;EAEA;ALyHR;AGqGE;EDtPE;EAAc;ECyPZ;EDzPF;EAAc;EC2PZ;ED3PF;EAAc;EC6PZ;AHjGN;AGsGI;EAEI;UAAA;AHrGR;AGyGI;EAEI;UAAA;AHxGR;AG6GE;EAEI;UAAA;EAIA;UAAA;AH/GN;AGoHI;ED1RA;EAAc;EC6RV;ED7RJ;EAAc;EC+RV;AHjHR;AGqHI;EDnSA;EAAc;ECsSV;EDtSJ;EAAc;ECwSV;AHlHR;;AGzFI;EAEI;AH2FR;AGtFM;EAEI;UAAA;AHuFV;AGlFQ;;EAGI;UAAA;AHmFZ;;AGlEE;EFxHI;ECZF;EDwBA;ADoLJ;;AGrDE;EAII;AHqDN;;AGjDE;EAEI,yBAlBkB;AHqExB;;AG5CE;EAEI,WG3MG;ANyPT;AG3CI;EAEI,qBGhNC;AN4PT;AGxCI;EAEI;AHyCR,C","file":"mdc.linear-progress.css","sourcesContent":["//\n// Copyright 2017 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n@use '@material/theme/theme';\n@use '@material/theme/custom-properties';\n\n@mixin primary-indeterminate-translate-keyframes_ {\n @keyframes mdc-linear-progress-primary-indeterminate-translate {\n 0% {\n transform: translateX(0);\n }\n\n 20% {\n animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);\n transform: translateX(0);\n }\n\n 59.15% {\n animation-timing-function: cubic-bezier(\n 0.302435,\n 0.381352,\n 0.55,\n 0.956352\n );\n\n $primary-half: custom-properties.create(\n --mdc-linear-progress-primary-half,\n 83.67142%\n );\n @include apply-translate_($primary-half);\n }\n\n 100% {\n $primary-full: custom-properties.create(\n --mdc-linear-progress-primary-full,\n 200.611057%\n );\n @include apply-translate_($primary-full);\n }\n }\n}\n\n@mixin primary-indeterminate-scale-keyframes_ {\n @keyframes mdc-linear-progress-primary-indeterminate-scale {\n 0% {\n transform: scaleX(0.08);\n }\n\n 36.65% {\n animation-timing-function: cubic-bezier(0.334731, 0.12482, 0.785844, 1);\n transform: scaleX(0.08);\n }\n\n 69.15% {\n animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);\n transform: scaleX(0.661479);\n }\n\n 100% {\n transform: scaleX(0.08);\n }\n }\n}\n\n@mixin secondary-indeterminate-translate-keyframes_ {\n @keyframes mdc-linear-progress-secondary-indeterminate-translate {\n 0% {\n animation-timing-function: cubic-bezier(0.15, 0, 0.515058, 0.409685);\n transform: translateX(0);\n }\n\n 25% {\n animation-timing-function: cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);\n $secondary-quarter: custom-properties.create(\n --mdc-linear-progress-secondary-quarter,\n 37.651913%\n );\n @include apply-translate_($secondary-quarter);\n }\n\n 48.35% {\n animation-timing-function: cubic-bezier(0.4, 0.627035, 0.6, 0.902026);\n $secondary-half: custom-properties.create(\n --mdc-linear-progress-secondary-half,\n 84.386165%\n );\n @include apply-translate_($secondary-half);\n }\n\n 100% {\n $secondary-full: custom-properties.create(\n --mdc-linear-progress-secondary-full,\n 160.277782%\n );\n @include apply-translate_($secondary-full);\n }\n }\n}\n\n@mixin secondary-indeterminate-scale-keyframes_ {\n @keyframes mdc-linear-progress-secondary-indeterminate-scale {\n 0% {\n animation-timing-function: cubic-bezier(\n 0.205028,\n 0.057051,\n 0.57661,\n 0.453971\n );\n transform: scaleX(0.08);\n }\n\n 19.15% {\n animation-timing-function: cubic-bezier(\n 0.152313,\n 0.196432,\n 0.648374,\n 1.004315\n );\n transform: scaleX(0.457104);\n }\n\n 44.15% {\n animation-timing-function: cubic-bezier(\n 0.257759,\n -0.003163,\n 0.211762,\n 1.38179\n );\n transform: scaleX(0.72796);\n }\n\n 100% {\n transform: scaleX(0.08);\n }\n }\n}\n\n@mixin buffering-keyframes_ {\n @keyframes mdc-linear-progress-buffering {\n from {\n // Normally the buffer dots start from the left and overflow to the right.\n // We rotate by 180deg so that the buffer dots start on the right when\n // in non-reversed mode and overflow to the left.\n transform: rotate(180deg) translateX(-10px);\n }\n }\n}\n\n@mixin primary-indeterminate-translate-reverse-keyframes_ {\n @keyframes mdc-linear-progress-primary-indeterminate-translate-reverse {\n 0% {\n transform: translateX(0);\n }\n\n 20% {\n animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);\n transform: translateX(0);\n }\n\n 59.15% {\n animation-timing-function: cubic-bezier(\n 0.302435,\n 0.381352,\n 0.55,\n 0.956352\n );\n $primary-half: custom-properties.create(\n --mdc-linear-progress-primary-half-neg,\n -83.67142%\n );\n @include apply-translate_($primary-half);\n }\n\n 100% {\n $primary-full: custom-properties.create(\n --mdc-linear-progress-primary-full-neg,\n -200.611057%\n );\n @include apply-translate_($primary-full);\n }\n }\n}\n\n@mixin secondary-indeterminate-translate-reverse-keyframes_ {\n @keyframes mdc-linear-progress-secondary-indeterminate-translate-reverse {\n 0% {\n animation-timing-function: cubic-bezier(0.15, 0, 0.515058, 0.409685);\n transform: translateX(0);\n }\n\n 25% {\n animation-timing-function: cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);\n $secondary-quarter: custom-properties.create(\n --mdc-linear-progress-secondary-quarter-neg,\n -37.651913%\n );\n @include apply-translate_($secondary-quarter);\n }\n\n 48.35% {\n animation-timing-function: cubic-bezier(0.4, 0.627035, 0.6, 0.902026);\n $secondary-half: custom-properties.create(\n --mdc-linear-progress-secondary-half-neg,\n -84.386165%\n );\n @include apply-translate_($secondary-half);\n }\n\n 100% {\n $secondary-full: custom-properties.create(\n --mdc-linear-progress-secondary-full-neg,\n -160.277782%\n );\n @include apply-translate_($secondary-full);\n }\n }\n}\n\n@mixin buffering-reverse-keyframes_ {\n @keyframes mdc-linear-progress-buffering-reverse {\n from {\n transform: translateX(-10px);\n }\n }\n}\n\n@mixin apply-translate_($value) {\n @include theme.property(\n transform,\n translateX(value),\n $replace: (value: $value)\n );\n}\n","@keyframes mdc-linear-progress-primary-indeterminate-translate {\n 0% {\n transform: translateX(0);\n }\n 20% {\n animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);\n transform: translateX(0);\n }\n 59.15% {\n animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);\n transform: translateX(83.67142%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-primary-half, 83.67142%));\n }\n 100% {\n transform: translateX(200.611057%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-primary-full, 200.611057%));\n }\n}\n@keyframes mdc-linear-progress-primary-indeterminate-scale {\n 0% {\n transform: scaleX(0.08);\n }\n 36.65% {\n animation-timing-function: cubic-bezier(0.334731, 0.12482, 0.785844, 1);\n transform: scaleX(0.08);\n }\n 69.15% {\n animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1);\n transform: scaleX(0.661479);\n }\n 100% {\n transform: scaleX(0.08);\n }\n}\n@keyframes mdc-linear-progress-secondary-indeterminate-translate {\n 0% {\n animation-timing-function: cubic-bezier(0.15, 0, 0.515058, 0.409685);\n transform: translateX(0);\n }\n 25% {\n animation-timing-function: cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);\n transform: translateX(37.651913%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-quarter, 37.651913%));\n }\n 48.35% {\n animation-timing-function: cubic-bezier(0.4, 0.627035, 0.6, 0.902026);\n transform: translateX(84.386165%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-half, 84.386165%));\n }\n 100% {\n transform: translateX(160.277782%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-full, 160.277782%));\n }\n}\n@keyframes mdc-linear-progress-secondary-indeterminate-scale {\n 0% {\n animation-timing-function: cubic-bezier(0.205028, 0.057051, 0.57661, 0.453971);\n transform: scaleX(0.08);\n }\n 19.15% {\n animation-timing-function: cubic-bezier(0.152313, 0.196432, 0.648374, 1.004315);\n transform: scaleX(0.457104);\n }\n 44.15% {\n animation-timing-function: cubic-bezier(0.257759, -0.003163, 0.211762, 1.38179);\n transform: scaleX(0.72796);\n }\n 100% {\n transform: scaleX(0.08);\n }\n}\n@keyframes mdc-linear-progress-buffering {\n from {\n transform: rotate(180deg) translateX(-10px);\n }\n}\n@keyframes mdc-linear-progress-primary-indeterminate-translate-reverse {\n 0% {\n transform: translateX(0);\n }\n 20% {\n animation-timing-function: cubic-bezier(0.5, 0, 0.701732, 0.495819);\n transform: translateX(0);\n }\n 59.15% {\n animation-timing-function: cubic-bezier(0.302435, 0.381352, 0.55, 0.956352);\n transform: translateX(-83.67142%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-primary-half-neg, -83.67142%));\n }\n 100% {\n transform: translateX(-200.611057%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-primary-full-neg, -200.611057%));\n }\n}\n@keyframes mdc-linear-progress-secondary-indeterminate-translate-reverse {\n 0% {\n animation-timing-function: cubic-bezier(0.15, 0, 0.515058, 0.409685);\n transform: translateX(0);\n }\n 25% {\n animation-timing-function: cubic-bezier(0.31033, 0.284058, 0.8, 0.733712);\n transform: translateX(-37.651913%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-quarter-neg, -37.651913%));\n }\n 48.35% {\n animation-timing-function: cubic-bezier(0.4, 0.627035, 0.6, 0.902026);\n transform: translateX(-84.386165%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-half-neg, -84.386165%));\n }\n 100% {\n transform: translateX(-160.277782%);\n /* @alternate */\n transform: translateX(var(--mdc-linear-progress-secondary-full-neg, -160.277782%));\n }\n}\n@keyframes mdc-linear-progress-buffering-reverse {\n from {\n transform: translateX(-10px);\n }\n}\n.mdc-linear-progress {\n position: relative;\n width: 100%;\n transform: translateZ(0);\n outline: 1px solid transparent;\n overflow: hidden;\n transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);\n}\n@media screen and (forced-colors: active) {\n .mdc-linear-progress {\n outline-color: CanvasText;\n }\n}\n.mdc-linear-progress__bar {\n position: absolute;\n width: 100%;\n height: 100%;\n animation: none;\n transform-origin: top left;\n transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);\n}\n.mdc-linear-progress__bar-inner {\n display: inline-block;\n position: absolute;\n width: 100%;\n animation: none;\n border-top-style: solid;\n}\n.mdc-linear-progress__buffer {\n display: flex;\n position: absolute;\n width: 100%;\n height: 100%;\n}\n.mdc-linear-progress__buffer-dots {\n background-repeat: repeat-x;\n flex: auto;\n transform: rotate(180deg);\n animation: mdc-linear-progress-buffering 250ms infinite linear;\n}\n.mdc-linear-progress__buffer-bar {\n flex: 0 1 100%;\n transition: flex-basis 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1);\n}\n.mdc-linear-progress__primary-bar {\n transform: scaleX(0);\n}\n.mdc-linear-progress__secondary-bar {\n display: none;\n}\n.mdc-linear-progress--indeterminate .mdc-linear-progress__bar {\n transition: none;\n}\n.mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar {\n left: -145.166611%;\n}\n.mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar {\n left: -54.888891%;\n display: block;\n}\n.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar {\n animation: mdc-linear-progress-primary-indeterminate-translate 2s infinite linear;\n}\n.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar > .mdc-linear-progress__bar-inner {\n animation: mdc-linear-progress-primary-indeterminate-scale 2s infinite linear;\n}\n.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar {\n animation: mdc-linear-progress-secondary-indeterminate-translate 2s infinite linear;\n}\n.mdc-linear-progress--indeterminate.mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar > .mdc-linear-progress__bar-inner {\n animation: mdc-linear-progress-secondary-indeterminate-scale 2s infinite linear;\n}\n[dir=rtl] .mdc-linear-progress, .mdc-linear-progress[dir=rtl] {\n /*rtl:begin:ignore*/\n /*rtl:end:ignore*/\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]) .mdc-linear-progress__bar, .mdc-linear-progress[dir=rtl]:not([dir=ltr]) .mdc-linear-progress__bar {\n /* @noflip */\n /*rtl:ignore*/\n right: 0;\n /* @noflip */\n /*rtl:ignore*/\n -webkit-transform-origin: center right;\n /* @noflip */\n /*rtl:ignore*/\n transform-origin: center right;\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar, .mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__primary-bar {\n animation-name: mdc-linear-progress-primary-indeterminate-translate-reverse;\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar, .mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--animation-ready .mdc-linear-progress__secondary-bar {\n animation-name: mdc-linear-progress-secondary-indeterminate-translate-reverse;\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]) .mdc-linear-progress__buffer-dots, .mdc-linear-progress[dir=rtl]:not([dir=ltr]) .mdc-linear-progress__buffer-dots {\n animation: mdc-linear-progress-buffering-reverse 250ms infinite linear;\n transform: rotate(0);\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar, .mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__primary-bar {\n /* @noflip */\n /*rtl:ignore*/\n right: -145.166611%;\n /* @noflip */\n /*rtl:ignore*/\n left: auto;\n}\n[dir=rtl] .mdc-linear-progress:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar, .mdc-linear-progress[dir=rtl]:not([dir=ltr]).mdc-linear-progress--indeterminate .mdc-linear-progress__secondary-bar {\n /* @noflip */\n /*rtl:ignore*/\n right: -54.888891%;\n /* @noflip */\n /*rtl:ignore*/\n left: auto;\n}\n\n.mdc-linear-progress--closed {\n opacity: 0;\n}\n.mdc-linear-progress--closed-animation-off .mdc-linear-progress__buffer-dots {\n animation: none;\n}\n.mdc-linear-progress--closed-animation-off.mdc-linear-progress--indeterminate .mdc-linear-progress__bar,\n.mdc-linear-progress--closed-animation-off.mdc-linear-progress--indeterminate .mdc-linear-progress__bar .mdc-linear-progress__bar-inner {\n animation: none;\n}\n\n.mdc-linear-progress__bar-inner {\n border-color: #6200ee;\n /* @alternate */\n border-color: var(--mdc-theme-primary, #6200ee);\n}\n\n.mdc-linear-progress__buffer-dots {\n background-image: url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='%23e6e6e6'/%3E%3C/svg%3E\");\n}\n\n.mdc-linear-progress__buffer-bar {\n background-color: #e6e6e6;\n}\n\n.mdc-linear-progress {\n height: 4px;\n}\n.mdc-linear-progress__bar-inner {\n border-top-width: 4px;\n}\n.mdc-linear-progress__buffer-dots {\n background-size: 10px 4px;\n}","//\n// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n@use './gss';\n\n/// When true, add an additional property/value declaration before declarations\n/// that use advanced features such as custom properties or CSS functions. This\n/// adds fallback support for older browsers such as IE11 that do not support\n/// these features at the cost of additional CSS. Set this variable to false to\n/// disable generating fallback declarations.\n$enable-fallback-declarations: true !default;\n\n/// Writes a CSS property/value declaration. This mixin is used throughout the\n/// theme package for consistency for dynamically setting CSS property values.\n///\n/// This mixin may optionally take a fallback value. For advanced features such\n/// as custom properties or CSS functions like min and max, a fallback value is\n/// recommended to support older browsers.\n///\n/// @param {String} $property - The CSS property of the declaration.\n/// @param {*} $value - The value of the CSS declaration. The value should be\n/// resolved by other theme functions first (i.e. custom property Maps and\n/// Material theme keys are not supported in this mixin). If the value is\n/// null, no declarations will be emitted.\n/// @param {*} $fallback - An optional fallback value for older browsers. If\n/// provided, a second property/value declaration will be added before the\n/// main property/value declaration.\n/// @param {Map} $gss - An optional Map of GSS annotations to add.\n/// @param {Bool} $important - If true, add `!important` to the declaration.\n@mixin declaration(\n $property,\n $value,\n $fallback-value: null,\n $gss: (),\n $important: false\n) {\n // Normally setting a null value to a property will not emit CSS, so mixins\n // wouldn't need to check this. However, Sass will throw an error if the\n // interpolated property is a custom property.\n @if $value != null {\n $important-rule: if($important, ' !important', '');\n\n @if $fallback-value and $enable-fallback-declarations {\n @include gss.annotate($gss);\n #{$property}: #{$fallback-value} #{$important-rule};\n\n // Add @alternate to annotations.\n $gss: map.merge(\n $gss,\n (\n alternate: true,\n )\n );\n }\n\n @include gss.annotate($gss);\n #{$property}: #{$value}#{$important-rule};\n }\n}\n\n/// Unpacks shorthand values for CSS properties (i.e. lists of 1-3 values).\n/// If a list of 4 values is given, it is returned as-is.\n///\n/// Examples:\n///\n/// unpack-value(4px) => 4px 4px 4px 4px\n/// unpack-value(4px 2px) => 4px 2px 4px 2px\n/// unpack-value(4px 2px 2px) => 4px 2px 2px 2px\n/// unpack-value(4px 2px 0 2px) => 4px 2px 0 2px\n///\n/// @param {Number | Map | List} $value - List of 1 to 4 value numbers.\n/// @return {List} a List of 4 value numbers.\n@function unpack-value($value) {\n @if meta.type-of($value) == 'map' or list.length($value) == 1 {\n @return $value $value $value $value;\n } @else if list.length($value) == 4 {\n @return $value;\n } @else if list.length($value) == 3 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 3)\n list.nth($value, 2);\n } @else if list.length($value) == 2 {\n @return list.nth($value, 1) list.nth($value, 2) list.nth($value, 1)\n list.nth($value, 2);\n }\n\n @error \"Invalid CSS property value: '#{$value}' is more than 4 values\";\n}\n","//\n// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:map';\n@use 'sass:meta';\n\n/// Adds optional GSS annotation comments. Useful for theme mixins where one or\n/// more properties are set indirectly.\n///\n/// Annotations may be provided as a Map of annotations or as named arguments.\n///\n/// @example - scss\n/// @include annotate((noflip: true));\n/// left: 0;\n///\n/// @example - scss\n/// @include annotate($noflip: true);\n/// left: 0;\n///\n/// @example - css\n/// /* @noflip */ /*rtl:ignore*/\n/// left: 0;\n///\n/// @param {Map} $annotations - Map of annotations. Values must be set to `true`\n/// for an annotation to be added.\n@mixin annotate($annotations...) {\n $keywords: meta.keywords($annotations);\n @if list.length($annotations) > 0 {\n $annotations: list.nth($annotations, 1);\n } @else {\n $annotations: $keywords;\n }\n\n @if (map.get($annotations, alternate) == true) {\n /* @alternate */\n }\n\n // noflip must be the last tag right before the property\n @if (map.get($annotations, noflip) == true) {\n /* @noflip */ /*rtl:ignore*/\n }\n}\n","// Copyright 2017 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\n// stylelint-disable no-unknown-animations --\n// Animations keyframes are included in `keyframes.scss`.\n// stylelint-disable selector-class-pattern --\n// Selector '.mdc-*' should only be used in this project.\n\n@use 'sass:string';\n@use '@material/animation/functions' as animation-functions;\n@use '@material/dom/dom';\n@use '@material/feature-targeting/feature-targeting';\n@use '@material/rtl/rtl';\n@use '@material/theme/theme';\n@use '@material/theme/theme-color';\n@use './variables';\n@use './keyframes';\n\n//\n// Public\n//\n\n@mixin core-styles($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n $feat-animation: feature-targeting.create-target($query, animation);\n\n @include feature-targeting.targets($feat-animation) {\n @include keyframes.primary-indeterminate-translate-keyframes_;\n @include keyframes.primary-indeterminate-scale-keyframes_;\n @include keyframes.secondary-indeterminate-translate-keyframes_;\n @include keyframes.secondary-indeterminate-scale-keyframes_;\n @include keyframes.buffering-keyframes_;\n @include keyframes.primary-indeterminate-translate-reverse-keyframes_;\n @include keyframes.secondary-indeterminate-translate-reverse-keyframes_;\n @include keyframes.buffering-reverse-keyframes_;\n }\n\n .mdc-linear-progress {\n @include feature-targeting.targets($feat-structure) {\n position: relative;\n width: 100%;\n transform: translateZ(0);\n // Create a border around the bar in Windows High Contrast Mode.\n outline: 1px solid transparent;\n overflow: hidden;\n\n @include dom.forced-colors-mode($exclude-ie11: true) {\n outline-color: CanvasText;\n }\n }\n\n @include feature-targeting.targets($feat-animation) {\n transition: animation-functions.exit-temporary(opacity, 250ms);\n }\n\n &__bar {\n @include feature-targeting.targets($feat-structure) {\n position: absolute;\n width: 100%;\n height: 100%;\n animation: none;\n transform-origin: top left;\n }\n\n @include feature-targeting.targets($feat-animation) {\n transition: animation-functions.exit-temporary(transform, 250ms);\n }\n }\n\n &__bar-inner {\n @include feature-targeting.targets($feat-structure) {\n display: inline-block;\n position: absolute;\n width: 100%;\n animation: none;\n // border-top is used rather than background-color to ensure that the\n // bar is visible in Windows High Contrast Mode.\n border-top-style: solid;\n }\n }\n\n &__buffer {\n @include feature-targeting.targets($feat-structure) {\n display: flex;\n position: absolute;\n width: 100%;\n height: 100%;\n }\n }\n\n &__buffer-dots {\n @include feature-targeting.targets($feat-structure) {\n background-repeat: repeat-x;\n // background-size: 10px variables.$height;\n flex: auto;\n transform: rotate(180deg);\n }\n\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-buffering 250ms infinite linear;\n }\n }\n\n &__buffer-bar {\n @include feature-targeting.targets($feat-structure) {\n flex: 0 1 100%;\n }\n\n @include feature-targeting.targets($feat-animation) {\n transition: animation-functions.exit-temporary(flex-basis, 250ms);\n }\n }\n\n &__primary-bar {\n @include feature-targeting.targets($feat-structure) {\n transform: scaleX(0);\n }\n }\n\n &__secondary-bar {\n @include feature-targeting.targets($feat-structure) {\n display: none;\n }\n }\n\n @include indeterminate_($query: $query);\n\n @include rtl.rtl() {\n // The rtl() mixin does not account for nested `dir` attributes. Set\n // `dir` attribute on root to take highest priority.\n &:not([dir='ltr']) {\n @include _rtl-styles($query: $query);\n }\n }\n\n &--closed {\n @include feature-targeting.targets($feat-structure) {\n opacity: 0;\n }\n }\n\n &--closed-animation-off {\n .mdc-linear-progress__buffer-dots {\n @include feature-targeting.targets($feat-animation) {\n animation: none;\n }\n }\n\n &.mdc-linear-progress--indeterminate {\n .mdc-linear-progress__bar,\n .mdc-linear-progress__bar .mdc-linear-progress__bar-inner {\n @include feature-targeting.targets($feat-animation) {\n animation: none;\n }\n }\n }\n }\n }\n\n @at-root {\n @include bar-color(primary, $query: $query);\n @include buffer-color(variables.$baseline-buffer-color, $query: $query);\n @include track-height(variables.$height, $query: $query);\n }\n}\n\n@mixin bar-color($color, $query: feature-targeting.all()) {\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-linear-progress__bar-inner {\n @include feature-targeting.targets($feat-color) {\n // Border is used rather than background-color to ensure that the\n // bar is visible in Windows High Contrast Mode.\n @include theme.property(border-color, $color);\n }\n }\n}\n\n@mixin buffer-color($color, $query: feature-targeting.all()) {\n // We need to escape the '#' character as \"%23\" for SVG because '#' is a reserved character in URIs.\n $color-value-for-css: theme-color.prop-value($color);\n $color-value-for-svg: str-replace_(\n string.unquote('#{$color-value-for-css}'),\n '#',\n '%23'\n );\n $feat-color: feature-targeting.create-target($query, color);\n\n .mdc-linear-progress__buffer-dots {\n @include feature-targeting.targets($feat-color) {\n // SVG is optimized for data URI (https://codepen.io/tigt/post/optimizing-svgs-in-data-uris)\n // stylelint-disable-next-line function-url-quotes\n background-image: url(\"data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' enable-background='new 0 0 5 2' xml:space='preserve' viewBox='0 0 5 2' preserveAspectRatio='none slice'%3E%3Ccircle cx='1' cy='1' r='1' fill='#{$color-value-for-svg}'/%3E%3C/svg%3E\");\n }\n }\n\n .mdc-linear-progress__buffer-bar {\n @include feature-targeting.targets($feat-color) {\n background-color: $color-value-for-css;\n }\n }\n}\n\n@mixin track-height($height, $query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n .mdc-linear-progress {\n @include feature-targeting.targets($feat-structure) {\n height: $height;\n }\n\n &__bar-inner {\n @include feature-targeting.targets($feat-structure) {\n border-top-width: $height;\n }\n }\n\n &__buffer-dots {\n @include feature-targeting.targets($feat-structure) {\n background-size: 10px $height;\n }\n }\n }\n}\n\n//\n// Private\n//\n\n@mixin indeterminate_($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n $feat-animation: feature-targeting.create-target($query, animation);\n\n &--indeterminate {\n .mdc-linear-progress__bar {\n @include feature-targeting.targets($feat-structure) {\n transition: none;\n }\n }\n\n .mdc-linear-progress__primary-bar {\n @include feature-targeting.targets($feat-structure) {\n left: -145.166611%;\n }\n }\n\n .mdc-linear-progress__secondary-bar {\n @include feature-targeting.targets($feat-structure) {\n left: -54.888891%;\n display: block;\n }\n }\n\n &.mdc-linear-progress--animation-ready {\n .mdc-linear-progress__primary-bar {\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-primary-indeterminate-translate 2s\n infinite linear;\n }\n\n > .mdc-linear-progress__bar-inner {\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-primary-indeterminate-scale 2s\n infinite linear;\n }\n }\n }\n\n .mdc-linear-progress__secondary-bar {\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-secondary-indeterminate-translate 2s\n infinite linear;\n }\n\n > .mdc-linear-progress__bar-inner {\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-secondary-indeterminate-scale 2s\n infinite linear;\n }\n }\n }\n }\n }\n}\n\n@mixin _rtl-styles($query: $query) {\n $feat-structure: feature-targeting.create-target($query, structure);\n $feat-animation: feature-targeting.create-target($query, animation);\n\n .mdc-linear-progress__bar {\n @include feature-targeting.targets($feat-structure) {\n @include rtl.ignore-next-line();\n right: 0;\n @include rtl.ignore-next-line();\n -webkit-transform-origin: center right;\n @include rtl.ignore-next-line();\n transform-origin: center right;\n }\n }\n\n &.mdc-linear-progress--animation-ready {\n .mdc-linear-progress__primary-bar {\n @include feature-targeting.targets($feat-animation) {\n animation-name: mdc-linear-progress-primary-indeterminate-translate-reverse;\n }\n }\n\n .mdc-linear-progress__secondary-bar {\n @include feature-targeting.targets($feat-animation) {\n animation-name: mdc-linear-progress-secondary-indeterminate-translate-reverse;\n }\n }\n }\n\n .mdc-linear-progress__buffer-dots {\n @include feature-targeting.targets($feat-animation) {\n animation: mdc-linear-progress-buffering-reverse 250ms infinite linear;\n }\n\n @include feature-targeting.targets($feat-structure) {\n transform: rotate(0);\n }\n }\n\n &.mdc-linear-progress--indeterminate {\n .mdc-linear-progress__primary-bar {\n @include feature-targeting.targets($feat-structure) {\n @include rtl.ignore-next-line();\n right: -145.166611%;\n @include rtl.ignore-next-line();\n left: auto;\n }\n }\n\n .mdc-linear-progress__secondary-bar {\n @include feature-targeting.targets($feat-structure) {\n @include rtl.ignore-next-line();\n right: -54.888891%;\n @include rtl.ignore-next-line();\n left: auto;\n }\n }\n }\n}\n\n// Based on https://css-tricks.com/snippets/sass/str-replace-function/\n@function str-replace_($string, $search, $replace) {\n $index: string.index($string, $search);\n\n @if $index {\n $head: string.slice($string, 1, $index - 1);\n $tail: str-replace_(\n string.slice($string, $index + string.length($search)),\n $search,\n $replace\n );\n\n @return $head + $replace + $tail;\n }\n\n @return $string;\n}\n","// Copyright 2020 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n\n@use '@material/feature-targeting/feature-targeting';\n///\n/// Emits necessary layout styles to set a transparent border around an element\n/// without interfering with the rest of its component layout. The border is\n/// only visible in high-contrast mode. The target element should be a child of\n/// a relatively positioned top-level element (i.e. a ::before pseudo-element).\n///\n/// @param {number} $border-width - The width of the transparent border.\n/// @param {string} $border-style - The style of the transparent border.\n///\n@mixin transparent-border(\n $border-width: 1px,\n $border-style: solid,\n $query: feature-targeting.all()\n) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include feature-targeting.targets($feat-structure) {\n position: absolute;\n box-sizing: border-box;\n width: 100%;\n height: 100%;\n top: 0;\n left: 0;\n border: $border-width $border-style transparent;\n border-radius: inherit;\n content: '';\n pointer-events: none;\n }\n\n // Used to satisfy Firefox v94 which does not render transparent borders in HCM (b/206440838).\n @include forced-colors-mode($exclude-ie11: true) {\n @include feature-targeting.targets($feat-structure) {\n border-color: CanvasText;\n }\n }\n}\n\n///\n/// Visually hides text content for accessibility. This text should only be\n/// visible to screen reader users.\n/// See https://a11yproject.com/posts/how-to-hide-content/\n///\n@mixin visually-hidden($query: feature-targeting.all()) {\n $feat-structure: feature-targeting.create-target($query, structure);\n\n @include feature-targeting.targets($feat-structure) {\n clip: rect(1px, 1px, 1px, 1px);\n height: 1px;\n overflow: hidden;\n position: absolute;\n white-space: nowrap; /* added line */\n width: 1px;\n }\n}\n\n/// Selects for IE11 support.\n///\n/// @content styles to emit for IE11 support\n@mixin ie11-support {\n @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {\n @content;\n }\n}\n\n/// Selects for `forced-colors` high contrast mode.\n///\n/// While in `forced-colors` mode, only system colors should be used.\n///\n/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/color_value#system_colors\n/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/@media/forced-colors\n/// @content styles to emit in `forced-colors` mode\n@mixin forced-colors-mode($exclude-ie11: false) {\n @if $exclude-ie11 {\n @media screen and (forced-colors: active) {\n @content;\n }\n } @else {\n @media screen and (forced-colors: active), (-ms-high-contrast: active) {\n @content;\n }\n }\n}\n","//\n// Copyright 2017 Google Inc.\n//\n// Permission is hereby granted, free of charge, to any person obtaining a copy\n// of this software and associated documentation files (the \"Software\"), to deal\n// in the Software without restriction, including without limitation the rights\n// to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n// copies of the Software, and to permit persons to whom the Software is\n// furnished to do so, subject to the following conditions:\n//\n// The above copyright notice and this permission notice shall be included in\n// all copies or substantial portions of the Software.\n//\n// THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n// IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n// FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n// AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n// LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n// OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n// THE SOFTWARE.\n//\n\n@use 'sass:list';\n@use 'sass:meta';\n@use 'sass:selector';\n@use '@material/theme/gss';\n@use '@material/theme/selector-ext';\n@use '@material/theme/theme';\n\n$include: true !default;\n\n/// Creates a rule that will be applied when a component is within the context\n/// of an RTL layout.\n///\n/// @example - scss\n/// .mdc-foo {\n/// padding-left: 4px;\n///\n/// @include rtl {\n/// padding-left: auto;\n/// padding-right: 4px;\n/// }\n/// }\n///\n/// @example - css\n/// .mdc-foo {\n/// padding-left: 4px;\n/// }\n///\n/// [dir=\"rtl\"] .mdc-foo,\n/// .mdc-foo[dir=\"rtl\"] {\n/// padding-left: auto;\n/// padding-right: 4px;\n/// }\n///\n/// Note that this mixin works by checking for an ancestor element with\n/// `[dir=\"rtl\"]`. As a result, nested `dir` values are not supported:\n///\n/// @example - html\n/// <html dir=\"rtl\">\n/// <!-- ... -->\n/// <div dir=\"ltr\">\n/// <div class=\"mdc-foo\">Styled incorrectly as RTL!</div>\n/// </div>\n/// </html>\n///\n/// In the future, selectors such as the `:dir` pseudo-class\n/// (http://mdn.io/css/:dir) will help us mitigate this.\n///\n/// @content Content to be styled in an RTL context.\n@mixin rtl() {\n @if ($include) {\n $dir-rtl: '[dir=rtl]';\n\n $rtl-selectors: list.join(\n selector.nest($dir-rtl, &),\n selector-ext.append-strict(&, $dir-rtl)\n );\n\n @at-root {\n #{$rtl-selectors} {\n /*rtl:begin:ignore*/\n @content;\n /*rtl:end:ignore*/\n }\n }\n }\n}\n\n// Takes a base box-model property name (`margin`, `border`, `padding`, etc.) along with a\n// default direction (`left` or `right`) and value, and emits rules which apply the given value to the\n// specified direction by default and the opposite direction in RTL.\n//\n// For example:\n//\n// ```scss\n// .mdc-foo {\n// @include rtl-reflexive-box(margin, left, 8px);\n// }\n// ```\n//\n// is equivalent to:\n//\n// ```scss\n// .mdc-foo {\n// margin-left: 8px;\n// margin-right: 0;\n//\n// @include rtl {\n// margin-left: 0;\n// margin-right: 8px;\n// }\n// }\n// ```\n//\n// whereas:\n//\n// ```scss\n// .mdc-foo {\n// @include rtl-reflexive-box(margin, right, 8px);\n// }\n// ```\n//\n// is equivalent to:\n//\n// ```scss\n// .mdc-foo {\n// margin-left: 0;\n// margin-right: 8px;\n//\n// @include rtl {\n// margin-left: 8px;\n// margin-right: 0;\n// }\n// }\n// ```\n//\n// You can also pass an optional 4th `$root-selector` argument which will be forwarded to `mdc-rtl`,\n// e.g. `@include rtl-reflexive-box(margin, left, 8px, '.mdc-component')`.\n//\n// Note that this function will always zero out the original value in an RTL context.\n// If you're trying to flip the values, use `mdc-rtl-reflexive-property()` instead.\n@mixin reflexive-box(\n $base-property,\n $default-direction,\n $value,\n $replace: null\n) {\n @if (list.index((right, left), $default-direction) == null) {\n @error \"Invalid default direction: '#{$default-direction}'. Please specifiy either 'right' or 'left'.\";\n }\n\n $left-value: $value;\n $right-value: 0;\n\n @if ($default-direction == right) {\n $left-value: 0;\n $right-value: $value;\n }\n\n @include reflexive-property(\n $base-property,\n $left-value,\n $right-value,\n $replace: $replace\n );\n}\n\n// Takes a base property and emits rules that assign <base-property>-left to <left-value> and\n// <base-property>-right to <right-value> in a LTR context, and vice versa in a RTL context.\n// For example:\n//\n// ```scss\n// .mdc-foo {\n// @include rtl-reflexive-property(margin, auto, 12px);\n// }\n// ```\n//\n// is equivalent to:\n//\n// ```scss\n// .mdc-foo {\n// margin-left: auto;\n// margin-right: 12px;\n//\n// @include rtl {\n// margin-left: 12px;\n// margin-right: auto;\n// }\n// }\n// ```\n//\n// An optional 4th `$root-selector` argument can be given, which will be passed to `mdc-rtl`.\n@mixin reflexive-property(\n $base-property,\n $left-value,\n $right-value,\n $replace: null\n) {\n $prop-left: #{$base-property}-left;\n $prop-right: #{$base-property}-right;\n\n @include reflexive(\n $prop-left,\n $left-value,\n $prop-right,\n $right-value,\n $replace: $replace\n );\n}\n\n// Takes an argument specifying a horizontal position property (either 'left' or 'right') as well\n// as a value, and applies that value to the specified position in a LTR context, and flips it in a\n// RTL context. For example:\n//\n// ```scss\n// .mdc-foo {\n// @include rtl-reflexive-position(left, 0);\n// }\n// ```\n//\n// is equivalent to:\n//\n// ```scss\n// .mdc-foo {\n// left: 0;\n// right: initial;\n//\n// @include rtl {\n// left: initial;\n// right: 0;\n// }\n// }\n// ```\n//\n// An optional third $root-selector argument may also be given, which is passed to `mdc-rtl`.\n@mixin reflexive-position($position-property, $value, $replace: null) {\n @if (list.index((right, left), $position-property) == null) {\n @error \"Invalid position #{position-property}. Please specifiy either right or left\";\n }\n\n // TODO: 'initial' is not supported in IE 11. https://caniuse.com/#feat=css-initial-value\n $left-value: $value;\n $right-value: initial;\n\n @if ($position-property == right) {\n $right-value: $value;\n $left-value: initial;\n }\n\n @include reflexive(\n left,\n $left-value,\n right,\n $right-value,\n $replace: $replace\n );\n}\n\n// Takes pair of properties with values as arguments and flips it in RTL context.\n// For example:\n//\n// ```scss\n// .mdc-foo {\n// @include rtl-reflexive(left, 2px, right, 5px);\n// }\n// ```\n//\n// is equivalent to:\n//\n// ```scss\n// .mdc-foo {\n// left: 2px;\n// right: 5px;\n//\n// @include rtl {\n// right: 2px;\n// left: 5px;\n// }\n// }\n// ```\n//\n// An optional fifth `$root-selector` argument may also be given, which is passed to `mdc-r