@govbr-ds/core/dist/components/accordion/accordion.min.css.map

Padrão Digital de Governo

{"version":3,"file":"components/accordion/accordion.min.css","mappings":"AAGA,cACE,2BACA,8CAFF,CAIE,oBACE,kDACA,YAAa,CACb,qBAFJ,CAII,4BACE,eAFN,CAIM,oCACE,wCAFR,CAKM,qCACE,kDACA,aAHR,CAQE,sBACE,sBAAuB,CACvB,2BACA,QAAS,CACT,wBAAyB,CACzB,YAAa,CACb,uCACA,6BAA8B,CAC9B,YAAa,CACb,kCACA,eAAgB,CAChB,oBAAqB,CACrB,UANJ,CAQI,4BACE,6DANN,CASI,6BACE,MAAO,CACP,QAPN,CCjCE,4BACE,YDmCJ,CChCE,wEAEE,0BAA2B,CAC3B,kCAAmC,CACnC,gCAAiC,CACjC,gCDiCJ,CExCI,2CACE,qHF0CN,CACE,uBACE,wBACA,YAAa,CACb,sCACA,mCACA,iFACJ,CAEM,mCACE,eAAR,CAKE,wBG3CA,0BACA,kCACA,+BACA,sCACA,8CACA,8BACA,0BACA,8BACA,sCACA,gCHoCE,iCAMJ","sources":["webpack://core/./src/components/accordion/_accordion.scss","webpack://core/./src/partial/scss/mixins/_focus.scss","webpack://core/./src/partial/scss/mixins/_hover.scss","webpack://core/./src/partial/scss/mixins/_states.scss"],"sourcesContent":["@use \"sass:math\";\n @import \"../../partial/scss/base\";\n \n.#{$prefix}accordion {\n  background: v(bg-color);\n  border-top: 1px solid v(color-secondary-04);\n\n  .item {\n    border-bottom: 1px solid v(color-secondary-04);\n    display: flex;\n    flex-direction: column;\n\n    &[active] {\n      border-bottom: 0;\n\n      .header {\n        font-weight: v(font-weight-semi-bold);\n      }\n\n      + .content {\n        border-bottom: 1px solid v(color-secondary-04);\n        display: block;\n      }\n    }\n  }\n\n  .header {\n    --bg-color: transparent;\n    background: v(bg-color);\n    border: 0;\n    color: var(--interactive);\n    display: flex;\n    font-size: v(font-size-scale-up-01);\n    justify-content: space-between;\n    outline: none;\n    padding: v(spacing-scale-2x) 0;\n    text-align: left;\n    text-decoration: none;\n    width: 100%;\n\n    .icon {\n      margin: 0 v(spacing-scale-2x) 0 v(spacing-scale-baseh);\n    }\n\n    .title {\n      flex: 1;\n      margin: 0;\n    }\n    @include focus;\n    @include hover;\n  }\n\n  .content {\n    color: v(text-color);\n    display: none;\n    font-size: v(font-size-scale-base);\n    margin: 0 v(spacing-scale-base);\n    padding: v(spacing-scale-base) v(spacing-scale-8x) v(spacing-scale-2x);\n\n    * {\n      &:last-child {\n        margin-bottom: 0;\n      }\n    }\n  }\n\n  &[negative] {\n    @include dark-mode;\n    --bg-color: var(--background-dark);\n  }\n}\n","/// Aplica foco: feedback ao navegar por teclado no elemento\n/// @example scss - Uso prático\n///  a {\n///    @include focus;\n///  }\n@mixin focus {\n  &:focus {\n    outline: none;\n  }\n\n  &.focus-visible,\n  &:focus-visible {\n    outline-color: var(--focus);\n    outline-offset: var(--focus-offset);\n    outline-style: var(--focus-style);\n    outline-width: var(--focus-width);\n  }\n}\n\n/// Aplica foco tênue\n/// @example scss - Uso prático\n///  input {\n///    &:focus,\n///    &:focus-visible,\n///    &.focus-visible {\n///      @include focus-soft;\n///    }\n///  }\n@mixin focus-soft {\n  border-color: var(--focus) !important;\n  box-shadow: 0 0 0 var(--surface-width-md) var(--focus);\n  outline: none;\n}\n","/// Aplica hover: feedback ao colocar o cursor no elemento\n/// @param {String} $color [\"interactive\"] - Cor do hover **(Opcional)**\n/// @example scss - Uso prático\n///  a {\n///    @include hover;\n///  }\n@mixin hover($color: \"interactive\") {\n  &:not(:disabled) {\n    &:hover {\n      background-image: linear-gradient(\n        rgba(var(--#{$color}-rgb), var(--hover)),\n        rgba(var(--#{$color}-rgb), var(--hover))\n      );\n    }\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":[],"ignoreList":[],"sourceRoot":""}