agnosticui-core 2.0.0-alpha.28 → 2.0.0-alpha.29

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.
@@ -156,7 +156,7 @@ d.styles = v`
156
156
  filter: brightness(1.1);
157
157
  }
158
158
  :host([interactive]) .badge:focus-visible {
159
- outline: var(--ag-focus-width) solid var(--ag-focus);
159
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
160
160
  outline-offset: var(--ag-focus-offset);
161
161
  }
162
162
  :host([single-char]) .badge {
@@ -126,7 +126,7 @@ o.styles = m`
126
126
  }
127
127
 
128
128
  .ag-breadcrumb__link:focus-visible {
129
- outline: var(--ag-focus-width) solid var(--ag-focus);
129
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
130
130
  outline-offset: var(--ag-focus-offset);
131
131
  }
132
132
 
@@ -133,7 +133,7 @@ l.styles = h`
133
133
  }
134
134
 
135
135
  summary:focus-visible {
136
- outline: var(--ag-focus-width) solid var(--ag-focus);
136
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
137
137
  outline-offset: var(--ag-focus-offset);
138
138
  transition: outline var(--ag-motion-medium) ease;
139
139
  }
@@ -194,7 +194,7 @@ c.styles = u`
194
194
 
195
195
  /* Focus state - High contrast, color-independent */
196
196
  button:focus-visible {
197
- outline: var(--ag-focus-width) solid var(--ag-focus);
197
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
198
198
  outline-offset: var(--ag-focus-offset);
199
199
  }
200
200
 
@@ -544,7 +544,7 @@ v.styles = b`
544
544
  button:focus,
545
545
  a:focus {
546
546
  background-color: var(--ag-background-secondary);
547
- outline: var(--ag-focus-width) solid var(--ag-focus);
547
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
548
548
  outline-offset: 0;
549
549
  }
550
550
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "agnosticui-core",
3
- "version": "2.0.0-alpha.28",
3
+ "version": "2.0.0-alpha.29",
4
4
  "author": "AgnosticUI",
5
5
  "license": "Apache-2.0",
6
6
  "type": "module",
@@ -108,7 +108,7 @@ export class AgBadge extends LitElement implements BadgeProps {
108
108
  filter: brightness(1.1);
109
109
  }
110
110
  :host([interactive]) .badge:focus-visible {
111
- outline: var(--ag-focus-width) solid var(--ag-focus);
111
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
112
112
  outline-offset: var(--ag-focus-offset);
113
113
  }
114
114
  :host([single-char]) .badge {
@@ -145,7 +145,7 @@ export class AgBreadcrumb extends LitElement implements BreadcrumbProps {
145
145
  }
146
146
 
147
147
  .ag-breadcrumb__link:focus-visible {
148
- outline: var(--ag-focus-width) solid var(--ag-focus);
148
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
149
149
  outline-offset: var(--ag-focus-offset);
150
150
  }
151
151
 
@@ -88,7 +88,7 @@ export class AgCollapsible extends LitElement implements CollapsibleProps {
88
88
  }
89
89
 
90
90
  summary:focus-visible {
91
- outline: var(--ag-focus-width) solid var(--ag-focus);
91
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
92
92
  outline-offset: var(--ag-focus-offset);
93
93
  transition: outline var(--ag-motion-medium) ease;
94
94
  }
@@ -152,7 +152,7 @@ export class AgIconButton extends LitElement implements IconButtonProps {
152
152
 
153
153
  /* Focus state - High contrast, color-independent */
154
154
  button:focus-visible {
155
- outline: var(--ag-focus-width) solid var(--ag-focus);
155
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
156
156
  outline-offset: var(--ag-focus-offset);
157
157
  }
158
158
 
@@ -834,7 +834,7 @@ export class AgMenuItem extends LitElement implements MenuItemProps {
834
834
  button:focus,
835
835
  a:focus {
836
836
  background-color: var(--ag-background-secondary);
837
- outline: var(--ag-focus-width) solid var(--ag-focus);
837
+ outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
838
838
  outline-offset: 0;
839
839
  }
840
840