@nubitio/admin 0.6.2 → 0.6.5

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.
Files changed (2) hide show
  1. package/dist/style.css +64 -67
  2. package/package.json +7 -7
package/dist/style.css CHANGED
@@ -139,21 +139,21 @@ html[data-density=comfortable] {
139
139
  .nb-feature-hub__header {
140
140
  display: flex;
141
141
  flex-direction: column;
142
- gap: 0.35rem;
143
- padding: 1.5rem 1.5rem 0;
142
+ gap: var(--space-1);
143
+ padding: var(--page-padding) var(--page-padding) 0;
144
144
  }
145
145
 
146
146
  .nb-feature-hub__title {
147
147
  margin: 0;
148
- font-size: 1.5rem;
149
- font-weight: 700;
148
+ font-size: var(--font-size-2xl);
149
+ font-weight: var(--font-weight-bold);
150
150
  letter-spacing: -0.02em;
151
151
  color: var(--text-primary);
152
152
  }
153
153
 
154
154
  .nb-feature-hub__subtitle {
155
155
  margin: 0;
156
- font-size: 0.875rem;
156
+ font-size: var(--font-size-md);
157
157
  color: var(--text-secondary);
158
158
  max-width: 36rem;
159
159
  }
@@ -161,30 +161,31 @@ html[data-density=comfortable] {
161
161
  .nb-feature-hub__tabs {
162
162
  display: flex;
163
163
  flex-wrap: wrap;
164
- gap: 0.25rem;
165
- margin: 1.25rem 1.5rem 0;
166
- padding: 0.25rem;
164
+ gap: var(--space-1);
165
+ margin-top: var(--space-5);
166
+ padding: var(--space-1);
167
167
  background: var(--surface-1);
168
168
  border: 1px solid var(--border-subtle, var(--border-color));
169
- border-radius: 10px;
169
+ border-radius: var(--radius-xl);
170
170
  box-shadow: var(--shadow-sm);
171
171
  }
172
172
 
173
173
  .nb-feature-hub__tab {
174
174
  display: inline-flex;
175
175
  align-items: center;
176
- gap: 0.45rem;
177
- padding: 0.55rem 0.9rem;
178
- font-size: 0.8125rem;
179
- font-weight: 600;
176
+ gap: var(--space-2);
177
+ min-height: var(--control-height);
178
+ padding: 0 var(--space-3);
179
+ font-size: var(--font-size-sm);
180
+ font-weight: var(--font-weight-semibold);
180
181
  color: var(--text-secondary);
181
182
  text-decoration: none;
182
183
  border: 1px solid transparent;
183
- border-radius: 7px;
184
- transition: color 0.15s, background 0.15s, border-color 0.15s;
184
+ border-radius: var(--radius-lg);
185
+ transition: color var(--transition-base), background var(--transition-base), border-color var(--transition-base);
185
186
  }
186
187
  .nb-feature-hub__tab .ph {
187
- font-size: 1rem;
188
+ font-size: var(--control-icon-size);
188
189
  opacity: 0.75;
189
190
  }
190
191
  .nb-feature-hub__tab:hover {
@@ -201,26 +202,61 @@ html[data-density=comfortable] {
201
202
  opacity: 1;
202
203
  }
203
204
 
205
+ .nb-feature-hub__banner {
206
+ display: flex;
207
+ align-items: flex-start;
208
+ gap: var(--space-3);
209
+ margin: var(--space-4) var(--page-padding) 0;
210
+ padding: var(--space-3) var(--space-4);
211
+ font-size: var(--font-size-sm);
212
+ line-height: 1.45;
213
+ border-radius: var(--radius-lg);
214
+ }
215
+ .nb-feature-hub__banner .ph {
216
+ flex-shrink: 0;
217
+ margin-top: 0.1rem;
218
+ font-size: var(--control-icon-size);
219
+ }
220
+ .nb-feature-hub__banner--info {
221
+ color: var(--status-info-text, #0369a1);
222
+ background: var(--status-info-bg, #e0f2fe);
223
+ border: 1px solid var(--status-info-border, #7dd3fc);
224
+ }
225
+ .nb-feature-hub__banner--warning {
226
+ color: var(--status-warning-text, #b45309);
227
+ background: var(--status-warning-bg, #fef3c7);
228
+ border: 1px solid var(--status-warning-border, #fcd34d);
229
+ }
230
+
231
+ .nb-feature-hub__content {
232
+ flex: 1;
233
+ min-height: 0;
234
+ overflow: auto;
235
+ display: flex;
236
+ flex-direction: column;
237
+ padding-top: var(--content-padding);
238
+ }
239
+
204
240
  .nb-feature-hub--compact .nb-feature-hub__header {
205
- padding: 0.65rem 1rem 0;
241
+ padding: var(--space-2) var(--page-padding) 0;
206
242
  }
207
243
  .nb-feature-hub--compact .nb-feature-hub__tabs-card {
208
244
  align-items: center;
209
245
  background: var(--surface-1);
210
246
  border: 1px solid var(--border-subtle, var(--border-color));
211
- border-radius: 10px;
247
+ border-radius: var(--radius-xl);
212
248
  box-shadow: var(--shadow-sm);
213
249
  display: flex;
214
250
  flex: 1 1 auto;
215
251
  flex-wrap: wrap;
216
- gap: 0.5rem 1rem;
252
+ gap: var(--space-2) var(--space-5);
217
253
  justify-content: space-between;
218
254
  min-width: 0;
219
- padding: 0.35rem 0.45rem 0.35rem 0.85rem;
255
+ padding: var(--space-1) var(--space-2) var(--space-1) var(--space-4);
220
256
  width: 100%;
221
257
  }
222
258
  .nb-feature-hub--compact .nb-feature-hub__title {
223
- font-size: 1.125rem;
259
+ font-size: var(--font-size-xl);
224
260
  line-height: 1.2;
225
261
  margin: 0;
226
262
  }
@@ -228,62 +264,23 @@ html[data-density=comfortable] {
228
264
  flex: 1 1 auto;
229
265
  justify-content: flex-end;
230
266
  margin: 0;
231
- padding: 0.15rem;
267
+ padding: var(--space-1);
232
268
  border: none;
233
- border-radius: 8px;
269
+ border-radius: var(--radius-lg);
234
270
  background: transparent;
235
271
  box-shadow: none;
236
272
  min-width: min(100%, 520px);
237
273
  }
238
274
  .nb-feature-hub--compact .nb-feature-hub__tab {
239
- padding: 0.38rem 0.7rem;
240
- font-size: 0.75rem;
275
+ font-size: var(--font-size-xs);
241
276
  }
242
277
  .nb-feature-hub--compact .nb-feature-hub__tab .ph {
243
- font-size: 0.9rem;
278
+ font-size: var(--font-size-sm);
244
279
  }
245
280
  .nb-feature-hub--compact .nb-feature-hub__banner {
246
- margin: 0.5rem 1rem 0;
247
- padding: 0.45rem 0.65rem;
248
- font-size: 0.75rem;
249
- }
250
-
251
- .nb-feature-hub__banner {
252
- display: flex;
253
- align-items: flex-start;
254
- gap: 0.6rem;
255
- margin: 0.85rem 1.5rem 0;
256
- padding: 0.7rem 0.9rem;
257
- font-size: 0.8125rem;
258
- line-height: 1.45;
259
- border-radius: 8px;
260
- }
261
- .nb-feature-hub__banner .ph {
262
- flex-shrink: 0;
263
- margin-top: 0.1rem;
264
- font-size: 1rem;
265
- }
266
- .nb-feature-hub__banner--info {
267
- color: var(--status-info-text, #0369a1);
268
- background: var(--status-info-bg, #e0f2fe);
269
- border: 1px solid var(--status-info-border, #7dd3fc);
270
- }
271
- .nb-feature-hub__banner--warning {
272
- color: var(--status-warning-text, #b45309);
273
- background: var(--status-warning-bg, #fef3c7);
274
- border: 1px solid var(--status-warning-border, #fcd34d);
275
- }
276
-
277
- .nb-feature-hub__content {
278
- flex: 1;
279
- min-height: 0;
280
- overflow: auto;
281
- display: flex;
282
- flex-direction: column;
283
- }
284
-
285
- .nb-feature-hub--compact .nb-feature-hub__content {
286
- padding-top: 0.35rem;
281
+ margin: var(--space-2) var(--page-padding) 0;
282
+ padding: var(--space-2) var(--space-3);
283
+ font-size: var(--font-size-xs);
287
284
  }
288
285
  .nb-admin-shell {
289
286
  display: flex;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nubitio/admin",
3
- "version": "0.6.2",
3
+ "version": "0.6.5",
4
4
  "type": "module",
5
5
  "description": "Admin shell layout components: responsive sidebar, header, and screen size utilities for Nubit apps.",
6
6
  "license": "MIT",
@@ -50,12 +50,12 @@
50
50
  },
51
51
  "peerDependencies": {
52
52
  "@tanstack/react-query": "^5.0.0",
53
- "react": "^19.0.0",
54
- "react-dom": "^19.0.0",
53
+ "react": "^18.2.0 || ^19.0.0",
54
+ "react-dom": "^18.2.0 || ^19.0.0",
55
55
  "react-router-dom": "^6.0.0",
56
- "@nubitio/core": "^0.6.2",
57
- "@nubitio/hydra": "^0.6.2",
58
- "@nubitio/crud": "^0.6.2",
59
- "@nubitio/ui": "^0.6.2"
56
+ "@nubitio/core": "^0.6.5",
57
+ "@nubitio/crud": "^0.6.5",
58
+ "@nubitio/ui": "^0.6.5",
59
+ "@nubitio/hydra": "^0.6.5"
60
60
  }
61
61
  }