reduce support page spacees and add btns
This commit is contained in:
samaradel
@@ -6,17 +6,46 @@
|
||||
{{ header.subtitle }}
|
||||
</h2>
|
||||
<div
|
||||
v-if="header.content"
|
||||
v-html="header.content"
|
||||
class="mb-8 text-gray-700 leading-relaxed"
|
||||
></div>
|
||||
<div>
|
||||
<g-link
|
||||
class="inline-block bg-green-500 text-sm text-white learn-button hover:bg-green-600 px-8 py-2 mr-2 my-0 rounded shadow rounded-full active--exact active"
|
||||
v-if="header.btn1"
|
||||
class="
|
||||
inline-block
|
||||
bg-green-500
|
||||
text-sm text-white
|
||||
learn-button
|
||||
hover:bg-green-600
|
||||
px-8
|
||||
py-2
|
||||
mr-2
|
||||
my-0
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
active--exact active
|
||||
"
|
||||
v-if="header.btn1"
|
||||
:to="header.link1"
|
||||
>{{ header.btn1 }}</g-link
|
||||
><g-link
|
||||
class="inline-block bg-teal-300 text-sm learn-button hover:bg-teal-400 text-gray-900 px-12 py-2 mr-3 my-2 rounded shadow rounded-full"
|
||||
class="
|
||||
inline-block
|
||||
bg-teal-300
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-teal-400
|
||||
text-gray-900
|
||||
px-12
|
||||
py-2
|
||||
mr-3
|
||||
my-2
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
v-if="header.btn2"
|
||||
:to="header.link2"
|
||||
>{{ header.btn2 }}</g-link
|
||||
@@ -32,5 +61,4 @@ export default {
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="py-0 mb-5 mx-4">
|
||||
<div class="text-center mx-auto my-4" v-if="id == 'why'">
|
||||
<div class="text-center mx-auto my-4" v-if="id == 'why'">
|
||||
<h1 class="text-4xl text-gray-900 font-light sm:text-9xl sm:leading-10">
|
||||
{{ main.title }} <span class="font-extrabold">{{ main.subtitle }}</span>
|
||||
</h1>
|
||||
@@ -26,7 +26,7 @@
|
||||
class="grid grid-cols-1 gap-4 sm:grid-cols-3 text-center"
|
||||
v-if="id == 'token'"
|
||||
>
|
||||
<a
|
||||
<a
|
||||
v-for="(product, idx) in products"
|
||||
target="_blank"
|
||||
:key="idx"
|
||||
@@ -53,7 +53,14 @@
|
||||
target="_blank"
|
||||
:key="idx"
|
||||
:href="product.link"
|
||||
class="m-auto rounded overflow-hidden transition duration-500 bg-gray-100"
|
||||
class="
|
||||
m-auto
|
||||
rounded
|
||||
overflow-hidden
|
||||
transition
|
||||
duration-500
|
||||
bg-gray-100
|
||||
"
|
||||
>
|
||||
<div>
|
||||
<g-image :src="img(product.image)" />
|
||||
@@ -66,13 +73,35 @@
|
||||
v-if="product.link.includes('http')"
|
||||
target="_blank"
|
||||
:href="product.link"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 shadow rounded-full"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="product.link"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 shadow rounded-full"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
</div>
|
||||
@@ -103,13 +132,35 @@
|
||||
v-if="product.link.includes('http')"
|
||||
target="_blank"
|
||||
:href="product.link"
|
||||
class="bg-gray-800 text-sm learn-button border-gray-900 text-white px-12 py-2 mr-5 shadow rounded-full"
|
||||
class="
|
||||
bg-gray-800
|
||||
text-sm
|
||||
learn-button
|
||||
border-gray-900
|
||||
text-white
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="product.link"
|
||||
class="bg-gray-800 text-sm learn-button border-gray-900 text-white px-12 py-2 mr-5 shadow rounded-full"
|
||||
class="
|
||||
bg-gray-800
|
||||
text-sm
|
||||
learn-button
|
||||
border-gray-900
|
||||
text-white
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
</div>
|
||||
@@ -117,6 +168,66 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Support -->
|
||||
|
||||
<div
|
||||
class="grid grid-cols-1 gap-4 sm:grid-cols-3 text-center"
|
||||
v-else-if="id == 'support'"
|
||||
>
|
||||
<a
|
||||
v-for="(product, idx) in products"
|
||||
target="_blank"
|
||||
:key="idx"
|
||||
:href="product.url"
|
||||
class="m-auto rounded overflow-hidden transition duration-500"
|
||||
>
|
||||
<div class="px-2 py-2">
|
||||
<g-image class="py-4" :src="img(product.image)" />
|
||||
<div class="font-bold text-xl mb-2">{{ product.title }}</div>
|
||||
<div v-html="product.content" class="text-gray-700 text-base"></div>
|
||||
<div v-if="product.button" class="my-5 text-center">
|
||||
<a
|
||||
v-if="product.link.includes('http')"
|
||||
target="_blank"
|
||||
:href="product.link"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="product.link"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ product.button }}</a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 gap-4 sm:grid-cols-3 text-center" v-else>
|
||||
<a
|
||||
v-for="(product, idx) in products"
|
||||
@@ -132,7 +243,7 @@
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div v-if="main.button" class="my-10 text-center">
|
||||
<!-- <a
|
||||
v-if="main.button"
|
||||
@@ -145,13 +256,37 @@
|
||||
v-if="main.link.includes('http')"
|
||||
target="_blank"
|
||||
:href="main.link"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 rounded shadow rounded-full"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ main.button }}</a
|
||||
>
|
||||
<a
|
||||
v-else
|
||||
:href="main.link"
|
||||
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 rounded shadow rounded-full"
|
||||
class="
|
||||
bg-blue-900
|
||||
text-sm
|
||||
learn-button
|
||||
hover:bg-blue-800
|
||||
text-gray-100
|
||||
px-12
|
||||
py-2
|
||||
mr-5
|
||||
rounded
|
||||
shadow
|
||||
rounded-full
|
||||
"
|
||||
>{{ main.button }}</a
|
||||
>
|
||||
</div>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<section class="py-10 pb-8 px-4 text-center">
|
||||
<div class="max-w-2xl mx-auto mb-8">
|
||||
<!-- <h2 class="text-4xl leading-tight mb-6 font-bold font-heading">
|
||||
WORK WITH AWESOME PARTNERS
|
||||
</h2> -->
|
||||
<div class="max-w-2xl mx-auto mb-8" v-if="main">
|
||||
<h2 class="text-4xl leading-tight mb-6 font-bold font-heading">
|
||||
{{ main.title }}
|
||||
</h2>
|
||||
<p class="text-gray-400 leading-relaxed"></p>
|
||||
</div>
|
||||
<div class="flex flex-wrap -mx-8">
|
||||
@@ -21,7 +21,7 @@
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: ["logos"],
|
||||
props: ["logos", "main"],
|
||||
methods: {
|
||||
img(image) {
|
||||
if (!image) return "";
|
||||
|
||||
@@ -96,8 +96,5 @@ export default {
|
||||
this.open = !this.open;
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
console.log(this.main);
|
||||
},
|
||||
};
|
||||
</script>
|
||||
Reference in New Issue
Block a user