@vnmfify/core
Version:
```shell npm i @vnmfify/core -S ```
1 lines • 8.82 kB
Source Map (JSON)
{"version":3,"sources":["timeline/timeline.scss","timeline/timeline-item.scss","timeline/_variables.scss","timeline/timeline-connector.scss","timeline/timeline-separator.scss","timeline/timeline-dot.scss","timeline/timeline-content.scss"],"names":[],"mappings":"AAEA,kBAEE,2BAAA,CAAA,4BAAA,CACA,wBAAA,CAAA,qBAAA,CADA,6BAAA,CAAA,yBAAA,CAAA,qBAAA,CACA,qCAAA,CAAA,6BAAA,CCHF,yCDCE,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YEKmB,CDNrB,uBAGE,4DCGmB,CDJnB,2CCImB,CDKb,+UACE,YAAA,CAON,mDACE,6BAAA,CAAA,6BAAA,CAAA,kCAAA,CAAA,8BAAA,CAAA,0BAAA,CAGE,yFACE,sBAAA,CAAA,mBAAA,CAAA,kCAAA,CAAA,0BAAA,CAGF,wFACE,oBAAA,CAAA,iBAAA,CAAA,gCAAA,CAAA,wBAAA,CAON,0DACE,6BAAA,CAAA,6BAAA,CAAA,kCAAA,CAAA,8BAAA,CAAA,0BAAA,CAGE,gGACE,sBAAA,CAAA,mBAAA,CAAA,kCAAA,CAAA,0BAAA,CAGF,+FACE,oBAAA,CAAA,iBAAA,CAAA,gCAAA,CAAA,wBAAA,CE5CV,4BACE,kBAAA,CACA,iKAAA,CADA,cAAA,CAAA,UAAA,CAAA,MACA,CAEA,iCACE,kSAAA,CAGF,oCACE,2SAAA,CCTJ,4BAGE,2BAAA,CAAA,4BAAA,CACA,wBAAA,CAAA,qBAAA,CACA,sBAAA,CAAA,mBAAA,CADA,0BAAA,CAAA,kBAAA,CADA,6BAAA,CAAA,yBAAA,CAAA,qBAAA,CAEA,kCAAA,CAAA,0BAAA,CAJA,iBAIA,CCIF,kDDPE,mBAAA,CAAA,oBAAA,CAAA,mBAAA,CAAA,YCYA,CALF,sBAIE,yDAAA,CACA,iBAAA,CAFA,wCHWoB,CGZpB,uCAGA,CAGE,sCAEE,kEAnBgB,CAkBhB,UAlBgB,CAsBlB,wCACE,oEAvBgB,CAiBlB,sCAEE,qFAnBgB,CAkBhB,UAlBgB,CAsBlB,wCACE,uFAvBgB,CAiBlB,mCAEE,+EAnBgB,CAkBhB,UAlBgB,CAsBlB,qCACE,iFAvBgB,CAiBlB,sCAEE,sFAnBgB,CAkBhB,UAlBgB,CAsBlB,wCACE,wFAvBgB,CAiBlB,sCAEE,uFAnBgB,CAkBhB,UAlBgB,CAsBlB,wCACE,yFAvBgB,CAiBlB,qCAEE,kFAnBgB,CAkBhB,UAlBgB,CAsBlB,uCACE,oFAvBgB,CCgBtB,0BAEE,kBAAA,CADA,6BAAA,CAAA,qBAAA,CACA,cAAA,CAAA,UAAA,CAAA,MAAA,CACA,8CJVyB,CIYzB,sCACE,oBAAA,CAAA,iBAAA,CAAA,gCAAA,CAAA,wBAAA,CASE,uGACE,sBAhCqB,CAgCrB,mBAhCqB,CAgCrB,kCAhCqB,CAgCrB,0BAhCqB,CA+BvB,mEACE,uBAhCqB,CAgCrB,oBAhCqB,CAgCrB,8BAhCqB,CAgCrB,sBAhCqB,CA+BvB,gEACE,oBAhCqB,CAgCrB,iBAhCqB,CAgCrB,gCAhCqB,CAgCrB,wBAhCqB,CA+BvB,oEACE,wBAhCqB,CAgCrB,qBAhCqB,CAgCrB,qCAhCqB,CAgCrB,6BAhCqB,CA+BvB,mEACE,wBAhCqB,CAgCrB,oCAhCqB,CAgCrB,4BAhCqB,CAuCvB,gEACE,uBAhCkB,CAgClB,oBAhCkB,CAgClB,8BAhCkB,CAgClB,sBAhCkB,CA+BpB,iEACE,wBAhCkB,CAgClB,qBAhCkB,CAgClB,0BAhCkB,CAgClB,kBAhCkB,CA+BpB,8DACE,qBAhCkB,CAgClB,kBAhCkB,CAgClB,4BAhCkB,CAgClB,oBAhCkB,CA+BpB,mEACE,0BAhCkB,CAgClB,uBAhCkB,CAgClB,4BAhCkB,CAgClB,oBAhCkB,CA+BpB,kEACE,yBAhCkB,CAgClB,sBAhCkB,CAgClB,2BAhCkB,CAgClB,mBAhCkB","file":"index.css","sourcesContent":["@import \"./variables\";\r\n\r\n.#{$component-prefix}timeline {\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: space-between;\r\n}\r\n","@import \"./variables\";\r\n\r\n.#{$component-prefix}timeline-item {\r\n display: flex;\r\n min-height: $timeline-min-height;\r\n font-size: $timeline-font-size;\r\n\r\n &--right,\r\n &--left,\r\n &--alternate,\r\n &--alternate-reverse {\r\n &:last-child {\r\n .#{$component-prefix}timeline-connector {\r\n &:last-child {\r\n display: none;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &--alternate {\r\n &:nth-of-type(odd) {\r\n flex-direction: row-reverse;\r\n\r\n .#{$component-prefix}timeline-content {\r\n &:first-child {\r\n justify-content: flex-start;\r\n }\r\n\r\n &:last-child {\r\n justify-content: flex-end;\r\n }\r\n }\r\n }\r\n }\r\n\r\n &--alternate-reverse {\r\n &:nth-of-type(even) {\r\n flex-direction: row-reverse;\r\n\r\n .#{$component-prefix}timeline-content {\r\n &:first-child {\r\n justify-content: flex-start;\r\n }\r\n\r\n &:last-child {\r\n justify-content: flex-end;\r\n }\r\n }\r\n }\r\n }\r\n}\r\n","@import \"../styles/prefix\";\r\n@import \"../styles/variables\";\r\n\r\n$timeline-color: var(--avatar-color, var(--white, $white));\r\n$timeline-background-color: var(--avatar-background-color, var(--gray-5, $gray-5));\r\n$timeline-border-color: var(--avatar-border-color, var(--white, $white));\r\n$timeline-border-width: var(--avatar-border-width, 2px * $hd);\r\n$timeline-font-weight: var(--avatar-font-weight, var(--font-weight-bold, $font-weight-bold));\r\n$timeline-font-size: var(--timeline-font-size, var(--font-size-md, $font-size-md));\r\n$timeline-min-height: var(--timeline-min-height, 70px * $hd);\r\n\r\n$timeline-content-padding: var(--timeline-content-padding, 0 16px * $hd);\r\n\r\n$timeline-connector-border-color: var(--timeline-connector-border-color, var(--gray-5, $gray-5));\r\n$timeline-connector-border-width: var(--timeline-connector-border-width, 2PX);\r\n$timeline-connector-border-style: var(--timeline-connector-border-style, solid);\r\n\r\n$timeline-top-connector-border-color: var(--timeline-top-connector-border-color, $timeline-connector-border-color);\r\n$timeline-top-connector-border-width: var(--timeline-top-connector-border-width, $timeline-connector-border-width);\r\n$timeline-top-connector-border-style: var(--timeline-top-connector-border-style, $timeline-connector-border-style);\r\n$timeline-bottom-connector-border-color: var(--timeline-bottom-connector-border-color, $timeline-connector-border-color);\r\n$timeline-bottom-connector-border-width: var(--timeline-bottom-connector-border-width, $timeline-connector-border-width);\r\n$timeline-bottom-connector-border-style: var(--timeline-bottom-connector-border-style, $timeline-connector-border-style);\r\n\r\n$timeline-dot-size: var(--timeline-dot-size, 12px * $hd);\r\n$timeline-dot-margin: var(--timeline-dot-margin, 6px * $hd 0);\r\n$timeline-dot-padding: var(--timeline-dot-padding, 4PX);\r\n$timeline-dot-border-width: var(--timeline-dot-border, 2PX);\r\n\r\n$timeline-dot-default-color: var(--timeline-dot-default-color, var(--gray-5, $gray-5));\r\n$timeline-dot-primary-color: var(--timeline-dot-primary-color, var(--primary-color, $primary-color));\r\n$timeline-dot-info-color: var(--timeline-dot-info-color, var(--info-color, $info-color));\r\n$timeline-dot-success-color: var(--timeline-dot-success-color, var(--success-color, $success-color));\r\n$timeline-dot-warning-color: var(--timeline-dot-warning-color, var(--warning-color, $warning-color));\r\n$timeline-dot-danger-color: var(--timeline-dot-danger-color, var(--danger-color, $danger-color));\r\n","@import \"./variables\";\r\n\r\n.#{$component-prefix}timeline-connector {\r\n flex: 1;\r\n border-right: $timeline-connector-border-width $timeline-connector-border-style $timeline-connector-border-color;\r\n\r\n &--top {\r\n border-right: $timeline-top-connector-border-width $timeline-top-connector-border-style $timeline-top-connector-border-color;\r\n }\r\n\r\n &--bottom {\r\n border-right: $timeline-bottom-connector-border-width $timeline-bottom-connector-border-style $timeline-bottom-connector-border-color;\r\n }\r\n}\r\n","@import \"./variables\";\r\n\r\n.#{$component-prefix}timeline-separator {\r\n position: relative;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n justify-content: flex-start;\r\n}\r\n","@import \"./variables\";\r\n\r\n$timeline-dot-colors: (\r\n \"default\" : $timeline-dot-default-color,\r\n \"primary\" :$timeline-dot-primary-color,\r\n \"info\" :$timeline-dot-info-color,\r\n \"success\": $timeline-dot-success-color,\r\n \"warning\": $timeline-dot-warning-color,\r\n \"danger\": $timeline-dot-danger-color\r\n);\r\n\r\n.#{$component-prefix}timeline-dot {\r\n display: flex;\r\n padding: $timeline-dot-padding;\r\n margin: $timeline-dot-margin;\r\n border: $timeline-dot-border-width solid transparent;\r\n border-radius: 50%;\r\n\r\n @each $color-name, $color-value in $timeline-dot-colors {\r\n &--filled-#{$color-name} {\r\n color: $white;\r\n background: $color-value;\r\n }\r\n\r\n &--outlined-#{$color-name} {\r\n border-color: $color-value;\r\n }\r\n }\r\n}\r\n","@import \"./variables\";\r\n\r\n$timeline-content-justifies: (\r\n \"start\":flex-start,\r\n \"center\": center,\r\n \"end\": flex-end,\r\n \"between\": space-between,\r\n \"around\": space-around\r\n);\r\n\r\n$timeline-content-aligns: (\r\n \"start\":flex-start,\r\n \"center\": center,\r\n \"end\": flex-end,\r\n \"baseline\": baseline,\r\n \"stretch\": stretch\r\n);\r\n\r\n.#{$component-prefix}timeline-content {\r\n box-sizing: border-box;\r\n flex: 1;\r\n padding: $timeline-content-padding;\r\n\r\n &:first-child {\r\n justify-content: flex-end;\r\n }\r\n\r\n &:last-child {\r\n justify-content: flex-start;\r\n }\r\n\r\n &.#{$component-prefix}timeline-content--justify {\r\n @each $justify-name, $justify-value in $timeline-content-justifies {\r\n &-#{$justify-name} {\r\n justify-content: $justify-value;\r\n }\r\n }\r\n }\r\n\r\n &.#{$component-prefix}timeline-content--align {\r\n @each $align-name, $align-value in $timeline-content-aligns {\r\n &-#{$align-name} {\r\n align-items: $align-value;\r\n }\r\n }\r\n }\r\n}\r\n"]}