negodesign 0.0.16 → 0.0.18
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.
|
@@ -4,9 +4,12 @@
|
|
|
4
4
|
import type { Snippet } from "svelte";
|
|
5
5
|
|
|
6
6
|
let {
|
|
7
|
-
navMenu,
|
|
8
7
|
items,
|
|
8
|
+
navMenu,
|
|
9
9
|
children,
|
|
10
|
+
className,
|
|
11
|
+
titleClass,
|
|
12
|
+
descriptionClass,
|
|
10
13
|
intervalMs = 5000,
|
|
11
14
|
transitionMs = 1200,
|
|
12
15
|
}: CarouselHeroProps & {
|
|
@@ -81,7 +84,7 @@
|
|
|
81
84
|
|
|
82
85
|
{#if selected}
|
|
83
86
|
<header
|
|
84
|
-
class="w-full relative flex flex-col justify-center items-center h-
|
|
87
|
+
class="w-full relative flex flex-col justify-center items-center h-75 md:h-100 overflow-hidden {className}"
|
|
85
88
|
>
|
|
86
89
|
{#each layers as bg, i (i)}
|
|
87
90
|
<div
|
|
@@ -108,10 +111,10 @@
|
|
|
108
111
|
class="opacity-0"
|
|
109
112
|
use:fadeIn
|
|
110
113
|
>
|
|
111
|
-
<h1 class="text-white text-2xl md:text-4xl font-bold">
|
|
114
|
+
<h1 class="text-white text-2xl md:text-4xl font-bold {titleClass}">
|
|
112
115
|
{selected.title}
|
|
113
116
|
</h1>
|
|
114
|
-
<p class="text-white/90 mt-2 max-w-2xl">
|
|
117
|
+
<p class="text-white/90 mt-2 max-w-2xl {descriptionClass}">
|
|
115
118
|
{selected.description}
|
|
116
119
|
</p>
|
|
117
120
|
</div>
|
|
@@ -39,6 +39,9 @@ export interface CarouselHeroItem {
|
|
|
39
39
|
description: string;
|
|
40
40
|
}
|
|
41
41
|
export interface CarouselHeroProps {
|
|
42
|
-
navMenu: NavMenuProps;
|
|
43
42
|
items: CarouselHeroItem[];
|
|
43
|
+
navMenu: NavMenuProps;
|
|
44
|
+
className?: string;
|
|
45
|
+
titleClass?: string;
|
|
46
|
+
descriptionClass?: string;
|
|
44
47
|
}
|
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
actions,
|
|
17
17
|
navClass = "",
|
|
18
18
|
linkClass = "",
|
|
19
|
+
groupClass = "",
|
|
19
20
|
buttonClass = "",
|
|
20
21
|
align = "LINK_SEPARATED_ACTIONS",
|
|
21
22
|
isLightSwitch = false,
|
|
@@ -94,11 +95,11 @@
|
|
|
94
95
|
{#if responsive.isMobile}
|
|
95
96
|
<NavMenuDrawer {links} {onclickButtonLogin} {onclickButtonRegister} />
|
|
96
97
|
{:else if align === "LINK_SEPARATED_ACTIONS"}
|
|
97
|
-
<MenuLinks {links} {linkClass} orientation="horizontal" />
|
|
98
|
+
<MenuLinks {links} {linkClass} {groupClass} orientation="horizontal" />
|
|
98
99
|
{@render actionButtons()}
|
|
99
100
|
{:else if align === "LINK_INTO_ACTIONS"}
|
|
100
101
|
<div class="flex items-center gap-2">
|
|
101
|
-
<MenuLinks {links} {linkClass} orientation="vertical" />
|
|
102
|
+
<MenuLinks {links} {linkClass} {groupClass} orientation="vertical" />
|
|
102
103
|
{@render actionButtons()}
|
|
103
104
|
</div>
|
|
104
105
|
{/if}
|
package/dist/globals.css
CHANGED
|
@@ -686,8 +686,8 @@
|
|
|
686
686
|
.h-72 {
|
|
687
687
|
height: calc(var(--spacing) * 72);
|
|
688
688
|
}
|
|
689
|
-
.h
|
|
690
|
-
height:
|
|
689
|
+
.h-75 {
|
|
690
|
+
height: calc(var(--spacing) * 75);
|
|
691
691
|
}
|
|
692
692
|
.h-\[calc\(100\%-1px\)\] {
|
|
693
693
|
height: calc(100% - 1px);
|
|
@@ -3241,12 +3241,12 @@
|
|
|
3241
3241
|
.md\:h-37\.5 {
|
|
3242
3242
|
height: calc(var(--spacing) * 37.5);
|
|
3243
3243
|
}
|
|
3244
|
+
.md\:h-100 {
|
|
3245
|
+
height: calc(var(--spacing) * 100);
|
|
3246
|
+
}
|
|
3244
3247
|
.md\:h-125 {
|
|
3245
3248
|
height: calc(var(--spacing) * 125);
|
|
3246
3249
|
}
|
|
3247
|
-
.md\:h-\[400px\] {
|
|
3248
|
-
height: 400px;
|
|
3249
|
-
}
|
|
3250
3250
|
.md\:min-h-15 {
|
|
3251
3251
|
min-height: calc(var(--spacing) * 15);
|
|
3252
3252
|
}
|