@esportsplus/ui 0.9.6 → 0.9.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/components/button/scss/index.scss +1 -1
- package/build/components/card/scss/index.scss +1 -1
- package/build/components/link/scss/index.scss +1 -1
- package/build/components/scrollbar/scss/index.scss +1 -1
- package/build/components/text/scss/index.scss +1 -1
- package/build/css-utilities/background/scss/index.scss +1 -1
- package/build/css-utilities/border/scss/index.scss +1 -1
- package/build/css-utilities/color/scss/index.scss +1 -1
- package/package.json +6 -1
- package/src/components/button/scss/index.scss +1 -1
- package/src/components/button/scss/variables.scss +0 -12
- package/src/components/card/scss/variables.scss +0 -8
- package/src/components/link/scss/variables.scss +0 -12
- package/src/components/scrollbar/scss/index.scss +1 -1
- package/src/components/scrollbar/scss/variables.scss +1 -1
- package/src/components/text/scss/variables.scss +1 -2
- package/src/css-utilities/background/scss/variables.scss +7 -0
- package/src/css-utilities/border/scss/variables.scss +7 -0
- package/src/css-utilities/color/scss/variables.scss +7 -0
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.button{--background:var(--background-default);--
|
|
1
|
+
.button{--background:var(--background-default);--border-color:var(--border-color-default);--border-radius:var(--border-radius-400);--border-width:0px;--box-shadow:var(--box-shadow-default);--box-shadow-active:var(--box-shadow-300);--box-shadow-default:none;--box-shadow-hover:var(--box-shadow-400);--box-shadow-pressed:none;--color:var(--color-default);--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--line-height:var(--line-height-400);--padding-horizontal:var(--size-400);--padding-vertical:var(--size-400);--width:auto}.button.--active{--background:var(--background-active);--border-color:var(--border-color-active);--box-shadow:var(--box-shadow-active);--color:var(--color-active)}.button:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--box-shadow:var(--box-shadow-hover);--color:var(--color-hover)}.button:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--box-shadow:var(--box-shadow-pressed);--color:var(--color-pressed)}.button--processing{--animation-duration:.64s;--border-width:var(--border-width-400);--processing-color:var(--color);--size:var(--size-400)}.button--skeleton{--animation-duration:6.4s}.button{background:var(--background);border-radius:var(--border-radius);color:var(--color);cursor:pointer;font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);padding:calc(var(--padding-vertical) - var(--border-width))calc(var(--padding-horizontal) - var(--border-width));transition:all var(--transition-duration)ease-in-out;width:var(--width);flex-wrap:wrap;place-content:center;align-items:center;display:flex;position:relative}.button:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;z-index:-1;position:absolute;inset:0}.button--flat:after{display:none}.button--processing{color:#0000;pointer-events:none}.button--processing:before{animation:buttonProcessing var(--animation-duration)infinite linear;border:var(--border-width)solid color-mix(in srgb,var(--processing-color),transparent 90%);border-left-color:var(--processing-color);content:"";height:var(--size);width:var(--size);border-top-color:#0000;border-right-color:#0000;border-radius:100%;position:absolute;bottom:50%;right:50%;transform:translate(50%,50%)}.button--processing *{opacity:0}@keyframes buttonProcessing{0%{transform:translate(50%,50%)rotate(0)}to{transform:translate(50%,50%)rotate(359deg)}}.button--skeleton{animation:var(--animation-duration)ease-in-out infinite buttonSkeleton;background-image:linear-gradient(270deg,var(--background-pressed),var(--background-default),var(--background-default),var(--background-pressed));color:#0000;pointer-events:none;background-size:400% 100%}.button--skeleton *{opacity:0}@keyframes buttonSkeleton{0%{background-position:200% 0}to{background-position:-200% 0}}.button--top-left,.button--top-right{top:calc((var(--padding-vertical) + var(--line-height)/2)*-1);position:absolute}.button--top-left{left:calc((var(--padding-horizontal) + var(--line-height)/2)*-1)}.button--top-right{right:calc((var(--padding-horizontal) + var(--line-height)/2)*-1)}.button--underline.--active,.button--underline:not(.--active):hover{text-decoration:underline}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.card{--background:var(--background-default);--
|
|
1
|
+
.card{--background:var(--background-default);--border-color:var(--border-color-default);--border-radius:var(--border-radius-400);--box-shadow:var(--box-shadow-default);--box-shadow-active:var(--box-shadow-300);--box-shadow-default:none;--box-shadow-hover:var(--box-shadow-300);--box-shadow-pressed:none;--padding-horizontal:0px;--padding-vertical:0px;--width:auto}.card.--active{--background:var(--background-active);--border-color:var(--border-color-active);--box-shadow:var(--box-shadow-active)}.card:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--box-shadow:var(--box-shadow-hover)}.card:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--box-shadow:var(--box-shadow-pressed)}.card{background:var(--background);border-radius:var(--border-radius);padding:var(--padding-vertical)var(--padding-horizontal);transition:background var(--transition-duration)ease-in-out,border-color var(--transition-duration)ease-in-out,box-shadow var(--transition-duration)ease-in-out,max-height var(--transition-duration)ease-in-out;width:var(--width);position:relative}.card:after{border-radius:inherit;box-shadow:var(--box-shadow);content:"";pointer-events:none;transition:box-shadow var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;z-index:0;position:absolute;inset:0}.card--flat:after{display:none}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.link{--background:var(--background-default);--
|
|
1
|
+
.link{--background:var(--background-default);--border-color:var(--border-color-default);--border-radius:var(--border-radius-400);--border-width:0px;--color:var(--color-default);--font-size:var(--font-size-400);--font-weight:var(--font-weight-500);--line-height:var(--line-height-400);--padding-horizontal:0px;--padding-vertical:var(--size-400);--width:auto}.link.--active{--background:var(--background-active);--border-color:var(--border-color-active);--color:var(--color-active)}.link:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover);--color:var(--color-hover)}.link:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-pressed);--color:var(--color-pressed)}.link{background:var(--background);color:var(--color);cursor:pointer;font-size:var(--font-size);line-height:var(--line-height);padding:calc(var(--padding-vertical) - var(--border-width))calc(var(--padding-horizontal) - var(--border-width));transition:background var(--transition-duration)ease-in-out,border-color var(--transition-duration)ease-in-out,color var(--transition-duration)ease-in-out,opacity var(--transition-duration)ease-in-out;width:var(--width);flex-wrap:wrap;place-content:center flex-start;display:flex;position:relative}.link--hover.tooltip:hover .link-hover--one,.link--hover:not(.--active):hover .link-hover--one{opacity:0;transform:translateY(-75%)}.link--hover.tooltip:hover .link-hover--two,.link--hover:not(.--active):hover .link-hover--two{opacity:1;transform:translate(50%,50%)}.link--underline.--active,.link--underline:not(.--active):hover{text-decoration:underline}.link-hover{transition:opacity .3s ease-in-out,all .3s cubic-bezier(.23,.65,.74,1.09)}.link-hover--one{transform:translateY(0)}.link-hover--two{opacity:0;padding:0 var(--padding-horizontal);white-space:nowrap;position:absolute;bottom:50%;right:50%;transform:translate(50%,125%)}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.scrollbar{--background
|
|
1
|
+
.scrollbar{--background:transparent;--height:0;--translate:translate3d(0,0,0);--width:4px}::-webkit-scrollbar{box-shadow:unset;background:0 0}::-webkit-scrollbar-track{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb{box-shadow:unset;background:0 0}::-webkit-scrollbar-thumb:window-inactive{box-shadow:unset;background:0 0}.scrollbar{z-index:9;height:100%}.scrollbar,.scrollbar:before{transition:opacity var(--transition-duration)ease-in-out;width:var(--width);position:absolute;top:0;right:0}.scrollbar:before{background:var(--background);content:"";height:var(--height);transform:var(--translate);transform-origin:top;border-radius:1px 0 0 1px}.scrollbar--fixed{position:fixed}.scrollbar--hidden{opacity:0}.scrollbar-container{flex-flow:column;display:flex;position:relative;overflow:hidden}.scrollbar-content{height:100%;margin-right:calc(var(--scrollbar-width)*-1);scrollbar-gutter:stable;scroll-behavior:smooth;width:calc(100% + var(--scrollbar-width));overflow:hidden scroll}.scrollbar-content--snap{scroll-snap-type:both mandatory;overscroll-behavior-x:contain;overflow:auto}.scrollbar-content--snap>*{scroll-snap-stop:normal;scroll-snap-align:center}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.text{--color:var(--color-default);--
|
|
1
|
+
.text{--color:var(--color-default,inherit);--font-size:var(--font-size-400);--font-weight:var(--font-weight-400);--line-height:var(--line-height-400);--width:auto;color:var(--color);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height);transition:color var(--transition-duration)ease-in-out;width:var(--width);position:relative}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.--background-primary{--background-active:var(--color-primary-300);--background-default:var(--color-primary-400);--background-hover:var(--color-primary-300);--background-pressed:var(--color-primary-500)}.--background-secondary{--background-active:var(--color-secondary-300);--background-default:var(--color-secondary-400);--background-hover:var(--color-secondary-300);--background-pressed:var(--color-secondary-500)}.--background-black{--background-active:var(--color-black-300);--background-default:var(--color-black-400);--background-hover:var(--color-black-300);--background-pressed:var(--color-black-500)}.--background-blue{--background-active:var(--color-blue-300);--background-default:var(--color-blue-400);--background-hover:var(--color-blue-300);--background-pressed:var(--color-blue-500)}.--background-border{--background-active:var(--color-border-300);--background-default:var(--color-border-400);--background-hover:var(--color-border-300);--background-pressed:var(--color-border-500)}.--background-green{--background-active:var(--color-green-300);--background-default:var(--color-green-400);--background-hover:var(--color-green-300);--background-pressed:var(--color-green-500)}.--background-grey{--background-active:var(--color-grey-300);--background-default:var(--color-grey-400);--background-hover:var(--color-grey-300);--background-pressed:var(--color-grey-500)}.--background-purple{--background-active:var(--color-purple-300);--background-default:var(--color-purple-400);--background-hover:var(--color-purple-300);--background-pressed:var(--color-purple-500)}.--background-red{--background-active:var(--color-red-300);--background-default:var(--color-red-400);--background-hover:var(--color-red-300);--background-pressed:var(--color-red-500)}.--background-text{--background-active:var(--color-text-300);--background-default:var(--color-text-400);--background-hover:var(--color-text-300);--background-pressed:var(--color-text-500)}.--background-white{--background-active:var(--color-white-300);--background-default:var(--color-white-400);--background-hover:var(--color-white-300);--background-pressed:var(--color-white-500)}.--background-yellow{--background-active:var(--color-yellow-300);--background-default:var(--color-yellow-400);--background-hover:var(--color-yellow-300);--background-pressed:var(--color-yellow-500)}.--background-state{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--background-state.--active{--background:var(--background-active)}.--background-state:not(.--active):hover{--background:var(--background-hover)}.--background-state:not(.--active):active{--background:var(--background-pressed)}
|
|
1
|
+
.--background-primary{--background-active:var(--color-primary-300);--background-default:var(--color-primary-400);--background-hover:var(--color-primary-300);--background-pressed:var(--color-primary-500)}.--background-secondary{--background-active:var(--color-secondary-300);--background-default:var(--color-secondary-400);--background-hover:var(--color-secondary-300);--background-pressed:var(--color-secondary-500)}.--background-black{--background-active:var(--color-black-300);--background-default:var(--color-black-400);--background-hover:var(--color-black-300);--background-pressed:var(--color-black-500)}.--background-blue{--background-active:var(--color-blue-300);--background-default:var(--color-blue-400);--background-hover:var(--color-blue-300);--background-pressed:var(--color-blue-500)}.--background-border{--background-active:var(--color-border-300);--background-default:var(--color-border-400);--background-hover:var(--color-border-300);--background-pressed:var(--color-border-500)}.--background-green{--background-active:var(--color-green-300);--background-default:var(--color-green-400);--background-hover:var(--color-green-300);--background-pressed:var(--color-green-500)}.--background-grey{--background-active:var(--color-grey-300);--background-default:var(--color-grey-400);--background-hover:var(--color-grey-300);--background-pressed:var(--color-grey-500)}.--background-purple{--background-active:var(--color-purple-300);--background-default:var(--color-purple-400);--background-hover:var(--color-purple-300);--background-pressed:var(--color-purple-500)}.--background-red{--background-active:var(--color-red-300);--background-default:var(--color-red-400);--background-hover:var(--color-red-300);--background-pressed:var(--color-red-500)}.--background-text{--background-active:var(--color-text-300);--background-default:var(--color-text-400);--background-hover:var(--color-text-300);--background-pressed:var(--color-text-500)}.--background-white{--background-active:var(--color-white-300);--background-default:var(--color-white-400);--background-hover:var(--color-white-300);--background-pressed:var(--color-white-500)}.--background-yellow{--background-active:var(--color-yellow-300);--background-default:var(--color-yellow-400);--background-hover:var(--color-yellow-300);--background-pressed:var(--color-yellow-500)}.--background-default{--background:var(--background-default);--background-active:var(--background-default);--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--background-state{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default)}.--background-state.--active{--background:var(--background-active)}.--background-state:not(.--active):hover{--background:var(--background-hover)}.--background-state:not(.--active):active{--background:var(--background-pressed)}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.--border-primary{--border-color-active:var(--color-primary-300);--border-color-default:var(--color-primary-400);--border-color-hover:var(--color-primary-300);--border-color-pressed:var(--color-primary-500)}.--border-secondary{--border-color-active:var(--color-secondary-300);--border-color-default:var(--color-secondary-400);--border-color-hover:var(--color-secondary-300);--border-color-pressed:var(--color-secondary-500)}.--border-black{--border-color-active:var(--color-black-300);--border-color-default:var(--color-black-400);--border-color-hover:var(--color-black-300);--border-color-pressed:var(--color-black-500)}.--border-blue{--border-color-active:var(--color-blue-300);--border-color-default:var(--color-blue-400);--border-color-hover:var(--color-blue-300);--border-color-pressed:var(--color-blue-500)}.--border-border{--border-color-active:var(--color-border-300);--border-color-default:var(--color-border-400);--border-color-hover:var(--color-border-300);--border-color-pressed:var(--color-border-500)}.--border-green{--border-color-active:var(--color-green-300);--border-color-default:var(--color-green-400);--border-color-hover:var(--color-green-300);--border-color-pressed:var(--color-green-500)}.--border-grey{--border-color-active:var(--color-grey-300);--border-color-default:var(--color-grey-400);--border-color-hover:var(--color-grey-300);--border-color-pressed:var(--color-grey-500)}.--border-purple{--border-color-active:var(--color-purple-300);--border-color-default:var(--color-purple-400);--border-color-hover:var(--color-purple-300);--border-color-pressed:var(--color-purple-500)}.--border-red{--border-color-active:var(--color-red-300);--border-color-default:var(--color-red-400);--border-color-hover:var(--color-red-300);--border-color-pressed:var(--color-red-500)}.--border-text{--border-color-active:var(--color-text-300);--border-color-default:var(--color-text-400);--border-color-hover:var(--color-text-300);--border-color-pressed:var(--color-text-500)}.--border-white{--border-color-active:var(--color-white-300);--border-color-default:var(--color-white-400);--border-color-hover:var(--color-white-300);--border-color-pressed:var(--color-white-500)}.--border-yellow{--border-color-active:var(--color-yellow-300);--border-color-default:var(--color-yellow-400);--border-color-hover:var(--color-yellow-300);--border-color-pressed:var(--color-yellow-500)}.--border,.--border-bottom,.--border-left,.--border-right,.--border-top{--border-color:var(--border-color-default);--border-style:solid;--border-width:var(--border-width-400)}.--border-dashed{--border-style:dashed}.--border-dotted{--border-style:dotted}.--border-radius{--border-radius:var(--border-radius-400)}.--border-radius-0px{--border-radius:var(--border-radius-0px)}.--border-radius-circle{--border-radius:var(--border-radius-circle)}.--border-radius-curved{--border-radius:var(--border-radius-curved)}.--border-radius-100{--border-radius:var(--border-radius-100)}.--border-radius-200{--border-radius:var(--border-radius-200)}.--border-radius-300{--border-radius:var(--border-radius-300)}.--border-radius-400{--border-radius:var(--border-radius-400)}.--border-radius-500{--border-radius:var(--border-radius-500)}.--border-radius-600{--border-radius:var(--border-radius-600)}.--border-state{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--border-state.--active{--border-color:var(--border-color-active)}.--border-state:not(.--active):hover{--border-color:var(--border-color-hover)}.--border-state:not(.--active):active{--border-color:var(--border-color-pressed)}.--border-width,.--border-width-400{--border-width:var(--border-width-400)}.--border-width-500{--border-width:var(--border-width-500)}.--border-width-600{--border-width:var(--border-width-600)}.--border-width-700{--border-width:var(--border-width-700)}.--border{border:var(--border-width)var(--border-style)var(--border-color)}.--border-bottom{border-bottom:var(--border-width)var(--border-style)var(--border-color)}.--border-left{border-left:var(--border-width)var(--border-style)var(--border-color)}.--border-right{border-right:var(--border-width)var(--border-style)var(--border-color)}.--border-top{border-top:var(--border-width)var(--border-style)var(--border-color)}.--border-offset-bottom{margin-bottom:calc(var(--border-width)*-1)}.--border-offset-left{margin-left:calc(var(--border-width)*-1)}.--border-offset-right{margin-right:calc(var(--border-width)*-1)}.--border-offset-top{margin-top:calc(var(--border-width)*-1)}.--border-radius{border-radius:var(--border-radius)}
|
|
1
|
+
.--border-primary{--border-color-active:var(--color-primary-300);--border-color-default:var(--color-primary-400);--border-color-hover:var(--color-primary-300);--border-color-pressed:var(--color-primary-500)}.--border-secondary{--border-color-active:var(--color-secondary-300);--border-color-default:var(--color-secondary-400);--border-color-hover:var(--color-secondary-300);--border-color-pressed:var(--color-secondary-500)}.--border-black{--border-color-active:var(--color-black-300);--border-color-default:var(--color-black-400);--border-color-hover:var(--color-black-300);--border-color-pressed:var(--color-black-500)}.--border-blue{--border-color-active:var(--color-blue-300);--border-color-default:var(--color-blue-400);--border-color-hover:var(--color-blue-300);--border-color-pressed:var(--color-blue-500)}.--border-border{--border-color-active:var(--color-border-300);--border-color-default:var(--color-border-400);--border-color-hover:var(--color-border-300);--border-color-pressed:var(--color-border-500)}.--border-green{--border-color-active:var(--color-green-300);--border-color-default:var(--color-green-400);--border-color-hover:var(--color-green-300);--border-color-pressed:var(--color-green-500)}.--border-grey{--border-color-active:var(--color-grey-300);--border-color-default:var(--color-grey-400);--border-color-hover:var(--color-grey-300);--border-color-pressed:var(--color-grey-500)}.--border-purple{--border-color-active:var(--color-purple-300);--border-color-default:var(--color-purple-400);--border-color-hover:var(--color-purple-300);--border-color-pressed:var(--color-purple-500)}.--border-red{--border-color-active:var(--color-red-300);--border-color-default:var(--color-red-400);--border-color-hover:var(--color-red-300);--border-color-pressed:var(--color-red-500)}.--border-text{--border-color-active:var(--color-text-300);--border-color-default:var(--color-text-400);--border-color-hover:var(--color-text-300);--border-color-pressed:var(--color-text-500)}.--border-white{--border-color-active:var(--color-white-300);--border-color-default:var(--color-white-400);--border-color-hover:var(--color-white-300);--border-color-pressed:var(--color-white-500)}.--border-yellow{--border-color-active:var(--color-yellow-300);--border-color-default:var(--color-yellow-400);--border-color-hover:var(--color-yellow-300);--border-color-pressed:var(--color-yellow-500)}.--border,.--border-bottom,.--border-left,.--border-right,.--border-top{--border-color:var(--border-color-default);--border-style:solid;--border-width:var(--border-width-400)}.--border-dashed{--border-style:dashed}.--border-dotted{--border-style:dotted}.--border-radius{--border-radius:var(--border-radius-400)}.--border-radius-0px{--border-radius:var(--border-radius-0px)}.--border-radius-circle{--border-radius:var(--border-radius-circle)}.--border-radius-curved{--border-radius:var(--border-radius-curved)}.--border-radius-100{--border-radius:var(--border-radius-100)}.--border-radius-200{--border-radius:var(--border-radius-200)}.--border-radius-300{--border-radius:var(--border-radius-300)}.--border-radius-400{--border-radius:var(--border-radius-400)}.--border-radius-500{--border-radius:var(--border-radius-500)}.--border-radius-600{--border-radius:var(--border-radius-600)}.--border-default{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--border-state{--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:transparent;--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default)}.--border-state.--active{--border-color:var(--border-color-active)}.--border-state:not(.--active):hover{--border-color:var(--border-color-hover)}.--border-state:not(.--active):active{--border-color:var(--border-color-pressed)}.--border-width,.--border-width-400{--border-width:var(--border-width-400)}.--border-width-500{--border-width:var(--border-width-500)}.--border-width-600{--border-width:var(--border-width-600)}.--border-width-700{--border-width:var(--border-width-700)}.--border{border:var(--border-width)var(--border-style)var(--border-color)}.--border-bottom{border-bottom:var(--border-width)var(--border-style)var(--border-color)}.--border-left{border-left:var(--border-width)var(--border-style)var(--border-color)}.--border-right{border-right:var(--border-width)var(--border-style)var(--border-color)}.--border-top{border-top:var(--border-width)var(--border-style)var(--border-color)}.--border-offset-bottom{margin-bottom:calc(var(--border-width)*-1)}.--border-offset-left{margin-left:calc(var(--border-width)*-1)}.--border-offset-right{margin-right:calc(var(--border-width)*-1)}.--border-offset-top{margin-top:calc(var(--border-width)*-1)}.--border-radius{border-radius:var(--border-radius)}
|
|
2
2
|
/*$vite$:1*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
.--color-primary{--color-active:var(--color-primary-300);--color-default:var(--color-primary-400);--color-hover:var(--color-primary-300);--color-pressed:var(--color-primary-500)}.--color-secondary{--color-active:var(--color-secondary-300);--color-default:var(--color-secondary-400);--color-hover:var(--color-secondary-300);--color-pressed:var(--color-secondary-500)}.--color-black{--color-active:var(--color-black-300);--color-default:var(--color-black-400);--color-hover:var(--color-black-300);--color-pressed:var(--color-black-500)}.--color-blue{--color-active:var(--color-blue-300);--color-default:var(--color-blue-400);--color-hover:var(--color-blue-300);--color-pressed:var(--color-blue-500)}.--color-border{--color-active:var(--color-border-300);--color-default:var(--color-border-400);--color-hover:var(--color-border-300);--color-pressed:var(--color-border-500)}.--color-green{--color-active:var(--color-green-300);--color-default:var(--color-green-400);--color-hover:var(--color-green-300);--color-pressed:var(--color-green-500)}.--color-grey{--color-active:var(--color-grey-300);--color-default:var(--color-grey-400);--color-hover:var(--color-grey-300);--color-pressed:var(--color-grey-500)}.--color-purple{--color-active:var(--color-purple-300);--color-default:var(--color-purple-400);--color-hover:var(--color-purple-300);--color-pressed:var(--color-purple-500)}.--color-red{--color-active:var(--color-red-300);--color-default:var(--color-red-400);--color-hover:var(--color-red-300);--color-pressed:var(--color-red-500)}.--color-text{--color-active:var(--color-text-300);--color-default:var(--color-text-400);--color-hover:var(--color-text-300);--color-pressed:var(--color-text-500)}.--color-white{--color-active:var(--color-white-300);--color-default:var(--color-white-400);--color-hover:var(--color-white-300);--color-pressed:var(--color-white-500)}.--color-yellow{--color-active:var(--color-yellow-300);--color-default:var(--color-yellow-400);--color-hover:var(--color-yellow-300);--color-pressed:var(--color-yellow-500)}.--color-inherit{--color:inherit}.--color-state{--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--color-state.--active{--color:var(--color-active)}.--color-state:not(.--active):hover{--color:var(--color-hover)}.--color-state:not(.--active):active{--color:var(--color-pressed)}
|
|
1
|
+
.--color-primary{--color-active:var(--color-primary-300);--color-default:var(--color-primary-400);--color-hover:var(--color-primary-300);--color-pressed:var(--color-primary-500)}.--color-secondary{--color-active:var(--color-secondary-300);--color-default:var(--color-secondary-400);--color-hover:var(--color-secondary-300);--color-pressed:var(--color-secondary-500)}.--color-black{--color-active:var(--color-black-300);--color-default:var(--color-black-400);--color-hover:var(--color-black-300);--color-pressed:var(--color-black-500)}.--color-blue{--color-active:var(--color-blue-300);--color-default:var(--color-blue-400);--color-hover:var(--color-blue-300);--color-pressed:var(--color-blue-500)}.--color-border{--color-active:var(--color-border-300);--color-default:var(--color-border-400);--color-hover:var(--color-border-300);--color-pressed:var(--color-border-500)}.--color-green{--color-active:var(--color-green-300);--color-default:var(--color-green-400);--color-hover:var(--color-green-300);--color-pressed:var(--color-green-500)}.--color-grey{--color-active:var(--color-grey-300);--color-default:var(--color-grey-400);--color-hover:var(--color-grey-300);--color-pressed:var(--color-grey-500)}.--color-purple{--color-active:var(--color-purple-300);--color-default:var(--color-purple-400);--color-hover:var(--color-purple-300);--color-pressed:var(--color-purple-500)}.--color-red{--color-active:var(--color-red-300);--color-default:var(--color-red-400);--color-hover:var(--color-red-300);--color-pressed:var(--color-red-500)}.--color-text{--color-active:var(--color-text-300);--color-default:var(--color-text-400);--color-hover:var(--color-text-300);--color-pressed:var(--color-text-500)}.--color-white{--color-active:var(--color-white-300);--color-default:var(--color-white-400);--color-hover:var(--color-white-300);--color-pressed:var(--color-white-500)}.--color-yellow{--color-active:var(--color-yellow-300);--color-default:var(--color-yellow-400);--color-hover:var(--color-yellow-300);--color-pressed:var(--color-yellow-500)}.--color-default{--color:var(--color-default);--color-active:var(--color-default);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--color-inherit{--color:inherit}.--color-state{--color:var(--color-default);--color-active:var(--color-default);--color-default:var(--color-text-400);--color-hover:var(--color-default);--color-pressed:var(--color-default)}.--color-state.--active{--color:var(--color-active)}.--color-state:not(.--active):hover{--color:var(--color-hover)}.--color-state:not(.--active):active{--color:var(--color-pressed)}
|
|
2
2
|
/*$vite$:1*/
|
package/package.json
CHANGED
|
@@ -22,12 +22,17 @@
|
|
|
22
22
|
"types": "./build/css-utilities/index.d.ts",
|
|
23
23
|
"default": "./build/css-utilities/index.js"
|
|
24
24
|
},
|
|
25
|
+
"./css-utilities/*": "./build/css-utilities/*/scss/index.scss",
|
|
25
26
|
"./fonts": {
|
|
26
27
|
"types": "./build/fonts/index.d.ts",
|
|
27
28
|
"default": "./build/fonts/index.js"
|
|
28
29
|
},
|
|
29
30
|
"./lib": "./lib.scss",
|
|
30
31
|
"./tokens": "./tokens.scss",
|
|
32
|
+
"./*": {
|
|
33
|
+
"types": "./build/components/*/index.d.ts",
|
|
34
|
+
"default": "./build/components/*/index.js"
|
|
35
|
+
},
|
|
31
36
|
".": {
|
|
32
37
|
"types": "./build/components/index.d.ts",
|
|
33
38
|
"default": "./build/components/index.js"
|
|
@@ -37,7 +42,7 @@
|
|
|
37
42
|
"private": false,
|
|
38
43
|
"sideEffects": false,
|
|
39
44
|
"type": "module",
|
|
40
|
-
"version": "0.9.
|
|
45
|
+
"version": "0.9.7",
|
|
41
46
|
"scripts": {
|
|
42
47
|
"build": "run-s build:vite build:ts",
|
|
43
48
|
"build:ts": "tsc && tsc-alias",
|
|
@@ -3,15 +3,7 @@
|
|
|
3
3
|
|
|
4
4
|
.button {
|
|
5
5
|
--background: var(--background-default);
|
|
6
|
-
--background-active: var(--background-default);
|
|
7
|
-
--background-default: transparent;
|
|
8
|
-
--background-hover: var(--background-default);
|
|
9
|
-
--background-pressed: var(--background-default);
|
|
10
6
|
--border-color: var(--border-color-default);
|
|
11
|
-
--border-color-active: var(--border-color-default);
|
|
12
|
-
--border-color-default: var(--background);
|
|
13
|
-
--border-color-hover: var(--border-color-default);
|
|
14
|
-
--border-color-pressed: var(--border-color-default);
|
|
15
7
|
--border-radius: var(--border-radius-400);
|
|
16
8
|
--border-width: 0px;
|
|
17
9
|
--box-shadow: var(--box-shadow-default);
|
|
@@ -20,10 +12,6 @@
|
|
|
20
12
|
--box-shadow-hover: var(--box-shadow-400);
|
|
21
13
|
--box-shadow-pressed: none;
|
|
22
14
|
--color: var(--color-default);
|
|
23
|
-
--color-active: var(--color-default);
|
|
24
|
-
--color-default: var(--color-text-400);
|
|
25
|
-
--color-hover: var(--color-default);
|
|
26
|
-
--color-pressed: var(--color-default);
|
|
27
15
|
--font-size: var(--font-size-400);
|
|
28
16
|
--font-weight: var(--font-weight-400);
|
|
29
17
|
--line-height: var(--line-height-400);
|
|
@@ -2,15 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
.card {
|
|
4
4
|
--background: var(--background-default);
|
|
5
|
-
--background-active: var(--background-default);
|
|
6
|
-
--background-default: transparent;
|
|
7
|
-
--background-hover: var(--background-default);
|
|
8
|
-
--background-pressed: var(--background-default);
|
|
9
5
|
--border-color: var(--border-color-default);
|
|
10
|
-
--border-color-active: var(--border-color-default);
|
|
11
|
-
--border-color-default: var(--background);
|
|
12
|
-
--border-color-hover: var(--border-color-default);
|
|
13
|
-
--border-color-pressed: var(--border-color-default);
|
|
14
6
|
--border-radius: var(--border-radius-400);
|
|
15
7
|
--box-shadow: var(--box-shadow-default);
|
|
16
8
|
--box-shadow-active: var(--box-shadow-300);
|
|
@@ -2,22 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
.link {
|
|
4
4
|
--background: var(--background-default);
|
|
5
|
-
--background-active: var(--background-default);
|
|
6
|
-
--background-default: transparent;
|
|
7
|
-
--background-hover: var(--background-default);
|
|
8
|
-
--background-pressed: var(--background-default);
|
|
9
5
|
--border-color: var(--border-color-default);
|
|
10
|
-
--border-color-active: var(--border-color-default);
|
|
11
|
-
--border-color-default: var(--background);
|
|
12
|
-
--border-color-hover: var(--border-color-default);
|
|
13
|
-
--border-color-pressed: var(--border-color-default);
|
|
14
6
|
--border-radius: var(--border-radius-400);
|
|
15
7
|
--border-width: 0px;
|
|
16
8
|
--color: var(--color-default);
|
|
17
|
-
--color-active: var(--color-default);
|
|
18
|
-
--color-default: var(--color-text-400);
|
|
19
|
-
--color-hover: var(--color-default);
|
|
20
|
-
--color-pressed: var(--color-default);
|
|
21
9
|
--font-size: var(--font-size-400);
|
|
22
10
|
--font-weight: var(--font-weight-500);
|
|
23
11
|
--line-height: var(--line-height-400);
|
|
@@ -3,6 +3,13 @@
|
|
|
3
3
|
.--background {
|
|
4
4
|
@include tokens.state-utility('background', tokens.$colors);
|
|
5
5
|
|
|
6
|
+
&-default {
|
|
7
|
+
--background: var(--background-default);
|
|
8
|
+
--background-active: var(--background-default);
|
|
9
|
+
--background-hover: var(--background-default);
|
|
10
|
+
--background-pressed: var(--background-default);
|
|
11
|
+
}
|
|
12
|
+
|
|
6
13
|
&-state {
|
|
7
14
|
--background: var(--background-default);
|
|
8
15
|
--background-active: var(--background-default);
|
|
@@ -32,6 +32,13 @@
|
|
|
32
32
|
}
|
|
33
33
|
}
|
|
34
34
|
|
|
35
|
+
&-default {
|
|
36
|
+
--border-color: var(--border-color-default);
|
|
37
|
+
--border-color-active: var(--border-color-default);
|
|
38
|
+
--border-color-hover: var(--border-color-default);
|
|
39
|
+
--border-color-pressed: var(--border-color-default);
|
|
40
|
+
}
|
|
41
|
+
|
|
35
42
|
&-state {
|
|
36
43
|
--border-color: var(--border-color-default);
|
|
37
44
|
--border-color-active: var(--border-color-default);
|
|
@@ -3,6 +3,13 @@
|
|
|
3
3
|
.--color {
|
|
4
4
|
@include tokens.state-utility('color', tokens.$colors);
|
|
5
5
|
|
|
6
|
+
&-default {
|
|
7
|
+
--color: var(--color-default);
|
|
8
|
+
--color-active: var(--color-default);
|
|
9
|
+
--color-hover: var(--color-default);
|
|
10
|
+
--color-pressed: var(--color-default);
|
|
11
|
+
}
|
|
12
|
+
|
|
6
13
|
&-inherit {
|
|
7
14
|
--color: inherit;
|
|
8
15
|
}
|