prime-ui-kit 0.5.1 → 0.6.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.
- package/README.md +11 -2
- package/dist/components/index.css +24 -9
- package/dist/components/index.css.map +3 -3
- package/dist/components/index.js +3 -19
- package/dist/components/index.js.map +3 -3
- package/dist/index.css +24 -9
- package/dist/index.css.map +3 -3
- package/dist/index.js +3 -19
- package/dist/index.js.map +3 -3
- package/dist/layout/app-shell/AppShell.d.ts +0 -8
- package/dist/layout/app-shell/AppShell.d.ts.map +1 -1
- package/dist/layout/index.d.ts +1 -1
- package/dist/layout/index.d.ts.map +1 -1
- package/dist/layout/sidebar/examples/01-app-shell-nav.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/page-content/COMPONENT.md +9 -5
- package/src/layout/app-shell/COMPONENT.md +77 -27
- package/src/layout/sidebar/COMPONENT.md +1 -1
- package/src/layout/sidebar/examples/01-app-shell-nav.tsx +11 -13
- package/src/layout/sidebar/examples/examples.module.css +0 -10
package/dist/index.css
CHANGED
|
@@ -1487,16 +1487,8 @@ textarea::-moz-focus-inner {
|
|
|
1487
1487
|
flex-direction: column;
|
|
1488
1488
|
min-width: 0;
|
|
1489
1489
|
min-height: 0;
|
|
1490
|
-
padding: 0;
|
|
1491
1490
|
margin: 0;
|
|
1492
1491
|
background: transparent;
|
|
1493
|
-
}
|
|
1494
|
-
.AppShell_layoutMainInset {
|
|
1495
|
-
box-sizing: border-box;
|
|
1496
|
-
flex: 1 1 auto;
|
|
1497
|
-
min-height: 0;
|
|
1498
|
-
min-width: 0;
|
|
1499
|
-
width: 100%;
|
|
1500
1492
|
padding-block: var(--prime-sys-spacing-x6);
|
|
1501
1493
|
padding-inline: var(--prime-sys-spacing-x6);
|
|
1502
1494
|
}
|
|
@@ -2054,6 +2046,12 @@ textarea::-moz-focus-inner {
|
|
|
2054
2046
|
outline: var(--prime-sys-border-width-focusRing) solid var(--prime-sys-color-focus-ring);
|
|
2055
2047
|
outline-offset: var(--prime-sys-unit-2px);
|
|
2056
2048
|
}
|
|
2049
|
+
.Sidebar_menuButtonActive:focus-visible,
|
|
2050
|
+
.Sidebar_menuButton[data-active=true]:focus-visible,
|
|
2051
|
+
.Sidebar_menuButton[aria-current=page]:focus-visible {
|
|
2052
|
+
outline: none;
|
|
2053
|
+
box-shadow: var(--prime-sys-elevation-shadow-primaryFocus);
|
|
2054
|
+
}
|
|
2057
2055
|
.Sidebar_menuButton:disabled {
|
|
2058
2056
|
opacity: 0.56;
|
|
2059
2057
|
cursor: not-allowed;
|
|
@@ -2061,7 +2059,13 @@ textarea::-moz-focus-inner {
|
|
|
2061
2059
|
.Sidebar_menuButtonActive,
|
|
2062
2060
|
.Sidebar_menuButton[data-active=true],
|
|
2063
2061
|
.Sidebar_menuButton[aria-current=page] {
|
|
2064
|
-
background: var(--prime-sys-color-action-
|
|
2062
|
+
background: var(--prime-sys-color-action-primaryBackground);
|
|
2063
|
+
color: var(--prime-sys-color-action-primaryForeground);
|
|
2064
|
+
}
|
|
2065
|
+
.Sidebar_menuButtonActive:hover:not(:disabled),
|
|
2066
|
+
.Sidebar_menuButton[data-active=true]:hover:not(:disabled),
|
|
2067
|
+
.Sidebar_menuButton[aria-current=page]:hover:not(:disabled) {
|
|
2068
|
+
background: var(--prime-sys-color-action-primaryBackgroundHover);
|
|
2065
2069
|
}
|
|
2066
2070
|
.Sidebar_menuIcon {
|
|
2067
2071
|
display: inline-flex;
|
|
@@ -2094,6 +2098,17 @@ textarea::-moz-focus-inner {
|
|
|
2094
2098
|
opacity: var(--sb-item-trailing-opacity);
|
|
2095
2099
|
transform: scale(var(--sb-item-trailing-scale));
|
|
2096
2100
|
}
|
|
2101
|
+
.Sidebar_menuButtonActive .Sidebar_menuIcon,
|
|
2102
|
+
.Sidebar_menuButton[data-active=true] .Sidebar_menuIcon,
|
|
2103
|
+
.Sidebar_menuButton[aria-current=page] .Sidebar_menuIcon {
|
|
2104
|
+
color: var(--prime-sys-color-action-primaryForeground);
|
|
2105
|
+
}
|
|
2106
|
+
.Sidebar_menuButtonActive .Sidebar_menuTrailing,
|
|
2107
|
+
.Sidebar_menuButton[data-active=true] .Sidebar_menuTrailing,
|
|
2108
|
+
.Sidebar_menuButton[aria-current=page] .Sidebar_menuTrailing {
|
|
2109
|
+
color: var(--prime-sys-color-action-primaryForeground);
|
|
2110
|
+
opacity: 0.72;
|
|
2111
|
+
}
|
|
2097
2112
|
.Sidebar_menuAction {
|
|
2098
2113
|
box-sizing: border-box;
|
|
2099
2114
|
display: inline-flex;
|