@innertia-solutions/nuxt-theme-spark 0.1.105 → 0.1.106

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 (5) hide show
  1. package/components/Admin/Base.vue +10 -10
  2. package/components/Admin/Page.vue +4 -4
  3. package/components/Nav/Tabs.vue +2 -2
  4. package/components/Table/Standard.vue +8 -8
  5. package/package.json +1 -1
package/components/Admin/Base.vue CHANGED
@@ -44,8 +44,8 @@ const userInitial = computed(() =>
44
44
  :class="[
45
45
  'flex flex-col h-full',
46
46
  floating
47
- ? 'bg-white dark:bg-slate-800 rounded-2xl border border-slate-200 dark:border-slate-700 shadow-sm overflow-hidden'
48
- : 'bg-white dark:bg-slate-800 border-e border-slate-200 dark:border-slate-700',
47
+ ? 'bg-white dark:bg-slate-900 rounded-2xl border border-slate-200 dark:border-slate-800 shadow-sm overflow-hidden'
48
+ : 'bg-white dark:bg-slate-900 border-e border-slate-200 dark:border-slate-800',
49
49
  ]"
50
50
  >
51
51
  <!-- Logo + mobile close -->
@@ -55,7 +55,7 @@ const userInitial = computed(() =>
55
55
  </div>
56
56
  <button
57
57
  type="button"
58
- class="lg:hidden size-7 inline-flex justify-center items-center rounded-lg text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-700 transition-colors"
58
+ class="lg:hidden size-7 inline-flex justify-center items-center rounded-lg text-slate-400 hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors"
59
59
  @click="close"
60
60
  >
61
61
  <svg class="size-4" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
@@ -81,7 +81,12 @@ const userInitial = computed(() =>
81
81
  </div>
82
82
 
83
83
  <!-- User footer -->
84
- <div class="shrink-0 border-t border-slate-100 dark:border-slate-700/60 px-3 py-3 space-y-2">
84
+ <div class="shrink-0 border-t border-slate-100 dark:border-slate-800/60 px-3 py-3 space-y-2">
85
+
86
+ <!-- Controls slot (dark mode, notifications, etc.) -->
87
+ <div v-if="$slots['user-controls']" class="flex items-center gap-x-1.5">
88
+ <slot name="user-controls" />
89
+ </div>
85
90
 
86
91
  <!-- User info + logout -->
87
92
  <div v-if="user" class="flex items-center gap-x-2.5 px-1">
@@ -94,7 +99,7 @@ const userInitial = computed(() =>
94
99
  </div>
95
100
  <button
96
101
  type="button"
97
- class="size-7 inline-flex items-center justify-center rounded-lg text-slate-400 hover:text-slate-600 hover:bg-slate-100 dark:hover:bg-slate-700 transition-colors shrink-0"
102
+ class="size-7 inline-flex items-center justify-center rounded-lg text-slate-400 hover:text-slate-600 hover:bg-slate-100 dark:hover:bg-slate-800 transition-colors shrink-0"
98
103
  title="Cerrar sesión"
99
104
  @click="emit('logout')"
100
105
  >
@@ -104,11 +109,6 @@ const userInitial = computed(() =>
104
109
  </button>
105
110
  </div>
106
111
 
107
- <!-- Controls slot (dark mode, notifications, etc.) -->
108
- <div v-if="$slots['user-controls']" class="flex items-center gap-x-1.5">
109
- <slot name="user-controls" />
110
- </div>
111
-
112
112
  <!-- Env / extra slot -->
113
113
  <slot name="user-footer" />
114
114
  </div>
package/components/Admin/Page.vue CHANGED
@@ -13,22 +13,22 @@ const slots = useSlots()
13
13
  const iconComponent = computed(() => props.icon ? TablerIcons[props.icon] ?? null : null)
14
14
 
15
15
  const iconColorClass = computed(() => ({
16
- slate: 'bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-400',
16
+ slate: 'bg-slate-100 dark:bg-slate-900 text-slate-600 dark:text-slate-400',
17
17
  blue: 'bg-blue-100 dark:bg-blue-900/30 text-blue-600 dark:text-blue-400',
18
18
  green: 'bg-green-100 dark:bg-green-900/30 text-green-600 dark:text-green-400',
19
19
  amber: 'bg-amber-100 dark:bg-amber-900/30 text-amber-600 dark:text-amber-400',
20
20
  red: 'bg-red-100 dark:bg-red-900/30 text-red-600 dark:text-red-400',
21
21
  purple: 'bg-purple-100 dark:bg-purple-900/30 text-purple-600 dark:text-purple-400',
22
22
  rose: 'bg-rose-100 dark:bg-rose-900/30 text-rose-600 dark:text-rose-400',
23
- gray: 'bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-400',
24
- }[props.color] ?? 'bg-slate-100 dark:bg-slate-800 text-slate-600 dark:text-slate-400'))
23
+ gray: 'bg-slate-100 dark:bg-slate-900 text-slate-600 dark:text-slate-400',
24
+ }[props.color] ?? 'bg-slate-100 dark:bg-slate-900 text-slate-600 dark:text-slate-400'))
25
25
  </script>
26
26
 
27
27
  <template>
28
28
  <div class="space-y-4">
29
29
 
30
30
  <!-- Page header card -->
31
- <div v-if="title" class="flex items-center justify-between bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-2xl shadow-sm px-4 py-3">
31
+ <div v-if="title" class="flex items-center justify-between bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-sm px-4 py-3">
32
32
  <div class="flex items-center gap-x-4 min-w-0">
33
33
  <div v-if="iconComponent" class="shrink-0 size-10 rounded-xl flex items-center justify-center border border-current/15" :class="iconColorClass">
34
34
  <component :is="iconComponent" class="size-5" stroke="1.5" />
package/components/Nav/Tabs.vue CHANGED
@@ -28,7 +28,7 @@ const colorTextClass = computed(() => ({
28
28
  }[props.color] ?? 'text-blue-600 dark:text-blue-400'))
29
29
 
30
30
  const resolvedActiveClass = computed(() =>
31
- props.activeClass ?? `bg-white dark:bg-slate-800 shadow-sm ${colorTextClass.value}`
31
+ props.activeClass ?? `bg-white dark:bg-slate-900 shadow-sm ${colorTextClass.value}`
32
32
  )
33
33
 
34
34
  const route = useRoute()
@@ -38,7 +38,7 @@ const isActive = (tab: Tab) =>
38
38
  </script>
39
39
 
40
40
  <template>
41
- <div class="flex items-center gap-x-1 p-1 bg-slate-100 dark:bg-slate-900/50 rounded-xl w-fit border border-slate-200 dark:border-slate-700">
41
+ <div class="flex items-center gap-x-1 p-1 bg-slate-100 dark:bg-slate-900/50 rounded-xl w-fit border border-slate-200 dark:border-slate-800">
42
42
  <NuxtLink
43
43
  v-for="tab in tabs"
44
44
  :key="tab.to"
package/components/Table/Standard.vue CHANGED
@@ -203,10 +203,10 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
203
203
  <div class="relative" ref="containerRef">
204
204
 
205
205
  <!-- Card único -->
206
- <div class="bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-2xl shadow-sm overflow-hidden">
206
+ <div class="bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-2xl shadow-sm overflow-hidden">
207
207
 
208
208
  <!-- Toolbar -->
209
- <div class="flex flex-wrap items-center gap-3 px-4 py-3 border-b border-slate-200 dark:border-slate-700">
209
+ <div class="flex flex-wrap items-center gap-3 px-4 py-3 border-b border-slate-200 dark:border-slate-800">
210
210
  <div v-if="showSearch" class="flex-1 min-w-48">
211
211
  <Forms.Input v-model="search" type="search" :placeholder="searchPlaceholder" :icon-left="IconSearch" />
212
212
  </div>
@@ -219,7 +219,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
219
219
  'py-1.5 px-3 inline-flex items-center gap-2 text-sm font-medium rounded-lg border transition-colors',
220
220
  showFilterPanel || activeFilterCount > 0
221
221
  ? 'border-blue-500 bg-blue-50 text-blue-700 dark:bg-blue-900/20 dark:border-blue-500 dark:text-blue-300'
222
- : 'border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'
222
+ : 'border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-800'
223
223
  ]"
