@esportsplus/ui 0.20.11 → 0.21.0

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.
@@ -1,2 +1,2 @@
1
- @layer components {.card{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--padding-horizontal:0px;--padding-vertical:0px;--width:auto}.card.--active{--background:var(--background-active);--border-color:var(--border-color-active)}.card:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover)}.card:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-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:-1;position:absolute;inset:0}.card--flat:after{display:none}}
1
+ @layer components {.card{--background:var(--background-default);--background-active:var(--background-default);--background-default:transparent;--background-hover:var(--background-default);--background-pressed:var(--background-default);--border-color:var(--border-color-default);--border-color-active:var(--border-color-default);--border-color-default:var(--background);--border-color-hover:var(--border-color-default);--border-color-pressed:var(--border-color-default);--border-radius:var(--border-radius-400);--box-shadow:var(--box-shadow-default);--box-shadow-default:none;--padding-horizontal:0px;--padding-vertical:0px;--width:auto}.card.--active{--background:var(--background-active);--border-color:var(--border-color-active)}.card:not(.--active):hover{--background:var(--background-hover);--border-color:var(--border-color-hover)}.card:not(.--active):active{--background:var(--background-pressed);--border-color:var(--border-color-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:-1;position:absolute;inset:0}.card--flat:after{display:none}.card--option{border-radius:0}.card--option:first-child:last-child{border-radius:var(--border-radius)}.card--option:first-child:not(:last-child){border-radius:var(--border-radius)var(--border-radius)0 0}.card--option:last-child:not(:first-child){border-radius:0 0 var(--border-radius)var(--border-radius)}}
2
2
  /*$vite$:1*/
@@ -0,0 +1,2 @@
1
+ @layer css-utilities {.--focus-active>*{transition:opacity var(--transition-duration)ease-in-out}.--focus-active:has(.--active) .--focus-active>:not(.--active){opacity:var(--opacity)}}
2
+ /*$vite$:1*/
@@ -6,6 +6,7 @@ import './color/scss/index.scss';
6
6
  import './disabled/scss/index.scss';
7
7
  import './flex/scss/index.scss';
8
8
  import './flicker/scss/index.scss';
9
+ import './focus/scss/index.scss';
9
10
  import './glass/scss/index.scss';
10
11
  import './hidden/scss/index.scss';
11
12
  import './inline/scss/index.scss';
@@ -6,6 +6,7 @@ import './color/scss/index.scss';
6
6
  import './disabled/scss/index.scss';
7
7
  import './flex/scss/index.scss';
8
8
  import './flicker/scss/index.scss';
9
+ import './focus/scss/index.scss';
9
10
  import './glass/scss/index.scss';
10
11
  import './hidden/scss/index.scss';
11
12
  import './inline/scss/index.scss';
package/package.json CHANGED
@@ -48,7 +48,7 @@
48
48
  "private": false,
49
49
  "sideEffects": false,
50
50
  "type": "module",
51
- "version": "0.20.11",
51
+ "version": "0.21.0",
52
52
  "scripts": {
53
53
  "build": "run-s build:vite build:ts",
54
54
  "build:ts": "tsc && tsc-alias",
@@ -33,4 +33,20 @@
33
33
  display: none;
34
34
  }
35
35
  }
36
+
37
+ &--option {
38
+ border-radius: 0;
39
+
40
+ &:first-child:last-child {
41
+ border-radius: var(--border-radius);
42
+ }
43
+
44
+ &:first-child:not(:last-child) {
45
+ border-radius: var(--border-radius) var(--border-radius) 0 0;
46
+ }
47
+
48
+ &:last-child:not(:first-child) {
49
+ border-radius: 0 0 var(--border-radius) var(--border-radius);
50
+ }
51
+ }
36
52
  }
@@ -0,0 +1,9 @@
1
+ .--focus-active {
2
+ > * {
3
+ transition: opacity var(--transition-duration) ease-in-out;
4
+
5
+ .--focus-active:has(.--active) &:not(.--active) {
6
+ opacity: var(--opacity);
7
+ }
8
+ }
9
+ }
@@ -0,0 +1,5 @@
1
+ .--focus-active {
2
+ > * {
3
+ --opacity: 0.24;
4
+ }
5
+ }
@@ -6,6 +6,7 @@ import './color/scss/index.scss';
6
6
  import './disabled/scss/index.scss';
7
7
  import './flex/scss/index.scss';
8
8
  import './flicker/scss/index.scss';
9
+ import './focus/scss/index.scss';
9
10
  import './glass/scss/index.scss';
10
11
  import './hidden/scss/index.scss';
11
12
  import './inline/scss/index.scss';