@dcodegroup-au/page-builder 0.4.8 → 0.4.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/package.json
CHANGED
|
@@ -1,31 +1,33 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div class="overflow-hidden">
|
|
3
|
-
<div class="max-w-[1640px] md:px-[120px] mx-auto w-full my-[40px]
|
|
4
|
-
<div
|
|
5
|
-
<div class="flex justify-
|
|
6
|
-
<div class="
|
|
7
|
-
<
|
|
3
|
+
<div class="max-w-[1640px] md:px-[120px] mx-auto w-full my-[40px] flex justify-center">
|
|
4
|
+
<div class="bg-gray-100 rounded-[16px] flex justify-center w-full" v-if="headerComponent">
|
|
5
|
+
<div class="flex items-center justify-center flex-col py-[40px] max-w-[820px]">
|
|
6
|
+
<div class="flex justify-between relative w-[150px]">
|
|
7
|
+
<div class="w-[56px] h-[56px] border-[2px] border-white bg-gray-200 rounded-full flex justify-center items-center">
|
|
8
|
+
<Phone class="w-6 h-6 text-gray-600"></Phone>
|
|
9
|
+
</div>
|
|
10
|
+
<div class="w-[56px] h-[56px] border-[2px] border-white bg-gray-200 rounded-full flex justify-center items-center absolute top-[40%] left-1/2 -translate-x-1/2 -translate-y-1/2">
|
|
11
|
+
<Help class="w-6 h-6 text-gray-600"></Help>
|
|
12
|
+
</div>
|
|
13
|
+
<div class="w-[56px] h-[56px] border-[2px] border-white bg-gray-200 rounded-full flex justify-center items-center">
|
|
14
|
+
<Email class="w-6 h-6 text-gray-600"></Email>
|
|
15
|
+
</div>
|
|
8
16
|
</div>
|
|
9
|
-
<
|
|
10
|
-
|
|
17
|
+
<h3 class="text-[24px] text-gray-900 font-semibold mt-4">{{ headerComponent.title }}</h3>
|
|
18
|
+
<p v-if="headerComponent?.supporting_text" class="text-[18px] font-normal mt-2 text-gray-600 leading-[30px] text-center" v-html="headerComponent.supporting_text"></p>
|
|
19
|
+
<div class="flex gap-2">
|
|
20
|
+
<template v-for="item in contactUs.data">
|
|
21
|
+
<a
|
|
22
|
+
v-if="item?.show"
|
|
23
|
+
class="inline-flex gap-1.5 items-center font-semibold text-base mt-4 px-5 py-2.5 rounded-full"
|
|
24
|
+
:class="{'text-brand-700 hover:bg-white border border-brand-300': item.type === 'phone', 'text-white bg-brand-600 hover:bg-brand-800': item.type === 'email'}"
|
|
25
|
+
:href="`${item.type === 'email' ? 'mailto:' : 'tel:'} ${item.address}`">
|
|
26
|
+
{{ item.label }}
|
|
27
|
+
<ArrowUpRight class="w-5 h-5"></ArrowUpRight>
|
|
28
|
+
</a>
|
|
29
|
+
</template>
|
|
11
30
|
</div>
|
|
12
|
-
<div class="w-[56px] h-[56px] border-[2px] border-white bg-gray-200 rounded-full flex justify-center items-center">
|
|
13
|
-
<Email class="w-6 h-6 text-gray-600"></Email>
|
|
14
|
-
</div>
|
|
15
|
-
</div>
|
|
16
|
-
<h3 class="text-[24px] text-gray-900 font-semibold mt-4">{{ headerComponent.title }}</h3>
|
|
17
|
-
<p v-if="headerComponent?.supporting_text" class="text-[18px] font-normal mt-2 text-gray-600 leading-[30px] text-center" v-html="headerComponent.supporting_text"></p>
|
|
18
|
-
<div class="flex gap-2">
|
|
19
|
-
<template v-for="item in contactUs.data">
|
|
20
|
-
<a
|
|
21
|
-
v-if="item?.show"
|
|
22
|
-
class="inline-flex gap-1.5 items-center font-semibold text-base mt-4 px-5 py-2.5 rounded-full"
|
|
23
|
-
:class="{'text-brand-700 hover:bg-white border border-brand-300': item.type === 'phone', 'text-white bg-brand-600 hover:bg-brand-800': item.type === 'email'}"
|
|
24
|
-
:href="`${item.type === 'email' ? 'mailto:' : 'tel:'} ${item.address}`">
|
|
25
|
-
{{ item.label }}
|
|
26
|
-
<ArrowUpRight class="w-5 h-5"></ArrowUpRight>
|
|
27
|
-
</a>
|
|
28
|
-
</template>
|
|
29
31
|
</div>
|
|
30
32
|
</div>
|
|
31
33
|
</div>
|