@bobbykim/mcl-footer 0.9.7 → 0.9.9
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/dist/index.d.ts +30 -50
- package/dist/mcl-footer.js +93 -94
- package/dist/mcl-footer.umd.cjs +5 -5
- package/package.json +3 -3
package/dist/index.d.ts
CHANGED
|
@@ -7,56 +7,10 @@ import { DefineComponent } from 'vue';
|
|
|
7
7
|
import { HeadingSize } from '@bobbykim/manguito-theme';
|
|
8
8
|
import { PublicProps } from 'vue';
|
|
9
9
|
|
|
10
|
-
declare const __VLS_component: DefineComponent<
|
|
11
|
-
title: string;
|
|
12
|
-
titleSize?: HeadingSize;
|
|
13
|
-
titleColor?: ColorPalette;
|
|
14
|
-
logo: string;
|
|
15
|
-
logoAlt?: string;
|
|
16
|
-
logoAsLink?: boolean;
|
|
17
|
-
logoLink: string;
|
|
18
|
-
logoLinkTarget?: CtaTarget;
|
|
19
|
-
displaySocialIcons?: boolean;
|
|
20
|
-
socialIconColor: ColorPalette;
|
|
21
|
-
socialLinks?: SocialUrl;
|
|
22
|
-
menuItems: MenuItemType[];
|
|
23
|
-
secondaryMenuItems?: MenuItemType[];
|
|
24
|
-
menuItemAsLink?: boolean;
|
|
25
|
-
menuTextSize?: BodyText;
|
|
26
|
-
menuTextColor?: ColorPalette;
|
|
27
|
-
menuTextBold?: boolean;
|
|
28
|
-
displayHighlight?: boolean;
|
|
29
|
-
highlightColor?: ColorPalette;
|
|
30
|
-
bgColor?: ColorPalette;
|
|
31
|
-
borderTopColor?: ColorPalette;
|
|
32
|
-
headlineColor?: ColorPalette;
|
|
33
|
-
}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
|
|
10
|
+
declare const __VLS_component: DefineComponent<__VLS_Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
|
|
34
11
|
"logo-click": (event: Event, link: string, target: CtaTarget) => any;
|
|
35
12
|
"menu-click": (event: Event, item: MenuItemType) => any;
|
|
36
|
-
}, string, PublicProps, Readonly<{
|
|
37
|
-
title: string;
|
|
38
|
-
titleSize?: HeadingSize;
|
|
39
|
-
titleColor?: ColorPalette;
|
|
40
|
-
logo: string;
|
|
41
|
-
logoAlt?: string;
|
|
42
|
-
logoAsLink?: boolean;
|
|
43
|
-
logoLink: string;
|
|
44
|
-
logoLinkTarget?: CtaTarget;
|
|
45
|
-
displaySocialIcons?: boolean;
|
|
46
|
-
socialIconColor: ColorPalette;
|
|
47
|
-
socialLinks?: SocialUrl;
|
|
48
|
-
menuItems: MenuItemType[];
|
|
49
|
-
secondaryMenuItems?: MenuItemType[];
|
|
50
|
-
menuItemAsLink?: boolean;
|
|
51
|
-
menuTextSize?: BodyText;
|
|
52
|
-
menuTextColor?: ColorPalette;
|
|
53
|
-
menuTextBold?: boolean;
|
|
54
|
-
displayHighlight?: boolean;
|
|
55
|
-
highlightColor?: ColorPalette;
|
|
56
|
-
bgColor?: ColorPalette;
|
|
57
|
-
borderTopColor?: ColorPalette;
|
|
58
|
-
headlineColor?: ColorPalette;
|
|
59
|
-
}> & Readonly<{
|
|
13
|
+
}, string, PublicProps, Readonly<__VLS_Props> & Readonly<{
|
|
60
14
|
"onLogo-click"?: ((event: Event, link: string, target: CtaTarget) => any) | undefined;
|
|
61
15
|
"onMenu-click"?: ((event: Event, item: MenuItemType) => any) | undefined;
|
|
62
16
|
}>, {
|
|
@@ -75,16 +29,42 @@ highlightColor: ColorPalette;
|
|
|
75
29
|
bgColor: ColorPalette;
|
|
76
30
|
borderTopColor: ColorPalette;
|
|
77
31
|
headlineColor: ColorPalette;
|
|
78
|
-
}, {}, {}, {}, string, ComponentProvideOptions, false, {},
|
|
32
|
+
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLElement>;
|
|
33
|
+
|
|
34
|
+
declare type __VLS_Props = {
|
|
35
|
+
title: string;
|
|
36
|
+
titleSize?: HeadingSize;
|
|
37
|
+
titleColor?: ColorPalette;
|
|
38
|
+
logo: string;
|
|
39
|
+
logoAlt?: string;
|
|
40
|
+
logoAsLink?: boolean;
|
|
41
|
+
logoLink: string;
|
|
42
|
+
logoLinkTarget?: CtaTarget;
|
|
43
|
+
displaySocialIcons?: boolean;
|
|
44
|
+
socialIconColor: ColorPalette;
|
|
45
|
+
socialLinks?: SocialUrl;
|
|
46
|
+
menuItems: MenuItemType[];
|
|
47
|
+
secondaryMenuItems?: MenuItemType[];
|
|
48
|
+
menuItemAsLink?: boolean;
|
|
49
|
+
menuTextSize?: BodyText;
|
|
50
|
+
menuTextColor?: ColorPalette;
|
|
51
|
+
menuTextBold?: boolean;
|
|
52
|
+
displayHighlight?: boolean;
|
|
53
|
+
highlightColor?: ColorPalette;
|
|
54
|
+
bgColor?: ColorPalette;
|
|
55
|
+
borderTopColor?: ColorPalette;
|
|
56
|
+
headlineColor?: ColorPalette;
|
|
57
|
+
};
|
|
79
58
|
|
|
80
59
|
declare function __VLS_template(): {
|
|
60
|
+
attrs: Partial<{}>;
|
|
81
61
|
slots: Readonly<{
|
|
82
62
|
default: any;
|
|
83
63
|
}> & {
|
|
84
64
|
default: any;
|
|
85
65
|
};
|
|
86
66
|
refs: {};
|
|
87
|
-
|
|
67
|
+
rootEl: HTMLElement;
|
|
88
68
|
};
|
|
89
69
|
|
|
90
70
|
declare type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
|
package/dist/mcl-footer.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.nav__decorator[data-v-21dde3ea]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-21dde3ea]:before,.nav__text:hover+.nav__decorator[data-v-21dde3ea]:before{width:100%}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
-
import { defineComponent as b, computed as
|
|
3
|
-
import
|
|
4
|
-
const
|
|
2
|
+
import { defineComponent as b, computed as k, openBlock as c, createElementBlock as r, Fragment as L, renderList as v, createElementVNode as t, normalizeClass as d, useSlots as T, unref as h, createVNode as I, createCommentVNode as x, renderSlot as A } from "vue";
|
|
3
|
+
import a from "@bobbykim/manguito-theme";
|
|
4
|
+
const _ = `<svg
|
|
5
5
|
xmlns="http://www.w3.org/2000/svg"
|
|
6
6
|
viewBox="0 0 448 512"
|
|
7
7
|
fill="currentColor"
|
|
@@ -55,45 +55,44 @@ const A = `<svg
|
|
|
55
55
|
iconColor: { default: "light-1" },
|
|
56
56
|
socialLinks: {}
|
|
57
57
|
},
|
|
58
|
-
setup(
|
|
59
|
-
const
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
url: t.socialLinks.linkedin,
|
|
58
|
+
setup(e) {
|
|
59
|
+
const s = e, m = k(() => {
|
|
60
|
+
const o = [];
|
|
61
|
+
return s.socialLinks?.linkedin && o.push({
|
|
62
|
+
url: s.socialLinks.linkedin,
|
|
64
63
|
icon: H,
|
|
65
64
|
label: "linkedin social icon"
|
|
66
|
-
}),
|
|
67
|
-
url:
|
|
68
|
-
icon:
|
|
65
|
+
}), s.socialLinks?.github && o.push({
|
|
66
|
+
url: s.socialLinks.github,
|
|
67
|
+
icon: _,
|
|
69
68
|
label: "github social icon"
|
|
70
|
-
}),
|
|
71
|
-
url:
|
|
69
|
+
}), s.socialLinks?.instagram && o.push({
|
|
70
|
+
url: s.socialLinks.instagram,
|
|
72
71
|
icon: M,
|
|
73
72
|
label: "instagram social icon"
|
|
74
|
-
}),
|
|
75
|
-
url:
|
|
73
|
+
}), s.socialLinks?.twitter && o.push({
|
|
74
|
+
url: s.socialLinks.twitter,
|
|
76
75
|
icon: z,
|
|
77
76
|
label: "x/twitter social icon"
|
|
78
|
-
}),
|
|
79
|
-
}),
|
|
80
|
-
|
|
81
|
-
|
|
77
|
+
}), o;
|
|
78
|
+
}), u = (o) => [
|
|
79
|
+
a("TEXTCOLOR", o),
|
|
80
|
+
a("RINGCOLOR", o)
|
|
82
81
|
].join(" ");
|
|
83
|
-
return (
|
|
84
|
-
(
|
|
85
|
-
key:
|
|
82
|
+
return (o, w) => (c(), r("ul", B, [
|
|
83
|
+
(c(!0), r(L, null, v(m.value, (g, C) => (c(), r("li", {
|
|
84
|
+
key: C,
|
|
86
85
|
class: "mr-xs last:mr-0"
|
|
87
86
|
}, [
|
|
88
|
-
|
|
89
|
-
href:
|
|
87
|
+
t("a", {
|
|
88
|
+
href: g.url,
|
|
90
89
|
target: "_blank",
|
|
91
|
-
class: d(["inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",
|
|
92
|
-
"aria-label":
|
|
90
|
+
class: d(["inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear", u(e.iconColor)]),
|
|
91
|
+
"aria-label": g.label,
|
|
93
92
|
role: "button"
|
|
94
93
|
}, [
|
|
95
|
-
|
|
96
|
-
innerHTML:
|
|
94
|
+
t("div", {
|
|
95
|
+
innerHTML: g.icon
|
|
97
96
|
}, null, 8, V)
|
|
98
97
|
], 10, O)
|
|
99
98
|
]))), 128))
|
|
@@ -132,119 +131,119 @@ const A = `<svg
|
|
|
132
131
|
headlineColor: { default: "light-1" }
|
|
133
132
|
},
|
|
134
133
|
emits: ["logo-click", "menu-click"],
|
|
135
|
-
setup(
|
|
136
|
-
const
|
|
137
|
-
|
|
138
|
-
const
|
|
139
|
-
const { bgColor:
|
|
134
|
+
setup(e, { emit: s }) {
|
|
135
|
+
const m = e;
|
|
136
|
+
T();
|
|
137
|
+
const u = s, o = k(() => {
|
|
138
|
+
const { bgColor: l, borderTopColor: i } = m;
|
|
140
139
|
return [
|
|
141
|
-
|
|
142
|
-
|
|
140
|
+
a("BGCOLOR", l),
|
|
141
|
+
a("BORDER", i)
|
|
143
142
|
].join(" ");
|
|
144
|
-
}),
|
|
145
|
-
const { titleSize:
|
|
143
|
+
}), w = k(() => {
|
|
144
|
+
const { titleSize: l, titleColor: i } = m;
|
|
146
145
|
return [
|
|
147
|
-
|
|
148
|
-
|
|
146
|
+
a("H2", l),
|
|
147
|
+
a("TEXTCOLOR", i)
|
|
149
148
|
].join(" ");
|
|
150
|
-
}),
|
|
151
|
-
const { menuTextSize:
|
|
149
|
+
}), g = k(() => {
|
|
150
|
+
const { menuTextSize: l, menuTextColor: i, menuTextBold: n } = m;
|
|
152
151
|
return [
|
|
153
|
-
|
|
154
|
-
|
|
152
|
+
a("BODYTEXT", l),
|
|
153
|
+
a("TEXTCOLOR", i)
|
|
155
154
|
].join(" ");
|
|
156
|
-
}),
|
|
157
|
-
const { logoAsLink:
|
|
158
|
-
!
|
|
159
|
-
},
|
|
160
|
-
const { menuItemAsLink: n } =
|
|
161
|
-
!n &&
|
|
155
|
+
}), C = (l) => {
|
|
156
|
+
const { logoAsLink: i, logoLink: n, logoLinkTarget: f } = m;
|
|
157
|
+
!i && l.preventDefault(), u("logo-click", l, n, f);
|
|
158
|
+
}, p = (l, i) => {
|
|
159
|
+
const { menuItemAsLink: n } = m;
|
|
160
|
+
!n && l.preventDefault(), u("menu-click", l, i);
|
|
162
161
|
};
|
|
163
|
-
return (
|
|
164
|
-
class: d(["border-t-2 py-6 sm:py-8 md:py-12",
|
|
162
|
+
return (l, i) => (c(), r("footer", {
|
|
163
|
+
class: d(["border-t-2 py-6 sm:py-8 md:py-12", o.value])
|
|
165
164
|
}, [
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
class: d(["flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2",
|
|
165
|
+
t("div", R, [
|
|
166
|
+
t("div", {
|
|
167
|
+
class: d(["flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2", h(a)("BORDER", e.headlineColor)])
|
|
169
168
|
}, [
|
|
170
|
-
|
|
171
|
-
|
|
169
|
+
t("div", j, [
|
|
170
|
+
t("a", {
|
|
172
171
|
href: e.logoLink,
|
|
173
172
|
target: e.logoLinkTarget,
|
|
174
|
-
class: d(["h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",
|
|
175
|
-
onClick:
|
|
173
|
+
class: d(["h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear", h(a)("RINGCOLOR", e.titleColor)]),
|
|
174
|
+
onClick: i[0] || (i[0] = (n) => C(n))
|
|
176
175
|
}, [
|
|
177
|
-
|
|
176
|
+
t("img", {
|
|
178
177
|
class: "inline-block h-full",
|
|
179
178
|
src: e.logo,
|
|
180
179
|
alt: e.logoAlt
|
|
181
180
|
}, null, 8, E)
|
|
182
181
|
], 10, S)
|
|
183
182
|
]),
|
|
184
|
-
e.displaySocialIcons ? (
|
|
185
|
-
|
|
183
|
+
e.displaySocialIcons ? (c(), r("div", $, [
|
|
184
|
+
I(F, {
|
|
186
185
|
"social-links": e.socialLinks,
|
|
187
186
|
"icon-color": e.socialIconColor
|
|
188
187
|
}, null, 8, ["social-links", "icon-color"])
|
|
189
|
-
])) :
|
|
188
|
+
])) : x("", !0)
|
|
190
189
|
], 2),
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
class: d(["inline-block align-middle tracking-wider",
|
|
190
|
+
t("div", G, [
|
|
191
|
+
t("div", Z, [
|
|
192
|
+
t("h2", {
|
|
193
|
+
class: d(["inline-block align-middle tracking-wider", w.value]),
|
|
195
194
|
innerHTML: e.title
|
|
196
195
|
}, null, 10, D),
|
|
197
|
-
|
|
198
|
-
|
|
196
|
+
t("div", N, [
|
|
197
|
+
A(l.$slots, "default", {}, void 0, !0)
|
|
199
198
|
])
|
|
200
199
|
]),
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
(
|
|
204
|
-
key: `first-nav-${
|
|
200
|
+
t("nav", X, [
|
|
201
|
+
t("ul", P, [
|
|
202
|
+
(c(!0), r(L, null, v(e.menuItems, (n, f) => (c(), r("li", {
|
|
203
|
+
key: `first-nav-${f}`,
|
|
205
204
|
class: "inline-block"
|
|
206
205
|
}, [
|
|
207
|
-
|
|
206
|
+
t("a", {
|
|
208
207
|
href: n.url,
|
|
209
208
|
target: n.target ? n.target : "_self",
|
|
210
|
-
class: d(["tracking-wide outline-none nav__text",
|
|
211
|
-
onClick: (
|
|
209
|
+
class: d(["tracking-wide outline-none nav__text", g.value]),
|
|
210
|
+
onClick: (y) => p(y, n),
|
|
212
211
|
innerHTML: n.title
|
|
213
212
|
}, null, 10, Y),
|
|
214
|
-
e.displayHighlight ? (
|
|
213
|
+
e.displayHighlight ? (c(), r("div", {
|
|
215
214
|
key: 0,
|
|
216
|
-
class: d(["relative top-3xs h-3xs nav__decorator",
|
|
217
|
-
}, null, 2)) :
|
|
215
|
+
class: d(["relative top-3xs h-3xs nav__decorator", h(a)("BEFOREBG", e.highlightColor)])
|
|
216
|
+
}, null, 2)) : x("", !0)
|
|
218
217
|
]))), 128))
|
|
219
218
|
]),
|
|
220
|
-
e.secondaryMenuItems ? (
|
|
221
|
-
(
|
|
222
|
-
key: `second-nav-${
|
|
219
|
+
e.secondaryMenuItems ? (c(), r("ul", q, [
|
|
220
|
+
(c(!0), r(L, null, v(e.secondaryMenuItems, (n, f) => (c(), r("li", {
|
|
221
|
+
key: `second-nav-${f}`,
|
|
223
222
|
class: "inline-block"
|
|
224
223
|
}, [
|
|
225
|
-
|
|
224
|
+
t("a", {
|
|
226
225
|
href: n.url,
|
|
227
226
|
target: n.target ? n.target : "_self",
|
|
228
|
-
class: d(["tracking-wide outline-none nav__text",
|
|
229
|
-
onClick: (
|
|
227
|
+
class: d(["tracking-wide outline-none nav__text", g.value]),
|
|
228
|
+
onClick: (y) => p(y, n),
|
|
230
229
|
innerHTML: n.title
|
|
231
230
|
}, null, 10, J),
|
|
232
|
-
e.displayHighlight ? (
|
|
231
|
+
e.displayHighlight ? (c(), r("div", {
|
|
233
232
|
key: 0,
|
|
234
|
-
class: d(["relative top-3xs h-3xs nav__decorator",
|
|
235
|
-
}, null, 2)) :
|
|
233
|
+
class: d(["relative top-3xs h-3xs nav__decorator", h(a)("BEFOREBG", e.highlightColor)])
|
|
234
|
+
}, null, 2)) : x("", !0)
|
|
236
235
|
]))), 128))
|
|
237
|
-
])) :
|
|
236
|
+
])) : x("", !0)
|
|
238
237
|
])
|
|
239
238
|
])
|
|
240
239
|
])
|
|
241
240
|
], 2));
|
|
242
241
|
}
|
|
243
|
-
}), Q = (
|
|
244
|
-
const
|
|
245
|
-
for (const [
|
|
246
|
-
|
|
247
|
-
return
|
|
242
|
+
}), Q = (e, s) => {
|
|
243
|
+
const m = e.__vccOpts || e;
|
|
244
|
+
for (const [u, o] of s)
|
|
245
|
+
m[u] = o;
|
|
246
|
+
return m;
|
|
248
247
|
}, ee = /* @__PURE__ */ Q(K, [["__scopeId", "data-v-21dde3ea"]]);
|
|
249
248
|
export {
|
|
250
249
|
ee as MclFooterA
|
package/dist/mcl-footer.umd.cjs
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode('.nav__decorator[data-v-21dde3ea]:before{content:"";position:absolute;bottom:0;left:0;height:100%;width:0;transition:width .3s linear}.nav__text:focus+.nav__decorator[data-v-21dde3ea]:before,.nav__text:hover+.nav__decorator[data-v-21dde3ea]:before{width:100%}')),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
|
|
2
|
-
(function(
|
|
2
|
+
(function(r,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@bobbykim/manguito-theme")):typeof define=="function"&&define.amd?define(["exports","vue","@bobbykim/manguito-theme"],e):(r=typeof globalThis<"u"?globalThis:r||self,e(r.MclFooter={},r.Vue,r.ManguitoTheme))})(this,(function(r,e,s){"use strict";const p=`<svg
|
|
3
3
|
xmlns="http://www.w3.org/2000/svg"
|
|
4
4
|
viewBox="0 0 448 512"
|
|
5
5
|
fill="currentColor"
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
<path
|
|
12
12
|
d="M400 32H48C21.5 32 0 53.5 0 80v352c0 26.5 21.5 48 48 48h352c26.5 0 48-21.5 48-48V80c0-26.5-21.5-48-48-48zM277.3 415.7c-8.4 1.5-11.5-3.7-11.5-8 0-5.4.2-33 .2-55.3 0-15.6-5.2-25.5-11.3-30.7 37-4.1 76-9.2 76-73.1 0-18.2-6.5-27.3-17.1-39 1.7-4.3 7.4-22-1.7-45-13.9-4.3-45.7 17.9-45.7 17.9-13.2-3.7-27.5-5.6-41.6-5.6-14.1 0-28.4 1.9-41.6 5.6 0 0-31.8-22.2-45.7-17.9-9.1 22.9-3.5 40.6-1.7 45-10.6 11.7-15.6 20.8-15.6 39 0 63.6 37.3 69 74.3 73.1-4.8 4.3-9.1 11.7-10.6 22.3-9.5 4.3-33.8 11.7-48.3-13.9-9.1-15.8-25.5-17.1-25.5-17.1-16.2-.2-1.1 10.2-1.1 10.2 10.8 5 18.4 24.2 18.4 24.2 9.7 29.7 56.1 19.7 56.1 19.7 0 13.9.2 36.5.2 40.6 0 4.3-3 9.5-11.5 8-66-22.1-112.2-84.9-112.2-158.3 0-91.8 70.2-161.5 162-161.5S388 165.6 388 257.4c.1 73.4-44.7 136.3-110.7 158.3zm-98.1-61.1c-1.9.4-3.7-.4-3.9-1.7-.2-1.5 1.1-2.8 3-3.2 1.9-.2 3.7.6 3.9 1.9.3 1.3-1 2.6-3 3zm-9.5-.9c0 1.3-1.5 2.4-3.5 2.4-2.2.2-3.7-.9-3.7-2.4 0-1.3 1.5-2.4 3.5-2.4 1.9-.2 3.7.9 3.7 2.4zm-13.7-1.1c-.4 1.3-2.4 1.9-4.1 1.3-1.9-.4-3.2-1.9-2.8-3.2.4-1.3 2.4-1.9 4.1-1.5 2 .6 3.3 2.1 2.8 3.4zm-12.3-5.4c-.9 1.1-2.8.9-4.3-.6-1.5-1.3-1.9-3.2-.9-4.1.9-1.1 2.8-.9 4.3.6 1.3 1.3 1.8 3.3.9 4.1zm-9.1-9.1c-.9.6-2.6 0-3.7-1.5s-1.1-3.2 0-3.9c1.1-.9 2.8-.2 3.7 1.3 1.1 1.5 1.1 3.3 0 4.1zm-6.5-9.7c-.9.9-2.4.4-3.5-.6-1.1-1.3-1.3-2.8-.4-3.5.9-.9 2.4-.4 3.5.6 1.1 1.3 1.3 2.8.4 3.5zm-6.7-7.4c-.4.9-1.7 1.1-2.8.4-1.3-.6-1.9-1.7-1.5-2.6.4-.6 1.5-.9 2.8-.4 1.3.7 1.9 1.8 1.5 2.6z"
|
|
13
13
|
/>
|
|
14
|
-
</svg>`,
|
|
14
|
+
</svg>`,x=`<svg
|
|
15
15
|
xmlns="http://www.w3.org/2000/svg"
|
|
16
16
|
viewBox="0 0 448 512"
|
|
17
17
|
fill="currentColor"
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
<path
|
|
24
24
|
d="M224,202.66A53.34,53.34,0,1,0,277.36,256,53.38,53.38,0,0,0,224,202.66Zm124.71-41a54,54,0,0,0-30.41-30.41c-21-8.29-71-6.43-94.3-6.43s-73.25-1.93-94.31,6.43a54,54,0,0,0-30.41,30.41c-8.28,21-6.43,71.05-6.43,94.33S91,329.26,99.32,350.33a54,54,0,0,0,30.41,30.41c21,8.29,71,6.43,94.31,6.43s73.24,1.93,94.3-6.43a54,54,0,0,0,30.41-30.41c8.35-21,6.43-71.05,6.43-94.33S357.1,182.74,348.75,161.67ZM224,338a82,82,0,1,1,82-82A81.9,81.9,0,0,1,224,338Zm85.38-148.3a19.14,19.14,0,1,1,19.13-19.14A19.1,19.1,0,0,1,309.42,189.74ZM400,32H48A48,48,0,0,0,0,80V432a48,48,0,0,0,48,48H400a48,48,0,0,0,48-48V80A48,48,0,0,0,400,32ZM382.88,322c-1.29,25.63-7.14,48.34-25.85,67s-41.4,24.63-67,25.85c-26.41,1.49-105.59,1.49-132,0-25.63-1.29-48.26-7.15-67-25.85s-24.63-41.42-25.85-67c-1.49-26.42-1.49-105.61,0-132,1.29-25.63,7.07-48.34,25.85-67s41.47-24.56,67-25.78c26.41-1.49,105.59-1.49,132,0,25.63,1.29,48.33,7.15,67,25.85s24.63,41.42,25.85,67.05C384.37,216.44,384.37,295.56,382.88,322Z"
|
|
25
25
|
/>
|
|
26
|
-
</svg>`,
|
|
26
|
+
</svg>`,w=`<svg
|
|
27
27
|
xmlns="http://www.w3.org/2000/svg"
|
|
28
28
|
viewBox="0 0 448 512"
|
|
29
29
|
fill="currentColor"
|
|
@@ -35,7 +35,7 @@
|
|
|
35
35
|
<path
|
|
36
36
|
d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"
|
|
37
37
|
/>
|
|
38
|
-
</svg>`,
|
|
38
|
+
</svg>`,y=`<svg
|
|
39
39
|
xmlns="http://www.w3.org/2000/svg"
|
|
40
40
|
viewBox="0 0 448 512"
|
|
41
41
|
fill="currentColor"
|
|
@@ -47,4 +47,4 @@
|
|
|
47
47
|
<path
|
|
48
48
|
d="M64 32C28.7 32 0 60.7 0 96V416c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V96c0-35.3-28.7-64-64-64H64zm297.1 84L257.3 234.6 379.4 396H283.8L209 298.1 123.3 396H75.8l111-126.9L69.7 116h98l67.7 89.5L313.6 116h47.5zM323.3 367.6L153.4 142.9H125.1L296.9 367.6h26.3z"
|
|
49
49
|
/>
|
|
50
|
-
</svg>`,
|
|
50
|
+
</svg>`,C={class:"flex flex-wrap"},L=["href","aria-label"],b=["innerHTML"],B=e.defineComponent({__name:"SocialIcons",props:{iconColor:{default:"light-1"},socialLinks:{}},setup(n){const i=n,a=e.computed(()=>{const o=[];return i.socialLinks?.linkedin&&o.push({url:i.socialLinks.linkedin,icon:w,label:"linkedin social icon"}),i.socialLinks?.github&&o.push({url:i.socialLinks.github,icon:p,label:"github social icon"}),i.socialLinks?.instagram&&o.push({url:i.socialLinks.instagram,icon:x,label:"instagram social icon"}),i.socialLinks?.twitter&&o.push({url:i.socialLinks.twitter,icon:y,label:"x/twitter social icon"}),o}),m=o=>[s("TEXTCOLOR",o),s("RINGCOLOR",o)].join(" ");return(o,h)=>(e.openBlock(),e.createElementBlock("ul",C,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,(d,g)=>(e.openBlock(),e.createElementBlock("li",{key:g,class:"mr-xs last:mr-0"},[e.createElementVNode("a",{href:d.url,target:"_blank",class:e.normalizeClass(["inline-block outline-none focus:ring-2 hover:ring-2 hover:opacity-70 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",m(n.iconColor)]),"aria-label":d.label,role:"button"},[e.createElementVNode("div",{innerHTML:d.icon},null,8,b)],10,L)]))),128))]))}}),E={class:"container px-xs md:px-lg lg:px-xl"},V={class:"h-lg md:h-xl align-middle mb-xs"},T=["href","target"],z=["src","alt"],_={key:0,class:"mb-xs flex items-center justify-end md:justify-center"},M={class:"flex flex-wrap md:justify-between items-center md:items-start gap-6 md:gap-8"},I={class:"grid gap-2 justify-items-center basis-full md:basis-1/3"},A=["innerHTML"],H={class:"px-xs md:px-0"},N={class:"text-sm flex flex-col md:flex-row items-center sm:items-start sm:flex-row text-center sm:text-left gap-xs justify-between md:justify-around grow md:basis-1/2"},O={class:"flex flex-wrap md:flex-col justify-center items-center gap-2xs"},F=["href","target","onClick","innerHTML"],j={key:0,class:"flex flex-wrap md:flex-col justify-center items-center gap-2xs"},S=["href","target","onClick","innerHTML"],R=((n,i)=>{const a=n.__vccOpts||n;for(const[m,o]of i)a[m]=o;return a})(e.defineComponent({__name:"MclFooterA",props:{title:{},titleSize:{default:"md"},titleColor:{default:"light-1"},logo:{},logoAlt:{},logoAsLink:{type:Boolean,default:!1},logoLink:{},logoLinkTarget:{default:"_self"},displaySocialIcons:{type:Boolean,default:!0},socialIconColor:{default:"light-1"},socialLinks:{},menuItems:{},secondaryMenuItems:{},menuItemAsLink:{type:Boolean,default:!1},menuTextSize:{default:"md"},menuTextColor:{default:"light-1"},menuTextBold:{type:Boolean,default:!1},displayHighlight:{type:Boolean,default:!0},highlightColor:{default:"primary"},bgColor:{default:"dark-3"},borderTopColor:{default:"primary"},headlineColor:{default:"light-1"}},emits:["logo-click","menu-click"],setup(n,{emit:i}){const a=n;e.useSlots();const m=i,o=e.computed(()=>{const{bgColor:l,borderTopColor:c}=a;return[s("BGCOLOR",l),s("BORDER",c)].join(" ")}),h=e.computed(()=>{const{titleSize:l,titleColor:c}=a;return[s("H2",l),s("TEXTCOLOR",c)].join(" ")}),d=e.computed(()=>{const{menuTextSize:l,menuTextColor:c,menuTextBold:t}=a;return[s("BODYTEXT",l),s("TEXTCOLOR",c)].join(" ")}),g=l=>{const{logoAsLink:c,logoLink:t,logoLinkTarget:f}=a;!c&&l.preventDefault(),m("logo-click",l,t,f)},u=(l,c)=>{const{menuItemAsLink:t}=a;!t&&l.preventDefault(),m("menu-click",l,c)};return(l,c)=>(e.openBlock(),e.createElementBlock("footer",{class:e.normalizeClass(["border-t-2 py-6 sm:py-8 md:py-12",o.value])},[e.createElementVNode("div",E,[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-col md:flex-row flex-wrap justify-between mb-xs md:mb-md px-xs md:px-md border-b-2",e.unref(s)("BORDER",n.headlineColor)])},[e.createElementVNode("div",V,[e.createElementVNode("a",{href:n.logoLink,target:n.logoLinkTarget,class:e.normalizeClass(["h-full inline-block outline-none focus:ring-2 ring-offset-2 ring-offset-transparent rounded-md transition-all duration-300 ease-linear",e.unref(s)("RINGCOLOR",n.titleColor)]),onClick:c[0]||(c[0]=t=>g(t))},[e.createElementVNode("img",{class:"inline-block h-full",src:n.logo,alt:n.logoAlt},null,8,z)],10,T)]),n.displaySocialIcons?(e.openBlock(),e.createElementBlock("div",_,[e.createVNode(B,{"social-links":n.socialLinks,"icon-color":n.socialIconColor},null,8,["social-links","icon-color"])])):e.createCommentVNode("",!0)],2),e.createElementVNode("div",M,[e.createElementVNode("div",I,[e.createElementVNode("h2",{class:e.normalizeClass(["inline-block align-middle tracking-wider",h.value]),innerHTML:n.title},null,10,A),e.createElementVNode("div",H,[e.renderSlot(l.$slots,"default",{},void 0,!0)])]),e.createElementVNode("nav",N,[e.createElementVNode("ul",O,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.menuItems,(t,f)=>(e.openBlock(),e.createElementBlock("li",{key:`first-nav-${f}`,class:"inline-block"},[e.createElementVNode("a",{href:t.url,target:t.target?t.target:"_self",class:e.normalizeClass(["tracking-wide outline-none nav__text",d.value]),onClick:k=>u(k,t),innerHTML:t.title},null,10,F),n.displayHighlight?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["relative top-3xs h-3xs nav__decorator",e.unref(s)("BEFOREBG",n.highlightColor)])},null,2)):e.createCommentVNode("",!0)]))),128))]),n.secondaryMenuItems?(e.openBlock(),e.createElementBlock("ul",j,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.secondaryMenuItems,(t,f)=>(e.openBlock(),e.createElementBlock("li",{key:`second-nav-${f}`,class:"inline-block"},[e.createElementVNode("a",{href:t.url,target:t.target?t.target:"_self",class:e.normalizeClass(["tracking-wide outline-none nav__text",d.value]),onClick:k=>u(k,t),innerHTML:t.title},null,10,S),n.displayHighlight?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["relative top-3xs h-3xs nav__decorator",e.unref(s)("BEFOREBG",n.highlightColor)])},null,2)):e.createCommentVNode("",!0)]))),128))])):e.createCommentVNode("",!0)])])])],2))}}),[["__scopeId","data-v-21dde3ea"]]);r.MclFooterA=R,Object.defineProperty(r,Symbol.toStringTag,{value:"Module"})}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@bobbykim/mcl-footer",
|
|
3
|
-
"version": "0.9.
|
|
3
|
+
"version": "0.9.9",
|
|
4
4
|
"description": "a footer components built based on Manguito theme",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"files": [
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
},
|
|
34
34
|
"license": "MIT",
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@bobbykim/manguito-theme": "0.28.
|
|
36
|
+
"@bobbykim/manguito-theme": "0.28.3",
|
|
37
37
|
"vue": "^3.5.13"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
@@ -45,5 +45,5 @@
|
|
|
45
45
|
"vite-plugin-dts": "^4.3.0",
|
|
46
46
|
"vue-tsc": "^2.1.10"
|
|
47
47
|
},
|
|
48
|
-
"gitHead": "
|
|
48
|
+
"gitHead": "fc1830324e5a409b68bbb2b39280fe0b3cf3673a"
|
|
49
49
|
}
|