@nuxtify/pages 0.3.3 → 0.4.1
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/LICENSE +21 -21
- package/README.md +230 -222
- package/dist/module.d.mts +0 -21
- package/dist/module.json +1 -1
- package/dist/module.mjs +2 -10
- package/dist/runtime/components/EmailSubscribeForm.vue +68 -68
- package/dist/runtime/components/FooterCallToAction.vue +29 -29
- package/dist/runtime/components/app/AppBar.vue +108 -108
- package/dist/runtime/components/app/AppFooter.vue +103 -133
- package/dist/runtime/components/app/AppNavigationDrawer.vue +85 -85
- package/dist/runtime/layouts/DefaultLayout.vue +27 -26
- package/dist/runtime/pages/DynamicSlug.vue +14 -14
- package/dist/runtime/pages/IndexPage.vue +12 -12
- package/dist/runtime/server/tsconfig.json +3 -3
- package/package.json +64 -64
|
@@ -117,74 +117,74 @@ async function handleSubmit() {
|
|
|
117
117
|
</script>
|
|
118
118
|
|
|
119
119
|
<template>
|
|
120
|
-
<!-- Form -->
|
|
121
|
-
<v-form
|
|
122
|
-
v-if="!isSubmitted"
|
|
123
|
-
ref="form"
|
|
124
|
-
validate-on="submit"
|
|
125
|
-
@submit.prevent="handleSubmit"
|
|
126
|
-
>
|
|
127
|
-
<div class="d-sm-flex justify-center">
|
|
128
|
-
<!-- Using useId prevents hydration mismatch warnings issue with Vuetify -->
|
|
129
|
-
<!-- See: https://github.com/vuetifyjs/vuetify/issues/19696 -->
|
|
130
|
-
<!-- Once the issue is resolved (and it's used internally in Vuetify), remove use of useId -->
|
|
131
|
-
<v-text-field
|
|
132
|
-
:id
|
|
133
|
-
v-model="formInput.email"
|
|
134
|
-
type="email"
|
|
135
|
-
color="secondary"
|
|
136
|
-
:placeholder="emailPlaceholder"
|
|
137
|
-
:rules="[formRules.required, formRules.validEmail]"
|
|
138
|
-
:rounded="xs ? 't-lg' : '0 ts-lg'"
|
|
139
|
-
hide-details="auto"
|
|
140
|
-
class="text-start"
|
|
141
|
-
>
|
|
142
|
-
<template #message="{ message }">
|
|
143
|
-
<span :class="dark ? 'text-red-lighten-3' : ''">{{ message }}</span>
|
|
144
|
-
</template>
|
|
145
|
-
</v-text-field>
|
|
146
|
-
<v-btn
|
|
147
|
-
type="submit"
|
|
148
|
-
variant="flat"
|
|
149
|
-
color="secondary"
|
|
150
|
-
size="x-large"
|
|
151
|
-
class="d-flex align-center py-7 mt-2 mt-sm-0"
|
|
152
|
-
:loading
|
|
153
|
-
:rounded="rounded()"
|
|
154
|
-
:append-icon="appendButtonIcon"
|
|
155
|
-
:prepend-icon="prependButtonIcon"
|
|
156
|
-
:block="xs"
|
|
157
|
-
>
|
|
158
|
-
{{ buttonText }}
|
|
159
|
-
</v-btn>
|
|
160
|
-
</div>
|
|
161
|
-
|
|
162
|
-
<!-- Supporting Text -->
|
|
163
|
-
<div
|
|
164
|
-
v-if="showPrivacy || marketingConsentText"
|
|
165
|
-
:class="`text-body-2 ${dark ? 'text-grey-lighten-2' : 'text-medium-emphasis'} mt-2`"
|
|
166
|
-
>
|
|
167
|
-
<span v-if="marketingConsentText">
|
|
168
|
-
{{ marketingConsentText }}
|
|
169
|
-
</span>
|
|
170
|
-
<span v-if="showPrivacy">
|
|
171
|
-
By signing up you agree to the
|
|
172
|
-
<NuxtLink
|
|
173
|
-
:to="nuxtifyConfig.policies?.privacyUrl"
|
|
174
|
-
:class="`text-decoration-none ${dark ? 'text-grey-lighten-2' : 'text-medium-emphasis'}`"
|
|
175
|
-
>
|
|
176
|
-
Privacy Policy</NuxtLink>.
|
|
177
|
-
</span>
|
|
178
|
-
</div>
|
|
179
|
-
</v-form>
|
|
180
|
-
|
|
181
|
-
<!-- Thank You -->
|
|
182
|
-
<div
|
|
183
|
-
v-else
|
|
184
|
-
class="text-body-1"
|
|
185
|
-
>
|
|
186
|
-
{{ thankYouMessage }}
|
|
187
|
-
</div>
|
|
120
|
+
<!-- Form -->
|
|
121
|
+
<v-form
|
|
122
|
+
v-if="!isSubmitted"
|
|
123
|
+
ref="form"
|
|
124
|
+
validate-on="submit"
|
|
125
|
+
@submit.prevent="handleSubmit"
|
|
126
|
+
>
|
|
127
|
+
<div class="d-sm-flex justify-center">
|
|
128
|
+
<!-- Using useId prevents hydration mismatch warnings issue with Vuetify -->
|
|
129
|
+
<!-- See: https://github.com/vuetifyjs/vuetify/issues/19696 -->
|
|
130
|
+
<!-- Once the issue is resolved (and it's used internally in Vuetify), remove use of useId -->
|
|
131
|
+
<v-text-field
|
|
132
|
+
:id
|
|
133
|
+
v-model="formInput.email"
|
|
134
|
+
type="email"
|
|
135
|
+
color="secondary"
|
|
136
|
+
:placeholder="emailPlaceholder"
|
|
137
|
+
:rules="[formRules.required, formRules.validEmail]"
|
|
138
|
+
:rounded="xs ? 't-lg' : '0 ts-lg'"
|
|
139
|
+
hide-details="auto"
|
|
140
|
+
class="text-start"
|
|
141
|
+
>
|
|
142
|
+
<template #message="{ message }">
|
|
143
|
+
<span :class="dark ? 'text-red-lighten-3' : ''">{{ message }}</span>
|
|
144
|
+
</template>
|
|
145
|
+
</v-text-field>
|
|
146
|
+
<v-btn
|
|
147
|
+
type="submit"
|
|
148
|
+
variant="flat"
|
|
149
|
+
color="secondary"
|
|
150
|
+
size="x-large"
|
|
151
|
+
class="d-flex align-center py-7 mt-2 mt-sm-0"
|
|
152
|
+
:loading
|
|
153
|
+
:rounded="rounded()"
|
|
154
|
+
:append-icon="appendButtonIcon"
|
|
155
|
+
:prepend-icon="prependButtonIcon"
|
|
156
|
+
:block="xs"
|
|
157
|
+
>
|
|
158
|
+
{{ buttonText }}
|
|
159
|
+
</v-btn>
|
|
160
|
+
</div>
|
|
161
|
+
|
|
162
|
+
<!-- Supporting Text -->
|
|
163
|
+
<div
|
|
164
|
+
v-if="showPrivacy || marketingConsentText"
|
|
165
|
+
:class="`text-body-2 ${dark ? 'text-grey-lighten-2' : 'text-medium-emphasis'} mt-2`"
|
|
166
|
+
>
|
|
167
|
+
<span v-if="marketingConsentText">
|
|
168
|
+
{{ marketingConsentText }}
|
|
169
|
+
</span>
|
|
170
|
+
<span v-if="showPrivacy">
|
|
171
|
+
By signing up you agree to the
|
|
172
|
+
<NuxtLink
|
|
173
|
+
:to="nuxtifyConfig.policies?.privacyUrl"
|
|
174
|
+
:class="`text-decoration-none ${dark ? 'text-grey-lighten-2' : 'text-medium-emphasis'}`"
|
|
175
|
+
>
|
|
176
|
+
Privacy Policy</NuxtLink>.
|
|
177
|
+
</span>
|
|
178
|
+
</div>
|
|
179
|
+
</v-form>
|
|
180
|
+
|
|
181
|
+
<!-- Thank You -->
|
|
182
|
+
<div
|
|
183
|
+
v-else
|
|
184
|
+
class="text-body-1"
|
|
185
|
+
>
|
|
186
|
+
{{ thankYouMessage }}
|
|
187
|
+
</div>
|
|
188
188
|
</template>
|
|
189
189
|
|
|
190
190
|
<style scoped>
|
|
@@ -4,33 +4,33 @@ const nuxtifyConfig = useNuxtifyConfig();
|
|
|
4
4
|
</script>
|
|
5
5
|
|
|
6
6
|
<template>
|
|
7
|
-
<v-row
|
|
8
|
-
justify="center"
|
|
9
|
-
class="text-center my-4"
|
|
10
|
-
>
|
|
11
|
-
<v-col
|
|
12
|
-
cols="12"
|
|
13
|
-
md="7"
|
|
14
|
-
lg="6"
|
|
15
|
-
xl="4"
|
|
16
|
-
>
|
|
17
|
-
<div
|
|
18
|
-
v-if="nuxtifyConfig.footer?.cta?.title"
|
|
19
|
-
:class="`text-h5 text-${nuxtifyConfig.footer.cta.color}-lighten-4`"
|
|
20
|
-
>
|
|
21
|
-
{{ nuxtifyConfig.footer.cta.title }}
|
|
22
|
-
</div>
|
|
23
|
-
<div
|
|
24
|
-
v-if="nuxtifyConfig.footer?.cta?.subtitle"
|
|
25
|
-
:class="`text-subtitle-1 text-${nuxtifyConfig.footer.cta.color}-lighten-3 mb-4`"
|
|
26
|
-
>
|
|
27
|
-
{{ nuxtifyConfig.footer.cta.subtitle }}
|
|
28
|
-
</div>
|
|
29
|
-
<EmailSubscribeForm
|
|
30
|
-
v-if="nuxtifyConfig.email?.provider?.defaultSubmitUrl"
|
|
31
|
-
:submit-url="nuxtifyConfig.email.provider.defaultSubmitUrl"
|
|
32
|
-
dark
|
|
33
|
-
/>
|
|
34
|
-
</v-col>
|
|
35
|
-
</v-row>
|
|
7
|
+
<v-row
|
|
8
|
+
justify="center"
|
|
9
|
+
class="text-center my-4"
|
|
10
|
+
>
|
|
11
|
+
<v-col
|
|
12
|
+
cols="12"
|
|
13
|
+
md="7"
|
|
14
|
+
lg="6"
|
|
15
|
+
xl="4"
|
|
16
|
+
>
|
|
17
|
+
<div
|
|
18
|
+
v-if="nuxtifyConfig.footer?.cta?.title"
|
|
19
|
+
:class="`text-h5 text-${nuxtifyConfig.footer.cta.color}-lighten-4`"
|
|
20
|
+
>
|
|
21
|
+
{{ nuxtifyConfig.footer.cta.title }}
|
|
22
|
+
</div>
|
|
23
|
+
<div
|
|
24
|
+
v-if="nuxtifyConfig.footer?.cta?.subtitle"
|
|
25
|
+
:class="`text-subtitle-1 text-${nuxtifyConfig.footer.cta.color}-lighten-3 mb-4`"
|
|
26
|
+
>
|
|
27
|
+
{{ nuxtifyConfig.footer.cta.subtitle }}
|
|
28
|
+
</div>
|
|
29
|
+
<EmailSubscribeForm
|
|
30
|
+
v-if="nuxtifyConfig.email?.provider?.defaultSubmitUrl"
|
|
31
|
+
:submit-url="nuxtifyConfig.email.provider.defaultSubmitUrl"
|
|
32
|
+
dark
|
|
33
|
+
/>
|
|
34
|
+
</v-col>
|
|
35
|
+
</v-row>
|
|
36
36
|
</template>
|
|
@@ -9,114 +9,114 @@ const featuredSecondaryLink = secondaryNavLinks?.slice(0, 1)[0];
|
|
|
9
9
|
</script>
|
|
10
10
|
|
|
11
11
|
<template>
|
|
12
|
-
<v-app-bar
|
|
13
|
-
:density="smAndDown ? 'compact' : 'default'"
|
|
14
|
-
flat
|
|
15
|
-
class="px-sm-2 bottom-border"
|
|
16
|
-
>
|
|
17
|
-
<template #prepend>
|
|
18
|
-
<!-- Logo -->
|
|
19
|
-
<NuxtLink
|
|
20
|
-
to="/"
|
|
21
|
-
class="ml-2"
|
|
22
|
-
>
|
|
23
|
-
<AppLogo />
|
|
24
|
-
</NuxtLink>
|
|
25
|
-
</template>
|
|
26
|
-
|
|
27
|
-
<!-- Desktop navigation -->
|
|
28
|
-
<div v-if="!smAndDown">
|
|
29
|
-
<!-- Primary links -->
|
|
30
|
-
<v-btn
|
|
31
|
-
v-for="link in primaryNavLinks"
|
|
32
|
-
:key="link.text"
|
|
33
|
-
:to="link.to"
|
|
34
|
-
:href="link.href"
|
|
35
|
-
:active="false"
|
|
36
|
-
:prepend-icon="link.icon"
|
|
37
|
-
slim
|
|
38
|
-
exact
|
|
39
|
-
:ripple="false"
|
|
40
|
-
size="large"
|
|
41
|
-
color="unset"
|
|
42
|
-
:target="link.openInNew ? '_blank' : void 0"
|
|
43
|
-
:rel="link.openInNew ? 'noopener nofollow' : void 0"
|
|
44
|
-
class="nav-items mx-2"
|
|
45
|
-
>
|
|
46
|
-
{{ link.text }}
|
|
47
|
-
<v-icon
|
|
48
|
-
v-if="link.openInNew"
|
|
49
|
-
:icon="mdiArrowTopRight"
|
|
50
|
-
size="x-small"
|
|
51
|
-
color="grey"
|
|
52
|
-
class="ml-1"
|
|
53
|
-
/>
|
|
54
|
-
</v-btn>
|
|
55
|
-
</div>
|
|
56
|
-
|
|
57
|
-
<template #append>
|
|
58
|
-
<!-- Mobile navigation -->
|
|
59
|
-
<v-app-bar-nav-icon
|
|
60
|
-
v-if="smAndDown"
|
|
61
|
-
:icon="drawer ? mdiClose : mdiMenu"
|
|
62
|
-
color="primary"
|
|
63
|
-
aria-label="Navigation Menu"
|
|
64
|
-
@click="drawer = !drawer"
|
|
65
|
-
/>
|
|
66
|
-
|
|
67
|
-
<!-- Desktop navigation -->
|
|
68
|
-
<nav
|
|
69
|
-
v-else
|
|
70
|
-
class="d-flex align-center"
|
|
71
|
-
>
|
|
72
|
-
<!-- Secondary links -->
|
|
73
|
-
<v-btn
|
|
74
|
-
v-for="link in secondaryNavLinks?.slice(1).reverse()"
|
|
75
|
-
:key="link.text"
|
|
76
|
-
:to="link.to"
|
|
77
|
-
:href="link.href"
|
|
78
|
-
:prepend-icon="link.icon"
|
|
79
|
-
:active="false"
|
|
80
|
-
size="large"
|
|
81
|
-
color="unset"
|
|
82
|
-
:target="link.openInNew ? '_blank' : void 0"
|
|
83
|
-
:rel="link.openInNew ? 'noopener nofollow' : void 0"
|
|
84
|
-
class="nav-items mx-2"
|
|
85
|
-
>
|
|
86
|
-
{{ link.text }}
|
|
87
|
-
<v-icon
|
|
88
|
-
v-if="link.openInNew"
|
|
89
|
-
:icon="mdiArrowTopRight"
|
|
90
|
-
size="x-small"
|
|
91
|
-
color="grey"
|
|
92
|
-
class="ml-1"
|
|
93
|
-
/>
|
|
94
|
-
</v-btn>
|
|
95
|
-
|
|
96
|
-
<!-- Featured secondary link -->
|
|
97
|
-
<v-btn
|
|
98
|
-
v-if="featuredSecondaryLink?.text"
|
|
99
|
-
:to="featuredSecondaryLink.to"
|
|
100
|
-
:href="featuredSecondaryLink.href"
|
|
101
|
-
:prepend-icon="featuredSecondaryLink.icon"
|
|
102
|
-
:active="false"
|
|
103
|
-
variant="flat"
|
|
104
|
-
size="large"
|
|
105
|
-
:target="featuredSecondaryLink.openInNew ? '_blank' : void 0"
|
|
106
|
-
:rel="featuredSecondaryLink.openInNew ? 'noopener nofollow' : void 0"
|
|
107
|
-
class="mx-2"
|
|
108
|
-
>
|
|
109
|
-
{{ featuredSecondaryLink.text }}
|
|
110
|
-
<v-icon
|
|
111
|
-
v-if="featuredSecondaryLink.openInNew"
|
|
112
|
-
:icon="mdiArrowTopRight"
|
|
113
|
-
size="small"
|
|
114
|
-
class="ml-1"
|
|
115
|
-
/>
|
|
116
|
-
</v-btn>
|
|
117
|
-
</nav>
|
|
118
|
-
</template>
|
|
119
|
-
</v-app-bar>
|
|
12
|
+
<v-app-bar
|
|
13
|
+
:density="smAndDown ? 'compact' : 'default'"
|
|
14
|
+
flat
|
|
15
|
+
class="px-sm-2 bottom-border"
|
|
16
|
+
>
|
|
17
|
+
<template #prepend>
|
|
18
|
+
<!-- Logo -->
|
|
19
|
+
<NuxtLink
|
|
20
|
+
to="/"
|
|
21
|
+
class="ml-2"
|
|
22
|
+
>
|
|
23
|
+
<AppLogo />
|
|
24
|
+
</NuxtLink>
|
|
25
|
+
</template>
|
|
26
|
+
|
|
27
|
+
<!-- Desktop navigation -->
|
|
28
|
+
<div v-if="!smAndDown">
|
|
29
|
+
<!-- Primary links -->
|
|
30
|
+
<v-btn
|
|
31
|
+
v-for="link in primaryNavLinks"
|
|
32
|
+
:key="link.text"
|
|
33
|
+
:to="link.to"
|
|
34
|
+
:href="link.href"
|
|
35
|
+
:active="false"
|
|
36
|
+
:prepend-icon="link.icon"
|
|
37
|
+
slim
|
|
38
|
+
exact
|
|
39
|
+
:ripple="false"
|
|
40
|
+
size="large"
|
|
41
|
+
color="unset"
|
|
42
|
+
:target="link.openInNew ? '_blank' : void 0"
|
|
43
|
+
:rel="link.openInNew ? 'noopener nofollow' : void 0"
|
|
44
|
+
class="nav-items mx-2"
|
|
45
|
+
>
|
|
46
|
+
{{ link.text }}
|
|
47
|
+
<v-icon
|
|
48
|
+
v-if="link.openInNew"
|
|
49
|
+
:icon="mdiArrowTopRight"
|
|
50
|
+
size="x-small"
|
|
51
|
+
color="grey"
|
|
52
|
+
class="ml-1"
|
|
53
|
+
/>
|
|
54
|
+
</v-btn>
|
|
55
|
+
</div>
|
|
56
|
+
|
|
57
|
+
<template #append>
|
|
58
|
+
<!-- Mobile navigation -->
|
|
59
|
+
<v-app-bar-nav-icon
|
|
60
|
+
v-if="smAndDown"
|
|
61
|
+
:icon="drawer ? mdiClose : mdiMenu"
|
|
62
|
+
color="primary"
|
|
63
|
+
aria-label="Navigation Menu"
|
|
64
|
+
@click="drawer = !drawer"
|
|
65
|
+
/>
|
|
66
|
+
|
|
67
|
+
<!-- Desktop navigation -->
|
|
68
|
+
<nav
|
|
69
|
+
v-else
|
|
70
|
+
class="d-flex align-center"
|
|
71
|
+
>
|
|
72
|
+
<!-- Secondary links -->
|
|
73
|
+
<v-btn
|
|
74
|
+
v-for="link in secondaryNavLinks?.slice(1).reverse()"
|
|
75
|
+
:key="link.text"
|
|
76
|
+
:to="link.to"
|
|
77
|
+
:href="link.href"
|
|
78
|
+
:prepend-icon="link.icon"
|
|
79
|
+
:active="false"
|
|
80
|
+
size="large"
|
|
81
|
+
color="unset"
|
|
82
|
+
:target="link.openInNew ? '_blank' : void 0"
|
|
83
|
+
:rel="link.openInNew ? 'noopener nofollow' : void 0"
|
|
84
|
+
class="nav-items mx-2"
|
|
85
|
+
>
|
|
86
|
+
{{ link.text }}
|
|
87
|
+
<v-icon
|
|
88
|
+
v-if="link.openInNew"
|
|
89
|
+
:icon="mdiArrowTopRight"
|
|
90
|
+
size="x-small"
|
|
91
|
+
color="grey"
|
|
92
|
+
class="ml-1"
|
|
93
|
+
/>
|
|
94
|
+
</v-btn>
|
|
95
|
+
|
|
96
|
+
<!-- Featured secondary link -->
|
|
97
|
+
<v-btn
|
|
98
|
+
v-if="featuredSecondaryLink?.text"
|
|
99
|
+
:to="featuredSecondaryLink.to"
|
|
100
|
+
:href="featuredSecondaryLink.href"
|
|
101
|
+
:prepend-icon="featuredSecondaryLink.icon"
|
|
102
|
+
:active="false"
|
|
103
|
+
variant="flat"
|
|
104
|
+
size="large"
|
|
105
|
+
:target="featuredSecondaryLink.openInNew ? '_blank' : void 0"
|
|
106
|
+
:rel="featuredSecondaryLink.openInNew ? 'noopener nofollow' : void 0"
|
|
107
|
+
class="mx-2"
|
|
108
|
+
>
|
|
109
|
+
{{ featuredSecondaryLink.text }}
|
|
110
|
+
<v-icon
|
|
111
|
+
v-if="featuredSecondaryLink.openInNew"
|
|
112
|
+
:icon="mdiArrowTopRight"
|
|
113
|
+
size="small"
|
|
114
|
+
class="ml-1"
|
|
115
|
+
/>
|
|
116
|
+
</v-btn>
|
|
117
|
+
</nav>
|
|
118
|
+
</template>
|
|
119
|
+
</v-app-bar>
|
|
120
120
|
</template>
|
|
121
121
|
|
|
122
122
|
<style scoped>
|