UNPKG

marsh-daemonite-material

Version:

Daemonite's Material UI is a cross-platform and fully responsive front-end interface based on Google Material Design developed using Bootstrap 4.

1 lines 107 kB
{"version":3,"sources":["../../docs-assets/scss/docs.scss","../../assets/scss/_colors.scss","../../assets/scss/variables/_spacer.scss","../../assets/scss/variables/_typography.scss","../../assets/scss/variables/_variable-material.scss","../../assets/scss/mixins/_border-radius.scss","../../assets/scss/variables/_variable-bootstrap.scss","../../assets/scss/mixins/_hover.scss","../../assets/scss/variables/_elevation-shadow.scss","../../assets/scss/mixins/_breakpoint.scss","../../assets/scss/mixins/_typography.scss","docs.css","../../assets/scss/mixins/_transition.scss","../../assets/scss/variables/_transition.scss"],"names":[],"mappings":"AAOA,YAEE,SCoNuC,ADpNvC,mCCoNuC,ADnNvC,gBAAgB,AAEhB,mBEMc,AFLd,cEKc,CFAf,AAXD,oCAIE,YAAa,CAMZ,AAGH,mBACE,yBCuNuC,CDlNxC,AAND,sBAII,aCoNqC,CDnNtC,AAGH,iBACE,yBCNuC,CDWxC,AAND,oBAII,aCTqC,CDUtC,AAGH,oBACE,yBC0JuC,CDrJxC,AAND,uBAII,aCuJqC,CDtJtC,AAIH,kBACE,wBE7C0B,CFsH3B,AA1ED,oLAUQ,SEtDoB,AFsDpB,6BEtDoB,AFuDpB,qBGSyB,AHPzB,qBI0C6B,AJ3C7B,qBI2C6B,CJjC9B,AAtBP,4PAgBU,mBIwC0B,CJvC3B,AAjBT,sPAoBU,oBIoC0B,CJnC3B,AArBT,wBA2BI,qBCqnB4F,CDrmB7F,AA3CH,4CA+BQ,wBCwCiC,CDvClC,AAhCP,4DAoCQ,mBIiC+B,AJhC/B,gBG/DoB,AHgEpB,YI6B0B,AJ3B1B,0BI+BoG,AJhCpG,sBIgCoG,CJ9BrG,AAzCP,wBA8CI,qBCmmB8F,CDvlB/F,AA1DH,4DAmDQ,iBIwB6B,AJvB7B,gBG9EoB,AH+EpB,cIoB4B,AJlB5B,2BIsBoG,AJvBpG,uBIuBoG,CJrBrG,AAxDP,wBA6DI,qBColB8F,CDxkB/F,AAzEH,4DAkEQ,iBIS6B,AJR7B,gBG9FoB,AH+FpB,cIK4B,AJH5B,2BIcoG,AJfpG,uBIeoG,CJbrG,AAMP,YACE,sBC8kB8F,AD7kB9F,iCCokB8F,ADnkB9F,SAAS,AACT,cExGyB,CFkI1B,AAxBC,wBAGE,aAAa,AK7Gf,yBL2G8B,AK1G9B,0BL0G8B,AAG5B,eAAgC,CACjC,AAXH,iEAcI,oBMpDsC,CNqDvC,AAfH,uCAoBI,UAAU,AAFV,kBAAkB,AAClB,QAAS,CAEV,AArBH,wBAwBI,cAAe,CAChB,AAzBH,cA4BI,eEpIY,CFqIb,AAGH,gCAEE,mBAAqC,AADrC,eAAkC,CAEnC,AAED,eAEE,aE7I0B,AF4I1B,UE5I0B,CF8I3B,AAED,WACE,yBCjDuC,ADkDvC,gBEpJc,AFqJd,eEjJyB,AFkJzB,iBAAkB,CAanB,AAXC,uBAEE,cAAc,AADd,cAAe,CAEh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lXI,0BC5B0C,CbiZ7C,CW+CA,AFvYG,yBTqVJ,6CY9WI,wBC1CwC,Cb2Z3C,CWsDA,ACpaC,kDZ2WF,6CY1WI,eAAgB,CZ6WnB,CW6DA,AX1DC,kDAGE,oBIxLuC,AQ5NzC,0BCT2C,ADU3C,gCZiZ8C,AYhZ9C,iDCCkE,CbkZjE,AS/VC,yBT2VF,kDY5YE,0BCT0C,CbyZ3C,CWmEF,AFlaG,yBT2VF,kDYxYE,wBCvBwC,CbmazC,CWyEF,ACldC,kDZqYA,kDYpYE,eAAgB,CZwYjB,CW+EF,AX3EC,gDAGE,oBIhMuC,AQ5NzC,0BCT2C,ADU3C,gCZyZ8C,AYxZ9C,iDCCkE,Cb0ZjE,ASvWC,yBTmWF,gDYpZE,0BCT0C,Cbia3C,CWoFF,AF3bG,yBTmWF,gDYhZE,wBCvBwC,Cb2azC,CW0FF,AC3eC,kDZ6YA,gDY5YE,eAAgB,CZgZjB,CWgGF,AX7FD,oBACE,eAAgB,CACjB,AAED,UACE,yBC/NuC,ADiOvC,cAAc,AACd,UAAU,AAEV,wBAA6E,AAD7E,qBAA0E,AAE1E,iBAAkB,CAKnB,AAZD,0BAEE,UC4Q8F,CDnQ7F,AAGH,eACE,kBAAyC,AACzC,qBI/agC,CJgbjC,AAED,iBACE,mFGpc0G,CHqc3G","file":"docs.min.css","sourcesContent":["@import '../../assets/scss/colors';\n@import '../../assets/scss/functions';\n@import '../../assets/scss/mixins';\n@import '../../assets/scss/variables';\n\n// Bootstrap doc CSS override\n\n.bd-callout {\n border: 0;\n border-left: $blockquote-border-width solid $blockquote-border-color;\n border-radius: 0;\n margin-top: 0;\n margin-bottom: $paragraph-margin-y;\n padding: 0 $spacer;\n\n + .bd-callout {\n margin-top: 0;\n }\n}\n\n.bd-callout-danger {\n border-left-color: theme-color(danger);\n\n h5 {\n color: theme-color(danger);\n }\n}\n\n.bd-callout-info {\n border-left-color: theme-color(info);\n\n h5 {\n color: theme-color(info);\n }\n}\n\n.bd-callout-warning {\n border-left-color: theme-color(warning);\n\n h5 {\n color: theme-color(warning);\n }\n}\n\n// stylelint-disable selector-max-compound-selectors, selector-max-type\n.bd-content > table {\n border: $table-border-width solid $table-border-color;\n\n > tbody,\n > tfoot,\n > thead {\n > tr {\n > td,\n > th {\n border: 0;\n border-top: $table-border-width solid $table-border-color;\n line-height: $table-line-height;\n padding-right: $table-cell-padding-x;\n padding-left: $table-cell-padding-x;\n\n &:first-child {\n padding-left: $table-cell-padding-x-alt;\n }\n\n &:last-child {\n padding-right: $table-cell-padding-x-alt;\n }\n }\n }\n }\n\n > tbody {\n color: $table-tbody-color;\n\n > tr {\n &:nth-of-type(#{$table-striped-order}) {\n background-color: $table-bg-accent;\n }\n\n > td,\n > th {\n font-size: $table-tbody-font-size;\n font-weight: $table-tbody-font-weight;\n height: $table-tbody-cell-height;\n padding-top: $table-tbody-padding-y;\n padding-bottom: $table-tbody-padding-y;\n }\n }\n }\n\n > tfoot {\n color: $table-tfoot-color;\n\n > tr {\n > td,\n > th {\n font-size: $table-tfoot-font-size;\n font-weight: $table-tfoot-font-weight;\n height: $table-tfoot-cell-height;\n padding-top: $table-tfoot-padding-y;\n padding-bottom: $table-tfoot-padding-y;\n }\n }\n }\n\n > thead {\n color: $table-thead-color;\n\n > tr {\n > td,\n > th {\n font-size: $table-thead-font-size;\n font-weight: $table-thead-font-weight;\n height: $table-thead-cell-height;\n padding-top: $table-thead-padding-y;\n padding-bottom: $table-thead-padding-y;\n }\n }\n }\n}\n// stylelint-enable\n\n.bd-example {\n background-color: $body-bg;\n border: $border-width solid $border-color;\n margin: 0;\n padding: $spacer-lg;\n\n .bd-example + & {\n @include border-top-radius(0);\n\n border-top: 0;\n margin-top: ($border-width * -1);\n }\n\n .custom-file-input:lang(es) ~ .custom-file-label::after {\n content: $custom-file-button-icon;\n }\n\n > .dropdown-menu:first-child {\n position: relative;\n top: auto;\n left: auto;\n }\n\n > .list-group {\n max-width: 100%;\n }\n\n + p {\n margin-top: $paragraph-margin-y;\n }\n}\n\n.bd-example-modal .modal-dialog {\n margin-top: ($dialog-margin-y * 2);\n margin-bottom: ($dialog-margin-y * 2);\n}\n\n.btn-clipboard {\n top: $spacer-xs;\n right: $spacer-xs;\n}\n\n.highlight {\n background-color: $light-theme-2;\n margin: 0 0 $paragraph-margin-y;\n padding: $spacer-lg;\n position: relative;\n\n .bd-content & {\n margin-right: 0;\n margin-left: 0;\n }\n\n .bd-example + &,\n .bd-example + .bd-clipboard + & {\n border: $border-width solid $border-color;\n border-top: 0;\n margin-top: ($border-width * -1);\n }\n}\n\n.section-nav {\n border-left: $blockquote-border-width solid theme-color(secondary);\n position: sticky;\n top: $paragraph-margin-y;\n}\n\n// stylelint-disable selector-no-qualifying-type\n.toc-entry {\n a {\n color: $nav-pills-color;\n opacity: $nav-pills-link-opacity;\n padding: ($nav-link-padding-y / 2) 0 ($nav-link-padding-y / 2) $spacer;\n\n @include active-focus-hover {\n color: $nav-pills-color;\n opacity: 1;\n }\n\n &.active {\n color: $nav-pills-color-active;\n opacity: 1;\n }\n }\n}\n// stylelint-enable\n\n// CSS for accordion examples\n\n.bd-example [id='accordion'] .btn-link[data-toggle='collapse'] {\n padding: 0;\n}\n\n// CSS to flatten buttons in card examples\n\n// stylelint-disable selector-max-class\n.bd-example .card {\n &.text-right .card-body .btn {\n margin-right: ($card-action-padding-x - $card-padding-x);\n }\n\n &:not(.text-center):not(.text-right) .card-body .btn {\n margin-left: ($card-action-padding-x - $card-padding-x);\n }\n\n .card-body {\n @each $color, $values in $theme-colors {\n .btn-#{$color} {\n @include plain-active-focus-hover {\n color: theme-color($color);\n }\n\n &.disabled,\n &:disabled {\n color: $btn-color-disabled;\n }\n }\n }\n\n &:last-child .btn:last-child {\n margin-bottom: ($card-action-padding-y - $card-padding-y);\n }\n\n &:not(:last-child) .btn:last-child {\n margin-bottom: ($card-action-padding-y - $card-inner-spacer-y);\n }\n\n .btn {\n background-color: transparent;\n box-shadow: none;\n min-width: $dialog-footer-btn-min-width;\n padding-right: $dialog-footer-inner-spacer-x;\n padding-left: $dialog-footer-inner-spacer-x;\n\n &.active,\n &:active {\n background-color: $btn-bg-active;\n box-shadow: none;\n }\n\n &.disabled,\n &:disabled {\n background-color: transparent;\n }\n }\n }\n}\n// stylelint-enable\n\n// CSS to limit `.form-control` width in `.navbar` examples\n\n.bd-example .navbar .form-control {\n width: 10rem;\n}\n\n// Docsearch\n\n// stylelint-disable declaration-no-important\n.algolia-autocomplete {\n .algolia-docsearch-footer {\n border-top: $border-width solid $border-color;\n color: $menu-link-color-disabled !important;\n font-size: $font-size-caption !important;\n line-height: $line-height-caption !important;\n padding: $menu-padding-y-cascading $menu-link-padding-x-cascading 0;\n }\n\n .algolia-docsearch-suggestion {\n color: $menu-link-color;\n }\n\n .algolia-docsearch-suggestion--category-header,\n .algolia-docsearch-suggestion--title {\n color: $menu-header-color !important;\n font-size: $menu-font-size-cascading !important;\n line-height: $menu-line-height-cascading;\n padding: $menu-link-padding-y-cascading $menu-link-padding-x-cascading !important;\n }\n\n .ds-dropdown-menu {\n border: 0;\n border-radius: $menu-border-radius;\n box-shadow: map-get($menu-elevation-shadow, shadow);\n margin-top: 0;\n padding-top: $menu-padding-y-cascading !important;\n padding-bottom: $menu-padding-y-cascading !important;\n width: 100%;\n\n [class^='ds-dataset-'] {\n border-radius: 0;\n }\n }\n\n .ds-suggestion.ds-cursor .algolia-docsearch-suggestion--content {\n background-color: $menu-link-bg-hover !important;\n }\n}\n// stylelint-enable\n\n.doc-search:focus {\n z-index: 101;\n}\n\n// Project css\n\n.doc-jumbotron {\n background-color: theme-color(primary);\n background-image: url('../images/doc-jumbotron-bg.jpg');\n background-position: 50% 50%;\n background-repeat: no-repeat;\n background-size: cover;\n color: $white-primary;\n padding-top: ($toolbar-height * 2);\n\n @include media-breakpoint-down(sm) {\n h1 {\n @include typography-display-3;\n }\n }\n\n @include media-breakpoint-up(lg) {\n .navdrawer-permanent-lg ~ & {\n margin-left: $navdrawer-width;\n }\n }\n\n h1:last-child,\n p:last-child {\n margin-bottom: 0;\n }\n}\n\n.doc-logo {\n @include typography-title;\n\n align-items: center;\n background-color: rgba(theme-color(secondary), $black-divider-opacity);\n border-radius: ($toolbar-element-height / 2);\n box-shadow: inset 0 0 0 $border-width currentColor;\n color: inherit;\n display: inline-flex;\n font-family: $font-family-serif;\n font-weight: 700;\n height: $toolbar-element-height;\n justify-content: center;\n line-height: 1;\n position: relative;\n user-select: none;\n vertical-align: top;\n white-space: nowrap;\n width: $toolbar-element-height;\n z-index: 1;\n\n &[href] {\n @include active-focus-hover {\n color: inherit;\n text-decoration: none;\n\n &::before {\n opacity: $black-divider-opacity;\n }\n }\n\n &::before {\n @include transition-standard(opacity);\n\n background-color: currentColor;\n border-radius: ($toolbar-element-height / 2);\n content: '';\n opacity: 0;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: -1;\n }\n }\n\n &:focus {\n outline: 0;\n }\n}\n\n.doc-main {\n @include media-breakpoint-up(lg) {\n .navdrawer-permanent-lg ~ & {\n margin-left: $navdrawer-width;\n }\n }\n}\n\n.doc-navbar-permanent {\n margin-left: $navdrawer-width;\n}\n\n.doc-navbar-persistent,\n.doc-navbar-temporary {\n @include transition-sharp(margin-left);\n}\n\n.doc-navbar-persistent {\n .navdrawer-open-persistent & {\n @include transition-deceleration(margin-left);\n\n margin-left: $navdrawer-width;\n }\n}\n\n.doc-navbar-temporary {\n .navdrawer-open-temporary & {\n @include transition-deceleration(margin-left);\n\n margin-left: $navdrawer-width;\n }\n}\n\n.doc-navdrawer-body {\n min-height: 100%;\n}\n\n.doc-skip {\n background-color: theme-color(primary);\n color: color-yiq(theme-color(primary));\n display: block;\n outline: 0;\n padding-top: (($toolbar-height - $font-size-base * $line-height-base) / 2);\n padding-bottom: (($toolbar-height - $font-size-base * $line-height-base) / 2);\n text-align: center;\n\n &:focus {\n color: color-yiq(theme-color(primary));\n }\n}\n\n.doc-skip-text {\n border: $border-width dotted currentColor;\n padding: $btn-padding-y $btn-padding-x;\n}\n\n.doc-swatch-text {\n font-family: $font-family-monospace;\n}\n","// Material colour palette\n// Based on https://material.google.com/style/color.html#color-color-palette\n\n$material-color-amber-050: #fff8e1 !default;\n$material-color-amber-100: #ffecb3 !default;\n$material-color-amber-200: #ffe082 !default;\n$material-color-amber-300: #ffd54f !default;\n$material-color-amber-400: #ffca28 !default;\n$material-color-amber-500: #ffc107 !default;\n$material-color-amber-600: #ffb300 !default;\n$material-color-amber-700: #ffa000 !default;\n$material-color-amber-800: #ff8f00 !default;\n$material-color-amber-900: #ff6f00 !default;\n$material-color-amber-a100: #ffe57f !default;\n$material-color-amber-a200: #ffd740 !default;\n$material-color-amber-a400: #ffc400 !default;\n$material-color-amber-a700: #ffab00 !default;\n\n$material-color-blue-050: #e3f2fd !default;\n$material-color-blue-100: #bbdefb !default;\n$material-color-blue-200: #90caf9 !default;\n$material-color-blue-300: #64b5f6 !default;\n$material-color-blue-400: #42a5f5 !default;\n$material-color-blue-500: #2196f3 !default;\n$material-color-blue-600: #1e88e5 !default;\n$material-color-blue-700: #1976d2 !default;\n$material-color-blue-800: #1565c0 !default;\n$material-color-blue-900: #0d47a1 !default;\n$material-color-blue-a100: #82b1ff !default;\n$material-color-blue-a200: #448aff !default;\n$material-color-blue-a400: #2979ff !default;\n$material-color-blue-a700: #2962ff !default;\n\n$material-color-blue-grey-050: #eceff1 !default;\n$material-color-blue-grey-100: #cfd8dc !default;\n$material-color-blue-grey-200: #b0bec5 !default;\n$material-color-blue-grey-300: #90a4ae !default;\n$material-color-blue-grey-400: #78909c !default;\n$material-color-blue-grey-500: #607d8b !default;\n$material-color-blue-grey-600: #546e7a !default;\n$material-color-blue-grey-700: #455a64 !default;\n$material-color-blue-grey-800: #37474f !default;\n$material-color-blue-grey-900: #263238 !default;\n\n$material-color-brown-050: #efebe9 !default;\n$material-color-brown-100: #d7ccc8 !default;\n$material-color-brown-200: #bcaaa4 !default;\n$material-color-brown-300: #a1887f !default;\n$material-color-brown-400: #8d6e63 !default;\n$material-color-brown-500: #795548 !default;\n$material-color-brown-600: #6d4c41 !default;\n$material-color-brown-700: #5d4037 !default;\n$material-color-brown-800: #4e342e !default;\n$material-color-brown-900: #3e2723 !default;\n\n$material-color-cyan-050: #e0f7fa !default;\n$material-color-cyan-100: #b2ebf2 !default;\n$material-color-cyan-200: #80deea !default;\n$material-color-cyan-300: #4dd0e1 !default;\n$material-color-cyan-400: #26c6da !default;\n$material-color-cyan-500: #00bcd4 !default;\n$material-color-cyan-600: #00acc1 !default;\n$material-color-cyan-700: #0097a7 !default;\n$material-color-cyan-800: #00838f !default;\n$material-color-cyan-900: #006064 !default;\n$material-color-cyan-a100: #84ffff !default;\n$material-color-cyan-a200: #18ffff !default;\n$material-color-cyan-a400: #00e5ff !default;\n$material-color-cyan-a700: #00b8d4 !default;\n\n$material-color-deep-orange-050: #fbe9e7 !default;\n$material-color-deep-orange-100: #ffccbc !default;\n$material-color-deep-orange-200: #ffab91 !default;\n$material-color-deep-orange-300: #ff8a65 !default;\n$material-color-deep-orange-400: #ff7043 !default;\n$material-color-deep-orange-500: #ff5722 !default;\n$material-color-deep-orange-600: #f4511e !default;\n$material-color-deep-orange-700: #e64a19 !default;\n$material-color-deep-orange-800: #d84315 !default;\n$material-color-deep-orange-900: #bf360c !default;\n$material-color-deep-orange-a100: #ff9e80 !default;\n$material-color-deep-orange-a200: #ff6e40 !default;\n$material-color-deep-orange-a400: #ff3d00 !default;\n$material-color-deep-orange-a700: #dd2c00 !default;\n\n$material-color-deep-purple-050: #ede7f6 !default;\n$material-color-deep-purple-100: #d1c4e9 !default;\n$material-color-deep-purple-200: #b39ddb !default;\n$material-color-deep-purple-300: #9575cd !default;\n$material-color-deep-purple-400: #7e57c2 !default;\n$material-color-deep-purple-500: #673ab7 !default;\n$material-color-deep-purple-600: #5e35b1 !default;\n$material-color-deep-purple-700: #512da8 !default;\n$material-color-deep-purple-800: #4527a0 !default;\n$material-color-deep-purple-900: #311b92 !default;\n$material-color-deep-purple-a100: #b388ff !default;\n$material-color-deep-purple-a200: #7c4dff !default;\n$material-color-deep-purple-a400: #651fff !default;\n$material-color-deep-purple-a700: #6200ea !default;\n\n$material-color-green-050: #e8f5e9 !default;\n$material-color-green-100: #c8e6c9 !default;\n$material-color-green-200: #a5d6a7 !default;\n$material-color-green-300: #81c784 !default;\n$material-color-green-400: #66bb6a !default;\n$material-color-green-500: #4caf50 !default;\n$material-color-green-600: #43a047 !default;\n$material-color-green-700: #388e3c !default;\n$material-color-green-800: #2e7d32 !default;\n$material-color-green-900: #1b5e20 !default;\n$material-color-green-a100: #b9f6ca !default;\n$material-color-green-a200: #69f0ae !default;\n$material-color-green-a400: #00e676 !default;\n$material-color-green-a700: #00c853 !default;\n\n$material-color-grey-050: #fafafa !default;\n$material-color-grey-100: #f5f5f5 !default;\n$material-color-grey-200: #eeeeee !default;\n$material-color-grey-300: #e0e0e0 !default;\n$material-color-grey-400: #bdbdbd !default;\n$material-color-grey-500: #9e9e9e !default;\n$material-color-grey-600: #757575 !default;\n$material-color-grey-700: #616161 !default;\n$material-color-grey-800: #424242 !default;\n$material-color-grey-900: #212121 !default;\n\n$material-color-indigo-050: #e8eaf6 !default;\n$material-color-indigo-100: #c5cae9 !default;\n$material-color-indigo-200: #9fa8da !default;\n$material-color-indigo-300: #7986cb !default;\n$material-color-indigo-400: #5c6bc0 !default;\n$material-color-indigo-500: #3f51b5 !default;\n$material-color-indigo-600: #3949ab !default;\n$material-color-indigo-700: #303f9f !default;\n$material-color-indigo-800: #283593 !default;\n$material-color-indigo-900: #1a237e !default;\n$material-color-indigo-a100: #8c9eff !default;\n$material-color-indigo-a200: #536dfe !default;\n$material-color-indigo-a400: #3d5afe !default;\n$material-color-indigo-a700: #304ffe !default;\n\n$material-color-light-blue-050: #e1f5fe !default;\n$material-color-light-blue-100: #b3e5fc !default;\n$material-color-light-blue-200: #81d4fa !default;\n$material-color-light-blue-300: #4fc3f7 !default;\n$material-color-light-blue-400: #29b6f6 !default;\n$material-color-light-blue-500: #03a9f4 !default;\n$material-color-light-blue-600: #039be5 !default;\n$material-color-light-blue-700: #0288d1 !default;\n$material-color-light-blue-800: #0277bd !default;\n$material-color-light-blue-900: #01579b !default;\n$material-color-light-blue-a100: #80d8ff !default;\n$material-color-light-blue-a200: #40c4ff !default;\n$material-color-light-blue-a400: #00b0ff !default;\n$material-color-light-blue-a700: #0091ea !default;\n\n$material-color-light-green-050: #f1f8e9 !default;\n$material-color-light-green-100: #dcedc8 !default;\n$material-color-light-green-200: #c5e1a5 !default;\n$material-color-light-green-300: #aed581 !default;\n$material-color-light-green-400: #9ccc65 !default;\n$material-color-light-green-500: #8bc34a !default;\n$material-color-light-green-600: #7cb342 !default;\n$material-color-light-green-700: #689f38 !default;\n$material-color-light-green-800: #558b2f !default;\n$material-color-light-green-900: #33691e !default;\n$material-color-light-green-a100: #ccff90 !default;\n$material-color-light-green-a200: #b2ff59 !default;\n$material-color-light-green-a400: #76ff03 !default;\n$material-color-light-green-a700: #64dd17 !default;\n\n$material-color-lime-050: #f9fbe7 !default;\n$material-color-lime-100: #f0f4c3 !default;\n$material-color-lime-200: #e6ee9c !default;\n$material-color-lime-300: #dce775 !default;\n$material-color-lime-400: #d4e157 !default;\n$material-color-lime-500: #cddc39 !default;\n$material-color-lime-600: #c0ca33 !default;\n$material-color-lime-700: #afb42b !default;\n$material-color-lime-800: #9e9d24 !default;\n$material-color-lime-900: #827717 !default;\n$material-color-lime-a100: #f4ff81 !default;\n$material-color-lime-a200: #eeff41 !default;\n$material-color-lime-a400: #c6ff00 !default;\n$material-color-lime-a700: #aeea00 !default;\n\n$material-color-orange-050: #fff3e0 !default;\n$material-color-orange-100: #ffe0b2 !default;\n$material-color-orange-200: #ffcc80 !default;\n$material-color-orange-300: #ffb74d !default;\n$material-color-orange-400: #ffa726 !default;\n$material-color-orange-500: #ff9800 !default;\n$material-color-orange-600: #fb8c00 !default;\n$material-color-orange-700: #f57c00 !default;\n$material-color-orange-800: #ef6c00 !default;\n$material-color-orange-900: #e65100 !default;\n$material-color-orange-a100: #ffd180 !default;\n$material-color-orange-a200: #ffab40 !default;\n$material-color-orange-a400: #ff9100 !default;\n$material-color-orange-a700: #ff6d00 !default;\n\n$material-color-pink-050: #fce4ec !default;\n$material-color-pink-100: #f8bbd0 !default;\n$material-color-pink-200: #f48fb1 !default;\n$material-color-pink-300: #f06292 !default;\n$material-color-pink-400: #ec407a !default;\n$material-color-pink-500: #e91e63 !default;\n$material-color-pink-600: #d81b60 !default;\n$material-color-pink-700: #c2185b !default;\n$material-color-pink-800: #ad1457 !default;\n$material-color-pink-900: #880e4f !default;\n$material-color-pink-a100: #ff80ab !default;\n$material-color-pink-a200: #ff4081 !default;\n$material-color-pink-a400: #f50057 !default;\n$material-color-pink-a700: #c51162 !default;\n\n$material-color-purple-050: #f3e5f5 !default;\n$material-color-purple-100: #e1bee7 !default;\n$material-color-purple-200: #ce93d8 !default;\n$material-color-purple-300: #ba68c8 !default;\n$material-color-purple-400: #ab47bc !default;\n$material-color-purple-500: #9c27b0 !default;\n$material-color-purple-600: #8e24aa !default;\n$material-color-purple-700: #7b1fa2 !default;\n$material-color-purple-800: #6a1b9a !default;\n$material-color-purple-900: #4a148c !default;\n$material-color-purple-a100: #ea80fc !default;\n$material-color-purple-a200: #e040fb !default;\n$material-color-purple-a400: #d500f9 !default;\n$material-color-purple-a700: #aa00ff !default;\n\n$material-color-red-050: #ffebee !default;\n$material-color-red-100: #ffcdd2 !default;\n$material-color-red-200: #ef9a9a !default;\n$material-color-red-300: #e57373 !default;\n$material-color-red-400: #ef5350 !default;\n$material-color-red-500: #f44336 !default;\n$material-color-red-600: #e53935 !default;\n$material-color-red-700: #d32f2f !default;\n$material-color-red-800: #c62828 !default;\n$material-color-red-900: #b71c1c !default;\n$material-color-red-a100: #ff8a80 !default;\n$material-color-red-a200: #ff5252 !default;\n$material-color-red-a400: #ff1744 !default;\n$material-color-red-a700: #d50000 !default;\n\n$material-color-teal-050: #e0f2f1 !default;\n$material-color-teal-100: #b2dfdb !default;\n$material-color-teal-200: #80cbc4 !default;\n$material-color-teal-300: #4db6ac !default;\n$material-color-teal-400: #26a69a !default;\n$material-color-teal-500: #009688 !default;\n$material-color-teal-600: #00897b !default;\n$material-color-teal-700: #00796b !default;\n$material-color-teal-800: #00695c !default;\n$material-color-teal-900: #004d40 !default;\n$material-color-teal-a100: #a7ffeb !default;\n$material-color-teal-a200: #64ffda !default;\n$material-color-teal-a400: #1de9b6 !default;\n$material-color-teal-a700: #00bfa5 !default;\n\n$material-color-yellow-050: #fffde7 !default;\n$material-color-yellow-100: #fff9c4 !default;\n$material-color-yellow-200: #fff59d !default;\n$material-color-yellow-300: #fff176 !default;\n$material-color-yellow-400: #ffee58 !default;\n$material-color-yellow-500: #ffeb3b !default;\n$material-color-yellow-600: #fdd835 !default;\n$material-color-yellow-700: #fbc02d !default;\n$material-color-yellow-800: #f9a825 !default;\n$material-color-yellow-900: #f57f17 !default;\n$material-color-yellow-a100: #ffff8d !default;\n$material-color-yellow-a200: #ffff00 !default;\n$material-color-yellow-a400: #ffea00 !default;\n$material-color-yellow-a700: #ffd600 !default;\n\n// stylelint-disable scss/dollar-variable-default\n$ambers: () !default;\n$ambers: map-merge(\n (\n 50: $material-color-amber-050,\n 100: $material-color-amber-100,\n 200: $material-color-amber-200,\n 300: $material-color-amber-300,\n 400: $material-color-amber-400,\n 500: $material-color-amber-500,\n 600: $material-color-amber-600,\n 700: $material-color-amber-700,\n 800: $material-color-amber-800,\n 900: $material-color-amber-900,\n a100: $material-color-amber-a100,\n a200: $material-color-amber-a200,\n a400: $material-color-amber-a400,\n a700: $material-color-amber-a700\n ),\n $ambers\n);\n\n$blues: () !default;\n$blues: map-merge(\n (\n 50: $material-color-blue-050,\n 100: $material-color-blue-100,\n 200: $material-color-blue-200,\n 300: $material-color-blue-300,\n 400: $material-color-blue-400,\n 500: $material-color-blue-500,\n 600: $material-color-blue-600,\n 700: $material-color-blue-700,\n 800: $material-color-blue-800,\n 900: $material-color-blue-900,\n a100: $material-color-blue-a100,\n a200: $material-color-blue-a200,\n a400: $material-color-blue-a400,\n a700: $material-color-blue-a700\n ),\n $blues\n);\n\n$blue-greys: () !default;\n$blue-greys: map-merge(\n (\n 50: $material-color-blue-grey-050,\n 100: $material-color-blue-grey-100,\n 200: $material-color-blue-grey-200,\n 300: $material-color-blue-grey-300,\n 400: $material-color-blue-grey-400,\n 500: $material-color-blue-grey-500,\n 600: $material-color-blue-grey-600,\n 700: $material-color-blue-grey-700,\n 800: $material-color-blue-grey-800,\n 900: $material-color-blue-grey-900\n ),\n $blue-greys\n);\n\n$browns: () !default;\n$browns: map-merge(\n (\n 50: $material-color-brown-050,\n 100: $material-color-brown-100,\n 200: $material-color-brown-200,\n 300: $material-color-brown-300,\n 400: $material-color-brown-400,\n 500: $material-color-brown-500,\n 600: $material-color-brown-600,\n 700: $material-color-brown-700,\n 800: $material-color-brown-800,\n 900: $material-color-brown-900\n ),\n $browns\n);\n\n$cyans: () !default;\n$cyans: map-merge(\n (\n 50: $material-color-cyan-050,\n 100: $material-color-cyan-100,\n 200: $material-color-cyan-200,\n 300: $material-color-cyan-300,\n 400: $material-color-cyan-400,\n 500: $material-color-cyan-500,\n 600: $material-color-cyan-600,\n 700: $material-color-cyan-700,\n 800: $material-color-cyan-800,\n 900: $material-color-cyan-900,\n a100: $material-color-cyan-a100,\n a200: $material-color-cyan-a200,\n a400: $material-color-cyan-a400,\n a700: $material-color-cyan-a700\n ),\n $cyans\n);\n\n$deep-oranges: () !default;\n$deep-oranges: map-merge(\n (\n 50: $material-color-deep-orange-050,\n 100: $material-color-deep-orange-100,\n 200: $material-color-deep-orange-200,\n 300: $material-color-deep-orange-300,\n 400: $material-color-deep-orange-400,\n 500: $material-color-deep-orange-500,\n 600: $material-color-deep-orange-600,\n 700: $material-color-deep-orange-700,\n 800: $material-color-deep-orange-800,\n 900: $material-color-deep-orange-900,\n a100: $material-color-deep-orange-a100,\n a200: $material-color-deep-orange-a200,\n a400: $material-color-deep-orange-a400,\n a700: $material-color-deep-orange-a700\n ),\n $deep-oranges\n);\n\n$deep-purples: () !default;\n$deep-purples: map-merge(\n (\n 50: $material-color-deep-purple-050,\n 100: $material-color-deep-purple-100,\n 200: $material-color-deep-purple-200,\n 300: $material-color-deep-purple-300,\n 400: $material-color-deep-purple-400,\n 500: $material-color-deep-purple-500,\n 600: $material-color-deep-purple-600,\n 700: $material-color-deep-purple-700,\n 800: $material-color-deep-purple-800,\n 900: $material-color-deep-purple-900,\n a100: $material-color-deep-purple-a100,\n a200: $material-color-deep-purple-a200,\n a400: $material-color-deep-purple-a400,\n a700: $material-color-deep-purple-a700\n ),\n $deep-purples\n);\n\n$greens: () !default;\n$greens: map-merge(\n (\n 50: $material-color-green-050,\n 100: $material-color-green-100,\n 200: $material-color-green-200,\n 300: $material-color-green-300,\n 400: $material-color-green-400,\n 500: $material-color-green-500,\n 600: $material-color-green-600,\n 700: $material-color-green-700,\n 800: $material-color-green-800,\n 900: $material-color-green-900,\n a100: $material-color-green-a100,\n a200: $material-color-green-a200,\n a400: $material-color-green-a400,\n a700: $material-color-green-a700\n ),\n $greens\n);\n\n$greys: () !default;\n$greys: map-merge(\n (\n 50: $material-color-grey-050,\n 100: $material-color-grey-100,\n 200: $material-color-grey-200,\n 300: $material-color-grey-300,\n 400: $material-color-grey-400,\n 500: $material-color-grey-500,\n 600: $material-color-grey-600,\n 700: $material-color-grey-700,\n 800: $material-color-grey-800,\n 900: $material-color-grey-900\n ),\n $greys\n);\n\n$indigos: () !default;\n$indigos: map-merge(\n (\n 50: $material-color-indigo-050,\n 100: $material-color-indigo-100,\n 200: $material-color-indigo-200,\n 300: $material-color-indigo-300,\n 400: $material-color-indigo-400,\n 500: $material-color-indigo-500,\n 600: $material-color-indigo-600,\n 700: $material-color-indigo-700,\n 800: $material-color-indigo-800,\n 900: $material-color-indigo-900,\n a100: $material-color-indigo-a100,\n a200: $material-color-indigo-a200,\n a400: $material-color-indigo-a400,\n a700: $material-color-indigo-a700\n ),\n $indigos\n);\n\n$light-blues: () !default;\n$light-blues: map-merge(\n (\n 50: $material-color-light-blue-050,\n 100: $material-color-light-blue-100,\n 200: $material-color-light-blue-200,\n 300: $material-color-light-blue-300,\n 400: $material-color-light-blue-400,\n 500: $material-color-light-blue-500,\n 600: $material-color-light-blue-600,\n 700: $material-color-light-blue-700,\n 800: $material-color-light-blue-800,\n 900: $material-color-light-blue-900,\n a100: $material-color-light-blue-a100,\n a200: $material-color-light-blue-a200,\n a400: $material-color-light-blue-a400,\n a700: $material-color-light-blue-a700\n ),\n $light-blues\n);\n\n$light-greens: () !default;\n$light-greens: map-merge(\n (\n 50: $material-color-light-green-050,\n 100: $material-color-light-green-100,\n 200: $material-color-light-green-200,\n 300: $material-color-light-green-300,\n 400: $material-color-light-green-400,\n 500: $material-color-light-green-500,\n 600: $material-color-light-green-600,\n 700: $material-color-light-green-700,\n 800: $material-color-light-green-800,\n 900: $material-color-light-green-900,\n a100: $material-color-light-green-a100,\n a200: $material-color-light-green-a200,\n a400: $material-color-light-green-a400,\n a700: $material-color-light-green-a700\n ),\n $light-greens\n);\n\n$limes: () !default;\n$limes: map-merge(\n (\n 50: $material-color-lime-050,\n 100: $material-color-lime-100,\n 200: $material-color-lime-200,\n 300: $material-color-lime-300,\n 400: $material-color-lime-400,\n 500: $material-color-lime-500,\n 600: $material-color-lime-600,\n 700: $material-color-lime-700,\n 800: $material-color-lime-800,\n 900: $material-color-lime-900,\n a100: $material-color-lime-a100,\n a200: $material-color-lime-a200,\n a400: $material-color-lime-a400,\n a700: $material-color-lime-a700\n ),\n $limes\n);\n\n$oranges: () !default;\n$oranges: map-merge(\n (\n 50: $material-color-orange-050,\n 100: $material-color-orange-100,\n 200: $material-color-orange-200,\n 300: $material-color-orange-300,\n 400: $material-color-orange-400,\n 500: $material-color-orange-500,\n 600: $material-color-orange-600,\n 700: $material-color-orange-700,\n 800: $material-color-orange-800,\n 900: $material-color-orange-900,\n a100: $material-color-orange-a100,\n a200: $material-color-orange-a200,\n a400: $material-color-orange-a400,\n a700: $material-color-orange-a700\n ),\n $oranges\n);\n\n$pinks: () !default;\n$pinks: map-merge(\n (\n 50: $material-color-pink-050,\n 100: $material-color-pink-100,\n 200: $material-color-pink-200,\n 300: $material-color-pink-300,\n 400: $material-color-pink-400,\n 500: $material-color-pink-500,\n 600: $material-color-pink-600,\n 700: $material-color-pink-700,\n 800: $material-color-pink-800,\n 900: $material-color-pink-900,\n a100: $material-color-pink-a100,\n a200: $material-color-pink-a200,\n a400: $material-color-pink-a400,\n a700: $material-color-pink-a700\n ),\n $pinks\n);\n\n$purples: () !default;\n$purples: map-merge(\n (\n 50: $material-color-purple-050,\n 100: $material-color-purple-100,\n 200: $material-color-purple-200,\n 300: $material-color-purple-300,\n 400: $material-color-purple-400,\n 500: $material-color-purple-500,\n 600: $material-color-purple-600,\n 700: $material-color-purple-700,\n 800: $material-color-purple-800,\n 900: $material-color-purple-900,\n a100: $material-color-purple-a100,\n a200: $material-color-purple-a200,\n a400: $material-color-purple-a400,\n a700: $material-color-purple-a700\n ),\n $purples\n);\n\n$reds: () !default;\n$reds: map-merge(\n (\n 50: $material-color-red-050,\n 100: $material-color-red-100,\n 200: $material-color-red-200,\n 300: $material-color-red-300,\n 400: $material-color-red-400,\n 500: $material-color-red-500,\n 600: $material-color-red-600,\n 700: $material-color-red-700,\n 800: $material-color-red-800,\n 900: $material-color-red-900,\n a100: $material-color-red-a100,\n a200: $material-color-red-a200,\n a400: $material-color-red-a400,\n a700: $material-color-red-a700\n ),\n $reds\n);\n\n$teals: () !default;\n$teals: map-merge(\n (\n 50: $material-color-teal-050,\n 100: $material-color-teal-100,\n 200: $material-color-teal-200,\n 300: $material-color-teal-300,\n 400: $material-color-teal-400,\n 500: $material-color-teal-500,\n 600: $material-color-teal-600,\n 700: $material-color-teal-700,\n 800: $material-color-teal-800,\n 900: $material-color-teal-900,\n a100: $material-color-teal-a100,\n a200: $material-color-teal-a200,\n a400: $material-color-teal-a400,\n a700: $material-color-teal-a700\n ),\n $teals\n);\n\n$yellows: () !default;\n$yellows: map-merge(\n (\n 50: $material-color-yellow-050,\n 100: $material-color-yellow-100,\n 200: $material-color-yellow-200,\n 300: $material-color-yellow-300,\n 400: $material-color-yellow-400,\n 500: $material-color-yellow-500,\n 600: $material-color-yellow-600,\n 700: $material-color-yellow-700,\n 800: $material-color-yellow-800,\n 900: $material-color-yellow-900,\n a100: $material-color-yellow-a100,\n a200: $material-color-yellow-a200,\n a400: $material-color-yellow-a400,\n a700: $material-color-yellow-a700\n ),\n $yellows\n);\n\n$colors: () !default;\n$colors: map-merge(\n (\n 'amber': $material-color-amber-500,\n 'blue': $material-color-blue-500,\n 'blue-grey': $material-color-blue-grey-500,\n 'brown': $material-color-brown-500,\n 'cyan': $material-color-cyan-500,\n 'deep-orange': $material-color-deep-orange-500,\n 'deep-purple': $material-color-deep-purple-500,\n 'green': $material-color-green-500,\n 'grey': $material-color-grey-500,\n 'indigo': $material-color-indigo-500,\n 'light-blue': $material-color-light-blue-500,\n 'light-green': $material-color-light-green-500,\n 'lime': $material-color-lime-500,\n 'orange': $material-color-orange-500,\n 'pink': $material-color-pink-500,\n 'purple': $material-color-purple-500,\n 'red': $material-color-red-500,\n 'teal': $material-color-teal-500,\n 'yellow': $material-color-yellow-500\n ),\n $colors\n);\n// stylelint-enable\n\n// Black and white\n// Based on https://material.google.com/style/color.html#color-text-background-colors\n\n$black: #000000 !default;\n\n$black-primary-opacity: 0.87 !default;\n$black-secondary-opacity: 0.54 !default;\n$black-hint-opacity: 0.38 !default;\n$black-divider-opacity: 0.12 !default;\n\n$black-primary: rgba(red($black), green($black), blue($black), $black-primary-opacity) !default;\n$black-secondary: rgba(red($black), green($black), blue($black), $black-secondary-opacity) !default;\n$black-hint: rgba(red($black), green($black), blue($black), $black-hint-opacity) !default;\n$black-divider: rgba(red($black), green($black), blue($black), $black-divider-opacity) !default;\n\n$white: #ffffff !default;\n\n$white-primary-opacity: 1 !default;\n$white-secondary-opacity: 0.7 !default;\n$white-hint-opacity: 0.5 !default;\n$white-divider-opacity: 0.12 !default;\n\n$white-primary: rgba(red($white), green($white), blue($white), $white-primary-opacity) !default;\n$white-secondary: rgba(red($white), green($white), blue($white), $white-secondary-opacity) !default;\n$white-hint: rgba(red($white), green($white), blue($white), $white-hint-opacity) !default;\n$white-divider: rgba(red($white), green($white), blue($white), $white-divider-opacity) !default;\n\n// Theme\n// Based on https://material.google.com/style/color.html#color-themes\n\n$dark-theme-1: #000000 !default;\n$dark-theme-2: $material-color-grey-900 !default;\n$dark-theme-3: #303030 !default;\n$dark-theme-4: $material-color-grey-800 !default;\n\n$light-theme-1: $material-color-grey-300 !default;\n$light-theme-2: $material-color-grey-100 !default;\n$light-theme-3: $material-color-grey-050 !default;\n$light-theme-4: #ffffff !default;\n","$border-color: $black-divider !default;\n$border-color-solid: #e1e1e1 !default;\n$border-radius: 2px !default;\n$border-width: 1px !default;\n\n$sizes: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$sizes: map-merge(\n (\n 25: 25%,\n 50: 50%,\n 75: 75%,\n 100: 100%,\n auto: auto\n ),\n $sizes\n);\n\n$spacer: 1rem !default;\n\n$spacer-xs: ($spacer * 0.25) !default;\n$spacer-sm: ($spacer * 0.5) !default;\n$spacer-lg: ($spacer * 1.5) !default;\n$spacer-xl: ($spacer * 3) !default;\n\n$spacers: () !default;\n// stylelint-disable-next-line scss/dollar-variable-default\n$spacers: map-merge(\n (\n 0: 0,\n 1: $spacer-xs,\n 2: $spacer-sm,\n 3: $spacer,\n 4: $spacer-lg,\n 5: $spacer-xl\n ),\n $spacers\n);\n","// A base value used to responsively scale all typography, applied to the `<html>` element\n\n$font-size-root: 16px !default;\n\n// Font face\n// Based on https://material.google.com/style/typography.html#typography-typeface\n\n// N.B. Although some values are not used in this project\n// we leave them here just in case they may be required by your project\n\n// stylelint-disable value-keyword-case\n$font-family-monospace: 'Roboto Mono', Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace !default;\n$font-family-sans-serif: Roboto, -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !default;\n$font-family-serif: 'Roboto Slab', Georgia, 'Times New Roman', Times, serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !default;\n// stylelint-enable\n\n$font-family-base: $font-family-sans-serif !default;\n\n$font-weight-medium: 500 !default;\n$font-weight-regular: 400 !default;\n$font-weight-light: 300 !default;\n\n$font-weight-base: $font-weight-regular !default;\n\n// Font styles\n// Based on https://material.google.com/style/typography.html#typography-styles\n\n$font-size-base: 0.875rem !default; // 14px\n\n$font-size-display-4: ($font-size-base * 8) !default; // 112px\n$font-size-display-3: ($font-size-base * 4) !default; // 56px\n$font-size-display-2: ($font-size-base * 3.214286) !default; // 45px\n$font-size-display-1: ($font-size-base * 2.428571) !default; // 34px\n$font-size-headline: ($font-size-base * 1.714286) !default; // 24px\n$font-size-title: ($font-size-base * 1.428571) !default; // 20px\n$font-size-subheading: ($font-size-base * 1.142857) !default; // 16px\n$font-size-body-2: ($font-size-base * 1) !default; // 14px\n$font-size-body-1: ($font-size-base * 1) !default; // 14px\n$font-size-caption: ($font-size-base * 0.857143) !default; // 12px\n\n$font-weight-display-4: $font-weight-light !default;\n$font-weight-display-3: $font-weight-regular !default;\n$font-weight-display-2: $font-weight-regular !default;\n$font-weight-display-1: $font-weight-regular !default;\n$font-weight-headline: $font-weight-regular !default;\n$font-weight-title: $font-weight-medium !default;\n$font-weight-subheading: $font-weight-regular !default;\n$font-weight-body-2: $font-weight-medium !default;\n$font-weight-body-1: $font-weight-regular !default;\n$font-weight-caption: $font-weight-regular !default;\n\n$letter-spacing-display-4: -0.04em !default;\n$letter-spacing-display-3: -0.02em !default;\n$letter-spacing-display-2: 0 !default;\n$letter-spacing-display-1: 0 !default;\n$letter-spacing-headline: 0 !default;\n$letter-spacing-title: 0.02em !default;\n$letter-spacing-subheading: 0.04em !default;\n$letter-spacing-body-2: 0 !default;\n$letter-spacing-body-1: 0 !default;\n$letter-spacing-caption: 0 !default;\n\n// Line height\n// Based on https://material.google.com/style/typography.html#typography-line-height\n\n$line-height-base: 1.428572 !default;\n\n$line-height-display-4: 1 !default; // 112px\n$line-height-display-3: 1.035715 !default; // 58px\n$line-height-display-2: 1.066667 !default; // 48px\n$line-height-display-1: 1.176471 !default; // 40px\n$line-height-headline: 1.333334 !default; // 32px\n$line-height-title: 1.4 !default; // 28px\n$line-height-subheading: 1.5 !default; // 24px\n$line-height-body-2: 1.428572 !default; // 20px\n$line-height-body-1: 1.428572 !default; // 20px\n$line-height-caption: 1.5 !default; // 18px\n\n// Material icons default size\n\n$material-icon-size: (24 / strip-unit($font-size-root) * 1rem) !default;\n","// Button (Bootstrap button)\n// Based on https://material.google.com/components/buttons.html#buttons-style\n\n// N.B. Material design only specifies specs for default button (.btn) and dense button (.btn-sm)\n\n$btn-bg-active: rgba(153, 153, 153, 0.4) !default;\n$btn-bg-active-inverse: rgba(204, 204, 204, 0.25) !default;\n$btn-bg-disabled: $black-divider !default;\n$btn-bg-disabled-inverse: $white-divider !default;\n$btn-border-radius: $border-radius !default;\n$btn-block-margin-y: $spacer-xs !default;\n$btn-color: $black-primary !default;\n$btn-color-disabled: rgba(0, 0, 0, 0.26) !default;\n$btn-color-disabled-inverse: rgba(255, 255, 255, 0.3) !default;\n$btn-elevation-shadow: map-get($elevation-shadows, 2) !default;\n$btn-elevation-shadow-active: map-get($elevation-shadows, 8) !default;\n$btn-font-weight: $font-weight-medium !default;\n$btn-line-height: 1 !default;\n$btn-min-width: 5.5rem !default;\n$btn-overlay: $black-divider !default;\n$btn-overlay-inverse: $white-divider !default;\n\n$btn-font-size: 0.875rem !default;\n$btn-font-size-lg: 0.9375rem !default;\n$btn-font-size-sm: 0.8125rem !default;\n$btn-height: 2.25rem !default;\n$btn-height-lg: 2.5rem !default;\n$btn-height-sm: 2rem !default;\n$btn-padding-x: 1rem !default;\n$btn-padding-x-lg: $btn-padding-x !default;\n$btn-padding-x-sm: $btn-padding-x !default;\n$btn-padding-y: (($btn-height - $btn-font-size * $btn-line-height) / 2) !default;\n$btn-padding-y-lg: (($btn-height-lg - $btn-font-size-lg * $btn-line-height) / 2) !default;\n$btn-padding-y-sm: (($btn-height-sm - $btn-font-size-sm * $btn-line-height) / 2) !default;\n\n// Button: floating action button\n// Based on https://material.google.com/components/buttons-floating-action-button.html#buttons-floating-action-button-floating-action-button\n\n$btn-float-dropdown-inner-spacer-y: 1rem !default;\n$btn-float-elevation-shadow: map-get($elevation-s