Created
June 19, 2018 19:02
-
-
Save schontz/c69f310376a1deb8d67250df942b35c3 to your computer and use it in GitHub Desktop.
Change material names to work better with JS/TS imports
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /*! | |
| Material Components for the Web | |
| Copyright (c) 2018 Google Inc. | |
| License: Apache-2.0 | |
| */ | |
| @-webkit-keyframes mdc-ripple-fg-radius-in { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); | |
| transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); } | |
| to { | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripplefg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } } | |
| @keyframes mdc-ripple-fg-radius-in { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1); | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); | |
| transform: translate(var(--mdc-ripple-fg-translate-start, 0)) scale(1); } | |
| to { | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } } | |
| @-webkit-keyframes mdc-ripple-fg-opacity-in { | |
| from { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| opacity: 0; } | |
| to { | |
| opacity: var(--mdc-ripple-fg-opacity, 0); } } | |
| @keyframes mdc-ripple-fg-opacity-in { | |
| from { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| opacity: 0; } | |
| to { | |
| opacity: var(--mdc-ripple-fg-opacity, 0); } } | |
| @-webkit-keyframes mdc-ripple-fg-opacity-out { | |
| from { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| opacity: var(--mdc-ripple-fg-opacity, 0); } | |
| to { | |
| opacity: 0; } } | |
| @keyframes mdc-ripple-fg-opacity-out { | |
| from { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| opacity: var(--mdc-ripple-fg-opacity, 0); } | |
| to { | |
| opacity: 0; } } | |
| .rippleSurface__testEdgeVarBug { | |
| --mdc-ripple-surface-test-edge-var: 1px solid #000; | |
| visibility: hidden; } | |
| .rippleSurface__testEdgeVarBug::before { | |
| border: var(--mdc-ripple-surface-test-edge-var); } | |
| .button { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 2.25rem; | |
| font-weight: 500; | |
| letter-spacing: 0.08929em; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| padding: 0 8px 0 8px; | |
| display: inline-flex; | |
| position: relative; | |
| align-items: center; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| min-width: 64px; | |
| height: 36px; | |
| border: none; | |
| outline: none; | |
| /* @alternate */ | |
| line-height: inherit; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| -webkit-appearance: none; | |
| overflow: hidden; | |
| vertical-align: middle; | |
| border-radius: 2px; } | |
| .button::before, .button::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .button::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .button.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .button.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .button.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .button.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .button.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .button::before, .button::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .button.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .button::mozFocusInner { | |
| padding: 0; | |
| border: 0; } | |
| .button:active { | |
| outline: none; } | |
| .button:hover { | |
| cursor: pointer; } | |
| .button:disabled { | |
| background-color: transparent; | |
| color: rgba(0, 0, 0, 0.37); | |
| cursor: default; | |
| pointer-events: none; } | |
| .button:not(:disabled) { | |
| background-color: transparent; } | |
| .button:not(:disabled) { | |
| color: #6200ee; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee); } | |
| .button::before, .button::after { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| .button::before, .button::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| .button:hover::before { | |
| opacity: 0.04; } | |
| .button:not(.rippleUpgraded):focus::before, .button.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .button:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .button:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .button.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .button .button__icon { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 8px; | |
| display: inline-block; | |
| width: 18px; | |
| height: 18px; | |
| font-size: 18px; | |
| vertical-align: top; } | |
| [dir="rtl"] .button .button__icon, .button .button__icon[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .button svg.button__icon { | |
| fill: currentColor; } | |
| .button__raised .button__icon, | |
| .buttonUnelevated .button__icon, | |
| .buttonOutlined .button__icon { | |
| /* @noflip */ | |
| margin-left: -4px; | |
| /* @noflip */ | |
| margin-right: 8px; } | |
| [dir="rtl"] .button__raised .button__icon, .buttonRaised .button__icon[dir="rtl"], [dir="rtl"] | |
| .buttonUnelevated .button__icon, | |
| .buttonUnelevated .button__icon[dir="rtl"], [dir="rtl"] | |
| .buttonOutlined .button__icon, | |
| .buttonOutlined .button__icon[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: -4px; } | |
| .button__raised, | |
| .buttonUnelevated { | |
| padding: 0 16px 0 16px; } | |
| .button__raised:disabled, | |
| .buttonUnelevated:disabled { | |
| background-color: rgba(0, 0, 0, 0.12); | |
| color: rgba(0, 0, 0, 0.37); } | |
| .button__raised:not(:disabled), | |
| .buttonUnelevated:not(:disabled) { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| .button__raised:not(:disabled), | |
| .buttonUnelevated:not(:disabled) { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| .button__raised:not(:disabled), | |
| .buttonUnelevated:not(:disabled) { | |
| color: #fff; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-primary, #fff); } | |
| .button__raised::before, .buttonRaised::after, | |
| .buttonUnelevated::before, | |
| .buttonUnelevated::after { | |
| background-color: #fff; } | |
| @supports not (-ms-ime-align: auto) { | |
| .button__raised::before, .buttonRaised::after, | |
| .buttonUnelevated::before, | |
| .buttonUnelevated::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-on-primary, #fff); } } | |
| .button__raised:hover::before, | |
| .buttonUnelevated:hover::before { | |
| opacity: 0.08; } | |
| .button__raised:not(.rippleUpgraded):focus::before, .buttonRaised.rippleUpgradedBackgroundFocused::before, | |
| .buttonUnelevated:not(.rippleUpgraded):focus::before, | |
| .buttonUnelevated.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| .button__raised:not(.rippleUpgraded)::after, | |
| .buttonUnelevated:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .button__raised:not(.rippleUpgraded):active::after, | |
| .buttonUnelevated:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.32; } | |
| .button__raised.rippleUpgraded, | |
| .buttonUnelevated.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.32; } | |
| .button__raised { | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .button__raised:hover, .buttonRaised:focus { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); } | |
| .button__raised:active { | |
| box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); } | |
| .button__raised:disabled { | |
| box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); } | |
| .button__outlined { | |
| border-style: solid; | |
| padding: 0 14px 0 14px; | |
| border-width: 2px; | |
| line-height: 32px; } | |
| .button__outlined:disabled { | |
| border-color: rgba(0, 0, 0, 0.37); } | |
| .button__outlined.buttonDense { | |
| line-height: 27px; } | |
| .button__outlined:not(:disabled) { | |
| border-color: #6200ee; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-primary, #6200ee); } | |
| .button__dense { | |
| height: 32px; | |
| font-size: .8125rem; | |
| line-height: 32px; } | |
| .card { | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-surface, #fff); | |
| border-radius: 2px; | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); | |
| display: flex; | |
| flex-direction: column; | |
| box-sizing: border-box; } | |
| .card__outlined { | |
| box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); | |
| border: 1px solid #e0e0e0; } | |
| .card__media { | |
| position: relative; | |
| box-sizing: border-box; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| background-size: cover; } | |
| .card__media::before { | |
| display: block; | |
| content: ""; } | |
| .card__media:firstChild { | |
| border-top-left-radius: inherit; | |
| border-top-right-radius: inherit; } | |
| .card__media:lastChild { | |
| border-bottom-left-radius: inherit; | |
| border-bottom-right-radius: inherit; } | |
| .card__media__square::before { | |
| margin-top: 100%; } | |
| .card__media__16_9::before { | |
| margin-top: 56.25%; } | |
| .card__mediaContent { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| box-sizing: border-box; } | |
| .card__primaryAction { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| display: flex; | |
| flex-direction: column; | |
| box-sizing: border-box; | |
| position: relative; | |
| outline: none; | |
| color: inherit; | |
| text-decoration: none; | |
| cursor: pointer; | |
| overflow: hidden; } | |
| .card__primaryAction::before, .card__primaryAction::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .card__primaryAction::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .card__primaryAction.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .card__primaryAction.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .card__primaryAction.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .card__primaryAction.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .card__primaryAction.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .card__primaryAction::before, .card__primaryAction::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .card__primaryAction.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .card__primaryAction::before, .card__primaryAction::after { | |
| background-color: black; } | |
| .card__primaryAction:hover::before { | |
| opacity: 0.04; } | |
| .card__primaryAction:not(.rippleUpgraded):focus::before, .card__primaryAction.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .card__primaryAction:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .card__primaryAction:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .card__primaryAction.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .card__primaryAction:firstChild { | |
| border-top-left-radius: inherit; | |
| border-top-right-radius: inherit; } | |
| .card__primaryAction:lastChild { | |
| border-bottom-left-radius: inherit; | |
| border-bottom-right-radius: inherit; } | |
| .card__actions { | |
| display: flex; | |
| flex-direction: row; | |
| align-items: center; | |
| box-sizing: border-box; | |
| min-height: 52px; | |
| padding: 8px; } | |
| .card__actions__fullBleed { | |
| padding: 0; } | |
| .card__actionButtons, | |
| .card__actionIcons { | |
| display: flex; | |
| flex-direction: row; | |
| align-items: center; | |
| box-sizing: border-box; } | |
| .card__actionIcons { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)); | |
| flex-grow: 1; | |
| justify-content: flex-end; } | |
| .card__actionButtons + .card__actionIcons { | |
| /* @noflip */ | |
| margin-left: 16px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| [dir="rtl"] .card__actionButtons + .card__actionIcons, .card__actionButtons + .card__actionIcons[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 16px; } | |
| .card__action { | |
| display: inline-flex; | |
| flex-direction: row; | |
| align-items: center; | |
| box-sizing: border-box; | |
| justify-content: center; | |
| cursor: pointer; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; } | |
| .card__action:focus { | |
| outline: none; } | |
| .card__action__button { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 8px; | |
| padding: 0 8px; } | |
| [dir="rtl"] .card__action__button, .card__actionButton[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .card__action__button:lastChild { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| [dir="rtl"] .card__action__button:lastChild, .card__actionButton:lastChild[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .card__actions__fullBleed .card__actionButton { | |
| justify-content: space-between; | |
| width: 100%; | |
| height: auto; | |
| max-height: none; | |
| margin: 0; | |
| padding: 8px 16px; | |
| text-align: left; } | |
| [dir="rtl"] .card__actions__fullBleed .card__actionButton, .card__actionsFullBleed .card__actionButton[dir="rtl"] { | |
| text-align: right; } | |
| .card__action__icon { | |
| margin: -6px 0; | |
| padding: 12px; } | |
| .card__action__icon:not(:disabled) { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)); } | |
| @-webkit-keyframes mdc-checkbox-unchecked-checked-checkmark-path { | |
| 0%, | |
| 50% { | |
| stroke-dashoffset: 29.78334; } | |
| 50% { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } | |
| 100% { | |
| stroke-dashoffset: 0; } } | |
| @keyframes mdc-checkbox-unchecked-checked-checkmark-path { | |
| 0%, | |
| 50% { | |
| stroke-dashoffset: 29.78334; } | |
| 50% { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } | |
| 100% { | |
| stroke-dashoffset: 0; } } | |
| @-webkit-keyframes mdc-checkbox-unchecked-indeterminate-mixedmark { | |
| 0%, | |
| 68.2% { | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); } | |
| 68.2% { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0, 1); } | |
| 100% { | |
| -webkit-transform: scaleX(1); | |
| transform: scaleX(1); } } | |
| @keyframes mdc-checkbox-unchecked-indeterminate-mixedmark { | |
| 0%, | |
| 68.2% { | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); } | |
| 68.2% { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0, 1); } | |
| 100% { | |
| -webkit-transform: scaleX(1); | |
| transform: scaleX(1); } } | |
| @-webkit-keyframes mdc-checkbox-checked-unchecked-checkmark-path { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1); | |
| animation-timing-function: cubic-bezier(0.4, 0, 1, 1); | |
| opacity: 1; | |
| stroke-dashoffset: 0; } | |
| to { | |
| opacity: 0; | |
| stroke-dashoffset: -29.78334; } } | |
| @keyframes mdc-checkbox-checked-unchecked-checkmark-path { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0, 1, 1); | |
| animation-timing-function: cubic-bezier(0.4, 0, 1, 1); | |
| opacity: 1; | |
| stroke-dashoffset: 0; } | |
| to { | |
| opacity: 0; | |
| stroke-dashoffset: -29.78334; } } | |
| @-webkit-keyframes mdc-checkbox-checked-indeterminate-checkmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } | |
| to { | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| opacity: 0; } } | |
| @keyframes mdc-checkbox-checked-indeterminate-checkmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| animation-timing-function: cubic-bezier(0, 0, 0.2, 1); | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } | |
| to { | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| opacity: 0; } } | |
| @-webkit-keyframes mdc-checkbox-indeterminate-checked-checkmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| opacity: 0; } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| opacity: 1; } } | |
| @keyframes mdc-checkbox-indeterminate-checked-checkmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| opacity: 0; } | |
| to { | |
| -webkit-transform: rotate(360deg); | |
| transform: rotate(360deg); | |
| opacity: 1; } } | |
| @-webkit-keyframes mdc-checkbox-checked-indeterminate-mixedmark { | |
| from { | |
| -webkit-animation-timing-function: mdc-animation-deceleration-curve-timing-function; | |
| animation-timing-function: mdc-animation-deceleration-curve-timing-function; | |
| -webkit-transform: rotate(-45deg); | |
| transform: rotate(-45deg); | |
| opacity: 0; } | |
| to { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } } | |
| @keyframes mdc-checkbox-checked-indeterminate-mixedmark { | |
| from { | |
| -webkit-animation-timing-function: mdc-animation-deceleration-curve-timing-function; | |
| animation-timing-function: mdc-animation-deceleration-curve-timing-function; | |
| -webkit-transform: rotate(-45deg); | |
| transform: rotate(-45deg); | |
| opacity: 0; } | |
| to { | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } } | |
| @-webkit-keyframes mdc-checkbox-indeterminate-checked-mixedmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } | |
| to { | |
| -webkit-transform: rotate(315deg); | |
| transform: rotate(315deg); | |
| opacity: 0; } } | |
| @keyframes mdc-checkbox-indeterminate-checked-mixedmark { | |
| from { | |
| -webkit-animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| animation-timing-function: cubic-bezier(0.14, 0, 0, 1); | |
| -webkit-transform: rotate(0deg); | |
| transform: rotate(0deg); | |
| opacity: 1; } | |
| to { | |
| -webkit-transform: rotate(315deg); | |
| transform: rotate(315deg); | |
| opacity: 0; } } | |
| @-webkit-keyframes mdc-checkbox-indeterminate-unchecked-mixedmark { | |
| 0% { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| -webkit-transform: scaleX(1); | |
| transform: scaleX(1); | |
| opacity: 1; } | |
| 32.8%, | |
| 100% { | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); | |
| opacity: 0; } } | |
| @keyframes mdc-checkbox-indeterminate-unchecked-mixedmark { | |
| 0% { | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; | |
| -webkit-transform: scaleX(1); | |
| transform: scaleX(1); | |
| opacity: 1; } | |
| 32.8%, | |
| 100% { | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); | |
| opacity: 0; } } | |
| .checkbox { | |
| display: inline-block; | |
| position: relative; | |
| flex: 0 0 18px; | |
| box-sizing: content-box; | |
| width: 18px; | |
| height: 18px; | |
| padding: 11px; | |
| line-height: 0; | |
| white-space: nowrap; | |
| cursor: pointer; | |
| vertical-align: bottom; | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; } | |
| .checkbox::before, .checkbox::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .checkbox::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .checkbox.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .checkbox.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .checkbox.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .checkbox.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .checkbox.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .checkbox::before, .checkbox::after { | |
| background-color: #018786; } | |
| @supports not (-ms-ime-align: auto) { | |
| .checkbox::before, .checkbox::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .checkbox:hover::before { | |
| opacity: 0.04; } | |
| .checkbox:not(.rippleUpgraded):focus::before, .checkbox.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .checkbox:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .checkbox:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .checkbox.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .checkbox::before, .checkbox::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .checkbox.rippleUpgraded::before, .checkbox.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .checkbox.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .checkbox__checkmarkPath { | |
| stroke: #fff !important; } | |
| .checkbox__mixedmark { | |
| border-color: #fff; } | |
| .checkbox__background::before { | |
| background-color: #018786; } | |
| @supports not (-ms-ime-align: auto) { | |
| .checkbox__background::before { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .checkbox__nativeControl:enabled:not(:checked):not(:indeterminate) ~ .checkbox__background { | |
| border-color: rgba(0, 0, 0, 0.54); | |
| background-color: transparent; } | |
| .checkbox__nativeControl:enabled:checked ~ .checkbox__background, | |
| .checkbox__nativeControl:enabled:indeterminate ~ .checkbox__background { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| @-webkit-keyframes mdc-checkbox-fade-in-background-0 { | |
| 0% { | |
| border-color: rgba(0, 0, 0, 0.54); | |
| background-color: transparent; } | |
| 50% { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| @keyframes mdc-checkbox-fade-in-background-0 { | |
| 0% { | |
| border-color: rgba(0, 0, 0, 0.54); | |
| background-color: transparent; } | |
| 50% { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| @-webkit-keyframes mdc-checkbox-fade-out-background-0 { | |
| 0%, 80% { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| 100% { | |
| border-color: rgba(0, 0, 0, 0.54); | |
| background-color: transparent; } } | |
| @keyframes mdc-checkbox-fade-out-background-0 { | |
| 0%, 80% { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| 100% { | |
| border-color: rgba(0, 0, 0, 0.54); | |
| background-color: transparent; } } | |
| .checkbox__animUncheckedChecked .checkbox__nativeControl:enabled ~ .checkbox__background, .checkboxAnimUncheckedIndeterminate .checkbox__nativeControl:enabled ~ .checkbox__background { | |
| -webkit-animation-name: mdc-checkbox-fade-in-background-0; | |
| animation-name: mdc-checkbox-fade-in-background-0; } | |
| .checkbox__animCheckedUnchecked .checkbox__nativeControl:enabled ~ .checkbox__background, .checkboxAnimIndeterminateUnchecked .checkbox__nativeControl:enabled ~ .checkbox__background { | |
| -webkit-animation-name: mdc-checkbox-fade-out-background-0; | |
| animation-name: mdc-checkbox-fade-out-background-0; } | |
| .checkbox__nativeControl:disabled:not(:checked):not(:indeterminate) ~ .checkbox__background { | |
| border-color: rgba(0, 0, 0, 0.26); } | |
| .checkbox__nativeControl:disabled:checked ~ .checkbox__background, | |
| .checkbox__nativeControl:disabled:indeterminate ~ .checkbox__background { | |
| border-color: transparent; | |
| background-color: rgba(0, 0, 0, 0.26); } | |
| @media screen and (-ms-high-contrast: active) { | |
| .checkbox__mixedmark { | |
| margin: 0 1px; } } | |
| @media screen and (-ms-high-contrast: black-on-white) { | |
| .checkbox__checkmarkPath { | |
| stroke: black !important; } | |
| .checkbox__mixedmark { | |
| border-color: black; } } | |
| .checkbox__disabled { | |
| cursor: default; | |
| pointer-events: none; } | |
| .checkbox__background { | |
| /* @noflip */ | |
| left: 11px; | |
| /* @noflip */ | |
| right: initial; | |
| display: inline-flex; | |
| position: absolute; | |
| top: 11px; | |
| bottom: 0; | |
| align-items: center; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| width: 45%; | |
| height: 45%; | |
| transition: background-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border: 2px solid currentColor; | |
| border-radius: 2px; | |
| background-color: transparent; | |
| pointer-events: none; | |
| will-change: background-color, border-color; } | |
| .checkbox[dir="rtl"] .checkbox__background, | |
| [dir="rtl"] .checkbox .checkbox__background { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 11px; } | |
| .checkbox__checkmark { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| transition: opacity 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| opacity: 0; } | |
| .checkbox__upgraded .checkbox__checkmark { | |
| opacity: 1; } | |
| .checkbox__checkmarkPath { | |
| transition: stroke-dashoffset 180ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| stroke-width: 3.12px; | |
| stroke-dashoffset: 29.78334; | |
| stroke-dasharray: 29.78334; } | |
| .checkbox__mixedmark { | |
| width: 100%; | |
| height: 0; | |
| -webkit-transform: scaleX(0) rotate(0deg); | |
| transform: scaleX(0) rotate(0deg); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border-width: 1px; | |
| border-style: solid; | |
| opacity: 0; } | |
| .checkbox__upgraded .checkbox__background, | |
| .checkboxUpgraded .checkbox__checkmark, | |
| .checkboxUpgraded .checkbox__checkmarkPath, | |
| .checkboxUpgraded .checkbox__mixedmark { | |
| transition: none !important; } | |
| .checkbox__animUncheckedChecked .checkbox__background, .checkboxAnimUncheckedIndeterminate .checkbox__background, .checkboxAnimCheckedUnchecked .checkbox__background, .checkboxAnimIndeterminateUnchecked .checkbox__background { | |
| -webkit-animation-duration: 180ms; | |
| animation-duration: 180ms; | |
| -webkit-animation-timing-function: linear; | |
| animation-timing-function: linear; } | |
| .checkbox__animUncheckedChecked .checkbox__checkmarkPath { | |
| -webkit-animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path; | |
| animation: 180ms linear 0s mdc-checkbox-unchecked-checked-checkmark-path; | |
| transition: none; } | |
| .checkbox__animUncheckedIndeterminate .checkbox__mixedmark { | |
| -webkit-animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark; | |
| animation: 90ms linear 0s mdc-checkbox-unchecked-indeterminate-mixedmark; | |
| transition: none; } | |
| .checkbox__animCheckedUnchecked .checkbox__checkmarkPath { | |
| -webkit-animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path; | |
| animation: 90ms linear 0s mdc-checkbox-checked-unchecked-checkmark-path; | |
| transition: none; } | |
| .checkbox__animCheckedIndeterminate .checkbox__checkmark { | |
| -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark; | |
| animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-checkmark; | |
| transition: none; } | |
| .checkbox__animCheckedIndeterminate .checkbox__mixedmark { | |
| -webkit-animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark; | |
| animation: 90ms linear 0s mdc-checkbox-checked-indeterminate-mixedmark; | |
| transition: none; } | |
| .checkbox__animIndeterminateChecked .checkbox__checkmark { | |
| -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark; | |
| animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-checkmark; | |
| transition: none; } | |
| .checkbox__animIndeterminateChecked .checkbox__mixedmark { | |
| -webkit-animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark; | |
| animation: 500ms linear 0s mdc-checkbox-indeterminate-checked-mixedmark; | |
| transition: none; } | |
| .checkbox__animIndeterminateUnchecked .checkbox__mixedmark { | |
| -webkit-animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark; | |
| animation: 300ms linear 0s mdc-checkbox-indeterminate-unchecked-mixedmark; | |
| transition: none; } | |
| .checkbox__nativeControl:checked ~ .checkbox__background, | |
| .checkbox__nativeControl:indeterminate ~ .checkbox__background { | |
| transition: border-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1), background-color 90ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .checkbox__nativeControl:checked ~ .checkbox__background .checkbox__checkmarkPath, | |
| .checkbox__nativeControl:indeterminate ~ .checkbox__background .checkbox__checkmarkPath { | |
| stroke-dashoffset: 0; } | |
| .checkbox__background::before { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-transform: scale(0, 0); | |
| transform: scale(0, 0); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; | |
| will-change: opacity, transform; } | |
| .rippleUpgraded__unbounded .checkbox__background::before { | |
| content: none; } | |
| .checkbox__nativeControl:focus ~ .checkbox__background::before { | |
| -webkit-transform: scale(2.75, 2.75); | |
| transform: scale(2.75, 2.75); | |
| transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 80ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 80ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| opacity: 0.26; } | |
| .checkbox__nativeControl { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 0; | |
| opacity: 0; | |
| cursor: inherit; } | |
| .checkbox__nativeControl:disabled { | |
| cursor: default; | |
| pointer-events: none; } | |
| .checkbox__nativeControl:checked ~ .checkbox__background .checkbox__checkmark { | |
| transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 180ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| opacity: 1; } | |
| .checkbox__nativeControl:checked ~ .checkbox__background .checkbox__mixedmark { | |
| -webkit-transform: scaleX(1) rotate(-45deg); | |
| transform: scaleX(1) rotate(-45deg); } | |
| .checkbox__nativeControl:indeterminate ~ .checkbox__background .checkbox__checkmark { | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 90ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| opacity: 0; } | |
| .checkbox__nativeControl:indeterminate ~ .checkbox__background .checkbox__mixedmark { | |
| -webkit-transform: scaleX(1) rotate(0deg); | |
| transform: scaleX(1) rotate(0deg); | |
| opacity: 1; } | |
| .chip { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| border-radius: 16px; | |
| background-color: #e0e0e0; | |
| color: rgba(0, 0, 0, 0.87); | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.01786em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| height: 32px; | |
| display: inline-flex; | |
| position: relative; | |
| align-items: center; | |
| box-sizing: border-box; | |
| padding: 7px 12px; | |
| outline: none; | |
| cursor: pointer; | |
| overflow: hidden; } | |
| .chip::before, .chip::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .chip::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .chip.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .chip.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .chip.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .chip.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .chip.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .chip::before, .chip::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .chip.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .chip::before, .chip::after { | |
| background-color: rgba(0, 0, 0, 0.87); } | |
| .chip:hover::before { | |
| opacity: 0.04; } | |
| .chip:not(.rippleUpgraded):focus::before, .chip.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .chip:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .chip:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .chip.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .chip:hover { | |
| color: rgba(0, 0, 0, 0.87); } | |
| .chip.chip__selected::before { | |
| opacity: 0.08; } | |
| .chip.chip__selected::before, .chip.chipSelected::after { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| .chip.chip__selected::before, .chip.chipSelected::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| .chip.chip__selected:hover::before { | |
| opacity: 0.12; } | |
| .chip.chip__selected:not(.rippleUpgraded):focus::before, .chip.chipSelected.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.2; } | |
| .chip.chip__selected:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .chip.chip__selected:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| .chip.chip__selected.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.24; } | |
| .chip.chip__selected { | |
| color: #6200ee; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee); } | |
| .chip.chip__selected .chip__icon.chip__iconLeading { | |
| color: rgba(98, 0, 238, 0.54); } | |
| .chip.chip__selected:hover { | |
| color: #6200ee; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee); } | |
| .chip .chip__checkmarkPath { | |
| stroke: #6200ee; | |
| /* @alternate */ | |
| stroke: var(--mdc-theme-primary, #6200ee); } | |
| .chip .chip__icon.chip__icon__leading { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .chip .chip__icon.chip__icon__trailing { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .chip .chip__icon.chip__icon__trailing:hover { | |
| color: rgba(0, 0, 0, 0.62); } | |
| .chip .chip__icon.chip__icon__trailing:focus { | |
| color: rgba(0, 0, 0, 0.87); } | |
| .chip .chip__icon.chip__icon__leading:not(.chip__iconLeadingHidden) { | |
| width: 20px; | |
| height: 20px; | |
| font-size: 20px; } | |
| .chip .chip__icon.chip__icon__trailing { | |
| width: 18px; | |
| height: 18px; | |
| font-size: 18px; } | |
| .chip:hover { | |
| color: #000; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-surface, #000); } | |
| .chip__exit { | |
| transition: opacity 75ms cubic-bezier(0.4, 0, 0.2, 1), width 150ms cubic-bezier(0, 0, 0.2, 1), padding 100ms linear, margin 100ms linear; | |
| opacity: 0; } | |
| .chip__selected { | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-surface, #fff); } | |
| .chip__text { | |
| white-space: nowrap; } | |
| .chip__icon { | |
| border-radius: 50%; | |
| outline: none; | |
| vertical-align: middle; } | |
| .chip__icon__trailing { | |
| margin: 0 -4px 0 4px; } | |
| .chip__checkmark, | |
| .chip__icon__leading { | |
| height: 20px; | |
| margin: -4px 4px -4px -4px; } | |
| .chip__checkmarkPath { | |
| transition: stroke-dashoffset 150ms 50ms cubic-bezier(0.4, 0, 0.6, 1); | |
| stroke-width: 2px; | |
| stroke-dashoffset: 29.78334; | |
| stroke-dasharray: 29.78334; } | |
| .chip__selected .chip__checkmarkPath { | |
| stroke-dashoffset: 0; } | |
| .chip__checkmarkSvg { | |
| width: 0; | |
| height: 20px; | |
| transition: width 150ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .chip__selected .chip__checkmarkSvg { | |
| width: 20px; } | |
| .chipSet__filter .chip__iconLeading { | |
| transition: opacity 75ms linear; | |
| transition-delay: -50ms; | |
| opacity: 1; } | |
| .chipSet__filter .chip__iconLeading + .chip__checkmark { | |
| transition: opacity 75ms linear; | |
| transition-delay: 80ms; | |
| opacity: 0; } | |
| .chipSet__filter .chip__iconLeading + .chip__checkmark .chip__checkmarkSvg { | |
| transition: width 0ms; } | |
| .chipSet__filter .chipSelected .chip__iconLeading { | |
| opacity: 0; } | |
| .chipSet__filter .chipSelected .chip__iconLeading + .chip__checkmark { | |
| width: 0; | |
| opacity: 1; } | |
| .chipSet__filter .chip__iconLeadingHidden.chip__iconLeading { | |
| width: 0; | |
| opacity: 0; } | |
| .chipSet__filter .chip__iconLeadingHidden.chip__iconLeading + .chip__checkmark { | |
| width: 20px; } | |
| @-webkit-keyframes mdc-chip-entry { | |
| from { | |
| -webkit-transform: scale(0.8); | |
| transform: scale(0.8); | |
| opacity: .4; } | |
| to { | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| opacity: 1; } } | |
| @keyframes mdc-chip-entry { | |
| from { | |
| -webkit-transform: scale(0.8); | |
| transform: scale(0.8); | |
| opacity: .4; } | |
| to { | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| opacity: 1; } } | |
| .chipSet { | |
| padding: 4px; | |
| display: flex; | |
| flex-wrap: wrap; | |
| box-sizing: border-box; } | |
| .chipSet .chip { | |
| margin: 4px; } | |
| .chipSet__input .chip { | |
| -webkit-animation: mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1); | |
| animation: mdc-chip-entry 100ms cubic-bezier(0, 0, 0.2, 1); } | |
| .dialog { | |
| display: flex; | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| align-items: center; | |
| justify-content: center; | |
| width: 100%; | |
| height: 100%; | |
| visibility: hidden; | |
| z-index: 5; } | |
| .dialog__backdrop { | |
| background-color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| align-items: center; | |
| justify-content: center; | |
| width: 100%; | |
| height: 100%; | |
| opacity: 0; | |
| z-index: -1; } | |
| .dialog__surface { | |
| box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-background, #fff); | |
| display: inline-flex; | |
| flex-direction: column; | |
| width: calc(100% - 30px); | |
| min-width: 640px; | |
| max-width: 865px; | |
| -webkit-transform: translateY(150px) scale(0.8); | |
| transform: translateY(150px) scale(0.8); | |
| border-radius: 2px; | |
| opacity: 0; } | |
| .dialog[dir="rtl"] .dialog__surface, | |
| [dir="rtl"] .dialog .dialog__surface { | |
| text-align: right; } | |
| .dialog__header { | |
| display: flex; | |
| align-items: center; | |
| padding: 24px 24px 0; } | |
| .dialog[dir="rtl"] .dialog__header, | |
| [dir="rtl"] .dialog .dialog__header { | |
| text-align: right; } | |
| .dialog__header__empty { | |
| padding: 0; } | |
| .dialog__header__title { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.25rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.0125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| flex: 1; | |
| margin: 0; } | |
| .dialog__body { | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)); | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.5rem; | |
| font-weight: 400; | |
| letter-spacing: 0.03125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| margin-top: 20px; | |
| padding: 0 24px 24px; } | |
| .dialog__body__scrollable { | |
| max-height: 195px; | |
| border-top: 1px solid rgba(0, 0, 0, 0.1); | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.1); | |
| overflow-x: auto; | |
| overflow-y: scroll; | |
| -webkit-overflow-scrolling: touch; } | |
| .dialog__footer { | |
| display: flex; | |
| flex-wrap: wrap; | |
| align-items: center; | |
| justify-content: flex-end; | |
| padding: 8px; } | |
| .dialog__footer__button { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 8px; } | |
| [dir="rtl"] .dialog__footer__button, .dialog__footer__button[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .dialog__footer__button:lastChild { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| [dir="rtl"] .dialog__footer__button:lastChild, .dialog__footer__button:lastChild[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .dialog__action:not(:disabled) { | |
| color: #018786; | |
| /* @alternate */ | |
| color: var(--mdc-theme-secondary, #018786); } | |
| @media (max-width: 640px) { | |
| .dialog { | |
| min-width: 280px; } | |
| .dialog__surface { | |
| min-width: 280px; } | |
| .dialog__body { | |
| line-height: 24px; } } | |
| .dialog__animating { | |
| visibility: visible; } | |
| .dialog__animating .dialog__backdrop { | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .dialog__animating .dialog__surface { | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .dialog__open { | |
| visibility: visible; } | |
| .dialog__open .dialog__backdrop { | |
| opacity: .3; } | |
| .dialog__open .dialog__surface { | |
| -webkit-transform: translateY(0) scale(1); | |
| transform: translateY(0) scale(1); | |
| opacity: 1; } | |
| .dialogScrollLock { | |
| overflow: hidden; } | |
| .drawer__persistent { | |
| color: rgba(0, 0, 0, 0.87); | |
| width: 0; } | |
| .drawer__persistent .drawer__toolbarSpacer { | |
| display: flex; | |
| position: relative; | |
| flex-direction: row; | |
| flex-shrink: 0; | |
| align-items: center; | |
| box-sizing: border-box; | |
| height: 56px; | |
| padding: 16px; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.12); } | |
| @media (min-width: 600px) { | |
| .drawer__persistent .drawer__toolbarSpacer { | |
| height: 64px; } } | |
| .drawer__persistent .drawer__header { | |
| position: relative; } | |
| .drawer__persistent .drawer__header::before { | |
| display: block; | |
| padding-top: 56.25%; | |
| content: ""; } | |
| .drawer__persistent .drawer__headerContent { | |
| display: flex; | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| align-items: flex-end; | |
| box-sizing: border-box; | |
| padding: 16px; } | |
| .drawer__persistent .listItem { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.375rem; | |
| font-weight: 500; | |
| letter-spacing: 0.00714em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| position: relative; | |
| outline: none; | |
| color: inherit; | |
| text-decoration: none; } | |
| .drawer__persistent .listItem__graphic { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .drawer__persistent.drawerPermanent, | |
| .drawerPersistent .drawer__drawer { | |
| background-color: #fff; } | |
| .drawer__persistent .drawer__drawer { | |
| /* @noflip */ | |
| border-left: 0; | |
| /* @noflip */ | |
| border-right: 1px solid #e4e4e4; | |
| /* @noflip */ | |
| left: 0; | |
| /* @noflip */ | |
| right: initial; | |
| height: 100%; | |
| -webkit-transform: translateX(-107%); | |
| transform: translateX(-107%); | |
| -webkit-transform: translateX(calc(-100% - 20px)); | |
| transform: translateX(calc(-100% - 20px)); | |
| will-change: transform; | |
| display: inline-flex; | |
| flex-direction: column; | |
| box-sizing: border-box; | |
| width: 240px; | |
| overflow: hidden; | |
| touch-action: none; } | |
| [dir="rtl"] .drawer__persistent .drawer__drawer, .drawerPersistent .drawer__drawer[dir="rtl"] { | |
| /* @noflip */ | |
| border-left: 1px solid #e4e4e4; | |
| /* @noflip */ | |
| border-right: 0; } | |
| [dir="rtl"] .drawer__persistent .drawer__drawer, .drawerPersistent .drawer__drawer[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 0; } | |
| [dir="rtl"] .drawer__persistent .drawer__drawer, .drawerPersistent .drawer__drawer[dir="rtl"] { | |
| -webkit-transform: translateX(107%); | |
| transform: translateX(107%); | |
| -webkit-transform: translateX(calc(100% + 20px)); | |
| transform: translateX(calc(100% + 20px)); } | |
| .drawer__persistent.drawerOpen { | |
| width: 240px; | |
| pointer-events: auto; } | |
| .drawer__persistent.drawerOpen .drawer__drawer { | |
| -webkit-transform: none; | |
| transform: none; } | |
| [dir="rtl"] .drawer__persistent.drawerOpen .drawer__drawer, .drawerPersistent.drawerOpen[dir="rtl"] .drawer__drawer { | |
| -webkit-transform: none; | |
| transform: none; } | |
| .drawer__persistent.drawerAnimating .drawer__drawer { | |
| transition: -webkit-transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .drawer__persistent.drawerAnimating.drawerOpen .drawer__drawer { | |
| transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .drawer__permanent { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @noflip */ | |
| border-left: 0; | |
| /* @noflip */ | |
| border-right: 1px solid #e4e4e4; | |
| /* @noflip */ | |
| left: 0; | |
| /* @noflip */ | |
| right: initial; | |
| display: inline-flex; | |
| flex: 0 0 auto; | |
| flex-direction: column; | |
| box-sizing: border-box; | |
| width: 240px; | |
| overflow: hidden; } | |
| .drawer__permanent .drawer__toolbarSpacer { | |
| display: flex; | |
| position: relative; | |
| flex-direction: row; | |
| flex-shrink: 0; | |
| align-items: center; | |
| box-sizing: border-box; | |
| height: 56px; | |
| padding: 16px; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.12); } | |
| @media (min-width: 600px) { | |
| .drawer__permanent .drawer__toolbarSpacer { | |
| height: 64px; } } | |
| .drawer__permanent .drawer__header { | |
| position: relative; } | |
| .drawer__permanent .drawer__header::before { | |
| display: block; | |
| padding-top: 56.25%; | |
| content: ""; } | |
| .drawer__permanent .drawer__headerContent { | |
| display: flex; | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| align-items: flex-end; | |
| box-sizing: border-box; | |
| padding: 16px; } | |
| .drawer__permanent .listItem { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.375rem; | |
| font-weight: 500; | |
| letter-spacing: 0.00714em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| position: relative; | |
| outline: none; | |
| color: inherit; | |
| text-decoration: none; } | |
| .drawer__permanent .listItem__graphic { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .drawer__permanent.drawerPermanent, | |
| .drawerPermanent .drawer__drawer { | |
| background-color: #fff; } | |
| [dir="rtl"] .drawer__permanent, .drawerPermanent[dir="rtl"] { | |
| /* @noflip */ | |
| border-left: 1px solid #e4e4e4; | |
| /* @noflip */ | |
| border-right: 0; } | |
| [dir="rtl"] .drawer__permanent, .drawerPermanent[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 0; } | |
| .drawer__permanentFloating { | |
| /* @noflip */ | |
| border-left: 0; | |
| /* @noflip */ | |
| border-right: none; | |
| background: none; } | |
| [dir="rtl"] .drawer__permanentFloating, .drawerPermanentFloating[dir="rtl"] { | |
| /* @noflip */ | |
| border-left: none; | |
| /* @noflip */ | |
| border-right: 0; } | |
| .drawer__temporary { | |
| color: rgba(0, 0, 0, 0.87); | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| pointer-events: none; | |
| overflow: hidden; | |
| contain: strict; | |
| z-index: 5; } | |
| .drawer__temporary .drawer__toolbarSpacer { | |
| display: flex; | |
| position: relative; | |
| flex-direction: row; | |
| flex-shrink: 0; | |
| align-items: center; | |
| box-sizing: border-box; | |
| height: 56px; | |
| padding: 16px; | |
| border-bottom: 1px solid rgba(0, 0, 0, 0.12); } | |
| @media (min-width: 600px) { | |
| .drawer__temporary .drawer__toolbarSpacer { | |
| height: 64px; } } | |
| .drawer__temporary .drawer__header { | |
| position: relative; } | |
| .drawer__temporary .drawer__header::before { | |
| display: block; | |
| padding-top: 56.25%; | |
| content: ""; } | |
| .drawer__temporary .drawer__headerContent { | |
| display: flex; | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| align-items: flex-end; | |
| box-sizing: border-box; | |
| padding: 16px; } | |
| .drawer__temporary .listItem { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.375rem; | |
| font-weight: 500; | |
| letter-spacing: 0.00714em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| position: relative; | |
| outline: none; | |
| color: inherit; | |
| text-decoration: none; } | |
| .drawer__temporary .listItem__graphic { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .drawer__temporary.drawerPermanent, | |
| .drawerTemporary .drawer__drawer { | |
| background-color: #fff; } | |
| .drawer__temporary::before { | |
| background-color: rgba(0, 0, 0, 0.6); } | |
| .drawer__temporary::before { | |
| display: block; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| opacity: 0; | |
| opacity: var(--mdc-temporary-drawer-opacity, 0); | |
| content: ""; | |
| will-change: opacity; } | |
| .drawer__temporary .drawer__drawer { | |
| box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); | |
| /* @noflip */ | |
| left: 0; | |
| /* @noflip */ | |
| right: initial; | |
| height: 100%; | |
| -webkit-transform: translateX(-107%); | |
| transform: translateX(-107%); | |
| -webkit-transform: translateX(calc(-100% - 20px)); | |
| transform: translateX(calc(-100% - 20px)); | |
| will-change: transform; | |
| display: flex; | |
| position: absolute; | |
| flex-direction: column; | |
| box-sizing: border-box; | |
| width: calc(100% - 56px); | |
| max-width: 280px; | |
| overflow: hidden; | |
| touch-action: none; } | |
| [dir="rtl"] .drawer__temporary .drawer__drawer, .drawerTemporary .drawer__drawer[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 0; } | |
| [dir="rtl"] .drawer__temporary .drawer__drawer, .drawerTemporary .drawer__drawer[dir="rtl"] { | |
| -webkit-transform: translateX(107%); | |
| transform: translateX(107%); | |
| -webkit-transform: translateX(calc(100% + 20px)); | |
| transform: translateX(calc(100% + 20px)); } | |
| @media (min-width: 600px) { | |
| .drawer__temporary .drawer__drawer { | |
| width: calc(100% - 64px); | |
| max-width: 320px; } } | |
| .drawer__temporary .drawer__content { | |
| flex-grow: 1; | |
| box-sizing: border-box; | |
| margin: 0; | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| -webkit-overflow-scrolling: touch; | |
| touch-action: pan-y; } | |
| .drawer__temporary .drawer__footer { | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); | |
| flex-shrink: 0; } | |
| .drawer__temporary.drawerOpen { | |
| pointer-events: auto; } | |
| .drawer__temporary.drawerOpen::before { | |
| opacity: 1; | |
| opacity: var(--mdc-temporary-drawer-opacity, 1); } | |
| .drawer__temporary.drawerOpen .drawer__drawer { | |
| -webkit-transform: none; | |
| transform: none; } | |
| [dir="rtl"] .drawer__temporary.drawerOpen .drawer__drawer, .drawerTemporary.drawerOpen[dir="rtl"] .drawer__drawer { | |
| -webkit-transform: none; | |
| transform: none; } | |
| .drawer__temporary.drawerAnimating::before { | |
| transition: opacity 0.3s 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .drawer__temporary.drawerAnimating .drawer__drawer { | |
| transition: -webkit-transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 200ms 0ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .drawer__temporary.drawerAnimating.drawerOpen .drawer__drawer { | |
| transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .drawerScrollLock { | |
| overflow: hidden; } | |
| .elevation__z0 { | |
| box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z1 { | |
| box-shadow: 0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 1px 3px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z2 { | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z3 { | |
| box-shadow: 0px 3px 3px -2px rgba(0, 0, 0, 0.2), 0px 3px 4px 0px rgba(0, 0, 0, 0.14), 0px 1px 8px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z4 { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z5 { | |
| box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 5px 8px 0px rgba(0, 0, 0, 0.14), 0px 1px 14px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z6 { | |
| box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); } | |
| .elevation__z7 { | |
| box-shadow: 0px 4px 5px -2px rgba(0, 0, 0, 0.2), 0px 7px 10px 1px rgba(0, 0, 0, 0.14), 0px 2px 16px 1px rgba(0, 0, 0, 0.12); } | |
| .elevation__z8 { | |
| box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); } | |
| .elevation__z9 { | |
| box-shadow: 0px 5px 6px -3px rgba(0, 0, 0, 0.2), 0px 9px 12px 1px rgba(0, 0, 0, 0.14), 0px 3px 16px 2px rgba(0, 0, 0, 0.12); } | |
| .elevation__z10 { | |
| box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2), 0px 10px 14px 1px rgba(0, 0, 0, 0.14), 0px 4px 18px 3px rgba(0, 0, 0, 0.12); } | |
| .elevation__z11 { | |
| box-shadow: 0px 6px 7px -4px rgba(0, 0, 0, 0.2), 0px 11px 15px 1px rgba(0, 0, 0, 0.14), 0px 4px 20px 3px rgba(0, 0, 0, 0.12); } | |
| .elevation__z12 { | |
| box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); } | |
| .elevation__z13 { | |
| box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 13px 19px 2px rgba(0, 0, 0, 0.14), 0px 5px 24px 4px rgba(0, 0, 0, 0.12); } | |
| .elevation__z14 { | |
| box-shadow: 0px 7px 9px -4px rgba(0, 0, 0, 0.2), 0px 14px 21px 2px rgba(0, 0, 0, 0.14), 0px 5px 26px 4px rgba(0, 0, 0, 0.12); } | |
| .elevation__z15 { | |
| box-shadow: 0px 8px 9px -5px rgba(0, 0, 0, 0.2), 0px 15px 22px 2px rgba(0, 0, 0, 0.14), 0px 6px 28px 5px rgba(0, 0, 0, 0.12); } | |
| .elevation__z16 { | |
| box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12); } | |
| .elevation__z17 { | |
| box-shadow: 0px 8px 11px -5px rgba(0, 0, 0, 0.2), 0px 17px 26px 2px rgba(0, 0, 0, 0.14), 0px 6px 32px 5px rgba(0, 0, 0, 0.12); } | |
| .elevation__z18 { | |
| box-shadow: 0px 9px 11px -5px rgba(0, 0, 0, 0.2), 0px 18px 28px 2px rgba(0, 0, 0, 0.14), 0px 7px 34px 6px rgba(0, 0, 0, 0.12); } | |
| .elevation__z19 { | |
| box-shadow: 0px 9px 12px -6px rgba(0, 0, 0, 0.2), 0px 19px 29px 2px rgba(0, 0, 0, 0.14), 0px 7px 36px 6px rgba(0, 0, 0, 0.12); } | |
| .elevation__z20 { | |
| box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 20px 31px 3px rgba(0, 0, 0, 0.14), 0px 8px 38px 7px rgba(0, 0, 0, 0.12); } | |
| .elevation__z21 { | |
| box-shadow: 0px 10px 13px -6px rgba(0, 0, 0, 0.2), 0px 21px 33px 3px rgba(0, 0, 0, 0.14), 0px 8px 40px 7px rgba(0, 0, 0, 0.12); } | |
| .elevation__z22 { | |
| box-shadow: 0px 10px 14px -6px rgba(0, 0, 0, 0.2), 0px 22px 35px 3px rgba(0, 0, 0, 0.14), 0px 8px 42px 7px rgba(0, 0, 0, 0.12); } | |
| .elevation__z23 { | |
| box-shadow: 0px 11px 14px -7px rgba(0, 0, 0, 0.2), 0px 23px 36px 3px rgba(0, 0, 0, 0.14), 0px 9px 44px 8px rgba(0, 0, 0, 0.12); } | |
| .elevation__z24 { | |
| box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12); } | |
| .elevationTransition { | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); | |
| will-change: box-shadow; } | |
| .fab { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| box-shadow: 0px 3px 5px -1px rgba(0, 0, 0, 0.2), 0px 6px 10px 0px rgba(0, 0, 0, 0.14), 0px 1px 18px 0px rgba(0, 0, 0, 0.12); | |
| display: inline-flex; | |
| position: relative; | |
| align-items: center; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| width: 56px; | |
| height: 56px; | |
| padding: 0; | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, -webkit-transform 270ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, transform 270ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1), opacity 15ms linear 30ms, transform 270ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 270ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| border: none; | |
| border-radius: 50%; | |
| fill: currentColor; | |
| cursor: pointer; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| -moz-appearance: none; | |
| -webkit-appearance: none; | |
| overflow: hidden; | |
| background-color: #018786; | |
| color: #fff; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-secondary, #fff); } | |
| .fab::before, .fab::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .fab::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .fab.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .fab.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .fab.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .fab.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .fab.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .fab::before, .fab::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .fab.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .fab::mozFocusInner { | |
| padding: 0; | |
| border: 0; } | |
| .fab:hover, .fab:focus { | |
| box-shadow: 0px 5px 5px -3px rgba(0, 0, 0, 0.2), 0px 8px 10px 1px rgba(0, 0, 0, 0.14), 0px 3px 14px 2px rgba(0, 0, 0, 0.12); } | |
| .fab:active { | |
| box-shadow: 0px 7px 8px -4px rgba(0, 0, 0, 0.2), 0px 12px 17px 2px rgba(0, 0, 0, 0.14), 0px 5px 22px 4px rgba(0, 0, 0, 0.12); } | |
| .fab:active, .fab:focus { | |
| outline: none; } | |
| .fab:hover { | |
| cursor: pointer; } | |
| .fab > svg { | |
| width: 100%; } | |
| @supports not (-ms-ime-align: auto) { | |
| .fab { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .fab .fab__icon { | |
| width: 24px; | |
| height: 24px; | |
| font-size: 24px; } | |
| .fab::before, .fab::after { | |
| background-color: #fff; } | |
| @supports not (-ms-ime-align: auto) { | |
| .fab::before, .fab::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-on-secondary, #fff); } } | |
| .fab:hover::before { | |
| opacity: 0.08; } | |
| .fab:not(.rippleUpgraded):focus::before, .fab.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| .fab:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .fab:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.32; } | |
| .fab.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.32; } | |
| .fab__mini { | |
| width: 40px; | |
| height: 40px; } | |
| .fab__extended { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 2.25rem; | |
| font-weight: 500; | |
| letter-spacing: 0.08929em; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| width: auto; | |
| max-width: 100%; | |
| height: 48px; | |
| padding: 0 20px 0 16px; | |
| border-radius: 24px; } | |
| .fab__label { | |
| justify-content: flex-start; | |
| padding-left: 8px; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; } | |
| .fab__icon { | |
| transition: -webkit-transform 180ms 90ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 180ms 90ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 180ms 90ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 180ms 90ms cubic-bezier(0, 0, 0.2, 1); | |
| fill: currentColor; | |
| will-change: transform; } | |
| .fab .fab__icon { | |
| display: inline-flex; | |
| align-items: center; | |
| justify-content: center; } | |
| .fab__exited { | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| transition: opacity 15ms linear 150ms, -webkit-transform 180ms 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: opacity 15ms linear 150ms, transform 180ms 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: opacity 15ms linear 150ms, transform 180ms 0ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 180ms 0ms cubic-bezier(0.4, 0, 1, 1); | |
| opacity: 0; } | |
| .fab__exited .fab__icon { | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| transition: -webkit-transform 135ms 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: transform 135ms 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: transform 135ms 0ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 135ms 0ms cubic-bezier(0.4, 0, 1, 1); } | |
| .floatingLabel { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| position: absolute; | |
| bottom: 8px; | |
| left: 0; | |
| -webkit-transform-origin: left top; | |
| transform-origin: left top; | |
| transition: color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1), color 150ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| line-height: 1.15rem; | |
| cursor: text; } | |
| [dir="rtl"] .floatingLabel, .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| right: 0; | |
| /* @noflip */ | |
| left: auto; | |
| /* @noflip */ | |
| -webkit-transform-origin: right top; | |
| transform-origin: right top; } | |
| .floatingLabel__floatAbove { | |
| cursor: auto; } | |
| .floatingLabel__floatAbove { | |
| -webkit-transform: translateY(-100%) scale(0.75); | |
| transform: translateY(-100%) scale(0.75); } | |
| .floatingLabel__shake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-standard 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-standard 250ms 1; } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-standard { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } } | |
| @keyframes mdc-floating-label-shake-float-above-standard { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-100%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-100%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-100%) scale(0.75); } } | |
| .formField { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.01786em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); | |
| display: inline-flex; | |
| align-items: center; | |
| vertical-align: middle; } | |
| .formField > label { | |
| order: 0; | |
| margin-right: auto; | |
| padding-left: 4px; } | |
| [dir="rtl"] .formField > label, .formField[dir="rtl"] > label { | |
| margin-left: auto; | |
| padding-right: 4px; } | |
| .formField__alignEnd > label { | |
| order: -1; | |
| margin-left: auto; | |
| padding-right: 4px; } | |
| [dir="rtl"] .formField__alignEnd > label, .formFieldAlignEnd[dir="rtl"] > label { | |
| margin-right: auto; | |
| padding-left: 4px; } | |
| .gridTile__primary { | |
| padding-bottom: calc(100% / 1); } | |
| .gridTile { | |
| margin: 2px 0; | |
| padding: 0 2px; } | |
| .gridTile__secondary { | |
| left: 2px; | |
| width: calc(100% - 4px); } | |
| .gridList__tiles { | |
| margin: 2px auto; } | |
| .gridList__tiles { | |
| display: flex; | |
| flex-flow: row wrap; | |
| padding: 0; } | |
| .gridList__tileGutter1 .gridTile { | |
| margin: 0.5px 0; | |
| padding: 0 0.5px; } | |
| .gridList__tileGutter1 .gridTile__secondary { | |
| left: 0.5px; | |
| width: calc(100% - 1px); } | |
| .gridList__tileGutter1 .gridList__tiles { | |
| margin: 0.5px auto; } | |
| .gridList__tileAspect16x9 .gridTile__primary { | |
| padding-bottom: calc(100% / 1.77778); } | |
| .gridList__tileAspect3x2 .gridTile__primary { | |
| padding-bottom: calc(100% / 1.5); } | |
| .gridList__tileAspect2x3 .gridTile__primary { | |
| padding-bottom: calc(100% / 0.66667); } | |
| .gridList__tileAspect4x3 .gridTile__primary { | |
| padding-bottom: calc(100% / 1.33333); } | |
| .gridList__tileAspect3x4 .gridTile__primary { | |
| padding-bottom: calc(100% / 0.75); } | |
| .gridTile { | |
| display: block; | |
| position: relative; | |
| /* @alternate */ | |
| width: 200px; | |
| width: var(--mdc-grid-list-tile-width, 200px); } | |
| .gridTile__primary { | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-background, #fff); | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); | |
| position: relative; | |
| height: 0; } | |
| .gridTile__primaryContent { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| background-size: cover; } | |
| .gridTile__secondary { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); | |
| color: #fff; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-primary, #fff); | |
| position: absolute; | |
| bottom: 0; | |
| box-sizing: border-box; | |
| height: 48px; | |
| padding: 16px; } | |
| .gridTile__title { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| display: block; | |
| margin: 0; | |
| padding: 0; | |
| font-size: 1rem; | |
| font-weight: 500; | |
| line-height: 1rem; } | |
| .gridTile__supportText { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| display: block; | |
| margin: 0; | |
| margin-top: 4px; | |
| padding: 0; } | |
| .gridTile__icon { | |
| position: absolute; | |
| top: calc(50% - 24px / 2); | |
| font-size: 0; } | |
| .gridList__twolineCaption .gridTile__secondary { | |
| height: 68px; } | |
| .gridList__headerCaption .gridTile__secondary { | |
| top: 0; | |
| bottom: auto; } | |
| .gridList__withIconAlignStart .gridTile__secondary { | |
| /* @noflip */ | |
| padding-left: 56px; | |
| /* @noflip */ | |
| padding-right: 8px; } | |
| .gridList[dir="rtl"] .gridList__withIconAlignStart .gridTile__secondary, | |
| [dir="rtl"] .gridList .gridListWithIconAlignStart .gridTile__secondary { | |
| /* @noflip */ | |
| padding-left: 8px; | |
| /* @noflip */ | |
| padding-right: 56px; } | |
| .gridList__withIconAlignStart .gridTile__icon { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; | |
| font-size: 24px; } | |
| .gridList[dir="rtl"] .gridList__withIconAlignStart .gridTile__icon, | |
| [dir="rtl"] .gridList .gridListWithIconAlignStart .gridTile__icon { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; } | |
| .gridList__withIconAlignEnd .gridTile__secondary { | |
| /* @noflip */ | |
| padding-left: 16px; | |
| /* @noflip */ | |
| padding-right: 56px; } | |
| .gridList[dir="rtl"] .gridList__withIconAlignEnd .gridTile__secondary, | |
| [dir="rtl"] .gridList .gridListWithIconAlignEnd .gridTile__secondary { | |
| /* @noflip */ | |
| padding-left: 56px; | |
| /* @noflip */ | |
| padding-right: 16px; } | |
| .gridList__withIconAlignEnd .gridTile__icon { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; | |
| font-size: 24px; } | |
| .gridList[dir="rtl"] .gridList__withIconAlignEnd .gridTile__icon, | |
| [dir="rtl"] .gridList .gridListWithIconAlignEnd .gridTile__icon { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; } | |
| .iconButton { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| width: 48px; | |
| height: 48px; | |
| padding: 12px; | |
| font-size: 24px; | |
| display: inline-block; | |
| position: relative; | |
| box-sizing: border-box; | |
| border: none; | |
| outline: none; | |
| background-color: transparent; | |
| fill: currentColor; | |
| color: inherit; | |
| text-decoration: none; | |
| cursor: pointer; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; } | |
| .iconButton::before, .iconButton::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .iconButton::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .iconButton.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .iconButton.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .iconButton.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .iconButton.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .iconButton.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .iconButton::before, .iconButton::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .iconButton.rippleUpgraded::before, .iconButton.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .iconButton.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .iconButton svg, | |
| .iconButton img { | |
| width: 24px; | |
| height: 24px; } | |
| .iconButton:disabled { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); | |
| cursor: default; | |
| pointer-events: none; } | |
| .iconButton::before, .iconButton::after { | |
| background-color: black; } | |
| .iconButton:hover::before { | |
| opacity: 0.04; } | |
| .iconButton:not(.rippleUpgraded):focus::before, .iconButton.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .iconButton:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .iconButton:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .iconButton.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .iconButton__disabled { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); | |
| pointer-events: none; } | |
| .iconToggle { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); | |
| display: flex; | |
| position: relative; | |
| align-items: center; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| width: 48px; | |
| height: 48px; | |
| padding: 12px; | |
| outline: none; | |
| font-size: 1.5rem; | |
| cursor: pointer; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| /* @alternate */ | |
| will-change: initial; } | |
| .iconToggle::before, .iconToggle::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .iconToggle::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .iconToggle.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .iconToggle.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .iconToggle.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .iconToggle.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .iconToggle.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .iconToggle::before, .iconToggle::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .iconToggle.rippleUpgraded::before, .iconToggle.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .iconToggle.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .iconToggle::before, .iconToggle::after { | |
| background-color: black; } | |
| .iconToggle:hover::before { | |
| opacity: 0.04; } | |
| .iconToggle:not(.rippleUpgraded):focus::before, .iconToggle.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .iconToggle:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .iconToggle:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .iconToggle.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .iconToggle::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .iconToggle__disabled { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)); | |
| pointer-events: none; } | |
| .imageList { | |
| display: flex; | |
| flex-wrap: wrap; | |
| margin: 0 auto; | |
| padding: 0; } | |
| .imageList__item, | |
| .imageList__imageAspectContainer { | |
| position: relative; | |
| box-sizing: border-box; } | |
| .imageList__item { | |
| list-style-type: none; } | |
| .imageList__image { | |
| width: 100%; } | |
| .imageList__imageAspectContainer .imageList__image { | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| height: 100%; | |
| background-repeat: no-repeat; | |
| background-position: center; | |
| background-size: cover; } | |
| .imageList__imageAspectContainer { | |
| padding-bottom: calc(100% / 1); } | |
| .imageList__supporting { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); | |
| display: flex; | |
| align-items: center; | |
| justify-content: space-between; | |
| box-sizing: border-box; | |
| padding: 8px 0; | |
| line-height: 24px; } | |
| .imageList__label { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; } | |
| .imageList__withTextProtection .imageList__supporting { | |
| position: absolute; | |
| bottom: 0; | |
| width: 100%; | |
| height: 48px; | |
| padding: 0 16px; | |
| background: rgba(0, 0, 0, 0.6); | |
| color: #fff; } | |
| .imageList__masonry { | |
| display: block; } | |
| .imageList__masonry .imageList__item { | |
| -webkit-column-break-inside: avoid; | |
| break-inside: avoid-column; } | |
| .imageList__masonry .imageList__image { | |
| display: block; | |
| height: auto; } | |
| :root { | |
| --mdc-layout-grid-margin-desktop: 24px; | |
| --mdc-layout-grid-gutter-desktop: 24px; | |
| --mdc-layout-grid-column-width-desktop: 72px; | |
| --mdc-layout-grid-margin-tablet: 16px; | |
| --mdc-layout-grid-gutter-tablet: 16px; | |
| --mdc-layout-grid-column-width-tablet: 72px; | |
| --mdc-layout-grid-margin-phone: 16px; | |
| --mdc-layout-grid-gutter-phone: 16px; | |
| --mdc-layout-grid-column-width-phone: 72px; } | |
| @media (min-width: 840px) { | |
| .layoutGrid { | |
| box-sizing: border-box; | |
| margin: 0 auto; | |
| padding: 24px; | |
| padding: var(--mdc-layout-grid-margin-desktop, 24px); } } | |
| @media (min-width: 480px) and (max-width: 839px) { | |
| .layoutGrid { | |
| box-sizing: border-box; | |
| margin: 0 auto; | |
| padding: 16px; | |
| padding: var(--mdc-layout-grid-margin-tablet, 16px); } } | |
| @media (max-width: 479px) { | |
| .layoutGrid { | |
| box-sizing: border-box; | |
| margin: 0 auto; | |
| padding: 16px; | |
| padding: var(--mdc-layout-grid-margin-phone, 16px); } } | |
| @media (min-width: 840px) { | |
| .layoutGrid__inner { | |
| display: flex; | |
| flex-flow: row wrap; | |
| align-items: stretch; | |
| margin: -12px; | |
| margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2 * -1); } | |
| @supports (display: grid) { | |
| .layoutGrid__inner { | |
| display: grid; | |
| margin: 0; | |
| grid-gap: 24px; | |
| grid-gap: var(--mdc-layout-grid-gutter-desktop, 24px); | |
| grid-template-columns: repeat(12, minmax(0, 1fr)); } } } | |
| @media (min-width: 480px) and (max-width: 839px) { | |
| .layoutGrid__inner { | |
| display: flex; | |
| flex-flow: row wrap; | |
| align-items: stretch; | |
| margin: -8px; | |
| margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2 * -1); } | |
| @supports (display: grid) { | |
| .layoutGrid__inner { | |
| display: grid; | |
| margin: 0; | |
| grid-gap: 16px; | |
| grid-gap: var(--mdc-layout-grid-gutter-tablet, 16px); | |
| grid-template-columns: repeat(8, minmax(0, 1fr)); } } } | |
| @media (max-width: 479px) { | |
| .layoutGrid__inner { | |
| display: flex; | |
| flex-flow: row wrap; | |
| align-items: stretch; | |
| margin: -8px; | |
| margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2 * -1); } | |
| @supports (display: grid) { | |
| .layoutGrid__inner { | |
| display: grid; | |
| margin: 0; | |
| grid-gap: 16px; | |
| grid-gap: var(--mdc-layout-grid-gutter-phone, 16px); | |
| grid-template-columns: repeat(4, minmax(0, 1fr)); } } } | |
| @media (min-width: 840px) { | |
| .layoutGrid__cell { | |
| width: calc(33.33333% - 24px); | |
| width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); | |
| box-sizing: border-box; | |
| margin: 12px; | |
| margin: calc(var(--mdc-layout-grid-gutter-desktop, 24px) / 2); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| margin: 0; } } | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Desktop { | |
| width: calc(8.33333% - 24px); | |
| width: calc(8.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Desktop { | |
| width: auto; | |
| grid-column-end: span 1; } } | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Desktop { | |
| width: calc(16.66667% - 24px); | |
| width: calc(16.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Desktop { | |
| width: auto; | |
| grid-column-end: span 2; } } | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Desktop { | |
| width: calc(25% - 24px); | |
| width: calc(25% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Desktop { | |
| width: auto; | |
| grid-column-end: span 3; } } | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Desktop { | |
| width: calc(33.33333% - 24px); | |
| width: calc(33.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Desktop { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Desktop { | |
| width: calc(41.66667% - 24px); | |
| width: calc(41.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Desktop { | |
| width: auto; | |
| grid-column-end: span 5; } } | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Desktop { | |
| width: calc(50% - 24px); | |
| width: calc(50% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Desktop { | |
| width: auto; | |
| grid-column-end: span 6; } } | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Desktop { | |
| width: calc(58.33333% - 24px); | |
| width: calc(58.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Desktop { | |
| width: auto; | |
| grid-column-end: span 7; } } | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Desktop { | |
| width: calc(66.66667% - 24px); | |
| width: calc(66.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Desktop { | |
| width: auto; | |
| grid-column-end: span 8; } } | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Desktop { | |
| width: calc(75% - 24px); | |
| width: calc(75% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Desktop { | |
| width: auto; | |
| grid-column-end: span 9; } } | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Desktop { | |
| width: calc(83.33333% - 24px); | |
| width: calc(83.33333% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Desktop { | |
| width: auto; | |
| grid-column-end: span 10; } } | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Desktop { | |
| width: calc(91.66667% - 24px); | |
| width: calc(91.66667% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Desktop { | |
| width: auto; | |
| grid-column-end: span 11; } } | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Desktop { | |
| width: calc(100% - 24px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-desktop, 24px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Desktop { | |
| width: auto; | |
| grid-column-end: span 12; } } } | |
| @media (min-width: 480px) and (max-width: 839px) { | |
| .layoutGrid__cell { | |
| width: calc(50% - 16px); | |
| width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); | |
| box-sizing: border-box; | |
| margin: 8px; | |
| margin: calc(var(--mdc-layout-grid-gutter-tablet, 16px) / 2); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| margin: 0; } } | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Tablet { | |
| width: calc(12.5% - 16px); | |
| width: calc(12.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Tablet { | |
| width: auto; | |
| grid-column-end: span 1; } } | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Tablet { | |
| width: calc(25% - 16px); | |
| width: calc(25% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Tablet { | |
| width: auto; | |
| grid-column-end: span 2; } } | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Tablet { | |
| width: calc(37.5% - 16px); | |
| width: calc(37.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Tablet { | |
| width: auto; | |
| grid-column-end: span 3; } } | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Tablet { | |
| width: calc(50% - 16px); | |
| width: calc(50% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Tablet { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Tablet { | |
| width: calc(62.5% - 16px); | |
| width: calc(62.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Tablet { | |
| width: auto; | |
| grid-column-end: span 5; } } | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Tablet { | |
| width: calc(75% - 16px); | |
| width: calc(75% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Tablet { | |
| width: auto; | |
| grid-column-end: span 6; } } | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Tablet { | |
| width: calc(87.5% - 16px); | |
| width: calc(87.5% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Tablet { | |
| width: auto; | |
| grid-column-end: span 7; } } | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Tablet { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Tablet { | |
| width: auto; | |
| grid-column-end: span 8; } } | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Tablet { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Tablet { | |
| width: auto; | |
| grid-column-end: span 8; } } | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Tablet { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Tablet { | |
| width: auto; | |
| grid-column-end: span 8; } } | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Tablet { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Tablet { | |
| width: auto; | |
| grid-column-end: span 8; } } | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Tablet { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-tablet, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Tablet { | |
| width: auto; | |
| grid-column-end: span 8; } } } | |
| @media (max-width: 479px) { | |
| .layoutGrid__cell { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); | |
| box-sizing: border-box; | |
| margin: 8px; | |
| margin: calc(var(--mdc-layout-grid-gutter-phone, 16px) / 2); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| @supports (display: grid) { | |
| .layoutGrid__cell { | |
| margin: 0; } } | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Phone { | |
| width: calc(25% - 16px); | |
| width: calc(25% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span1, | |
| .layoutGrid__cellSpan1Phone { | |
| width: auto; | |
| grid-column-end: span 1; } } | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Phone { | |
| width: calc(50% - 16px); | |
| width: calc(50% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span2, | |
| .layoutGrid__cellSpan2Phone { | |
| width: auto; | |
| grid-column-end: span 2; } } | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Phone { | |
| width: calc(75% - 16px); | |
| width: calc(75% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span3, | |
| .layoutGrid__cellSpan3Phone { | |
| width: auto; | |
| grid-column-end: span 3; } } | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span4, | |
| .layoutGrid__cellSpan4Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span5, | |
| .layoutGrid__cellSpan5Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span6, | |
| .layoutGrid__cellSpan6Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span7, | |
| .layoutGrid__cellSpan7Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span8, | |
| .layoutGrid__cellSpan8Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span9, | |
| .layoutGrid__cellSpan9Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span10, | |
| .layoutGrid__cellSpan10Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span11, | |
| .layoutGrid__cellSpan11Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Phone { | |
| width: calc(100% - 16px); | |
| width: calc(100% - var(--mdc-layout-grid-gutter-phone, 16px)); } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__span12, | |
| .layoutGrid__cellSpan12Phone { | |
| width: auto; | |
| grid-column-end: span 4; } } } | |
| .layoutGrid__cell__order1 { | |
| order: 1; } | |
| .layoutGrid__cell__order2 { | |
| order: 2; } | |
| .layoutGrid__cell__order3 { | |
| order: 3; } | |
| .layoutGrid__cell__order4 { | |
| order: 4; } | |
| .layoutGrid__cell__order5 { | |
| order: 5; } | |
| .layoutGrid__cell__order6 { | |
| order: 6; } | |
| .layoutGrid__cell__order7 { | |
| order: 7; } | |
| .layoutGrid__cell__order8 { | |
| order: 8; } | |
| .layoutGrid__cell__order9 { | |
| order: 9; } | |
| .layoutGrid__cell__order10 { | |
| order: 10; } | |
| .layoutGrid__cell__order11 { | |
| order: 11; } | |
| .layoutGrid__cell__order12 { | |
| order: 12; } | |
| .layoutGrid__cell__alignTop { | |
| align-self: flex-start; } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__alignTop { | |
| align-self: start; } } | |
| .layoutGrid__cell__alignMiddle { | |
| align-self: center; } | |
| .layoutGrid__cell__alignBottom { | |
| align-self: flex-end; } | |
| @supports (display: grid) { | |
| .layoutGrid__cell__alignBottom { | |
| align-self: end; } } | |
| @media (min-width: 840px) { | |
| .layoutGrid__fixedColumnWidth { | |
| width: 1176px; | |
| width: calc( var(--mdc-layout-grid-column-width-desktop, 72px) * 12 + var(--mdc-layout-grid-gutter-desktop, 24px) * 11 + var(--mdc-layout-grid-margin-desktop, 24px) * 2); } } | |
| @media (min-width: 480px) and (max-width: 839px) { | |
| .layoutGrid__fixedColumnWidth { | |
| width: 720px; | |
| width: calc( var(--mdc-layout-grid-column-width-tablet, 72px) * 8 + var(--mdc-layout-grid-gutter-tablet, 16px) * 7 + var(--mdc-layout-grid-margin-tablet, 16px) * 2); } } | |
| @media (max-width: 479px) { | |
| .layoutGrid__fixedColumnWidth { | |
| width: 368px; | |
| width: calc( var(--mdc-layout-grid-column-width-phone, 72px) * 4 + var(--mdc-layout-grid-gutter-phone, 16px) * 3 + var(--mdc-layout-grid-margin-phone, 16px) * 2); } } | |
| .layoutGrid__alignLeft { | |
| margin-right: auto; | |
| margin-left: 0; } | |
| .layoutGrid__alignRight { | |
| margin-right: 0; | |
| margin-left: auto; } | |
| .lineRipple { | |
| position: absolute; | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 2px; | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); | |
| transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 180ms cubic-bezier(0.4, 0, 0.2, 1), opacity 180ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 0; | |
| z-index: 2; } | |
| .lineRipple__active { | |
| -webkit-transform: scaleX(1); | |
| transform: scaleX(1); | |
| opacity: 1; } | |
| .lineRipple__deactivating { | |
| opacity: 0; } | |
| @-webkit-keyframes primary-indeterminate-translate { | |
| 0% { | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 20% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 59.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(83.67142%); | |
| transform: translateX(83.67142%); } | |
| 100% { | |
| -webkit-transform: translateX(200.61106%); | |
| transform: translateX(200.61106%); } } | |
| @keyframes primary-indeterminate-translate { | |
| 0% { | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 20% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 59.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(83.67142%); | |
| transform: translateX(83.67142%); } | |
| 100% { | |
| -webkit-transform: translateX(200.61106%); | |
| transform: translateX(200.61106%); } } | |
| @-webkit-keyframes primary-indeterminate-scale { | |
| 0% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 36.65% { | |
| -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1); | |
| animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1); | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 69.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1); | |
| animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1); | |
| -webkit-transform: scaleX(0.66148); | |
| transform: scaleX(0.66148); } | |
| 100% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } } | |
| @keyframes primary-indeterminate-scale { | |
| 0% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 36.65% { | |
| -webkit-animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1); | |
| animation-timing-function: cubic-bezier(0.33473, 0.12482, 0.78584, 1); | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 69.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1); | |
| animation-timing-function: cubic-bezier(0.06, 0.11, 0.6, 1); | |
| -webkit-transform: scaleX(0.66148); | |
| transform: scaleX(0.66148); } | |
| 100% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } } | |
| @-webkit-keyframes secondary-indeterminate-translate { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 25% { | |
| -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| -webkit-transform: translateX(37.65191%); | |
| transform: translateX(37.65191%); } | |
| 48.35% { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| -webkit-transform: translateX(84.38617%); | |
| transform: translateX(84.38617%); } | |
| 100% { | |
| -webkit-transform: translateX(160.27778%); | |
| transform: translateX(160.27778%); } } | |
| @keyframes secondary-indeterminate-translate { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 25% { | |
| -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| -webkit-transform: translateX(37.65191%); | |
| transform: translateX(37.65191%); } | |
| 48.35% { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| -webkit-transform: translateX(84.38617%); | |
| transform: translateX(84.38617%); } | |
| 100% { | |
| -webkit-transform: translateX(160.27778%); | |
| transform: translateX(160.27778%); } } | |
| @-webkit-keyframes secondary-indeterminate-scale { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397); | |
| animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397); | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 19.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432); | |
| animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432); | |
| -webkit-transform: scaleX(0.4571); | |
| transform: scaleX(0.4571); } | |
| 44.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179); | |
| animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179); | |
| -webkit-transform: scaleX(0.72796); | |
| transform: scaleX(0.72796); } | |
| 100% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } } | |
| @keyframes secondary-indeterminate-scale { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397); | |
| animation-timing-function: cubic-bezier(0.20503, 0.05705, 0.57661, 0.45397); | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } | |
| 19.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432); | |
| animation-timing-function: cubic-bezier(0.15231, 0.19643, 0.64837, 1.00432); | |
| -webkit-transform: scaleX(0.4571); | |
| transform: scaleX(0.4571); } | |
| 44.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179); | |
| animation-timing-function: cubic-bezier(0.25776, -0.00316, 0.21176, 1.38179); | |
| -webkit-transform: scaleX(0.72796); | |
| transform: scaleX(0.72796); } | |
| 100% { | |
| -webkit-transform: scaleX(0.08); | |
| transform: scaleX(0.08); } } | |
| @-webkit-keyframes buffering { | |
| to { | |
| -webkit-transform: translateX(-10px); | |
| transform: translateX(-10px); } } | |
| @keyframes buffering { | |
| to { | |
| -webkit-transform: translateX(-10px); | |
| transform: translateX(-10px); } } | |
| @-webkit-keyframes primary-indeterminate-translate-reverse { | |
| 0% { | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 20% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 59.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(-83.67142%); | |
| transform: translateX(-83.67142%); } | |
| 100% { | |
| -webkit-transform: translateX(-200.61106%); | |
| transform: translateX(-200.61106%); } } | |
| @keyframes primary-indeterminate-translate-reverse { | |
| 0% { | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 20% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 59.15% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(-83.67142%); | |
| transform: translateX(-83.67142%); } | |
| 100% { | |
| -webkit-transform: translateX(-200.61106%); | |
| transform: translateX(-200.61106%); } } | |
| @-webkit-keyframes secondary-indeterminate-translate-reverse { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 25% { | |
| -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| -webkit-transform: translateX(-37.65191%); | |
| transform: translateX(-37.65191%); } | |
| 48.35% { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| -webkit-transform: translateX(-84.38617%); | |
| transform: translateX(-84.38617%); } | |
| 100% { | |
| -webkit-transform: translateX(-160.27778%); | |
| transform: translateX(-160.27778%); } } | |
| @keyframes secondary-indeterminate-translate-reverse { | |
| 0% { | |
| -webkit-animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| animation-timing-function: cubic-bezier(0.15, 0, 0.51506, 0.40969); | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); } | |
| 25% { | |
| -webkit-animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| animation-timing-function: cubic-bezier(0.31033, 0.28406, 0.8, 0.73371); | |
| -webkit-transform: translateX(-37.65191%); | |
| transform: translateX(-37.65191%); } | |
| 48.35% { | |
| -webkit-animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| animation-timing-function: cubic-bezier(0.4, 0.62704, 0.6, 0.90203); | |
| -webkit-transform: translateX(-84.38617%); | |
| transform: translateX(-84.38617%); } | |
| 100% { | |
| -webkit-transform: translateX(-160.27778%); | |
| transform: translateX(-160.27778%); } } | |
| @-webkit-keyframes buffering-reverse { | |
| to { | |
| -webkit-transform: translateX(10px); | |
| transform: translateX(10px); } } | |
| @keyframes buffering-reverse { | |
| to { | |
| -webkit-transform: translateX(10px); | |
| transform: translateX(10px); } } | |
| .linearProgress { | |
| position: relative; | |
| width: 100%; | |
| height: 4px; | |
| -webkit-transform: translateZ(0); | |
| transform: translateZ(0); | |
| transition: opacity 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| overflow: hidden; } | |
| .linearProgress__bar { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-animation: none; | |
| animation: none; | |
| -webkit-transform-origin: top left; | |
| transform-origin: top left; | |
| transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); } | |
| .linearProgress__barInner { | |
| display: inline-block; | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-animation: none; | |
| animation: none; } | |
| .linearProgress__bufferingDots { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-animation: buffering 250ms infinite linear; | |
| animation: buffering 250ms infinite linear; | |
| background-repeat: repeat-x; | |
| background-size: 10px 4px; } | |
| .linearProgress__buffer { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-transform-origin: top left; | |
| transform-origin: top left; | |
| transition: -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 250ms 0ms cubic-bezier(0.4, 0, 0.6, 1); } | |
| .linearProgress__primaryBar { | |
| -webkit-transform: scaleX(0); | |
| transform: scaleX(0); } | |
| .linearProgress__secondaryBar { | |
| visibility: hidden; } | |
| .linearProgress__indeterminate .linearProgress__bar { | |
| transition: none; } | |
| .linearProgress__indeterminate .linearProgress__primaryBar { | |
| left: -145.166611%; | |
| -webkit-animation: primary-indeterminate-translate 2s infinite linear; | |
| animation: primary-indeterminate-translate 2s infinite linear; } | |
| .linearProgress__indeterminate .linearProgress__primaryBar > .linearProgress__barInner { | |
| -webkit-animation: primary-indeterminate-scale 2s infinite linear; | |
| animation: primary-indeterminate-scale 2s infinite linear; } | |
| .linearProgress__indeterminate .linearProgress__secondaryBar { | |
| left: -54.888891%; | |
| -webkit-animation: secondary-indeterminate-translate 2s infinite linear; | |
| animation: secondary-indeterminate-translate 2s infinite linear; | |
| visibility: visible; } | |
| .linearProgress__indeterminate .linearProgress__secondaryBar > .linearProgress__barInner { | |
| -webkit-animation: secondary-indeterminate-scale 2s infinite linear; | |
| animation: secondary-indeterminate-scale 2s infinite linear; } | |
| .linearProgress__reversed .linearProgress__bar, | |
| .linearProgressReversed .linearProgress__buffer { | |
| right: 0; | |
| -webkit-transform-origin: center right; | |
| transform-origin: center right; } | |
| .linearProgress__reversed .linearProgress__primaryBar { | |
| -webkit-animation-name: primary-indeterminate-translate-reverse; | |
| animation-name: primary-indeterminate-translate-reverse; } | |
| .linearProgress__reversed .linearProgress__secondaryBar { | |
| -webkit-animation-name: secondary-indeterminate-translate-reverse; | |
| animation-name: secondary-indeterminate-translate-reverse; } | |
| .linearProgress__reversed .linearProgress__bufferingDots { | |
| -webkit-animation: buffering-reverse 250ms infinite linear; | |
| animation: buffering-reverse 250ms infinite linear; } | |
| .linearProgress__closed { | |
| opacity: 0; } | |
| .linearProgress__barInner { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } | |
| .linearProgress__bufferingDots { | |
| 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"); } | |
| .linearProgress__buffer { | |
| background-color: #e6e6e6; } | |
| .linearProgress__indeterminate.linearProgressReversed .linearProgress__primaryBar { | |
| right: -145.166611%; | |
| left: auto; } | |
| .linearProgress__indeterminate.linearProgressReversed .linearProgress__secondaryBar { | |
| right: -54.888891%; | |
| left: auto; } | |
| .list { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); | |
| margin: 0; | |
| padding: 8px 0; | |
| /* @alternate */ | |
| line-height: 1.5rem; | |
| list-style-type: none; } | |
| .listItem__secondaryText { | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); } | |
| .listItem__graphic { | |
| background-color: transparent; } | |
| .listItem__graphic { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)); } | |
| .listItem__meta { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)); } | |
| .list__dense { | |
| padding-top: 4px; | |
| padding-bottom: 4px; | |
| font-size: .812rem; } | |
| .listItem { | |
| display: flex; | |
| position: relative; | |
| align-items: center; | |
| justify-content: flex-start; | |
| height: 48px; | |
| padding: 0 16px; | |
| overflow: hidden; } | |
| .listItem:focus { | |
| outline: none; } | |
| .listItem__selected, | |
| .listItemActivated { | |
| color: #6200ee; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee); } | |
| .listItem__selected .listItem__graphic, | |
| .listItemActivated .listItem__graphic { | |
| color: #6200ee; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee); } | |
| .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 32px; | |
| width: 24px; | |
| height: 24px; | |
| display: inline-flex; | |
| flex-shrink: 0; | |
| align-items: center; | |
| justify-content: center; } | |
| .listItem[dir="rtl"] .listItem__graphic, | |
| [dir="rtl"] .listItem .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 32px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .listItem__meta { | |
| /* @noflip */ | |
| margin-left: auto; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .listItem[dir="rtl"] .listItem__meta, | |
| [dir="rtl"] .listItem .listItem__meta { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: auto; } | |
| .listItem__text, | |
| .listItem__secondaryText { | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| display: block; } | |
| .listItem__secondaryText { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.01786em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .list__dense .listItem__secondaryText { | |
| font-size: inherit; } | |
| .list__dense .listItem { | |
| height: 40px; } | |
| .list__dense .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 36px; | |
| width: 20px; | |
| height: 20px; } | |
| .listItem[dir="rtl"] .list__dense .listItem__graphic, | |
| [dir="rtl"] .listItem .listDense .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 36px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| .list__avatarList .listItem { | |
| height: 56px; } | |
| .list__avatarList .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 16px; | |
| width: 40px; | |
| height: 40px; | |
| border-radius: 50%; } | |
| .listItem[dir="rtl"] .list__avatarList .listItem__graphic, | |
| [dir="rtl"] .listItem .listAvatarList .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 16px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| :not(.list__nonInteractive) > .listItem { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; } | |
| :not(.list__nonInteractive) > .listItem::before, :not(.listNonInteractive) > .listItem::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| :not(.list__nonInteractive) > .listItem::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgradedUnbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgradedForegroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgradedForegroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| :not(.list__nonInteractive) > .listItem::before, :not(.listNonInteractive) > .listItem::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| :not(.list__nonInteractive) > .listItem::before, :not(.listNonInteractive) > .listItem::after { | |
| background-color: black; } | |
| :not(.list__nonInteractive) > .listItem:hover::before { | |
| opacity: 0.04; } | |
| :not(.list__nonInteractive) > .listItem:not(.rippleUpgraded):focus::before, :not(.listNonInteractive) > .listItem.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| :not(.list__nonInteractive) > .listItem:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| :not(.list__nonInteractive) > .listItem:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| :not(.list__nonInteractive) > .listItem.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| :not(.list__nonInteractive) > .listItemActivated::before { | |
| opacity: 0.12; } | |
| :not(.list__nonInteractive) > .listItemActivated::before, :not(.listNonInteractive) > .listItemActivated::after { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| :not(.list__nonInteractive) > .listItemActivated::before, :not(.listNonInteractive) > .listItemActivated::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| :not(.list__nonInteractive) > .listItemActivated:hover::before { | |
| opacity: 0.16; } | |
| :not(.list__nonInteractive) > .listItemActivated:not(.rippleUpgraded):focus::before, :not(.listNonInteractive) > .listItemActivated.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| :not(.list__nonInteractive) > .listItemActivated:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| :not(.list__nonInteractive) > .listItemActivated:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.28; } | |
| :not(.list__nonInteractive) > .listItemActivated.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.28; } | |
| :not(.list__nonInteractive) > .listItemSelected::before { | |
| opacity: 0.08; } | |
| :not(.list__nonInteractive) > .listItemSelected::before, :not(.listNonInteractive) > .listItemSelected::after { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| :not(.list__nonInteractive) > .listItemSelected::before, :not(.listNonInteractive) > .listItemSelected::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| :not(.list__nonInteractive) > .listItemSelected:hover::before { | |
| opacity: 0.12; } | |
| :not(.list__nonInteractive) > .listItemSelected:not(.rippleUpgraded):focus::before, :not(.listNonInteractive) > .listItemSelected.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.2; } | |
| :not(.list__nonInteractive) > .listItemSelected:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| :not(.list__nonInteractive) > .listItemSelected:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| :not(.list__nonInteractive) > .listItemSelected.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.24; } | |
| .list__twoLine .listItem { | |
| height: 72px; } | |
| .list__twoLine.listDense .listItem { | |
| height: 60px; } | |
| .list__avatarList.listDense .listItem { | |
| height: 48px; } | |
| .list__avatarList.listDense .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 20px; | |
| width: 36px; | |
| height: 36px; } | |
| .listItem[dir="rtl"] .list__avatarList.listDense .listItem__graphic, | |
| [dir="rtl"] .listItem .listAvatarList.listDense .listItem__graphic { | |
| /* @noflip */ | |
| margin-left: 20px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| a.listItem { | |
| color: inherit; | |
| text-decoration: none; } | |
| .listDivider { | |
| height: 0; | |
| margin: 0; | |
| border: none; | |
| border-bottom-width: 1px; | |
| border-bottom-style: solid; } | |
| .listDivider { | |
| border-bottom-color: rgba(0, 0, 0, 0.12); } | |
| .listDivider__padded { | |
| margin: 0 16px; } | |
| .listDivider__inset { | |
| /* @noflip */ | |
| margin-left: 72px; | |
| /* @noflip */ | |
| margin-right: 0; | |
| width: calc(100% - 72px); } | |
| .listGroup[dir="rtl"] .listDivider__inset, | |
| [dir="rtl"] .listGroup .listDividerInset { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 72px; } | |
| .listDivider__inset.listDividerPadded { | |
| width: calc(100% - 72px - 16px); } | |
| .listGroup .list { | |
| padding: 0; } | |
| .listGroup__subheader { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| margin: 0.75rem 16px; } | |
| .listGroup__subheader { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .menu { | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-background, #fff); | |
| display: none; | |
| position: absolute; | |
| box-sizing: border-box; | |
| min-width: 170px; | |
| max-width: calc(100vw - 32px); | |
| max-height: calc(100vh - 32px); | |
| margin: 0; | |
| padding: 0; | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| -webkit-transform-origin: top left; | |
| transform-origin: top left; | |
| border-radius: 2px; | |
| opacity: 0; | |
| white-space: nowrap; | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| will-change: transform, opacity; | |
| z-index: 4; } | |
| .menu:focus { | |
| outline: none; } | |
| .menu__animatingOpen { | |
| display: inline-block; | |
| -webkit-transform: scale(0.8); | |
| transform: scale(0.8); | |
| transition: opacity 0.03s linear, -webkit-transform 0.12s cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 0.03s linear, transform 0.12s cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 0.03s linear, transform 0.12s cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.12s cubic-bezier(0, 0, 0.2, 1); | |
| opacity: 0; | |
| overflow-y: hidden; } | |
| .menu__open { | |
| display: inline-block; | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| opacity: 1; } | |
| .menu__animatingClosed { | |
| display: inline-block; | |
| transition: opacity 0.075s linear; | |
| opacity: 0; | |
| overflow-y: hidden; } | |
| .menu__items { | |
| box-sizing: border-box; | |
| -webkit-transform: scale(1); | |
| transform: scale(1); | |
| overflow-x: hidden; | |
| overflow-y: auto; | |
| will-change: transform; } | |
| .menu__items > .listItem { | |
| cursor: pointer; } | |
| .menu__animating .menu__items { | |
| overflow-y: hidden; } | |
| .menu__animatingOpen > .menu__items { | |
| -webkit-transform: scale(1.25); | |
| transform: scale(1.25); } | |
| .menu__open > .menu__items { | |
| -webkit-transform: scale(1); | |
| transform: scale(1); } | |
| [dir="rtl"] .menu { | |
| -webkit-transform-origin: top right; | |
| transform-origin: top right; } | |
| .menu .listGroup, | |
| .menu .list { | |
| padding: 8px 0; } | |
| .menu .listItem { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| position: relative; | |
| outline: none; | |
| color: inherit; | |
| text-decoration: none; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; } | |
| .menu .listItem__graphic { | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); } | |
| .menu .listItem[ariaDisabled="true"] { | |
| color: rgba(0, 0, 0, 0.38); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)); | |
| cursor: default; | |
| pointer-events: none; } | |
| .menu .listItem[ariaDisabled="true"]:focus::before { | |
| opacity: 0; } | |
| .menuAnchor { | |
| position: relative; | |
| overflow: visible; } | |
| .notchedOutline { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: calc(100% - 1px); | |
| height: calc(100% - 2px); | |
| transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 0; | |
| overflow: hidden; } | |
| .notchedOutline svg { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; } | |
| .notchedOutline__idle { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: calc(100% - 4px); | |
| height: calc(100% - 4px); | |
| transition: opacity 150ms cubic-bezier(0.4, 0, 0.2, 1), border-color 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| border: 1px solid; | |
| opacity: 1; } | |
| .notchedOutline__path { | |
| stroke-width: 1px; | |
| transition: stroke 150ms cubic-bezier(0.4, 0, 0.2, 1), stroke-width 150ms cubic-bezier(0.4, 0, 0.2, 1); | |
| fill: transparent; } | |
| .notchedOutline__notched { | |
| opacity: 1; } | |
| .notchedOutline__notched ~ .notchedOutline__idle { | |
| opacity: 0; } | |
| .radio { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| display: inline-block; | |
| position: relative; | |
| flex: 0 0 auto; | |
| box-sizing: border-box; | |
| width: 40px; | |
| height: 40px; | |
| padding: 10px; | |
| cursor: pointer; | |
| /* @alternate */ | |
| will-change: opacity, transform, border-color, color; } | |
| .radio .radio__nativeControl:enabled:not(:checked) + .radio__background .radio__outerCircle { | |
| border-color: rgba(0, 0, 0, 0.54); } | |
| .radio .radio__nativeControl:enabled:checked + .radio__background .radio__outerCircle { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); } | |
| .radio .radio__nativeControl:enabled + .radio__background .radio__innerCircle { | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); } | |
| .radio .radio__background::before { | |
| background-color: #018786; } | |
| @supports not (-ms-ime-align: auto) { | |
| .radio .radio__background::before { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .radio::before, .radio::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .radio::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .radio.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .radio.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .radio.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .radio.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .radio.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .radio::before, .radio::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .radio.rippleUpgraded::before, .radio.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .radio.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .radio::before, .radio::after { | |
| background-color: #018786; } | |
| @supports not (-ms-ime-align: auto) { | |
| .radio::before, .radio::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .radio:hover::before { | |
| opacity: 0.04; } | |
| .radio:not(.rippleUpgraded):focus::before, .radio.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .radio:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .radio:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .radio.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .radio__background { | |
| display: inline-block; | |
| position: absolute; | |
| left: 10px; | |
| box-sizing: border-box; | |
| width: 50%; | |
| height: 50%; } | |
| .radio__background::before { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-transform: scale(0, 0); | |
| transform: scale(0, 0); | |
| transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .radio__outerCircle { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border-width: 2px; | |
| border-style: solid; | |
| border-radius: 50%; } | |
| .radio__innerCircle { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-transform: scale(0, 0); | |
| transform: scale(0, 0); | |
| transition: border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), border-color 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1), -webkit-transform 120ms 0ms cubic-bezier(0.4, 0, 0.6, 1); | |
| border-width: 10px; | |
| border-style: solid; | |
| border-radius: 50%; } | |
| .radio__nativeControl { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| margin: 0; | |
| padding: 0; | |
| opacity: 0; | |
| cursor: inherit; | |
| z-index: 1; } | |
| .radio.rippleUpgraded .radio__background::before { | |
| content: none; } | |
| .radio__nativeControl:checked + .radio__background, | |
| .radio__nativeControl:disabled + .radio__background { | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .radio__nativeControl:checked + .radio__background .radio__outerCircle, | |
| .radio__nativeControl:disabled + .radio__background .radio__outerCircle { | |
| transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .radio__nativeControl:checked + .radio__background .radio__innerCircle, | |
| .radio__nativeControl:disabled + .radio__background .radio__innerCircle { | |
| transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .radio__disabled { | |
| cursor: default; | |
| pointer-events: none; } | |
| .radio__nativeControl:checked + .radio__background .radio__innerCircle { | |
| -webkit-transform: scale(0.5); | |
| transform: scale(0.5); | |
| transition: border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), border-color 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); } | |
| .radio__nativeControl:disabled + .radio__background, | |
| [ariaDisabled="true"] .radio__nativeControl + .radio__background { | |
| cursor: default; } | |
| .radio__nativeControl:disabled + .radio__background .radio__outerCircle, | |
| [ariaDisabled="true"] .radio__nativeControl + .radio__background .radio__outerCircle { | |
| border-color: rgba(0, 0, 0, 0.26); } | |
| .radio__nativeControl:disabled + .radio__background .radio__innerCircle, | |
| [ariaDisabled="true"] .radio__nativeControl + .radio__background .radio__innerCircle { | |
| border-color: rgba(0, 0, 0, 0.26); } | |
| .radio__nativeControl:focus + .radio__background::before { | |
| -webkit-transform: scale(2, 2); | |
| transform: scale(2, 2); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: opacity 120ms 0ms cubic-bezier(0, 0, 0.2, 1), transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 120ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| opacity: .26; } | |
| .rippleSurface { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| position: relative; | |
| outline: none; | |
| overflow: hidden; } | |
| .rippleSurface::before, .rippleSurface::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .rippleSurface::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .rippleSurface.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .rippleSurface.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .rippleSurface.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .rippleSurface.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .rippleSurface.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .rippleSurface::before, .rippleSurface::after { | |
| background-color: black; } | |
| .rippleSurface:hover::before { | |
| opacity: 0.04; } | |
| .rippleSurface:not(.rippleUpgraded):focus::before, .rippleSurface.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .rippleSurface:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .rippleSurface:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .rippleSurface.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .rippleSurface::before, .rippleSurface::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .rippleSurface.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .rippleSurface[data__rippleIsUnbounded] { | |
| overflow: visible; } | |
| .rippleSurface[data__rippleIsUnbounded]::before, .rippleSurface[dataRippleIsUnbounded]::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .rippleSurface[data__rippleIsUnbounded].rippleUpgraded::before, .rippleSurface[dataRippleIsUnbounded].rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .rippleSurface[data__rippleIsUnbounded].rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .rippleSurface__primary::before, .rippleSurfacePrimary::after { | |
| background-color: #6200ee; } | |
| @supports not (-ms-ime-align: auto) { | |
| .rippleSurface__primary::before, .rippleSurfacePrimary::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } } | |
| .rippleSurface__primary:hover::before { | |
| opacity: 0.04; } | |
| .rippleSurface__primary:not(.rippleUpgraded):focus::before, .rippleSurfacePrimary.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .rippleSurface__primary:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .rippleSurface__primary:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .rippleSurface__primary.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .rippleSurface__accent::before, .rippleSurfaceAccent::after { | |
| background-color: #018786; } | |
| @supports not (-ms-ime-align: auto) { | |
| .rippleSurface__accent::before, .rippleSurfaceAccent::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } } | |
| .rippleSurface__accent:hover::before { | |
| opacity: 0.04; } | |
| .rippleSurface__accent:not(.rippleUpgraded):focus::before, .rippleSurfaceAccent.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .rippleSurface__accent:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .rippleSurface__accent:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .rippleSurface__accent.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| @-webkit-keyframes mdc-select-float-native-control { | |
| 0% { | |
| -webkit-transform: translateY(8px); | |
| transform: translateY(8px); | |
| opacity: 0; } | |
| 100% { | |
| -webkit-transform: translateY(0); | |
| transform: translateY(0); | |
| opacity: 1; } } | |
| @keyframes mdc-select-float-native-control { | |
| 0% { | |
| -webkit-transform: translateY(8px); | |
| transform: translateY(8px); | |
| opacity: 0; } | |
| 100% { | |
| -webkit-transform: translateY(0); | |
| transform: translateY(0); | |
| opacity: 1; } } | |
| .select { | |
| background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%230%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E"); | |
| display: inline-flex; | |
| position: relative; | |
| box-sizing: border-box; | |
| height: 52px; | |
| background-repeat: no-repeat; | |
| background-position: right 8px bottom 12px; } | |
| .select:not(.select__disabled) { | |
| background-color: transparent; } | |
| .select:not(.select__disabled) .select__nativeControl { | |
| color: rgba(0, 0, 0, 0.87); } | |
| .select:not(.select__disabled) .floatingLabel { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .select:not(.select__disabled) .select__nativeControl { | |
| border-bottom-color: rgba(0, 0, 0, 0.42); } | |
| .select:not(.select__disabled) .select__nativeControl:focus ~ .lineRipple { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } | |
| .select:not(.select__disabled) .select__nativeControl:focus ~ .floatingLabel { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .select:not(.select__disabled) .select__nativeControl:hover { | |
| border-bottom-color: rgba(0, 0, 0, 0.87); } | |
| [dir="rtl"] .select, .select[dir="rtl"] { | |
| background-position: left 8px bottom 12px; } | |
| .select__nativeControl { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 26px; | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| width: 100%; | |
| padding-top: 20px; | |
| padding-bottom: 4px; | |
| border: none; | |
| border-bottom: 1px solid; | |
| border-radius: 0; | |
| outline: none; | |
| background-color: transparent; | |
| white-space: nowrap; | |
| cursor: pointer; | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| appearance: none; } | |
| [dir="rtl"] .select__nativeControl, .select__nativeControl[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 26px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| .select__nativeControl::msExpand { | |
| display: none; } | |
| @-moz-document url-prefix("") { | |
| .select__nativeControl { | |
| text-indent: -2px; } } | |
| .select .floatingLabel { | |
| pointer-events: none; } | |
| .select .select__nativeControl:focus ~ .lineRipple::after { | |
| -webkit-transform: scale(1, 2); | |
| transform: scale(1, 2); | |
| opacity: 1; } | |
| .select__box { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| height: 56px; | |
| border-radius: 4px 4px 0 0; | |
| background-position: right 10px center; | |
| overflow: hidden; } | |
| .select__box:not(.selectDisabled) { | |
| background-color: whitesmoke; } | |
| .select__box::before, .selectBox::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .select__box::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .select__box.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .select__box.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .select__box.rippleUpgradedUnbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .select__box.rippleUpgradedForegroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .select__box.rippleUpgradedForegroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .select__box::before, .selectBox::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .select__box.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .select__box::before, .selectBox::after { | |
| background-color: rgba(0, 0, 0, 0.87); } | |
| .select__box:hover::before { | |
| opacity: 0.04; } | |
| .select__box:not(.rippleUpgraded):focus::before, .selectBox:not(.rippleUpgraded):focusWithin::before, .selectBox.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| [dir="rtl"] .select__box, .selectBox[dir="rtl"] { | |
| background-position: left 10px center; } | |
| .select__box .select__nativeControl { | |
| /* @noflip */ | |
| padding-left: 16px; | |
| /* @noflip */ | |
| padding-right: 26px; | |
| height: 56px; | |
| border-radius: 4px 4px 0 0; } | |
| [dir="rtl"] .select__box .select__nativeControl, .selectBox .select__nativeControl[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 26px; | |
| /* @noflip */ | |
| padding-right: 16px; } | |
| .select__box .floatingLabel { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; | |
| bottom: 12px; | |
| line-height: 1.75rem; } | |
| [dir="rtl"] .select__box .floatingLabel, .selectBox .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; } | |
| .select__box .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-40%) scale(0.75, 0.75); | |
| transform: translateY(-40%) scale(0.75, 0.75); } | |
| .select__outlined { | |
| height: 56px; | |
| border: none; | |
| background-position: right 10px center; } | |
| .select__outlined:not(.selectDisabled) .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.24); } | |
| .select__outlined:not(.selectDisabled) .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.24); } | |
| .select__outlined:not(.selectDisabled):not(.select__nativeControl:focus) .select__nativeControl:hover ~ .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.87); } | |
| .select__outlined:not(.selectDisabled):not(.select__nativeControl:focus) .select__nativeControl:hover ~ .notchedOutline .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.87); } | |
| .select__outlined:not(.selectDisabled) .select__nativeControl:focus ~ .notchedOutline .notchedOutline__path { | |
| stroke-width: 2px; } | |
| .select__outlined:not(.selectDisabled) .select__nativeControl:focus ~ .notchedOutline .notchedOutline__path { | |
| stroke: #6200ee; | |
| /* @alternate */ | |
| stroke: var(--mdc-theme-primary, #6200ee); } | |
| .select__outlined .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-130%) scale(0.75); | |
| transform: translateY(-130%) scale(0.75); } | |
| .select__outlined .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1; } | |
| .select__outlined .notchedOutline { | |
| border-radius: 4px; } | |
| .select__outlined .notchedOutline__idle { | |
| border-radius: 4px; } | |
| [dir="rtl"] .select__outlined, .selectOutlined[dir="rtl"] { | |
| background-position: left 10px center; } | |
| .select__outlined .select__nativeControl { | |
| /* @noflip */ | |
| padding-left: 16px; | |
| /* @noflip */ | |
| padding-right: 26px; | |
| display: flex; | |
| padding-top: 12px; | |
| padding-bottom: 12px; | |
| border: none; | |
| background-color: transparent; | |
| z-index: 1; } | |
| [dir="rtl"] .select__outlined .select__nativeControl, .selectOutlined .select__nativeControl[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 26px; | |
| /* @noflip */ | |
| padding-right: 16px; } | |
| .select__outlined .floatingLabel { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; | |
| position: absolute; | |
| bottom: 20px; } | |
| [dir="rtl"] .select__outlined .floatingLabel, .selectOutlined .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; } | |
| .select__disabled { | |
| background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2210px%22%20height%3D%225px%22%20viewBox%3D%227%2010%2010%205%22%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%3E%0A%20%20%20%20%3Cpolygon%20id%3D%22Shape%22%20stroke%3D%22none%22%20fill%3D%22%23#000%22%20fill-rule%3D%22evenodd%22%20opacity%3D%220.54%22%20points%3D%227%2010%2012%2015%2017%2010%22%3E%3C%2Fpolygon%3E%0A%3C%2Fsvg%3E"); | |
| opacity: .38; | |
| cursor: default; | |
| pointer-events: none; } | |
| .select__disabled .floatingLabel { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .select__disabled .lineRipple { | |
| display: none; } | |
| .select__disabled .select__nativeControl { | |
| border-bottom-style: dotted; } | |
| .select__disabled.selectBox { | |
| background-color: #fafafa; } | |
| .select__disabled.selectOutlined .select__nativeControl { | |
| border-bottom-style: none; } | |
| .select__disabled.selectOutlined .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.16); } | |
| .select__disabled.selectOutlined .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.16); } | |
| .shapeContainer { | |
| display: inline-block; | |
| position: relative; | |
| overflow: hidden; } | |
| .shapeContainer__corner { | |
| position: absolute; | |
| z-index: 1; } | |
| .shapeContainer__corner::before, | |
| .shapeContainer__corner::after { | |
| position: absolute; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 100%; | |
| content: ""; } | |
| .shapeContainer__corner__topLeft { | |
| -webkit-transform: rotate(-45deg); | |
| transform: rotate(-45deg); } | |
| .shapeContainer__corner__topRight { | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); } | |
| .shapeContainer__corner__bottomRight { | |
| -webkit-transform: rotate(135deg); | |
| transform: rotate(135deg); } | |
| .shapeContainer__corner__bottomLeft { | |
| -webkit-transform: rotate(-135deg); | |
| transform: rotate(-135deg); } | |
| @-webkit-keyframes mdc-slider-emphasize { | |
| 0% { | |
| -webkit-animation-timing-function: ease-out; | |
| animation-timing-function: ease-out; } | |
| 50% { | |
| -webkit-animation-timing-function: ease-in; | |
| animation-timing-function: ease-in; | |
| -webkit-transform: scale(0.85); | |
| transform: scale(0.85); } | |
| 100% { | |
| -webkit-transform: scale(0.571); | |
| transform: scale(0.571); } } | |
| @keyframes mdc-slider-emphasize { | |
| 0% { | |
| -webkit-animation-timing-function: ease-out; | |
| animation-timing-function: ease-out; } | |
| 50% { | |
| -webkit-animation-timing-function: ease-in; | |
| animation-timing-function: ease-in; | |
| -webkit-transform: scale(0.85); | |
| transform: scale(0.85); } | |
| 100% { | |
| -webkit-transform: scale(0.571); | |
| transform: scale(0.571); } } | |
| .slider { | |
| position: relative; | |
| width: 100%; | |
| height: 48px; | |
| cursor: pointer; | |
| touch-action: pan-x; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } | |
| .slider:not(.slider__disabled) .slider__track { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| .slider:not(.slider__disabled) .slider__trackContainer { | |
| background-color: rgba(1, 135, 134, 0.26); } | |
| .slider:not(.slider__disabled) .slider__trackMarker::after, | |
| .slider:not(.sliderDisabled) .slider__trackMarkerContainer::after { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| .slider:not(.slider__disabled) .slider__thumb { | |
| fill: #018786; | |
| /* @alternate */ | |
| fill: var(--mdc-theme-secondary, #018786); | |
| stroke: #018786; | |
| /* @alternate */ | |
| stroke: var(--mdc-theme-secondary, #018786); } | |
| .slider:not(.slider__disabled) .slider__focusRing { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| .slider:not(.slider__disabled) .slider__pin { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| .slider:not(.slider__disabled) .slider__pin { | |
| color: white; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-dark, white); } | |
| .slider__disabled { | |
| cursor: auto; } | |
| .slider__disabled .slider__track { | |
| background-color: #9a9a9a; } | |
| .slider__disabled .slider__trackContainer { | |
| background-color: rgba(154, 154, 154, 0.26); } | |
| .slider__disabled .slider__trackMarker::after, | |
| .sliderDisabled .slider__trackMarkerContainer::after { | |
| background-color: #9a9a9a; } | |
| .slider__disabled .slider__thumb { | |
| fill: #9a9a9a; | |
| stroke: #9a9a9a; } | |
| .slider__disabled .slider__thumb { | |
| /* @alternate */ | |
| stroke: white; | |
| stroke: var(--mdc-slider-bg-color-behind-component, white); } | |
| .slider:focus { | |
| outline: none; } | |
| .slider__trackContainer { | |
| position: absolute; | |
| top: 50%; | |
| width: 100%; | |
| height: 2px; | |
| overflow: hidden; } | |
| .slider__track { | |
| position: absolute; | |
| width: 100%; | |
| height: 100%; | |
| -webkit-transform-origin: left top; | |
| transform-origin: left top; | |
| will-change: transform; } | |
| .slider[dir="rtl"] .slider__track, | |
| [dir="rtl"] .slider .slider__track { | |
| -webkit-transform-origin: right top; | |
| transform-origin: right top; } | |
| .slider__trackMarkerContainer { | |
| display: flex; | |
| margin-right: 0; | |
| margin-left: -1px; | |
| visibility: hidden; } | |
| .slider[dir="rtl"] .slider__trackMarkerContainer, | |
| [dir="rtl"] .slider .slider__trackMarkerContainer { | |
| margin-right: -1px; | |
| margin-left: 0; } | |
| .slider__trackMarkerContainer::after { | |
| display: block; | |
| width: 2px; | |
| height: 2px; | |
| content: ""; } | |
| .slider__trackMarker { | |
| flex: 1; } | |
| .slider__trackMarker::after { | |
| display: block; | |
| width: 2px; | |
| height: 2px; | |
| content: ""; } | |
| .slider__trackMarker:firstChild::after { | |
| width: 3px; } | |
| .slider__thumbContainer { | |
| position: absolute; | |
| top: 15px; | |
| left: 0; | |
| width: 21px; | |
| height: 100%; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| will-change: transform; } | |
| .slider__thumb { | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| -webkit-transform: scale(0.571); | |
| transform: scale(0.571); | |
| transition: fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out; | |
| transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out; | |
| transition: transform 100ms ease-out, fill 100ms ease-out, stroke 100ms ease-out, -webkit-transform 100ms ease-out; | |
| stroke-width: 3.5; } | |
| .slider__focusRing { | |
| width: 21px; | |
| height: 21px; | |
| transition: opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out; | |
| transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out; | |
| transition: transform 266.67ms ease-out, opacity 266.67ms ease-out, background-color 266.67ms ease-out, -webkit-transform 266.67ms ease-out; | |
| border-radius: 50%; | |
| opacity: 0; } | |
| .slider__pin { | |
| display: flex; | |
| position: absolute; | |
| top: 0; | |
| left: 0; | |
| align-items: center; | |
| justify-content: center; | |
| width: 26px; | |
| height: 26px; | |
| margin-top: -2px; | |
| margin-left: -2px; | |
| -webkit-transform: rotate(-45deg) scale(0) translate(0, 0); | |
| transform: rotate(-45deg) scale(0) translate(0, 0); | |
| transition: -webkit-transform 100ms ease-out; | |
| transition: transform 100ms ease-out; | |
| transition: transform 100ms ease-out, -webkit-transform 100ms ease-out; | |
| border-radius: 50% 50% 50% 0%; | |
| z-index: 1; } | |
| .slider__pinValueMarker { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.01786em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| -webkit-transform: rotate(45deg); | |
| transform: rotate(45deg); } | |
| .slider__active .slider__thumb { | |
| -webkit-transform: scale3d(1, 1, 1); | |
| transform: scale3d(1, 1, 1); } | |
| .slider__focus .slider__thumb { | |
| -webkit-animation: mdc-slider-emphasize 266.67ms linear; | |
| animation: mdc-slider-emphasize 266.67ms linear; } | |
| .slider__focus .slider__focusRing { | |
| -webkit-transform: scale3d(1.55, 1.55, 1.55); | |
| transform: scale3d(1.55, 1.55, 1.55); | |
| opacity: .25; } | |
| .slider__inTransit .slider__thumb { | |
| transition-delay: 140ms; } | |
| .slider__inTransit .slider__thumbContainer, | |
| .sliderInTransit .slider__track, | |
| .slider:focus:not(.sliderActive) .slider__thumbContainer, | |
| .slider:focus:not(.sliderActive) .slider__track { | |
| transition: -webkit-transform 80ms ease; | |
| transition: transform 80ms ease; | |
| transition: transform 80ms ease, -webkit-transform 80ms ease; } | |
| .slider__discrete.sliderActive .slider__thumb { | |
| -webkit-transform: scale(calc(12 / 21)); | |
| transform: scale(calc(12 / 21)); } | |
| .slider__discrete.sliderActive .slider__pin { | |
| -webkit-transform: rotate(-45deg) scale(1) translate(19px, -20px); | |
| transform: rotate(-45deg) scale(1) translate(19px, -20px); } | |
| .slider__discrete.sliderFocus .slider__thumb { | |
| -webkit-animation: none; | |
| animation: none; } | |
| .slider__discrete.sliderDisplayMarkers .slider__trackMarkerContainer { | |
| visibility: visible; } | |
| .snackbar { | |
| display: flex; | |
| position: fixed; | |
| bottom: 0; | |
| left: 50%; | |
| align-items: center; | |
| justify-content: flex-start; | |
| box-sizing: border-box; | |
| padding-right: 24px; | |
| padding-left: 24px; | |
| -webkit-transform: translate(-50%, 100%); | |
| transform: translate(-50%, 100%); | |
| transition: -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| transition: transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 0.25s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| background-color: #323232; | |
| pointer-events: none; | |
| will-change: transform; } | |
| @media (max-width: 599px) { | |
| .snackbar { | |
| left: 0; | |
| width: 100%; | |
| -webkit-transform: translate(0, 100%); | |
| transform: translate(0, 100%); } } | |
| @media (min-width: 600px) { | |
| .snackbar { | |
| min-width: 288px; | |
| max-width: 568px; | |
| border-radius: 2px; } } | |
| @media (min-width: 600px) { | |
| .snackbar__alignStart { | |
| /* @noflip */ | |
| left: 24px; | |
| /* @noflip */ | |
| right: initial; | |
| bottom: 24px; | |
| -webkit-transform: translate(0, 200%); | |
| transform: translate(0, 200%); } | |
| [dir="rtl"] .snackbar__alignStart, .snackbarAlignStart[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 24px; } } | |
| @media (max-width: 599px) { | |
| .snackbar__alignStart { | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| -webkit-transform: translate(0, 100%); | |
| transform: translate(0, 100%); } } | |
| .snackbar__active { | |
| -webkit-transform: translate(0); | |
| transform: translate(0); | |
| transition: -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 0.25s 0ms cubic-bezier(0, 0, 0.2, 1); | |
| pointer-events: auto; } | |
| .snackbar__active:not(.snackbarAlignStart) { | |
| -webkit-transform: translate(-50%, 0); | |
| transform: translate(-50%, 0); } | |
| @media (max-width: 599px) { | |
| .snackbar__active:not(.snackbarAlignStart) { | |
| bottom: 0; | |
| left: 0; | |
| width: 100%; | |
| -webkit-transform: translate(0); | |
| transform: translate(0); } } | |
| .snackbar__actionWrapper { | |
| /* @noflip */ | |
| padding-left: 24px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| [dir="rtl"] .snackbar__actionWrapper, .snackbar__actionWrapper[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 24px; } | |
| .snackbar__actionOnBottom { | |
| flex-direction: column; } | |
| .snackbar__text { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.5rem; | |
| font-weight: 400; | |
| letter-spacing: 0.03125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: auto; | |
| display: flex; | |
| align-items: center; | |
| height: 48px; | |
| transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| opacity: 0; | |
| color: white; } | |
| .snackbar[dir="rtl"] .snackbar__text, | |
| [dir="rtl"] .snackbar .snackbar__text { | |
| /* @noflip */ | |
| margin-left: auto; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| @media (min-width: 600px) { | |
| .snackbar__text { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 24px; } | |
| [dir="rtl"] .snackbar__text, .snackbar__text[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 24px; | |
| /* @noflip */ | |
| padding-right: 0; } } | |
| .snackbar__actionOnBottom .snackbar__text { | |
| margin-right: inherit; } | |
| .snackbar__actionOnBottom .snackbar__actionWrapper { | |
| /* @noflip */ | |
| margin-left: auto; | |
| /* @noflip */ | |
| margin-right: 0; | |
| flex-direction: column; | |
| justify-content: flex-start; | |
| margin-top: -12px; | |
| margin-bottom: 8px; } | |
| [dir="rtl"] .snackbar__actionOnBottom .snackbar__actionWrapper, .snackbarActionOnBottom .snackbar__actionWrapper[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: auto; } | |
| .snackbar__multiline .snackbar__text { | |
| height: 80px; } | |
| .snackbar__actionButton { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 2.25rem; | |
| font-weight: 500; | |
| letter-spacing: 0.08929em; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| color: #018786; | |
| /* @alternate */ | |
| color: var(--mdc-theme-secondary, #018786); | |
| padding: 0; | |
| transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| border: none; | |
| outline: none; | |
| background-color: transparent; | |
| opacity: 0; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; | |
| -webkit-appearance: none; | |
| visibility: hidden; } | |
| .snackbar__actionButton::mozFocusInner { | |
| border: 0; } | |
| .snackbar__actionButton:hover { | |
| cursor: pointer; } | |
| .snackbar__actionButton:not([ariaHidden]) { | |
| visibility: inherit; } | |
| .snackbar__active .snackbar__text, | |
| .snackbarActive .snackbar__actionButton:not([ariaHidden]) { | |
| transition: opacity 0.3s 0ms cubic-bezier(0.4, 0, 1, 1); | |
| opacity: 1; } | |
| .snackbar__multiline.snackbarActionOnBottom .snackbar__text { | |
| margin: 0; } | |
| .switch { | |
| display: inline-block; | |
| position: relative; } | |
| .switch__nativeControl { | |
| position: absolute; | |
| top: -14px; | |
| left: -14px; | |
| width: 48px; | |
| height: 48px; | |
| display: inline-block; | |
| margin-top: -3px; | |
| margin-left: 0; | |
| transition: -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 0; | |
| cursor: pointer; | |
| z-index: 2; } | |
| .switch__nativeControl:checked { | |
| -webkit-transform: translateX(14px); | |
| transform: translateX(14px); } | |
| [dir="rtl"] .switch__nativeControl:checked, .switch__nativeControl:checked[dir="rtl"] { | |
| -webkit-transform: translateX(-14px); | |
| transform: translateX(-14px); } | |
| .switch__nativeControl:enabled:not(:checked) ~ .switch__background::before { | |
| background-color: #000; | |
| border-color: #000; } | |
| .switch__nativeControl:enabled:not(:checked) ~ .switch__background .switch__knob { | |
| background-color: #fafafa; | |
| border-color: #fafafa; } | |
| .switch__nativeControl:enabled:not(:checked) ~ .switch__background .switch__knob::before { | |
| background-color: #9e9e9e; } | |
| .switch__nativeControl:enabled:checked ~ .switch__background::before { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); } | |
| .switch__nativeControl:enabled:checked ~ .switch__background .switch__knob { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); | |
| border-color: #018786; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-secondary, #018786); } | |
| .switch__nativeControl:enabled:checked ~ .switch__background .switch__knob::before { | |
| background-color: #018786; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786); } | |
| .switch__background { | |
| display: block; | |
| position: relative; | |
| width: 34px; | |
| height: 14px; | |
| border-radius: 50%; | |
| outline: none; | |
| -webkit-user-select: none; | |
| -moz-user-select: none; | |
| -ms-user-select: none; | |
| user-select: none; } | |
| .switch__background::before { | |
| display: block; | |
| position: absolute; | |
| top: 0; | |
| right: 0; | |
| bottom: 0; | |
| left: 0; | |
| transition: opacity 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), border-color 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| border: 1px solid; | |
| border-radius: 7px; | |
| opacity: .38; | |
| content: ""; } | |
| .switch__knob { | |
| box-shadow: 0px 3px 1px -2px rgba(0, 0, 0, 0.2), 0px 2px 2px 0px rgba(0, 0, 0, 0.14), 0px 1px 5px 0px rgba(0, 0, 0, 0.12); | |
| /* @noflip */ | |
| left: 0; | |
| /* @noflip */ | |
| right: initial; | |
| display: block; | |
| position: absolute; | |
| top: -3px; | |
| box-sizing: border-box; | |
| width: 20px; | |
| height: 20px; | |
| -webkit-transform: translateX(0); | |
| transform: translateX(0); | |
| transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), border-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), border-color 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), border-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| border: 10px solid; | |
| border-radius: 50%; | |
| z-index: 1; } | |
| [dir="rtl"] .switch__knob, .switch__knob[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 0; } | |
| .switch__knob::before { | |
| position: absolute; | |
| top: -24px; | |
| left: -24px; | |
| width: 48px; | |
| height: 48px; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| transition: background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| transition: transform 90ms cubic-bezier(0.4, 0, 0.2, 1), background-color 90ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 90ms cubic-bezier(0.4, 0, 0.2, 1); | |
| border-radius: 50%; | |
| opacity: .2; | |
| content: ""; } | |
| .switch__nativeControl:focus ~ .switch__background .switch__knob::before { | |
| -webkit-transform: scale(1); | |
| transform: scale(1); } | |
| .switch__nativeControl:checked ~ .switch__background::before { | |
| opacity: .5; } | |
| .switch__nativeControl:checked ~ .switch__background .switch__knob { | |
| -webkit-transform: translateX(14px); | |
| transform: translateX(14px); } | |
| [dir="rtl"] .switch__nativeControl:checked ~ .switch__background .switch__knob, .switch__nativeControl:checked ~ .switch__background .switch__knob[dir="rtl"] { | |
| -webkit-transform: translateX(-14px); | |
| transform: translateX(-14px); } | |
| .switch__nativeControl:checked ~ .switch__background .switch__knob::before { | |
| opacity: .15; } | |
| .switch__nativeControl:disabled { | |
| cursor: initial; } | |
| .switch__nativeControl:disabled ~ .switch__background::before { | |
| background-color: #000; | |
| opacity: .12; } | |
| .switch__nativeControl:disabled ~ .switch__background .switch__knob { | |
| border-width: 1px; | |
| border-color: #bdbdbd; | |
| background-color: #bdbdbd; } | |
| .tab { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 2.25rem; | |
| font-weight: 500; | |
| letter-spacing: 0.08929em; | |
| text-decoration: none; | |
| text-transform: uppercase; | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| display: table-cell; | |
| position: relative; | |
| box-sizing: border-box; | |
| min-width: 160px; | |
| min-height: 48px; | |
| padding: 0 24px; | |
| text-align: center; | |
| text-decoration: none; | |
| white-space: nowrap; | |
| cursor: pointer; | |
| overflow: hidden; | |
| vertical-align: middle; } | |
| .tab .tab__icon { | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); } | |
| .tab::before, .tab::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .tab::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .tab.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .tab.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .tab.rippleUpgraded__unbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .tab.rippleUpgraded__foregroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .tab.rippleUpgraded__foregroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .tab::before, .tab::after { | |
| background-color: black; } | |
| .tab:hover::before { | |
| opacity: 0.04; } | |
| .tab:not(.rippleUpgraded):focus::before, .tab.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .tab:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .tab:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.16; } | |
| .tab.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.16; } | |
| .tab::before, .tab::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .tab.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .tab:hover { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tab:hover .tab__icon { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tab:focus { | |
| outline: none; } | |
| @media screen and (max-width: 600px) { | |
| .tab { | |
| min-width: 72px; | |
| padding: 0 12px; } } | |
| .tab__icon { | |
| display: block; | |
| margin: 0 auto; | |
| width: 24px; | |
| height: 24px; } | |
| .tabBar__iconsWithText .tab__icon { | |
| margin-top: 4px; } | |
| .tab__iconText { | |
| display: block; | |
| margin: 0 auto; } | |
| .tab__icon + .tab__iconText { | |
| padding-top: 6px; } | |
| .tab__active { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tab__active .tab__icon { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tab__active::before { | |
| bottom: 0; } | |
| .tab__indicator { | |
| background-color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); | |
| position: absolute; | |
| bottom: 0; | |
| height: 2px; | |
| visibility: hidden; | |
| left: 2px; | |
| width: calc(100% - 4px); } | |
| .tabBar:not(.tabBarUpgraded) .tab__active .tab__indicator, | |
| .tabBar:not(.tabBarUpgraded) .tab:hover .tab__indicator, | |
| .tabBar:not(.tabBarUpgraded) .tab:active .tab__indicator { | |
| visibility: visible; } | |
| .tabBar:not(.tabBarUpgraded) .tab:not(.tab__active):hover .tab__indicator { | |
| opacity: .38; } | |
| .tabBar:not(.tabBarUpgraded) .tab__active, | |
| .tabBar:not(.tabBarUpgraded) .tab:not(.tabActive):active .tab__indicator { | |
| opacity: .87; } | |
| .tabBar__indicator, | |
| .tab__indicator { | |
| background-color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tabBar { | |
| display: table; | |
| position: relative; | |
| height: 48px; | |
| margin: 0 auto; | |
| text-transform: uppercase; } | |
| .tabBar__indicator { | |
| background-color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)); | |
| position: absolute; | |
| bottom: 0; | |
| height: 2px; | |
| visibility: hidden; | |
| left: 0; | |
| width: 100%; | |
| -webkit-transform-origin: left top; | |
| transform-origin: left top; | |
| transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| will-change: transform; } | |
| .tabBar__iconsWithText { | |
| height: 72px; } | |
| .tabBarScroller { | |
| display: flex; | |
| align-items: center; | |
| box-sizing: border-box; | |
| width: 100%; | |
| background-color: inherit; | |
| overflow: hidden; } | |
| .tabBarScroller__scrollFrame { | |
| display: flex; | |
| position: relative; | |
| flex: 1; | |
| justify-content: flex-start; | |
| overflow: hidden; } | |
| .tabBarScroller__scrollFrame__tabs { | |
| transition: -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| transition: transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 240ms 0ms cubic-bezier(0, 0, 0.2, 1); | |
| will-change: transform; } | |
| .tabBarScroller__indicator { | |
| color: rgba(0, 0, 0, 0.54); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)); | |
| display: flex; | |
| align-items: center; | |
| justify-content: center; | |
| width: 48px; | |
| cursor: pointer; | |
| visibility: hidden; } | |
| .tabBarScroller__indicator:hover { | |
| color: rgba(0, 0, 0, 0.87); | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)); } | |
| .tabBarScroller__indicator__inner { | |
| color: inherit; | |
| text-decoration: inherit; | |
| cursor: inherit; } | |
| .tabBarScroller__indicator__inner:focus { | |
| outline-color: inherit; } | |
| .tabBarScroller[dir="rtl"] .tabBarScroller__indicator__inner, | |
| [dir="rtl"] .tabBarScroller .tabBarScroller__indicator__inner { | |
| -webkit-transform: rotate(180deg); | |
| transform: rotate(180deg); } | |
| .tabBarScroller__indicator__inner:hover { | |
| color: inherit; } | |
| .tabBarScroller__indicator__enabled { | |
| visibility: visible; } | |
| .textFieldHelperText { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.75rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.03333em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| margin: 0; | |
| transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 0; | |
| will-change: opacity; } | |
| .textField + .textFieldHelperText { | |
| margin-bottom: 8px; } | |
| .textFieldHelperText__persistent { | |
| transition: none; | |
| opacity: 1; | |
| will-change: initial; } | |
| .textField__withLeadingIcon .textField__icon, | |
| .textFieldWithTrailingIcon .textField__icon { | |
| position: absolute; | |
| bottom: 16px; | |
| cursor: pointer; } | |
| .textField__icon:not([tabindex]), | |
| .textField__icon[tabindex="1"] { | |
| cursor: default; | |
| pointer-events: none; } | |
| .textField { | |
| display: inline-block; | |
| position: relative; | |
| margin-bottom: 8px; | |
| will-change: opacity, transform, color; } | |
| .textField:not(.textField__disabled):not(.textFieldOutlined):not(.textFieldTextarea) .textField__input { | |
| border-bottom-color: rgba(0, 0, 0, 0.42); } | |
| .textField:not(.textField__disabled):not(.textFieldOutlined):not(.textFieldTextarea) .textField__input:hover { | |
| border-bottom-color: rgba(0, 0, 0, 0.87); } | |
| .textField .lineRipple { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); } | |
| .textField:not(.textField__disabled) .textField__input { | |
| color: rgba(0, 0, 0, 0.87); } | |
| .textField:not(.textField__disabled) .floatingLabel { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled) .textField__input::webkitInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled) .textField__input:msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled) .textField__input::msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled) .textField__input::placeholder { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled) + .textFieldHelperText { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField:not(.textField__disabled):not(.textFieldTextarea) { | |
| border-bottom-color: rgba(0, 0, 0, 0.12); } | |
| .textField:not(.textField__disabled) .textField__icon { | |
| color: rgba(0, 0, 0, 0.54); } | |
| .textField__input { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| width: 100%; | |
| height: 30px; | |
| padding: 20px 0 1px; | |
| transition: opacity 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| border: none; | |
| border-bottom: 1px solid; | |
| border-radius: 0; | |
| background: none; | |
| -webkit-appearance: none; | |
| -moz-appearance: none; | |
| appearance: none; } | |
| .textField__input::webkitInputPlaceholder { | |
| transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 1; } | |
| .textField__input:msInputPlaceholder { | |
| transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 1; } | |
| .textField__input::msInputPlaceholder { | |
| transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 1; } | |
| .textField__input::placeholder { | |
| transition: color 180ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 1; } | |
| .textField__input:focus { | |
| outline: none; } | |
| .textField__input:invalid { | |
| box-shadow: none; } | |
| .textField__input:webkitAutofill + .floatingLabel { | |
| -webkit-transform: translateY(-100%) scale(0.75); | |
| transform: translateY(-100%) scale(0.75); | |
| cursor: auto; } | |
| .textField__outlined { | |
| height: 56px; | |
| border: none; } | |
| .textField__outlined:not(.textFieldDisabled) .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.24); } | |
| .textField__outlined:not(.textFieldDisabled) .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.24); } | |
| .textField__outlined:not(.textFieldDisabled):not(.textFieldFocused) .textField__input:hover ~ .notchedOutline__idle, | |
| .textFieldOutlined:not(.textFieldDisabled):not(.textFieldFocused) .textField__icon:hover ~ .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.87); } | |
| .textField__outlined:not(.textFieldDisabled):not(.textFieldFocused) .textField__input:hover ~ .notchedOutline .notchedOutline__path, | |
| .textFieldOutlined:not(.textFieldDisabled):not(.textFieldFocused) .textField__icon:hover ~ .notchedOutline .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.87); } | |
| .textField__outlined:not(.textFieldDisabled).textFieldFocused .notchedOutline__path { | |
| stroke: #6200ee; | |
| /* @alternate */ | |
| stroke: var(--mdc-theme-primary, #6200ee); } | |
| .textField__outlined .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-130%) scale(0.75); | |
| transform: translateY(-130%) scale(0.75); } | |
| .textField__outlined .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined 250ms 1; } | |
| .textField__outlined .notchedOutline { | |
| border-radius: 4px; } | |
| .textField__outlined .notchedOutline__idle { | |
| border-radius: 4px; } | |
| .textField__outlined .textField__input { | |
| display: flex; | |
| padding: 12px; | |
| border: none; | |
| background-color: transparent; | |
| z-index: 1; } | |
| .textField__outlined .floatingLabel { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; | |
| position: absolute; | |
| bottom: 20px; } | |
| [dir="rtl"] .textField__outlined .floatingLabel, .textFieldOutlined .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; } | |
| .textField__outlined .textField__icon { | |
| z-index: 2; } | |
| .textField__outlined.textFieldFocused .notchedOutline__path { | |
| stroke-width: 2px; } | |
| .textField__outlined.textFieldDisabled .textField__input { | |
| color: rgba(0, 0, 0, 0.6); } | |
| .textField__outlined.textFieldDisabled .notchedOutline__idle { | |
| border-color: rgba(0, 0, 0, 0.06); } | |
| .textField__outlined.textFieldDisabled .notchedOutline__path { | |
| stroke: rgba(0, 0, 0, 0.06); } | |
| .textField__outlined.textFieldDisabled .textField__input { | |
| border-bottom: none; } | |
| .textField__outlined.textFieldDense { | |
| height: 48px; } | |
| .textField__outlined.textFieldDense .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-110%) scale(0.923); | |
| transform: translateY(-110%) scale(0.923); } | |
| .textField__outlined.textFieldDense .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined-dense 250ms 1; } | |
| .textField__outlined.textFieldDense .textField__input { | |
| padding: 12px 12px 7px; } | |
| .textField__outlined.textFieldDense .floatingLabel { | |
| bottom: 16px; } | |
| .textField__outlined.textFieldDense .textField__icon { | |
| top: 12px; } | |
| .textField__box { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| border-radius: 4px 4px 0 0; | |
| display: inline-flex; | |
| position: relative; | |
| height: 56px; | |
| margin-top: 16px; | |
| overflow: hidden; } | |
| .textField__box::before, .textFieldBox::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .textField__box::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .textField__box.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .textField__box.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .textField__box.rippleUpgradedUnbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .textField__box.rippleUpgradedForegroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .textField__box.rippleUpgradedForegroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .textField__box::before, .textFieldBox::after { | |
| background-color: rgba(0, 0, 0, 0.87); } | |
| .textField__box:hover::before { | |
| opacity: 0.04; } | |
| .textField__box:not(.rippleUpgraded):focus::before, .textFieldBox:not(.rippleUpgraded):focusWithin::before, .textFieldBox.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.12; } | |
| .textField__box::before, .textFieldBox::after { | |
| top: calc(50% - 100%); | |
| /* @noflip */ | |
| left: calc(50% - 100%); | |
| width: 200%; | |
| height: 200%; } | |
| .textField__box.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .textField__box:not(.textFieldDisabled) { | |
| background-color: whitesmoke; } | |
| .textField__box .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-50%) scale(0.75); | |
| transform: translateY(-50%) scale(0.75); } | |
| .textField__box .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-box 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-box 250ms 1; } | |
| .textField__box .textField__input { | |
| align-self: flex-end; | |
| box-sizing: border-box; | |
| height: 100%; | |
| padding: 20px 16px 0; } | |
| .textField__box .floatingLabel { | |
| /* @noflip */ | |
| left: 16px; | |
| /* @noflip */ | |
| right: initial; | |
| position: absolute; | |
| bottom: 20px; | |
| width: calc(100% - 48px); | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| pointer-events: none; | |
| overflow: hidden; | |
| will-change: transform; } | |
| [dir="rtl"] .textField__box .floatingLabel, .textFieldBox .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 16px; } | |
| .textField__box.textFieldDisabled { | |
| background-color: #fafafa; | |
| border-bottom: none; } | |
| .textField__box.textFieldDisabled .textField__input { | |
| border-bottom-color: rgba(0, 0, 0, 0.06); } | |
| .textField__box.textFieldDisabled:not(.textFieldDisabled) .floatingLabel { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__box.textFieldDisabled:not(.textFieldDisabled) .textField__input::webkitInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__box.textFieldDisabled:not(.textFieldDisabled) .textField__input:msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__box.textFieldDisabled:not(.textFieldDisabled) .textField__input::msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__box.textFieldDisabled:not(.textFieldDisabled) .textField__input::placeholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__box.textFieldDense .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-70%) scale(0.923); | |
| transform: translateY(-70%) scale(0.923); } | |
| .textField__box.textFieldDense .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-box-dense 250ms 1; } | |
| .textField__box.textFieldDense .textField__input { | |
| padding: 12px 12px 0; } | |
| .textField__withLeadingIcon .textField__icon { | |
| /* @noflip */ | |
| left: 15px; | |
| /* @noflip */ | |
| right: initial; } | |
| [dir="rtl"] .textField__withLeadingIcon .textField__icon, .textFieldWithLeadingIcon .textField__icon[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 15px; } | |
| .textField__withLeadingIcon .textField__input { | |
| /* @noflip */ | |
| padding-left: 48px; | |
| /* @noflip */ | |
| padding-right: 15px; } | |
| [dir="rtl"] .textField__withLeadingIcon .textField__input, .textFieldWithLeadingIcon .textField__input[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 15px; | |
| /* @noflip */ | |
| padding-right: 48px; } | |
| .textField__withLeadingIcon .floatingLabel { | |
| /* @noflip */ | |
| left: 48px; | |
| /* @noflip */ | |
| right: initial; } | |
| [dir="rtl"] .textField__withLeadingIcon .floatingLabel, .textFieldWithLeadingIcon .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 48px; } | |
| .textField__withLeadingIcon.textFieldOutlined .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-130%) translateX(-32px) scale(0.75); | |
| transform: translateY(-130%) translateX(-32px) scale(0.75); } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldOutlined .floatingLabelFloatAbove, .textFieldWithLeadingIcon.textFieldOutlined .floatingLabelFloatAbove[dir="rtl"] { | |
| -webkit-transform: translateY(-130%) translateX(32px) scale(0.75); | |
| transform: translateY(-130%) translateX(32px) scale(0.75); } | |
| .textField__withLeadingIcon.textFieldOutlined .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon 250ms 1; } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldOutlined .floatingLabelShake, .textFieldWithLeadingIcon.textFieldOutlined[dir="rtl"] .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl 250ms 1; } | |
| .textField__withLeadingIcon.textFieldOutlined.textFieldDense .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-110%) translateX(-21px) scale(0.923); | |
| transform: translateY(-110%) translateX(-21px) scale(0.923); } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldOutlined.textFieldDense .floatingLabelFloatAbove, .textFieldWithLeadingIcon.textFieldOutlined.textFieldDense .floatingLabelFloatAbove[dir="rtl"] { | |
| -webkit-transform: translateY(-110%) translateX(21px) scale(0.923); | |
| transform: translateY(-110%) translateX(21px) scale(0.923); } | |
| .textField__withLeadingIcon.textFieldOutlined.textFieldDense .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense 250ms 1; } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldOutlined.textFieldDense .floatingLabelShake, .textFieldWithLeadingIcon.textFieldOutlined.textFieldDense[dir="rtl"] .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl 250ms 1; } | |
| .textField__withTrailingIcon .textField__icon { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 15px; } | |
| [dir="rtl"] .textField__withTrailingIcon .textField__icon, .textFieldWithTrailingIcon .textField__icon[dir="rtl"] { | |
| /* @noflip */ | |
| left: 15px; | |
| /* @noflip */ | |
| right: initial; } | |
| .textField__withTrailingIcon .textField__input { | |
| /* @noflip */ | |
| padding-left: 15px; | |
| /* @noflip */ | |
| padding-right: 48px; } | |
| [dir="rtl"] .textField__withTrailingIcon .textField__input, .textFieldWithTrailingIcon .textField__input[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 48px; | |
| /* @noflip */ | |
| padding-right: 15px; } | |
| .textField__withLeadingIcon.textFieldDense .textField__icon, | |
| .textFieldWithTrailingIcon.textFieldDense .textField__icon { | |
| bottom: 16px; | |
| -webkit-transform: scale(0.8); | |
| transform: scale(0.8); } | |
| .textField__withLeadingIcon.textFieldDense .textField__icon { | |
| /* @noflip */ | |
| left: 12px; | |
| /* @noflip */ | |
| right: initial; } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldDense .textField__icon, .textFieldWithLeadingIcon.textFieldDense .textField__icon[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 12px; } | |
| .textField__withLeadingIcon.textFieldDense .textField__input { | |
| /* @noflip */ | |
| padding-left: 38px; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldDense .textField__input, .textFieldWithLeadingIcon.textFieldDense .textField__input[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 38px; } | |
| .textField__withLeadingIcon.textFieldDense .floatingLabel { | |
| /* @noflip */ | |
| left: 38px; | |
| /* @noflip */ | |
| right: initial; } | |
| [dir="rtl"] .textField__withLeadingIcon.textFieldDense .floatingLabel, .textFieldWithLeadingIcon.textFieldDense .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 38px; } | |
| .textField__withTrailingIcon.textFieldDense .textField__icon { | |
| /* @noflip */ | |
| left: initial; | |
| /* @noflip */ | |
| right: 12px; } | |
| [dir="rtl"] .textField__withTrailingIcon.textFieldDense .textField__icon, .textFieldWithTrailingIcon.textFieldDense .textField__icon[dir="rtl"] { | |
| /* @noflip */ | |
| left: 12px; | |
| /* @noflip */ | |
| right: initial; } | |
| .textField__withTrailingIcon.textFieldDense .textField__input { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 38px; } | |
| [dir="rtl"] .textField__withTrailingIcon.textFieldDense .textField__input, .textFieldWithTrailingIcon.textFieldDense .textField__input[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 38px; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| .textField__upgraded:not(.textFieldFullwidth):not(.textFieldBox) { | |
| display: inline-flex; | |
| position: relative; | |
| align-items: flex-end; | |
| box-sizing: border-box; | |
| margin-top: 16px; } | |
| .textField__upgraded:not(.textFieldFullwidth):not(.textFieldBox):not(.textFieldTextarea):not(.textFieldOutlined) { | |
| height: 48px; } | |
| .textField__dense { | |
| margin-top: 12px; | |
| margin-bottom: 4px; } | |
| .textField__dense .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-110%) scale(0.923); | |
| transform: translateY(-110%) scale(0.923); } | |
| .textField__dense .floatingLabel { | |
| font-size: .813rem; } | |
| .textField__input:required + .floatingLabel::after { | |
| margin-left: 1px; | |
| content: "*"; } | |
| .textField__textarea { | |
| border-radius: 4px; | |
| display: flex; | |
| width: -webkit-fit-content; | |
| width: -moz-fit-content; | |
| width: fit-content; | |
| height: initial; | |
| transition: none; | |
| border: 1px solid; | |
| overflow: hidden; } | |
| .textField__textarea .floatingLabel { | |
| border-radius: 4px 4px 0 0; } | |
| .textField__textarea .textField__input { | |
| border-radius: 2px; } | |
| .textField__textarea:not(.textFieldDisabled) { | |
| border-color: rgba(0, 0, 0, 0.73); } | |
| .textField__textarea:not(.textFieldDisabled) .textField__input:focus { | |
| border-color: rgba(0, 0, 0, 0.73); } | |
| .textField__textarea .floatingLabelFloatAbove { | |
| -webkit-transform: translateY(-50%) scale(0.923); | |
| transform: translateY(-50%) scale(0.923); } | |
| .textField__textarea .floatingLabelShake { | |
| -webkit-animation: mdc-floating-label-shake-float-above-textarea 250ms 1; | |
| animation: mdc-floating-label-shake-float-above-textarea 250ms 1; } | |
| .textField__textarea .textField__input { | |
| height: auto; | |
| margin: 0; | |
| padding: 16px; | |
| padding-top: 32px; | |
| border: 1px solid transparent; } | |
| .textField__textarea .floatingLabel { | |
| background-color: white; | |
| /* @noflip */ | |
| left: 1px; | |
| /* @noflip */ | |
| right: 0; | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: 0; | |
| top: 18px; | |
| bottom: auto; | |
| margin-top: 2px; | |
| padding: 12px 8px 8px 8px; | |
| line-height: 1.15; | |
| pointer-events: none; } | |
| [dir="rtl"] .textField__textarea .floatingLabel, .textFieldTextarea .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| left: 0; | |
| /* @noflip */ | |
| right: 1px; } | |
| [dir="rtl"] .textField__textarea .floatingLabel, .textFieldTextarea .floatingLabel[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 8px; } | |
| .textField__fullwidth { | |
| width: 100%; } | |
| .textField__fullwidth .textField__input { | |
| resize: vertical; } | |
| .textField__fullwidth:not(.textFieldTextarea) { | |
| display: block; | |
| box-sizing: border-box; | |
| height: 56px; | |
| margin: 0; | |
| border: none; | |
| border-bottom: 1px solid; | |
| outline: none; } | |
| .textField__fullwidth:not(.textFieldTextarea) .textField__input { | |
| width: 100%; | |
| height: 100%; | |
| padding: 0; | |
| resize: none; | |
| border: none !important; } | |
| .textField__fullwidth.textFieldInvalid:not(.textFieldDisabled):not(.textFieldTextarea) { | |
| border-bottom-color: #b00020; } | |
| .textField__dense + .textFieldHelperText { | |
| margin-bottom: 4px; } | |
| .textField__box + .textFieldHelperText, | |
| .textFieldOutlined + .textFieldHelperText { | |
| margin-right: 16px; | |
| margin-left: 16px; } | |
| .formField > .textField + label { | |
| align-self: flex-start; } | |
| .textField__focused:not(.textFieldDisabled) .floatingLabel { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .textField__focused:not(.textFieldDisabled) .textField__input::webkitInputPlaceholder { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .textField__focused:not(.textFieldDisabled) .textField__input:msInputPlaceholder { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .textField__focused:not(.textFieldDisabled) .textField__input::msInputPlaceholder { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .textField__focused:not(.textFieldDisabled) .textField__input::placeholder { | |
| color: rgba(98, 0, 238, 0.87); } | |
| .textField__focused .textField__input:required + .floatingLabel::after { | |
| color: #b00020; } | |
| .textField__focused + .textFieldHelperText:not(.textFieldHelperTextValidationMsg) { | |
| opacity: 1; } | |
| .textField__textarea.textFieldFocused:not(.textFieldDisabled) { | |
| border-color: #6200ee; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-primary, #6200ee); } | |
| .textField__textarea.textFieldFocused:not(.textFieldDisabled) .textField__input:focus { | |
| border-color: #6200ee; | |
| /* @alternate */ | |
| border-color: var(--mdc-theme-primary, #6200ee); } | |
| .textField__invalid:not(.textFieldDisabled):not(.textFieldOutlined):not(.textFieldTextarea) .textField__input { | |
| border-bottom-color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled):not(.textFieldOutlined):not(.textFieldTextarea) .textField__input:hover { | |
| border-bottom-color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .lineRipple { | |
| background-color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .floatingLabel { | |
| color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .textField__input::webkitInputPlaceholder { | |
| color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .textField__input:msInputPlaceholder { | |
| color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .textField__input::msInputPlaceholder { | |
| color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled) .textField__input::placeholder { | |
| color: #b00020; } | |
| .textField__invalid:not(.textFieldDisabled).textFieldInvalid + .textFieldHelperTextValidationMsg { | |
| color: #b00020; } | |
| .textField__invalid.textFieldWithTrailingIcon:not(.textFieldDisabled) .textField__icon { | |
| color: #b00020; } | |
| .textField__invalid + .textFieldHelperTextValidationMsg { | |
| opacity: 1; } | |
| .textField__textarea.textFieldInvalid:not(.textFieldDisabled) { | |
| border-color: #b00020; } | |
| .textField__textarea.textFieldInvalid:not(.textFieldDisabled) .textField__input:focus { | |
| border-color: #b00020; } | |
| .textField__outlined.textFieldInvalid:not(.textFieldDisabled) .notchedOutline__idle { | |
| border-color: #b00020; } | |
| .textField__outlined.textFieldInvalid:not(.textFieldDisabled) .notchedOutline__path { | |
| stroke: #b00020; } | |
| .textField__outlined.textFieldInvalid:not(.textFieldDisabled):not(.textFieldFocused) .textField__input:hover ~ .notchedOutline__idle, | |
| .textFieldOutlined.textFieldInvalid:not(.textFieldDisabled):not(.textFieldFocused) .textField__icon:hover ~ .notchedOutline__idle { | |
| border-color: #b00020; } | |
| .textField__outlined.textFieldInvalid:not(.textFieldDisabled):not(.textFieldFocused) .textField__input:hover ~ .notchedOutline .notchedOutline__path, | |
| .textFieldOutlined.textFieldInvalid:not(.textFieldDisabled):not(.textFieldFocused) .textField__icon:hover ~ .notchedOutline .notchedOutline__path { | |
| stroke: #b00020; } | |
| .textField__outlined.textFieldInvalid:not(.textFieldDisabled).textFieldFocused .notchedOutline__path { | |
| stroke: #b00020; } | |
| .textField__disabled { | |
| pointer-events: none; } | |
| .textField__disabled .textField__input { | |
| border-bottom-color: rgba(35, 31, 32, 0.26); } | |
| .textField__disabled .textField__input { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .floatingLabel { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .textField__input::webkitInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .textField__input:msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .textField__input::msInputPlaceholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .textField__input::placeholder { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled + .textFieldHelperText { | |
| color: rgba(0, 0, 0, 0.37); } | |
| .textField__disabled .textField__icon { | |
| color: rgba(0, 0, 0, 0.3); } | |
| .textField__disabled:not(.textFieldTextarea) { | |
| border-bottom-color: rgba(0, 0, 0, 0.12); } | |
| .textField__disabled .textField__input { | |
| border-bottom: 1px dotted; } | |
| .textField__disabled .floatingLabel { | |
| cursor: default; } | |
| .textField__textarea.textFieldDisabled { | |
| border-color: rgba(35, 31, 32, 0.26); | |
| background-color: #f9f9f9; | |
| border-style: solid; } | |
| .textField__textarea.textFieldDisabled .textField__input:focus { | |
| border-color: rgba(35, 31, 32, 0.26); } | |
| .textField__textarea.textFieldDisabled .textField__input { | |
| border: 1px solid transparent; } | |
| .textField__textarea.textFieldDisabled .floatingLabel { | |
| background-color: #f9f9f9; } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-box { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.75); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-box-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-box-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-70%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-70%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-70%) scale(0.923); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - 0%)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - 0%)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 0%)) translateY(-130%) scale(0.75); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-110%) scale(0.923); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - 32px)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - 32px)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - 32px)) translateY(-130%) scale(0.75); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - 21px)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - 21px)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - 21px)) translateY(-110%) scale(0.923); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-rtl { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(4% - -32px)) translateY(-130%) scale(0.75); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(-4% - -32px)) translateY(-130%) scale(0.75); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); | |
| transform: translateX(calc(0 - -32px)) translateY(-130%) scale(0.75); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } } | |
| @keyframes mdc-floating-label-shake-float-above-text-field-outlined-leading-icon-dense-rtl { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(4% - -21px)) translateY(-110%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(-4% - -21px)) translateY(-110%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); | |
| transform: translateX(calc(0 - -21px)) translateY(-110%) scale(0.923); } } | |
| @-webkit-keyframes mdc-floating-label-shake-float-above-textarea { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } } | |
| @keyframes mdc-floating-label-shake-float-above-textarea { | |
| 0% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } | |
| 33% { | |
| -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| animation-timing-function: cubic-bezier(0.5, 0, 0.70173, 0.49582); | |
| -webkit-transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(4% - 0%)) translateY(-50%) scale(0.923); } | |
| 66% { | |
| -webkit-animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| animation-timing-function: cubic-bezier(0.30244, 0.38135, 0.55, 0.95635); | |
| -webkit-transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(-4% - 0%)) translateY(-50%) scale(0.923); } | |
| 100% { | |
| -webkit-transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); | |
| transform: translateX(calc(0 - 0%)) translateY(-50%) scale(0.923); } } | |
| :root { | |
| --mdc-theme-primary: #6200ee; | |
| --mdc-theme-secondary: #018786; | |
| --mdc-theme-background: #fff; | |
| --mdc-theme-surface: #fff; | |
| --mdc-theme-on-primary: #fff; | |
| --mdc-theme-on-secondary: #fff; | |
| --mdc-theme-on-surface: #000; | |
| --mdc-theme-text-primary-on-background: rgba(0, 0, 0, 0.87); | |
| --mdc-theme-text-secondary-on-background: rgba(0, 0, 0, 0.54); | |
| --mdc-theme-text-hint-on-background: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-disabled-on-background: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-icon-on-background: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-primary-on-light: rgba(0, 0, 0, 0.87); | |
| --mdc-theme-text-secondary-on-light: rgba(0, 0, 0, 0.54); | |
| --mdc-theme-text-hint-on-light: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-disabled-on-light: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-icon-on-light: rgba(0, 0, 0, 0.38); | |
| --mdc-theme-text-primary-on-dark: white; | |
| --mdc-theme-text-secondary-on-dark: rgba(255, 255, 255, 0.7); | |
| --mdc-theme-text-hint-on-dark: rgba(255, 255, 255, 0.5); | |
| --mdc-theme-text-disabled-on-dark: rgba(255, 255, 255, 0.5); | |
| --mdc-theme-text-icon-on-dark: rgba(255, 255, 255, 0.5); } | |
| .theme__primary { | |
| color: #6200ee !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-primary, #6200ee) !important; } | |
| .theme__secondary { | |
| color: #018786 !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-secondary, #018786) !important; } | |
| .theme__background { | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-background, #fff); } | |
| .theme__surface { | |
| background-color: #fff; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-surface, #fff); } | |
| .theme__onPrimary { | |
| color: #fff !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-primary, #fff) !important; } | |
| .theme__onSecondary { | |
| color: #fff !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-secondary, #fff) !important; } | |
| .theme__onSurface { | |
| color: #000 !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-surface, #000) !important; } | |
| .theme__textPrimaryOnBackground { | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-background, rgba(0, 0, 0, 0.87)) !important; } | |
| .theme__textSecondaryOnBackground { | |
| color: rgba(0, 0, 0, 0.54) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-background, rgba(0, 0, 0, 0.54)) !important; } | |
| .theme__textHintOnBackground { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-hint-on-background, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textDisabledOnBackground { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-background, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textIconOnBackground { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-background, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textPrimaryOnLight { | |
| color: rgba(0, 0, 0, 0.87) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-light, rgba(0, 0, 0, 0.87)) !important; } | |
| .theme__textSecondaryOnLight { | |
| color: rgba(0, 0, 0, 0.54) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-light, rgba(0, 0, 0, 0.54)) !important; } | |
| .theme__textHintOnLight { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-hint-on-light, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textDisabledOnLight { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-light, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textIconOnLight { | |
| color: rgba(0, 0, 0, 0.38) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-light, rgba(0, 0, 0, 0.38)) !important; } | |
| .theme__textPrimaryOnDark { | |
| color: white !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-primary-on-dark, white) !important; } | |
| .theme__textSecondaryOnDark { | |
| color: rgba(255, 255, 255, 0.7) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-secondary-on-dark, rgba(255, 255, 255, 0.7)) !important; } | |
| .theme__textHintOnDark { | |
| color: rgba(255, 255, 255, 0.5) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-hint-on-dark, rgba(255, 255, 255, 0.5)) !important; } | |
| .theme__textDisabledOnDark { | |
| color: rgba(255, 255, 255, 0.5) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-disabled-on-dark, rgba(255, 255, 255, 0.5)) !important; } | |
| .theme__textIconOnDark { | |
| color: rgba(255, 255, 255, 0.5) !important; | |
| /* @alternate */ | |
| color: var(--mdc-theme-text-icon-on-dark, rgba(255, 255, 255, 0.5)) !important; } | |
| .theme__primaryBg { | |
| background-color: #6200ee !important; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee) !important; } | |
| .theme__secondaryBg { | |
| background-color: #018786 !important; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-secondary, #018786) !important; } | |
| .toolbar { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); | |
| color: white; | |
| display: flex; | |
| position: relative; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| box-sizing: border-box; | |
| width: 100%; } | |
| .toolbar .toolbar__icon { | |
| color: white; } | |
| .toolbar .toolbar__icon::before, .toolbar .toolbar__icon::after { | |
| background-color: white; } | |
| .toolbar .toolbar__icon:hover::before { | |
| opacity: 0.08; } | |
| .toolbar .toolbar__icon:not(.rippleUpgraded):focus::before, .toolbar .toolbar__icon.rippleUpgraded__backgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| .toolbar .toolbar__icon:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .toolbar .toolbar__icon:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.32; } | |
| .toolbar .toolbar__icon.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.32; } | |
| .toolbar__row { | |
| display: flex; | |
| position: relative; | |
| align-items: center; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: auto; | |
| min-height: 64px; } | |
| @media (max-width: 959px) and (orientation: landscape) { | |
| .toolbar__row { | |
| min-height: 48px; } } | |
| @media (max-width: 599px) { | |
| .toolbar__row { | |
| min-height: 56px; } } | |
| .toolbar__section { | |
| display: inline-flex; | |
| flex: 1; | |
| align-items: start; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| min-width: 0; | |
| height: 100%; | |
| padding: 8px; | |
| z-index: 1; } | |
| @media (max-width: 959px) and (orientation: landscape) { | |
| .toolbar__section { | |
| padding: 0; } } | |
| @media (max-width: 599px) { | |
| .toolbar__section { | |
| padding: 4px 0; } } | |
| .toolbar__section__alignStart { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 0; | |
| justify-content: flex-start; | |
| order: -1; } | |
| [dir="rtl"] .toolbar__section__alignStart, .toolbar__sectionAlignStart[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| @media (max-width: 959px) and (orientation: landscape) { | |
| .toolbar__section__alignStart { | |
| /* @noflip */ | |
| padding-left: 4px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| [dir="rtl"] .toolbar__section__alignStart, .toolbar__sectionAlignStart[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 4px; } } | |
| @media (max-width: 599px) { | |
| .toolbar__section__alignStart { | |
| /* @noflip */ | |
| padding-left: 4px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| [dir="rtl"] .toolbar__section__alignStart, .toolbar__sectionAlignStart[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 4px; } } | |
| .toolbar__section__alignEnd { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 12px; | |
| justify-content: flex-end; | |
| order: 1; } | |
| [dir="rtl"] .toolbar__section__alignEnd, .toolbar__sectionAlignEnd[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| @media (max-width: 959px) and (orientation: landscape) { | |
| .toolbar__section__alignEnd { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 4px; } | |
| [dir="rtl"] .toolbar__section__alignEnd, .toolbar__sectionAlignEnd[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 4px; | |
| /* @noflip */ | |
| padding-right: 0; } } | |
| @media (max-width: 599px) { | |
| .toolbar__section__alignEnd { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 4px; } | |
| [dir="rtl"] .toolbar__section__alignEnd, .toolbar__sectionAlignEnd[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 4px; | |
| /* @noflip */ | |
| padding-right: 0; } } | |
| .toolbar__title { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.25rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.0125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| /* @noflip */ | |
| margin-left: 24px; | |
| /* @noflip */ | |
| margin-right: 0; | |
| align-self: center; | |
| padding: 12px 0; | |
| line-height: 1.5rem; | |
| z-index: 1; } | |
| [dir="rtl"] .toolbar__title, .toolbar__title[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 24px; } | |
| .toolbar__icon, .toolbar__menuIcon { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| display: flex; | |
| position: relative; | |
| align-items: start; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| width: 48px; | |
| height: 48px; | |
| padding: 12px; | |
| border: none; | |
| outline: none; | |
| background-color: transparent; | |
| fill: currentColor; | |
| color: inherit; | |
| text-decoration: none; | |
| cursor: pointer; } | |
| .toolbar__icon::before, .toolbar__icon::after, .toolbar__menuIcon::before, .toolbar__menuIcon::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .toolbar__icon::before, .toolbar__menuIcon::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .toolbar__icon.rippleUpgraded::before, .toolbar__menuIcon.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .toolbar__icon.rippleUpgraded::after, .toolbar__menuIcon.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .toolbar__icon.rippleUpgraded__unbounded::after, .toolbar__menuIcon.rippleUpgradedUnbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .toolbar__icon.rippleUpgraded__foregroundActivation::after, .toolbar__menuIcon.rippleUpgradedForegroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .toolbar__icon.rippleUpgraded__foregroundDeactivation::after, .toolbar__menuIcon.rippleUpgradedForegroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .toolbar__icon::before, .toolbar__icon::after, .toolbar__menuIcon::before, .toolbar__menuIcon::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .toolbar__icon.rippleUpgraded::before, .toolbar__icon.rippleUpgraded::after, .toolbar__menuIcon.rippleUpgraded::before, .toolbar__menuIcon.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .toolbar__icon.rippleUpgraded::after, .toolbar__menuIcon.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .toolbar__menuIcon + .toolbar__title { | |
| /* @noflip */ | |
| margin-left: 8px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| [dir="rtl"] .toolbar__menuIcon + .toolbar__title, .toolbar__menuIcon + .toolbar__title[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 8px; } | |
| @media (max-width: 599px) { | |
| .toolbar__title { | |
| /* @noflip */ | |
| margin-left: 16px; | |
| /* @noflip */ | |
| margin-right: 0; } | |
| [dir="rtl"] .toolbar__title, .toolbar__title[dir="rtl"] { | |
| /* @noflip */ | |
| margin-left: 0; | |
| /* @noflip */ | |
| margin-right: 16px; } } | |
| .toolbar__fixed { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); | |
| position: fixed; | |
| top: 0; | |
| left: 0; | |
| z-index: 4; } | |
| .toolbar__flexible { | |
| --mdc-toolbar-ratio-to-extend-flexible: 4; } | |
| .toolbar__flexible .toolbar__row:firstChild { | |
| height: 256px; | |
| height: calc(64px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); } | |
| @media (max-width: 599px) { | |
| .toolbar__flexible .toolbar__row:firstChild { | |
| height: 224px; | |
| height: calc(56px * var(--mdc-toolbar-ratio-to-extend-flexible, 4)); } } | |
| .toolbar__flexible .toolbar__row:firstChild::after { | |
| position: absolute; | |
| content: ""; } | |
| .toolbar__flexibleDefaultBehavior .toolbar__title { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.25rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.0125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| align-self: flex-end; | |
| line-height: 1.5rem; } | |
| .toolbar__flexibleDefaultBehavior .toolbar__row:firstChild::after { | |
| top: 0; | |
| left: 0; | |
| width: 100%; | |
| height: 100%; | |
| transition: opacity .2s ease; | |
| opacity: 1; } | |
| .toolbar__flexibleDefaultBehavior.toolbarFlexibleSpaceMinimized .toolbar__row:firstChild::after { | |
| opacity: 0; } | |
| .toolbar__flexibleDefaultBehavior.toolbarFlexibleSpaceMinimized .toolbar__title { | |
| font-weight: 500; } | |
| .toolbar__waterfall.toolbarFixed { | |
| box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); | |
| transition: box-shadow 280ms cubic-bezier(0.4, 0, 0.2, 1); | |
| will-change: box-shadow; } | |
| .toolbar__waterfall.toolbarFixed.toolbarFlexibleSpaceMinimized { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); } | |
| .toolbar__waterfall.toolbarFixed.toolbarFixedLastrowOnly.toolbarFlexibleSpaceMinimized { | |
| box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.2), 0px 0px 0px 0px rgba(0, 0, 0, 0.14), 0px 0px 0px 0px rgba(0, 0, 0, 0.12); } | |
| .toolbar__waterfall.toolbarFixed.toolbarFixedLastrowOnly.toolbarFixedAtLastRow { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); } | |
| .toolbarFixedAdjust { | |
| margin-top: 64px; } | |
| @media (max-width: 959px) and (max-height: 599px) { | |
| .toolbarFixedAdjust { | |
| margin-top: 48px; } } | |
| @media (max-width: 599px) { | |
| .toolbarFixedAdjust { | |
| margin-top: 56px; } } | |
| .toolbar__section__shrinkToFit { | |
| flex: none; } | |
| .topAppBar { | |
| background-color: #6200ee; | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-primary, #6200ee); | |
| color: white; | |
| display: flex; | |
| position: fixed; | |
| flex-direction: column; | |
| justify-content: space-between; | |
| box-sizing: border-box; | |
| width: 100%; | |
| z-index: 4; } | |
| .topAppBar .topAppBar__actionItem, | |
| .topAppBar .topAppBar__navigationIcon { | |
| color: #fff; | |
| /* @alternate */ | |
| color: var(--mdc-theme-on-primary, #fff); } | |
| .topAppBar .topAppBar__actionItem::before, .topAppBar .topAppBar__actionItem::after, | |
| .topAppBar .topAppBar__navigationIcon::before, | |
| .topAppBar .topAppBar__navigationIcon::after { | |
| background-color: #fff; } | |
| @supports not (-ms-ime-align: auto) { | |
| .topAppBar .topAppBar__actionItem::before, .topAppBar .topAppBar__actionItem::after, | |
| .topAppBar .topAppBar__navigationIcon::before, | |
| .topAppBar .topAppBar__navigationIcon::after { | |
| /* @alternate */ | |
| background-color: var(--mdc-theme-on-primary, #fff); } } | |
| .topAppBar .topAppBar__actionItem:hover::before, | |
| .topAppBar .topAppBar__navigationIcon:hover::before { | |
| opacity: 0.08; } | |
| .topAppBar .topAppBar__actionItem:not(.rippleUpgraded):focus::before, .topAppBar .topAppBar__actionItem.rippleUpgraded__backgroundFocused::before, | |
| .topAppBar .topAppBar__navigationIcon:not(.rippleUpgraded):focus::before, | |
| .topAppBar .topAppBar__navigationIcon.rippleUpgradedBackgroundFocused::before { | |
| transition-duration: 75ms; | |
| opacity: 0.24; } | |
| .topAppBar .topAppBar__actionItem:not(.rippleUpgraded)::after, | |
| .topAppBar .topAppBar__navigationIcon:not(.rippleUpgraded)::after { | |
| transition: opacity 150ms linear; } | |
| .topAppBar .topAppBar__actionItem:not(.rippleUpgraded):active::after, | |
| .topAppBar .topAppBar__navigationIcon:not(.rippleUpgraded):active::after { | |
| transition-duration: 75ms; | |
| opacity: 0.32; } | |
| .topAppBar .topAppBar__actionItem.rippleUpgraded, | |
| .topAppBar .topAppBar__navigationIcon.rippleUpgraded { | |
| --mdc-ripple-fg-opacity: 0.32; } | |
| .topAppBar__row { | |
| display: flex; | |
| position: relative; | |
| box-sizing: border-box; | |
| width: 100%; | |
| height: 64px; } | |
| .topAppBar__section { | |
| display: inline-flex; | |
| flex: 1 1 auto; | |
| align-items: center; | |
| min-width: 0; | |
| padding: 8px 12px; | |
| z-index: 1; } | |
| .topAppBar__section__alignStart { | |
| justify-content: flex-start; | |
| order: -1; } | |
| .topAppBar__section__alignEnd { | |
| justify-content: flex-end; | |
| order: 1; } | |
| .topAppBar__title { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.25rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.0125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; | |
| /* @noflip */ | |
| padding-left: 20px; | |
| /* @noflip */ | |
| padding-right: 0; | |
| text-overflow: ellipsis; | |
| white-space: nowrap; | |
| overflow: hidden; | |
| z-index: 1; } | |
| [dir="rtl"] .topAppBar__title, .topAppBar__title[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 20px; } | |
| .topAppBar__actionItem, .topAppBar__navigationIcon { | |
| --mdc-ripple-fg-size: 0; | |
| --mdc-ripple-left: 0; | |
| --mdc-ripple-top: 0; | |
| --mdc-ripple-fg-scale: 1; | |
| --mdc-ripple-fg-translate-end: 0; | |
| --mdc-ripple-fg-translate-start: 0; | |
| -webkit-tap-highlight-color: rgba(0, 0, 0, 0); | |
| will-change: transform, opacity; | |
| display: flex; | |
| position: relative; | |
| flex-shrink: 0; | |
| align-items: center; | |
| justify-content: center; | |
| box-sizing: border-box; | |
| width: 48px; | |
| height: 48px; | |
| padding: 12px; | |
| border: none; | |
| outline: none; | |
| background-color: transparent; | |
| fill: currentColor; | |
| color: inherit; | |
| text-decoration: none; | |
| cursor: pointer; } | |
| .topAppBar__actionItem::before, .topAppBar__actionItem::after, .topAppBar__navigationIcon::before, .topAppBar__navigationIcon::after { | |
| position: absolute; | |
| border-radius: 50%; | |
| opacity: 0; | |
| pointer-events: none; | |
| content: ""; } | |
| .topAppBar__actionItem::before, .topAppBar__navigationIcon::before { | |
| transition: opacity 15ms linear; | |
| z-index: 1; } | |
| .topAppBar__actionItem.rippleUpgraded::before, .topAppBar__navigationIcon.rippleUpgraded::before { | |
| -webkit-transform: scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .topAppBar__actionItem.rippleUpgraded::after, .topAppBar__navigationIcon.rippleUpgraded::after { | |
| top: 0; | |
| /* @noflip */ | |
| left: 0; | |
| -webkit-transform: scale(0); | |
| transform: scale(0); | |
| -webkit-transform-origin: center center; | |
| transform-origin: center center; } | |
| .topAppBar__actionItem.rippleUpgraded__unbounded::after, .topAppBar__navigationIcon.rippleUpgradedUnbounded::after { | |
| top: var(--mdc-ripple-top, 0); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, 0); } | |
| .topAppBar__actionItem.rippleUpgraded__foregroundActivation::after, .topAppBar__navigationIcon.rippleUpgradedForegroundActivation::after { | |
| -webkit-animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; | |
| animation: 225ms mdc-ripple-fg-radius-in forwards, 75ms mdc-ripple-fg-opacity-in forwards; } | |
| .topAppBar__actionItem.rippleUpgraded__foregroundDeactivation::after, .topAppBar__navigationIcon.rippleUpgradedForegroundDeactivation::after { | |
| -webkit-animation: 150ms mdc-ripple-fg-opacity-out; | |
| animation: 150ms mdc-ripple-fg-opacity-out; | |
| -webkit-transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); | |
| transform: translate(var(--mdc-ripple-fg-translate-end, 0)) scale(var(--mdc-ripple-fg-scale, 1)); } | |
| .topAppBar__actionItem::before, .topAppBar__actionItem::after, .topAppBar__navigationIcon::before, .topAppBar__navigationIcon::after { | |
| top: calc(50% - 50%); | |
| /* @noflip */ | |
| left: calc(50% - 50%); | |
| width: 100%; | |
| height: 100%; } | |
| .topAppBar__actionItem.rippleUpgraded::before, .topAppBar__actionItem.rippleUpgraded::after, .topAppBar__navigationIcon.rippleUpgraded::before, .topAppBar__navigationIcon.rippleUpgraded::after { | |
| top: var(--mdc-ripple-top, calc(50% - 50%)); | |
| /* @noflip */ | |
| left: var(--mdc-ripple-left, calc(50% - 50%)); | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .topAppBar__actionItem.rippleUpgraded::after, .topAppBar__navigationIcon.rippleUpgraded::after { | |
| width: var(--mdc-ripple-fg-size, 100%); | |
| height: var(--mdc-ripple-fg-size, 100%); } | |
| .topAppBar__short { | |
| top: 0; | |
| right: auto; | |
| left: 0; | |
| width: 100%; | |
| transition: width 250ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| [dir="rtl"] .topAppBar__short, .topAppBarShort[dir="rtl"] { | |
| right: 0; | |
| left: auto; } | |
| .topAppBar__short .topAppBar__row { | |
| height: 56px; } | |
| .topAppBar__short .topAppBar__section { | |
| padding: 4px; } | |
| .topAppBar__short .topAppBar__title { | |
| transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1); | |
| opacity: 1; } | |
| .topAppBar__shortCollapsed { | |
| /* @noflip */ | |
| border-bottom-left-radius: 0; | |
| /* @noflip */ | |
| border-bottom-right-radius: 4px; | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); | |
| width: 56px; | |
| transition: width 300ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| [dir="rtl"] .topAppBar__shortCollapsed, .topAppBarShortCollapsed[dir="rtl"] { | |
| /* @noflip */ | |
| border-bottom-left-radius: 4px; | |
| /* @noflip */ | |
| border-bottom-right-radius: 0; } | |
| .topAppBar__shortCollapsed .topAppBar__title { | |
| display: none; } | |
| .topAppBar__shortCollapsed .topAppBar__actionItem { | |
| transition: padding 150ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .topAppBar__shortCollapsed.topAppBarShortHasActionItem { | |
| width: 112px; } | |
| .topAppBar__shortCollapsed.topAppBarShortHasActionItem .topAppBar__sectionAlignEnd { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| [dir="rtl"] .topAppBar__shortCollapsed.topAppBarShortHasActionItem .topAppBar__sectionAlignEnd, .topAppBarShortCollapsed.topAppBarShortHasActionItem .topAppBar__sectionAlignEnd[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| .topAppBar__dense .topAppBar__row { | |
| height: 48px; } | |
| .topAppBar__dense .topAppBar__section { | |
| padding: 0 4px; } | |
| .topAppBar__dense .topAppBar__title { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| [dir="rtl"] .topAppBar__dense .topAppBar__title, .topAppBarDense .topAppBar__title[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| .topAppBar__prominent .topAppBar__row { | |
| height: 128px; } | |
| .topAppBar__prominent .topAppBar__title { | |
| align-self: flex-end; | |
| padding-bottom: 2px; } | |
| .topAppBar__prominent .topAppBar__actionItem, | |
| .topAppBarProminent .topAppBar__navigationIcon { | |
| align-self: flex-start; } | |
| .topAppBar__fixed { | |
| transition: box-shadow 200ms linear; } | |
| .topAppBar__fixedScrolled { | |
| box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.2), 0px 4px 5px 0px rgba(0, 0, 0, 0.14), 0px 1px 10px 0px rgba(0, 0, 0, 0.12); | |
| transition: box-shadow 200ms linear; } | |
| .topAppBar__dense.topAppBarProminent .topAppBar__row { | |
| height: 96px; } | |
| .topAppBar__dense.topAppBarProminent .topAppBar__section { | |
| padding: 0 12px; } | |
| .topAppBar__dense.topAppBarProminent .topAppBar__title { | |
| /* @noflip */ | |
| padding-left: 20px; | |
| /* @noflip */ | |
| padding-right: 0; | |
| padding-bottom: 9px; } | |
| [dir="rtl"] .topAppBar__dense.topAppBarProminent .topAppBar__title, .topAppBarDense.topAppBarProminent .topAppBar__title[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 20px; } | |
| .topAppBar__fixedAdjust { | |
| padding-top: 64px; } | |
| .topAppBar__denseFixedAdjust { | |
| padding-top: 48px; } | |
| .topAppBar__shortFixedAdjust { | |
| padding-top: 56px; } | |
| .topAppBar__prominentFixedAdjust { | |
| padding-top: 128px; } | |
| .topAppBar__denseProminentFixedAdjust { | |
| padding-top: 96px; } | |
| @media (max-width: 599px) { | |
| .topAppBar__row { | |
| height: 56px; } | |
| .topAppBar__section { | |
| padding: 4px; } | |
| .topAppBar__short { | |
| transition: width 200ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .topAppBar__shortCollapsed { | |
| transition: width 250ms cubic-bezier(0.4, 0, 0.2, 1); } | |
| .topAppBar__shortCollapsed .topAppBar__sectionAlignEnd { | |
| /* @noflip */ | |
| padding-left: 0; | |
| /* @noflip */ | |
| padding-right: 12px; } | |
| [dir="rtl"] .topAppBar__shortCollapsed .topAppBar__sectionAlignEnd, .topAppBarShortCollapsed .topAppBar__sectionAlignEnd[dir="rtl"] { | |
| /* @noflip */ | |
| padding-left: 12px; | |
| /* @noflip */ | |
| padding-right: 0; } | |
| .topAppBar__prominent .topAppBar__title { | |
| padding-bottom: 6px; } | |
| .topAppBar__fixedAdjust { | |
| padding-top: 56px; } } | |
| .typography { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; } | |
| .typography__headline1 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 6rem; | |
| line-height: 6rem; | |
| font-weight: 300; | |
| letter-spacing: -0.01562em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__headline2 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 3.75rem; | |
| line-height: 3.75rem; | |
| font-weight: 300; | |
| letter-spacing: -0.00833em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__headline3 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 3rem; | |
| line-height: 3.125rem; | |
| font-weight: 400; | |
| letter-spacing: normal; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__headline4 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 2.125rem; | |
| line-height: 2.5rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00735em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__headline5 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.5rem; | |
| line-height: 2rem; | |
| font-weight: 400; | |
| letter-spacing: normal; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__headline6 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1.25rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.0125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__subtitle1 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.75rem; | |
| font-weight: 400; | |
| letter-spacing: 0.00937em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__subtitle2 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.375rem; | |
| font-weight: 500; | |
| letter-spacing: 0.00714em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__body1 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 1rem; | |
| line-height: 1.5rem; | |
| font-weight: 400; | |
| letter-spacing: 0.03125em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__body2 { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.01786em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__caption { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.75rem; | |
| line-height: 1.25rem; | |
| font-weight: 400; | |
| letter-spacing: 0.03333em; | |
| text-decoration: inherit; | |
| text-transform: inherit; } | |
| .typography__button { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.875rem; | |
| line-height: 2.25rem; | |
| font-weight: 500; | |
| letter-spacing: 0.08929em; | |
| text-decoration: none; | |
| text-transform: uppercase; } | |
| .typography__overline { | |
| font-family: Roboto, sans-serif; | |
| -moz-osx-font-smoothing: grayscale; | |
| -webkit-font-smoothing: antialiased; | |
| font-size: 0.75rem; | |
| line-height: 2rem; | |
| font-weight: 500; | |
| letter-spacing: 0.16667em; | |
| text-decoration: none; | |
| text-transform: uppercase; } | |
| /*# sourceMappingURL=material-components-web.css.map*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment