{"version":3,"sources":["cell/cell.scss","cell/_variables.scss","styles/mixins/_hairline.scss","styles/_variables.scss","cell/cell-group.scss"],"names":[],"mappings":"AAGA,cAUE,yDCLsB,CDItB,+DCLW,CDDX,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YAAA,CAIA,wDCNe,CDOf,wCCNiB,CDIjB,eAAA,CADA,+FAAA,CAJA,iBAAA,CAGA,UCCsB,CDOtB,kCAVA,6BAAA,CAAA,qBEgCA,CFtBA,oBEqBA,0FAAA,CAFA,QAAA,CA5BA,WAAA,CA6BA,2BFnB+C,CEX/C,mBAAA,CAFA,iBAAA,CA8BA,4BFjB+E,CEqB/E,4BAAA,CAAA,wBAAA,CAAA,oBAAA,CFlBA,+DAEE,YAAA,CAGF,qBACE,kBAAA,CAAA,cAAA,CAAA,UAAA,CAAA,MAAA,CAGF,qBAIE,mDCXe,CDSf,8DCXmB,CDYnB,oECXqB,CDSrB,+DCRe,CDcjB,qBACE,uBAAA,CAAA,oBAAA,CAAA,8BAAA,CAAA,sBAAA,CAGF,sBACE,wBAAA,CAAA,qBAAA,CAAA,0BAAA,CAAA,kBAAA,CAGF,mBACE,qBAAA,CAAA,kBAAA,CAAA,4BAAA,CAAA,oBAAA,CAGF,qBAEE,wECvB0B,CDsB1B,qECtB0B,CDyB1B,0CACE,oECzBuB,CD4BzB,0CACE,oEC5BuB,CDgC3B,yBACE,cAAA,CAEA,gCACE,6ECrDc,CDyDlB,wBACE,gBAAA,CAEA,+BAIE,uEC/DgB,CDgEhB,WAAA,CAFA,wDCtEW,CDqEX,2BAAA,CADA,iBAIA,CAKJ,qBACE,kBAAA,CACA,mDCzEe,CDwEf,cAAA,CAAA,UAAA,CAAA,MAAA,CAEA,gBAAA,CAEA,4BACE,2BGnDO,CHoDP,eAAA,CAIJ,8CAGE,oCCjFa,CDgFb,mCCzFe,CD2Ff,wCC3Fe,CD8FjB,oBAGE,6CCvFoB,CD0FtB,8CAJE,wBAAA,CAAA,qBAAA,CAAA,0BAAA,CAAA,kBAAA,CADA,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YC1Fe,CD+FjB,0BAIE,mDCnGe,CDkGf,mDClGe,CGRnB,oBACE,+DH2B4B,CGzB5B,2BAGE,gFH4B6B,CG9B7B,+DH6BuB,CG5BvB,eH6B6B,CGzB/B,2BAIE,yDHgBqB,CGlBrB,oEHoByB,CGnBzB,oDHoB2B,CGtB3B,4GHmBqB,CGdrB,kCACE,yIHmB2B","file":"index.css","sourcesContent":["@import \"./variables\";\n\n// TODO The base variables need to be migrated\n.#{$component-prefix}cell {\n  position: relative;\n  box-sizing: border-box;\n  display: flex;\n  width: 100%;\n  padding: $cell-vertical-padding $cell-horizontal-padding;\n  overflow: hidden;\n  font-size: $cell-font-size;\n  line-height: $cell-line-height;\n  color: $cell-color;\n  background: $cell-background-color;\n\n  &::after {\n    @include hairline-bottom($cell-border-color, var(--padding-sm, $padding-sm), var(--padding-sm, $padding-sm));\n  }\n\n  &:last-child::after,\n  &--borderless::after {\n    display: none;\n  }\n\n  &__title {\n    flex: 1;\n  }\n\n  &__brief {\n    margin-top: $cell-brief-margin-top;\n    font-size: $cell-brief-font-size;\n    line-height: $cell-brief-line-height;\n    color: $cell-brief-color;\n  }\n\n  &--start {\n    align-items: flex-start;\n  }\n\n  &--center {\n    align-items: center;\n  }\n\n  &--end {\n    align-items: flex-end;\n  }\n\n  &--large {\n    padding-top: $cell-vertical-padding-large;\n    padding-bottom: $cell-vertical-padding-large;\n\n    .#{$component-prefix}cell__title {\n      font-size: $cell-title-font-size-large;\n    }\n\n    .#{$component-prefix}cell__brief {\n      font-size: $cell-brief-font-size-large;\n    }\n  }\n\n  &--clickable {\n    cursor: pointer;\n\n    &:active {\n      background: $cell-active-color;\n    }\n  }\n\n  &--required {\n    overflow: visible;\n\n    &::before {\n      position: absolute;\n      left: var(--padding-xs, $padding-xs);\n      font-size: $cell-font-size;\n      color: $cell-required-color;\n      content: '*';\n    }\n  }\n\n\n  &__value {\n    flex: 1;\n    color: $cell-value-color;\n    text-align: right;\n\n    &--alone {\n      color: $text-color;\n      text-align: left;\n    }\n  }\n\n  &__icon,\n  &__right-icon {\n    height: $cell-line-height;\n    font-size: $cell-icon-size;\n    line-height: $cell-line-height;\n  }\n\n  &__icon {\n    display: flex;\n    align-items: center;\n    margin-right: $cell-icon-margin-left;\n  }\n\n  &__right-icon {\n    display: flex;\n    align-items: center;\n    margin-left: $cell-right-icon-margin-right;\n    color:$cell-value-color;\n  }\n}\n","@import \"../styles/prefix\";\n@import \"../styles/variables\";\n@import \"../styles/mixins/hairline\";\n\n$cell-font-size: var(--cell-font-size, var(--font-size-md, $font-size-md));\n$cell-line-height: var(--cell-line-height, 24px * $hd);\n\n$cell-color: var(--cell-color, var(--text-color, $text-color));\n$cell-background-color: var(--cell-background-color, var(--white, $white));\n$cell-border-color: var(--cell-border-color, var(--border-color, $border-color));\n$cell-value-color: var(--cell-value-color, var(--gray-6, $gray-6));\n$cell-active-color: var(--cell-active-color, var(--active-color, $active-color));\n$cell-required-color: var(--cell-required-color, var(--danger-color, $danger-color));\n\n$cell-icon-size: var(--cell-icon-size, 16px * $hd);\n$cell-icon-margin-left: var(--cell-icon-margin-left, 4px * $hd);\n$cell-right-icon-margin-right: var(--cell-right-icon-margin-right, 4px * $hd);\n\n$cell-brief-margin-top: var(--cell-brief-margin-top, var(--padding-base, $padding-base));\n$cell-brief-font-size: var(--cell-brief-font-size, var(--font-size-sm, $font-size-sm));\n$cell-brief-line-height: var(--cell-brief-line-height, var(--line-height-sm, $line-height-sm));\n$cell-brief-color: var(--cell-brief-color, var(--gray-6, $gray-6));\n\n$cell-vertical-padding: var(--cell-vertical-padding, 10px * $hd);\n$cell-horizontal-padding: var(--cell-horizontal-padding, var(--padding-md, $padding-md));\n\n$cell-vertical-padding-large: var(--cell-vertical-padding-large, var(--padding-sm, $padding-sm));\n$cell-title-font-size-large: var(--cell-title-font-size-large, var(--font-size-lg, $font-size-lg));\n$cell-brief-font-size-large: var(--cell-brief-font-size-large, var(--font-size-md, $font-size-md));\n\n$cell-group-background-color: var(--cell-group-background-color, var(--white, $white));\n$cell-group-title-color: var(--cell-group-title-color, var(--gray-6, $gray-6));\n$cell-group-title-padding: var(--cell-group-title-padding, var(--padding-md, $padding-md) var(--padding-md, $padding-md) var(--padding-xs, $padding-xs));\n$cell-group-title-font-size: var(--cell-group-title-font-size, var(--font-size-md, $font-size-md));\n$cell-group-title-line-height: var(--cell-group-title-line-height, 16px * $hd);\n$cell-group-inset-padding: var(--cell-group-inset-padding, 0 var(--padding-md, $padding-md));\n$cell-group-inset-border-radius: var(--cell-group-inset-border-radius, var(--border-radius-lg, $border-radius-lg));\n$cell-group-inset-title-padding: var(--cell-group-inset-title-padding, var(--padding-md, $padding-md) var(--padding-md, $padding-md) var(--padding-xs, $padding-xs) var(--padding-xl, $padding-xl));\n","@import '../variables';\n\n@mixin hairline-common {\n  position: absolute;\n  box-sizing: border-box;\n  pointer-events: none;\n  content: ' ';\n}\n\n@mixin hairline($color: $border-color) {\n  @include hairline-common;\n\n  top: -50%;\n  right: -50%;\n  bottom: -50%;\n  left: -50%;\n  border: 0 solid $color;\n  transform: scale(0.5);\n}\n\n@mixin hairline-top($color: $border-color, $left: 0, $right: 0) {\n  @include hairline-common;\n\n  top: 0;\n  right: $right;\n  left: $left;\n  border-top: 2px solid $color;\n  transform: scaleY(0.5);\n}\n\n@mixin hairline-bottom($color: $border-color, $left: 0, $right: 0) {\n  @include hairline-common;\n\n  right: $right;\n  bottom: 0;\n  left: $left;\n  border-bottom: 2px solid $color;\n  transform: scaleY(0.5);\n}\n","// Color Palette\n$black: #000;\n$black-rgb: 0, 0, 0;\n$white: #fff;\n\n$gray-1: #f7f8fa;\n$gray-2: #f2f3f5;\n$gray-3: #ebedf0;\n$gray-4: #dcdee0;\n$gray-5: #c8c9cc;\n$gray-6: #969799;\n$gray-7: #646566;\n$gray-8: #323233;\n\n$red: #ee0a24;\n$blue: #1989fa;\n$cyan: #2db7f5;\n$green: #07c160;\n$orange: #ff976a;\n\n$orange-dark: #ed6a0c;\n$orange-light: #fffbe8;\n\n// Base Unit\n$hd: 2 !default;\n\n// Gradient Colors\n$gradient-red: linear-gradient(to right, #ff6034, #ee0a24);\n$gradient-orange: linear-gradient(to right, #ffd01e, #ff8917);\n\n// Component Colors\n$primary-color: var(--blue, $blue);\n$info-color: var(--cyan, $cyan);\n$success-color: var(--green, $green);\n$warning-color: var(--orange, $orange);\n$danger-color: var(--red, $red);\n$text-color: var(--gray-8, $gray-8);\n$text-color-2: var(--gray-6, $gray-6);\n$text-color-3: var(--gray-5, $gray-5);\n$active-color: var(--gray-2, $gray-2);\n$active-opacity: 0.7;\n$disabled-opacity: 0.5;\n$background-color: var(--gray-1, $gray-1);\n$background-color-light: var(--white, $white);\n$text-link-color: #576b95;\n\n// Padding\n$padding-base: 4px * $hd;\n$padding-xs: $padding-base * 2;\n$padding-sm: $padding-base * 3;\n$padding-md: $padding-base * 4;\n$padding-lg: $padding-base * 6;\n$padding-xl: $padding-base * 8;\n\n// Height\n$height-xs: 16px * $hd;\n$height-sm: 18px * $hd;\n$height-md: 20px * $hd;\n$height-lg: 22px * $hd;\n\n$font-weight-bold: 500;\n\n// Font\n$font-size-xs: 10px * $hd;\n$font-size-sm: 12px * $hd;\n$font-size-md: 14px * $hd;\n$font-size-lg: 16px * $hd;\n// Line Height\n$line-height-xs: 14px * $hd;\n$line-height-sm: 18px * $hd;\n$line-height-md: 20px * $hd;\n$line-height-lg: 22px * $hd;\n\n$base-font-family: -apple-system, blinkmacsystemfont, 'Helvetica Neue',\nhelvetica, segoe ui, arial, roboto, 'PingFang SC', 'miui', 'Hiragino Sans GB',\n'Microsoft Yahei', sans-serif;\n\n$price-integer-font-family: avenir-heavy, pingfang sc, helvetica neue, arial, sans-serif;\n\n// Animation\n$animation-duration-base: 0.3s;\n$animation-duration-fast: 0.2s;\n$animation-timing-function-enter: ease-out;\n$animation-timing-function-exit: ease-in;\n\n// Border\n$border-color: var(--gray-3, $gray-3);\n$border-width-base: 1px * $hd;\n$border-radius-sm: 2px * $hd;\n$border-radius-md: 4px * $hd;\n$border-radius-lg: 8px * $hd;\n$border-radius-max: 999px;\n","@import \"./variables\";\n\n.#{$component-prefix}cell-group {\n  background: $cell-group-background-color;\n\n  &--inset {\n    margin: $cell-group-inset-padding;\n    overflow: hidden;\n    border-radius: $cell-group-inset-border-radius;\n  }\n\n  &__title {\n    padding: $cell-group-title-padding;\n    font-size: $cell-group-title-font-size;\n    line-height: $cell-group-title-line-height;\n    color: $cell-group-title-color;\n\n    &--inset {\n      padding: $cell-group-inset-title-padding;\n    }\n  }\n}\n"]}