// // Copyright 2020 Google Inc. // // Permission is hereby granted, free of charge, to any person obtaining a copy // of this software and associated documentation files (the "Software"), to deal // in the Software without restriction, including without limitation the rights // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell // copies of the Software, and to permit persons to whom the Software is // furnished to do so, subject to the following conditions: // // The above copyright notice and this permission notice shall be included in // all copies or substantial portions of the Software. // // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN // THE SOFTWARE. // // stylelint-disable selector-class-pattern -- // Selector '.mdc-*' should only be used in this project. @use '@material/feature-targeting/feature-targeting'; @use '@material/rtl/rtl'; @use '@material/touch-target/mixins' as touch-target-mixins; @use '@material/typography/typography'; @use './button-base'; @use './button-filled'; @use './button-filled-theme'; @use './button-outlined'; @use './button-outlined-theme'; @use './button-protected'; @use './button-protected-theme'; @use './button-ripple'; @use './button-text'; @use './button-text-theme'; @use './button-theme'; @use './button-shared-theme'; // For backwards compatibility. @forward './button-base' show deprecated-base, base, icon, icon-trailing, icon-svg, icon-contained, icon-contained-trailing, deprecated-icon, deprecated-icon-trailing, deprecated-icon-svg, deprecated-icon-contained, deprecated-icon-contained-trailing; @mixin styles($query: feature-targeting.all()) { @include static-styles($query: $query); @include theme-styles($query: $query); } @mixin theme-styles($query: feature-targeting.all()) { .mdc-button { @include button-text-theme.theme-styles( button-text-theme.$light-theme, $query: $query ); } .mdc-button--unelevated { @include button-filled-theme.theme-styles( button-filled-theme.$light-theme, $query: $query ); } .mdc-button--raised { @include button-protected-theme.theme-styles( button-protected-theme.$light-theme, $query: $query ); } .mdc-button--outlined { @include button-outlined-theme.theme-styles( button-outlined-theme.$light-theme, $query: $query ); } } @mixin static-styles($query: feature-targeting.all()) { @include static-styles-without-ripple($query: $query); @include button-ripple.static-styles($query: $query); } @mixin static-styles-without-ripple($query: feature-targeting.all()) { @include button-base.static-styles($query: $query); @include button-text.static-styles-without-ripple($query: $query); @include button-filled.static-styles-without-ripple($query: $query); @include button-protected.static-styles-without-ripple($query: $query); @include button-outlined.static-styles-without-ripple($query: $query); } // Legacy mixins @mixin without-ripple($query: feature-targeting.all()) { @include button-base.deprecated-static-styles-without-ripple($query: $query); @include button-text.static-styles-without-ripple($query: $query); @include button-filled.static-styles-without-ripple($query: $query); @include button-protected.static-styles-without-ripple($query: $query); @include button-outlined.static-styles-without-ripple($query: $query); @include _theme-styles-without-ripple($query: $query); } @mixin _theme-styles-without-ripple($query: feature-targeting.all()) { @include button-text-theme.deprecated-theme-styles($query: $query); @include button-filled-theme.deprecated-theme-styles($query: $query); @include button-outlined-theme.deprecated-theme-styles($query: $query); // Elevation has been recategorized into theme styles. Keeping old elevation // styles here for backwards compatibility. .mdc-button--raised { @include button-protected.raised($query: $query); } } // @deprecated - use styles() instead. @mixin core-styles($query: feature-targeting.all()) { @include styles($query: $query); // TODO: remove this rule since padding now takes care of icon margins. $feat-structure: feature-targeting.create-target($query, structure); .mdc-button--raised, .mdc-button--unelevated, .mdc-button--outlined { .mdc-button__icon { @include feature-targeting.targets($feat-structure) { // Icons inside contained buttons have different styles due to increased button padding @include button-base.icon-contained; } } .mdc-button__label + .mdc-button__icon { @include feature-targeting.targets($feat-structure) { @include button-base.icon-contained-trailing; } } } }