224
224
  >
225
225
  <IconAdjustmentsHorizontal class="size-4" stroke="1.5" />
@@ -238,7 +238,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
238
238
  <div
239
239
  v-if="showFilterPanel"
240
240
  ref="filterPanelRef"
241
- class="absolute top-full left-0 z-50 mt-1.5 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-2xl p-3 min-w-56 max-h-96 overflow-y-auto"
241
+ class="absolute top-full left-0 z-50 mt-1.5 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl p-3 min-w-56 max-h-96 overflow-y-auto"
242
242
  >
243
243
  <p class="text-[10px] font-bold text-slate-400 dark:text-slate-500 uppercase tracking-widest mb-3 px-1">Filtros</p>
244
244
  <TableFilter v-model="activeFilters" :columns="filtersConfig" />
@@ -255,7 +255,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
255
255
  'py-1.5 px-3 inline-flex items-center gap-2 text-sm font-medium rounded-lg border transition-colors',
256
256
  showColumnPanel
257
257
  ? 'border-blue-500 bg-blue-50 text-blue-700 dark:bg-blue-900/20 dark:border-blue-500 dark:text-blue-300'
258
- : 'border-slate-200 dark:border-slate-700 bg-white dark:bg-slate-800 text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-700'
258
+ : 'border-slate-200 dark:border-slate-800 bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-slate-800'
259
259
  ]"
