noph-ui 0.10.2 → 0.10.4
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.
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
popover={modal ? popover || 'auto' : undefined}
|
|
17
17
|
class={[
|
|
18
18
|
'np-navigation-drawer-container',
|
|
19
|
-
modal && 'np-navigation-drawer-
|
|
19
|
+
modal && 'np-navigation-drawer-container-modal',
|
|
20
20
|
backdrop && 'np-navigation-drawer-backdrop',
|
|
21
21
|
attributes.class,
|
|
22
22
|
]}
|
|
23
23
|
>
|
|
24
|
-
<div class=
|
|
24
|
+
<div class={['np-navigation-wrapper', modal && 'np-navigation-drawer-shade']}>
|
|
25
25
|
<div class="np-navigation-drawer">
|
|
26
26
|
{#if children}
|
|
27
27
|
{@render children()}
|
|
@@ -33,8 +33,7 @@
|
|
|
33
33
|
<style>
|
|
34
34
|
.np-navigation-drawer-container {
|
|
35
35
|
color: var(--np-color-on-surface-variant);
|
|
36
|
-
|
|
37
|
-
border-bottom-right-radius: var(--np-shape-corner-large);
|
|
36
|
+
width: calc(var(--np-navigation-drawer-width, 22.5rem) + 3px);
|
|
38
37
|
overflow: hidden;
|
|
39
38
|
scrollbar-width: thin;
|
|
40
39
|
overflow-y: auto;
|
|
@@ -43,30 +42,27 @@
|
|
|
43
42
|
padding: 0;
|
|
44
43
|
background-color: transparent;
|
|
45
44
|
}
|
|
45
|
+
.np-navigation-drawer-container-modal {
|
|
46
|
+
z-index: 100;
|
|
47
|
+
}
|
|
46
48
|
.np-navigation-wrapper {
|
|
47
49
|
background-color: var(--np-navigation-drawer-background, var(--np-color-surface-container-low));
|
|
50
|
+
border-top-right-radius: var(--np-shape-corner-large);
|
|
51
|
+
border-bottom-right-radius: var(--np-shape-corner-large);
|
|
48
52
|
width: var(--np-navigation-drawer-width, 22.5rem);
|
|
49
53
|
height: var(--np-navigation-drawer-height, 100dvh);
|
|
50
54
|
overflow-y: auto;
|
|
51
55
|
}
|
|
52
|
-
.np-navigation-drawer-container[popover] {
|
|
53
|
-
width: 0;
|
|
54
|
-
transition:
|
|
55
|
-
overlay 0.2s allow-discrete,
|
|
56
|
-
display 0.2s allow-discrete,
|
|
57
|
-
width 0.2s ease-in;
|
|
58
|
-
}
|
|
59
|
-
.np-navigation-drawer-container:popover-open {
|
|
60
|
-
width: var(--np-navigation-drawer-width, 22.5rem);
|
|
61
|
-
@starting-style {
|
|
62
|
-
width: 0;
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
56
|
|
|
66
57
|
.np-navigation-drawer-container[popover] .np-navigation-wrapper {
|
|
67
58
|
transform: translateX(-100%);
|
|
68
59
|
transition: transform 0.2s ease-in;
|
|
69
60
|
}
|
|
61
|
+
.np-navigation-drawer-container[popover] {
|
|
62
|
+
transition:
|
|
63
|
+
overlay 0.2s allow-discrete,
|
|
64
|
+
display 0.2s allow-discrete;
|
|
65
|
+
}
|
|
70
66
|
.np-navigation-drawer-container:popover-open .np-navigation-wrapper {
|
|
71
67
|
transform: translateX(0);
|
|
72
68
|
@starting-style {
|
|
@@ -80,7 +76,6 @@
|
|
|
80
76
|
}
|
|
81
77
|
.np-navigation-drawer-shade {
|
|
82
78
|
box-shadow: var(--np-elevation-1);
|
|
83
|
-
z-index: 100;
|
|
84
79
|
}
|
|
85
80
|
.np-navigation-drawer-backdrop[popover]::backdrop {
|
|
86
81
|
background-color: var(--np-color-scrim);
|
|
@@ -119,9 +119,9 @@
|
|
|
119
119
|
}
|
|
120
120
|
|
|
121
121
|
.np-navigation-drawer-item-label {
|
|
122
|
-
font-size: var(--np-navigation-drawer-font-size, 0.875rem);
|
|
122
|
+
font-size: var(--np-navigation-drawer-item-font-size, 0.875rem);
|
|
123
123
|
line-height: 1.25rem;
|
|
124
|
-
font-weight: 500;
|
|
124
|
+
font-weight: var(--np-navigation-drawer-item-font-weight, 500);
|
|
125
125
|
flex: 1;
|
|
126
126
|
text-align: left;
|
|
127
127
|
overflow: hidden;
|
|
@@ -131,7 +131,7 @@
|
|
|
131
131
|
}
|
|
132
132
|
|
|
133
133
|
.np-navigation-drawer-item-selected .np-navigation-drawer-item-label {
|
|
134
|
-
font-weight: 700;
|
|
134
|
+
font-weight: var(--np-navigation-drawer-item-selected-font-weight, 700);
|
|
135
135
|
color: var(--np-color-on-secondary-container);
|
|
136
136
|
}
|
|
137
137
|
|
|
@@ -85,7 +85,7 @@
|
|
|
85
85
|
.np-navigation-action-label {
|
|
86
86
|
font-size: 0.75rem;
|
|
87
87
|
line-height: 1rem;
|
|
88
|
-
font-weight: 500;
|
|
88
|
+
font-weight: var(--np-navigation-rail-item-font-weight, 500);
|
|
89
89
|
transition: all;
|
|
90
90
|
color: var(--np-color-on-surface-variant);
|
|
91
91
|
}
|
|
@@ -113,7 +113,7 @@
|
|
|
113
113
|
}
|
|
114
114
|
|
|
115
115
|
.np-navigation-action-selected .np-navigation-action-label {
|
|
116
|
-
font-weight: 700;
|
|
116
|
+
font-weight: var(--np-navigation-rail-item-selected-font-weight, 700);
|
|
117
117
|
color: var(--np-color-on-surface);
|
|
118
118
|
}
|
|
119
119
|
.np-touch {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "noph-ui",
|
|
3
|
-
"version": "0.10.
|
|
3
|
+
"version": "0.10.4",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"homepage": "https://noph.dev",
|
|
6
6
|
"repository": {
|
|
@@ -53,10 +53,10 @@
|
|
|
53
53
|
},
|
|
54
54
|
"devDependencies": {
|
|
55
55
|
"@material/material-color-utilities": "^0.3.0",
|
|
56
|
-
"@playwright/test": "^1.
|
|
56
|
+
"@playwright/test": "^1.50.0",
|
|
57
57
|
"@sveltejs/adapter-vercel": "^5.5.3",
|
|
58
58
|
"@sveltejs/kit": "^2.16.1",
|
|
59
|
-
"@sveltejs/package": "^2.3.
|
|
59
|
+
"@sveltejs/package": "^2.3.9",
|
|
60
60
|
"@sveltejs/vite-plugin-svelte": "^5.0.3",
|
|
61
61
|
"@types/eslint": "^9.6.1",
|
|
62
62
|
"eslint": "^9.18.0",
|
|
@@ -66,12 +66,12 @@
|
|
|
66
66
|
"prettier": "^3.4.2",
|
|
67
67
|
"prettier-plugin-svelte": "^3.3.3",
|
|
68
68
|
"publint": "^0.3.2",
|
|
69
|
-
"svelte": "^5.19.
|
|
69
|
+
"svelte": "^5.19.2",
|
|
70
70
|
"svelte-check": "^4.1.4",
|
|
71
71
|
"typescript": "^5.7.3",
|
|
72
72
|
"typescript-eslint": "^8.21.0",
|
|
73
73
|
"vite": "^6.0.11",
|
|
74
|
-
"vitest": "^3.0.
|
|
74
|
+
"vitest": "^3.0.4"
|
|
75
75
|
},
|
|
76
76
|
"svelte": "./dist/index.js",
|
|
77
77
|
"types": "./dist/index.d.ts",
|