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

Padrão Digital de Governo

{"version":3,"file":"components/cookiebar/cookiebar.min.css","mappings":"AAKA,cCGE,8CAA+C,CAC/C,wCAAyC,CACzC,QAAS,CACT,kCAAmC,CACnC,gCACA,cAAe,CACf,mBAAoB,CACpB,uCACA,MAAO,CACP,YAAa,CACb,cAAe,CACf,OAAQ,CACR,KAAM,CACN,8BDNF,CEDE,yBDWM,4CACE,oCDPR,CACF,CEUE,yBFzBF,cC2BI,wCDRF,CCYM,0CACE,sCDVR,CCaM,4CACE,uCACA,cDXR,CCkBM,6DACE,eDhBR,CCkBQ,+DACE,sCDhBV,CC0CE,2NAEE,wCD5BJ,CACF,CC+BE,sBACE,SD7BJ,CC+BI,qCACE,YD7BN,CCgCI,iCACE,aD9BN,CCqCI,iFACE,YDhCN,CCoCM,yCACE,wCDlCR,CCqCM,yCACE,gBDnCR,CCuCI,+BACE,YDrCN,CCwCI,6CACE,gDDtCN,CC0CE,mBACE,UAAW,CACX,UDxCJ,CC2CE,0BACE,eDzCJ,CC4CE,uBACE,YAAa,CACb,qBAAsB,CACtB,iBAAkB,CAClB,yBD1CJ,CC6CE,yBACE,YAAa,CACb,0CD3CJ,CC+CI,+CACE,uCACA,eAAgB,CAChB,cAAe,CACf,gBAAiB,CACjB,UD7CN,CCgDI,sCACE,qCACA,SD9CN,CCgDM,kDACE,uBAAwB,CACxB,QAAS,CACT,UAAW,CACX,MAAO,CACP,oBAAqB,CACrB,iBAAkB,CAClB,OAAQ,CACR,KD9CR,CCkDI,4CACE,sCACA,wCDhDN,CCkDM,iDACE,oBAAqB,CACrB,qCDhDR,CCqDE,6BACE,MAAO,CACP,QAAS,CACT,cDnDJ,CCqDI,mCACE,YDnDN,CCsDI,+CACE,YAAa,CACb,eAAgB,CAChB,8BDpDN,CCuDI,0HAEE,gBDrDN,CCyDM,8CACE,aDvDR,CC0DU,oEACE,cDxDZ,CCgEI,uCACE,oCD9DN,CCkEE,mFAGE,kCAAmC,CACnC,cDhEJ,CCqEM,gDACE,cDnER,CCuEI,8BACE,eDrEN,CCwEI,sCACE,oBDtEN,CCyEI,mCEnMF,2BACA,mCACA,gCACA,uCACA,+CACA,+BACA,2BACA,+BACA,uCACA,iCF4LI,kCD9DN,CCiEI,qCACE,kCD/DN,CCqEI,2EACE,qCAAsC,CACtC,kCAAmC,CACnC,kCACA,WDlEN,CCqEI,+EACE,uCACA,WDlEN,CCsEE,6BACE,6BACA,wCDpEJ,CCwEI,oCACE,gCDtEN,CC+EI,2EACE,wCD1EN,CC8EE,uBACE,+CACA,qCACA,uCACA,mCD5EJ,CC+EE,qCACE,mCD7EJ,CCgFE,iCACE,eD9EJ,CCkFI,8CACE,oBDhFN,CC/NE,wBACE,8BDiOJ","sources":["webpack://core/./src/components/cookiebar/_cookiebar.scss","webpack://core/./src/components/cookiebar/_mixins.scss","webpack://core/./src/partial/scss/mixins/_grid.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}cookiebar {\n  @include cookiebar-configs;\n  @include cookiebar-modal;\n}\n","@mixin cookiebar-modal {\n  .#{$prefix}modal {\n    --modal-size: var(--modal-auto);\n  }\n}\n\n// TODO: Remover customizações internas de outros componentes\n@mixin cookiebar-configs {\n  --cookiebar-shadow: var(--surface-shadow-lg-up);\n  --cookiebar-layer: var(--z-index-layer-4);\n  bottom: 0;\n  box-shadow: var(--cookiebar-shadow);\n  color: v(color-secondary-08);\n  cursor: default;\n  font-family: inherit;\n  font-size: v(font-size-scale-up-01);\n  left: 0;\n  outline: none;\n  position: fixed;\n  right: 0;\n  top: 0;\n  z-index: var(--cookiebar-layer);\n  @include media-breakpoint-up(sm) {\n    .actions {\n      .br-button {\n        &.secondary {\n          margin-right: v(spacing-scale-5x);\n        }\n      }\n    }\n  }\n  @include media-breakpoint-down(xs) {\n    font-size: v(font-size-scale-down-01);\n\n    .actions {\n      .br-button {\n        &.primary {\n          margin-bottom: v(spacing-scale-2xh);\n        }\n\n        &.secondary {\n          margin-bottom: v(spacing-scale-2xh);\n          margin-right: 0;\n        }\n      }\n    }\n\n    .br-modal-header {\n      &.entry-content {\n        .br-modal-title {\n          margin-bottom: 0;\n\n          p {\n            font-size: v(font-size-scale-up-02);\n          }\n        }\n\n        .last-update {\n          font-size: v(font-size-scale-down-01);\n        }\n      }\n    }\n\n    .group-description {\n      font-size: v(font-size-scale-down-01);\n    }\n\n    .br-switch {\n      label {\n        font-size: v(font-size-scale-down-01);\n      }\n\n      .switch-data {\n        &::before {\n          font-size: v(font-size-scale-down-01);\n        }\n      }\n    }\n\n    .group-name,\n    .group-size {\n      font-size: v(font-size-scale-down-01);\n    }\n  }\n\n  &.default {\n    top: unset;\n\n    .entry-content {\n      display: none;\n    }\n\n    .info-text {\n      display: block;\n    }\n\n    .main-content {\n      display: none;\n    }\n\n    .complementary-content {\n      display: none;\n    }\n\n    .br-modal {\n      > .br-card {\n        --card-shadow: var(--surface-offset-none);\n      }\n\n      .wrapper {\n        overflow-y: unset;\n      }\n    }\n\n    .actions {\n      border-top: 0;\n    }\n\n    .container-fluid.p-2xh {\n      padding-bottom: var(--spacing-scale-3x) !important;\n    }\n  }\n\n  .row {\n    float: none;\n    width: auto;\n  }\n\n  .entry-text {\n    margin-bottom: 0;\n  }\n\n  .wrapper {\n    display: flex;\n    flex-direction: column;\n    overflow-y: scroll;\n    padding-top: 6px !important;\n  }\n\n  .info-text {\n    display: none;\n    line-height: v(font-line-height-medium);\n  }\n\n  .br-modal-header {\n    .br-modal-title {\n      font-size: v(font-size-scale-up-06);\n      margin-bottom: 0;\n      margin-right: 0;\n      max-height: unset;\n      width: auto;\n    }\n\n    .close {\n      margin-top: v(spacing-scale-base);\n      opacity: 1;\n\n      &:hover::after {\n        background: currentColor;\n        bottom: 0;\n        content: \"\";\n        left: 0;\n        opacity: var(--hover);\n        position: absolute;\n        right: 0;\n        top: 0;\n      }\n    }\n\n    .last-update {\n      font-size: v(font-size-scale-base);\n      font-weight: v(font-weight-semi-bold);\n\n      span {\n        display: inline-block;\n        margin-left: v(spacing-scale-half);\n      }\n    }\n  }\n\n  .br-modal-body {\n    flex: 1;\n    margin: 0;\n    overflow: unset;\n\n    &:focus {\n      outline: none;\n    }\n\n    .br-list .br-list {\n      max-height: 0;\n      overflow: hidden;\n      transition: all 400ms ease-in-out;\n    }\n\n    .br-list .br-item.open + .br-list,\n    .br-list .br-item.open .br-list {\n      max-height: 200em;\n    }\n\n    .br-list {\n      .header {\n        display: block;\n\n        .row {\n          div:nth-child(2) {\n            flex: 0 0 185px;\n          }\n        }\n      }\n    }\n  }\n\n  .br-modal-footer {\n    &.actions {\n      padding-top: var(--spacing-scale-2xh);\n    }\n  }\n\n  .group-name,\n  .cookies-checked,\n  .group-size {\n    color: var(--color-primary-default);\n    cursor: pointer;\n  }\n\n  .group-info {\n    .row {\n      div:nth-child(2) {\n        flex: 0 0 225px;\n      }\n    }\n\n    .fa {\n      font-weight: 900;\n    }\n\n    .group-size {\n      display: inline-block;\n    }\n\n    &.selected {\n      @include light-mode;\n      background-color: var(--background);\n    }\n\n    .br-button {\n      color: v(color-primary-default);\n    }\n  }\n\n  .group-info,\n  .cookie-info {\n    .br-switch {\n      margin-bottom: var(--spacing-scale-2x);\n      margin-top: var(--spacing-scale-2x);\n      padding: v(spacing-scale-half);\n      width: 120px;\n    }\n\n    .fixed-width {\n      padding-left: v(spacing-scale-base);\n      width: 100px;\n    }\n  }\n\n  .always-active {\n    color: v(color-highlight);\n    font-weight: v(font-weight-semi-bold);\n  }\n\n  .cookie-info {\n    .br-card {\n      margin-bottom: var(--card-margin);\n    }\n\n    .cookie-term {\n      font-weight: v(font-weight-semi-bold);\n    }\n  }\n\n  .notes {\n    p:first-child {\n      font-weight: v(font-weight-semi-bold);\n    }\n  }\n\n  .actions {\n    border-top: 1px solid v(color-secondary-05);\n    padding-left: v(spacing-scale-3x);\n    padding-right: v(spacing-scale-2xh);\n    padding-top: v(spacing-scale-3x);\n  }\n\n  .complementary-content {\n    padding: v(spacing-scale-base) 0;\n  }\n\n  [class^=\"container\"] {\n    --grid-margin: 0;\n  }\n\n  .#{$prefix}checkbox {\n    &:not(.hidden-label) {\n      --item-padding-y: 1px;\n    }\n  }\n}\n","// Dependência para calcular divisão\n@use \"sass:math\";\n\n/// Aplica os estilos **a partir** do breakpoint informado\n/// @group 02\n/// @param {String} $breakpoint - **Usar**: xs, sm, md, lg ou xl\n/// @example scss - Aplicar estilos em **lg** e **xl**\n///  .#{$prefix}cookiebar {\n///    @include media-breakpoint-up(lg) {\n///      ...\n///    }\n///  }\n@mixin media-breakpoint-up($breakpoint) {\n  $size: map-get($breakpoints, $breakpoint);\n  @media (min-width: $size) {\n    @content;\n  }\n}\n\n/// Aplica os estilos **até** o breakpoint informado\n/// @group 02\n/// @param {String} $breakpoint - **Usar**: xs, sm, md, lg ou xl\n/// @example scss - Aplicar estilos em **xs**, **sm** e **md**\n///  .#{$prefix}cookiebar {\n///    @include media-breakpoint-down(md) {\n///      ...\n///    }\n///  }\n@mixin media-breakpoint-down($breakpoint) {\n  $value: map-get($breakpoints, next-breakpoint($breakpoint)) - 1px;\n  @media (max-width: $value) {\n    @content;\n  }\n}\n\n/// Cria containers e linhas da Grid\n/// @group 03\n/// @param {String} $breakpoint - **Usar**: xs, sm, md, lg ou xl\n/// @example scss - Uso prático\n///  @include make-grid(lg);\n@mixin make-grid($breakpoint) {\n  $breakpoint-name: map-get($breakpoints-name, $breakpoint);\n  $breakpoint-width: map-get($breakpoints, $breakpoint);\n  @media (min-width: $breakpoint-width) {\n    .container,\n    .container-sm,\n    .container-md,\n    .container-lg,\n    .container-xl,\n    .container-fluid {\n      --grid-margin: var(--grid-#{$breakpoint-name}-margin);\n    }\n\n    .row {\n      --grid-gutter: var(--grid-#{$breakpoint-name}-gutter);\n    }\n    @if $breakpoint == \"sm\" {\n      .container,\n      .container-sm {\n        --grid-maxwidth: calc(var(--grid-breakpoint-#{$breakpoint}) - var(--grid-#{$breakpoint-name}-margin));\n      }\n    }\n    @if $breakpoint == \"md\" {\n      .container,\n      .container-sm,\n      .container-md {\n        --grid-maxwidth: calc(var(--grid-breakpoint-#{$breakpoint}) - var(--grid-#{$breakpoint-name}-margin));\n      }\n    }\n    @if $breakpoint == \"lg\" {\n      .container,\n      .container-sm,\n      .container-md,\n      .container-lg {\n        --grid-maxwidth: calc(var(--grid-breakpoint-#{$breakpoint}) - var(--grid-#{$breakpoint-name}-margin));\n      }\n    }\n    @if $breakpoint == \"xl\" {\n      .container,\n      .container-sm,\n      .container-md,\n      .container-lg,\n      .container-xl {\n        --grid-maxwidth: calc(var(--grid-breakpoint-#{$breakpoint}) - var(--grid-#{$breakpoint-name}-margin));\n      }\n    }\n    @include make-columns($grid-desktop-columns, $breakpoint);\n  }\n}\n\n/// Cria as colunas da Grid.\n/// @group 03\n/// @param {Number} $columns - **Usar**: 4, 8 ou 12\n/// @param {String} $breakpoint [null] - **Usar**: xs, sm, md, lg ou xl **(Opcional)**\n/// @example scss - Criar classes até 4 colunas\n///  @include make-columns(4);\n/// @example scss - Criar classes até 8 colunas para breakpoint **sm**\n///  @include make-columns(8, \"sm\");\n@mixin make-columns($columns, $breakpoint: null) {\n  .col#{if($breakpoint, \"-#{$breakpoint}\", \"\")} {\n    flex: 1 0 0%;\n    min-width: math.div(1, $columns) * 100%;\n  }\n  .col#{if($breakpoint, \"-#{$breakpoint}\", \"\")}-auto {\n    flex: 0 0 auto;\n    width: auto;\n  }\n  @for $i from 1 through $columns {\n    .col#{if($breakpoint, \"-#{$breakpoint}\", \"\")}-#{$i} {\n      flex-basis: math.div($i, $columns) * 100%;\n      max-width: math.div($i, $columns) * 100%;\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":""}