260
260
  >
261
261
  <IconLayoutColumns class="size-4" />
@@ -303,7 +303,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
303
303
  >
304
304
  <div
305
305
  v-if="previewRow && previewEnabled"
306
- class="absolute top-0 right-0 z-30 flex bg-white dark:bg-slate-800 border-l border-slate-200 dark:border-slate-700 shadow-[-4px_0_16px_rgba(0,0,0,0.06)]"
306
+ class="absolute top-0 right-0 z-30 flex bg-white dark:bg-slate-900 border-l border-slate-200 dark:border-slate-800 shadow-[-4px_0_16px_rgba(0,0,0,0.06)]"
307
307
  :style="{ width: (100 - currentRatio) + '%', bottom: paginationHeight + 'px' }"
308
308
  >
309
309
  <!-- Resize handle -->
@@ -333,7 +333,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
333
333
  <div
334
334
  v-if="showColumnPanel"
335
335
  ref="columnPanelRef"
336
- class="absolute top-12 right-0 z-50 bg-white dark:bg-slate-800 border border-slate-200 dark:border-slate-700 rounded-xl shadow-2xl p-3 min-w-56 max-h-80 overflow-y-auto"
336
+ class="absolute top-12 right-0 z-50 bg-white dark:bg-slate-900 border border-slate-200 dark:border-slate-800 rounded-xl shadow-2xl p-3 min-w-56 max-h-80 overflow-y-auto"
337
337
  >
338
338
  <p class="text-[10px] font-bold text-slate-400 dark:text-slate-500 uppercase tracking-widest mb-2 px-1">
339
339
  Columnas visibles
@@ -349,7 +349,7 @@ defineExpose({ getSelectedRows, reload, clearCache, exportTable, tableRef })
349
349
  class="flex items-center gap-2 py-1.5 px-2 rounded-lg select-none transition-colors"
350
350
  :class="dragOverKey === col.key
351
351
  ? 'bg-blue-50 dark:bg-blue-900/20 ring-1 ring-blue-300 dark:ring-blue-700'
352
- : 'hover:bg-slate-50 dark:hover:bg-slate-700 cursor-grab'"
352
+ : 'hover:bg-slate-50 dark:hover:bg-slate-800 cursor-grab'"
353
353
  >
354
354
  <IconGripVertical class="size-4 text-slate-300 dark:text-slate-600 shrink-0" />
355
355
  <input
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@innertia-solutions/nuxt-theme-spark",
3
- "version": "0.1.105",
3
+ "version": "0.1.106",
4
4
  "description": "Innertia Solutions — Spark theme: backoffice, landing and mobile components and layouts",
5
5
  "keywords": [
6
6
  "nuxt",