@govbr-ds/core
Version:
Padrão Digital de Governo
1 lines • 6.37 kB
Source Map (JSON)
{"version":3,"file":"components/message/message.min.css","mappings":"AAKA,YCQE,sCAAuC,CACvC,iCAAkC,CAClC,uCAAwC,CACxC,2BAA4B,CAI5B,oCAAqC,CACrC,YAAa,CACb,qCDdF,CCgBE,qBACE,yBAA0B,CAC1B,MAAO,CACP,sCAAuC,CACvC,yGDdJ,CCgBI,oCACE,wCDdN,CCiBI,mCACE,sCDfN,CCkBI,uBACE,mCAAoC,CACpC,yBDhBN,CCoBM,iCACE,eDlBR,CCuBE,kBACE,kBAAmB,CACnB,+BAAgC,CAChC,YAAa,CACb,sBAAuB,CACvB,6DAA8D,CAC9D,oCAAqC,CACrC,qCDrBJ,CCuBI,2BACE,cDrBN,CCyBE,mBACE,sCAAuC,CACvC,oCDvBJ,CCsDI,gEAGE,gDACA,qCACA,mCDtDN,CCyDQ,sHACE,uCAAwC,CACxC,oCDvDV,CC6CI,6DAGE,+CACA,oCACA,kCD7CN,CCgDQ,mHACE,uCAAwC,CACxC,mCD9CV,CCoCI,uDAGE,6CACA,kCACA,gCDpCN,CCuCQ,6GACE,uCAAwC,CACxC,iCDrCV,CC2CE,gEAGE,+CAAgD,CAChD,oCD3CJ,CC8CM,sHACE,0BAA2B,CAC3B,kCD5CR,CArEA,UCIE,sCAAuC,CACvC,iCAAkC,CAClC,uCAAwC,CACxC,2BAA4B,CAuD5B,kBAAmB,CACnB,qCAAsC,CACtC,yBAA0B,CAC1B,mBAAoB,CACpB,iBAAkB,CAClB,qCAAsC,CACtC,eAAgB,CAChB,iCDeF,CEtFE,mHD0EE,sCDqBJ,CClBE,wDACE,4BDoBJ,CCjBE,0DE1CA,2BACA,mCACA,gCACA,uCACA,+CACA,+BACA,2BACA,+BACA,uCACA,gCH8DF,CCpBI,0DAGE,gDACA,qCACA,mCDoBN,CCjBQ,gHACE,uCAAwC,CACxC,oCDmBV,CC7BI,uDAGE,+CACA,oCACA,kCD6BN,CC1BQ,6GACE,uCAAwC,CACxC,mCD4BV,CCtCI,iDAGE,6CACA,kCACA,gCDsCN,CCnCQ,uGACE,uCAAwC,CACxC,iCDqCV,CC/BE,0DAGE,+CAAgD,CAChD,oCD+BJ,CC5BM,gHACE,0BAA2B,CAC3B,kCD8BR","sources":["webpack://core/./src/components/message/_message.scss","webpack://core/./src/components/message/_mixins.scss","webpack://core/./src/partial/scss/mixins/_icons.scss","webpack://core/./src/partial/scss/mixins/_states.scss"],"sourcesContent":["@use \"sass:math\";\n @import \"../../partial/scss/base\";\n \n@import \"mixins\";\n\n.#{$prefix}message {\n @include message-configs;\n}\n\n.feedback {\n @include feedback-configs;\n}\n","@mixin message-configs {\n @include message-tokens;\n @include message-default;\n @include message-colors;\n}\n\n@mixin feedback-configs {\n @include message-tokens;\n @include feedback-default;\n @include message-colors;\n}\n\n@mixin message-tokens {\n --message-background: var(--background);\n --message-color-icon: var(--color);\n --feedback-background: var(--background);\n --message-text: var(--color);\n}\n\n@mixin message-default {\n background: var(--message-background);\n display: flex;\n margin-bottom: var(--spacing-scale-2x);\n\n .content {\n color: var(--message-text);\n flex: 1;\n font-size: var(--font-size-scale-up-01);\n padding: var(--spacing-scale-3x) var(--spacing-scale-base) var(--spacing-scale-3x) var(--spacing-scale-2x);\n\n .message-title {\n font-weight: var(--font-weight-semi-bold);\n }\n\n .message-body {\n font-weight: var(--font-weigth-regular);\n }\n\n a {\n font-weight: var(--font-weight-bold);\n text-decoration: underline;\n }\n\n * {\n &:last-child {\n margin-bottom: 0;\n }\n }\n }\n\n .icon {\n align-items: center;\n color: var(--message-color-icon);\n display: flex;\n justify-content: center;\n margin: var(--spacing-vertical-center) var(--spacing-scale-2x);\n padding-left: var(--spacing-scale-2x);\n padding-right: var(--spacing-scale-2x);\n\n + .content {\n padding-left: 0;\n }\n }\n\n .close {\n margin-right: var(--spacing-scale-base);\n margin-top: var(--spacing-scale-base);\n }\n}\n\n@mixin feedback-default {\n align-items: center;\n background: var(--feedback-background);\n color: var(--message-text);\n display: inline-flex;\n font-style: italic;\n font-weight: var(--font-weight-medium);\n margin-bottom: 0;\n padding: var(--spacing-scale-half);\n\n @include icon {\n margin-right: var(--spacing-scale-half);\n }\n\n &:not(.is-warning):not(.warning):not([warning]) {\n --message-text: var(--pure-0);\n }\n\n &.is-warning,\n &.warning,\n &[warning] {\n @include light-mode;\n }\n}\n\n@mixin message-colors {\n @each $color in success, danger, info {\n &.is-#{$color},\n &.#{$color},\n &[#{$color}] {\n --message-background: var(--#{$color}-alternative);\n --feedback-background: var(--#{$color});\n --message-color-icon: var(--#{$color});\n\n .close {\n .#{$prefix}button {\n --interactive: var(--message-color-icon);\n --interactive-rgb: var(--#{$color}-rgb);\n }\n }\n }\n }\n\n &.is-warning,\n &.warning,\n &[warning] {\n --message-background: var(--warning-alternative);\n --feedback-background: var(--warning);\n\n .close {\n .#{$prefix}button {\n --interactive: var(--color);\n --interactive-rgb: var(--color-rgb);\n }\n }\n }\n}\n","@mixin icon-size($value) {\n @include icon {\n --icon-size: #{$value};\n }\n}\n\n@mixin icon {\n .svg-inline--fa,\n .fa,\n .fab,\n .fad,\n .fal,\n .far,\n .fas {\n @content;\n }\n}\n","// Desabilitado\n@mixin disabled {\n cursor: not-allowed;\n opacity: var(--disabled);\n\n * {\n pointer-events: none;\n }\n}\n\n// Dark mode\n@mixin dark-mode(\n $color: \"color-dark\",\n $color-rgb: \"color-dark-rgb\",\n $text-color: $color,\n $interactive: \"interactive-dark\",\n $interactive-rgb: \"interactive-dark-rgb\",\n $visited: \"visited-dark\",\n $hover: \"hover-dark\",\n $pressed: \"pressed-dark\",\n $focus-color: \"focus-color-dark\",\n $focus: $focus-color\n) {\n --color: var(--#{$color});\n --color-rgb: var(--#{$color-rgb});\n --text-color: var(--#{$text-color});\n --interactive: var(--#{$interactive});\n --interactive-rgb: var(--#{$interactive-rgb});\n --visited: var(--#{$visited});\n --hover: var(--#{$hover});\n --pressed: var(--#{$pressed});\n --focus-color: var(--#{$focus-color});\n --focus: var(--#{$focus});\n}\n@mixin light-mode(\n $color: \"color-light\",\n $color-rgb: \"color-light-rgb\",\n $text-color: $color,\n $interactive: \"interactive-light\",\n $interactive-rgb: \"interactive-light-rgb\",\n $visited: \"visited-light\",\n $hover: \"hover-light\",\n $pressed: \"pressed-light\",\n $focus-color: \"focus-color-light\",\n $focus: $focus-color\n) {\n --color: var(--#{$color});\n --color-rgb: var(--#{$color-rgb});\n --text-color: var(--#{$text-color});\n --interactive: var(--#{$interactive});\n --interactive-rgb: var(--#{$interactive-rgb});\n --visited: var(--#{$visited});\n --hover: var(--#{$hover});\n --pressed: var(--#{$pressed});\n --focus-color: var(--#{$focus-color});\n --focus: var(--#{$focus});\n}\n"],"names":[],"sourceRoot":""}