ourworld_web/www_threefold_io
23
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init products part

Browse Source
This commit is contained in:
samaradel
2021-04-05 16:23:16 +02:00
parent 8a10be81bc
commit 8156694a06
12 changed files with 104 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/components/custom/sections/Comparison.vue
View File

@@ -33,19 +33,19 @@
>{{ main.button }}</a
> -->
<a
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"
>{{ main.button }}</a
>
<g-link
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"
>{{ main.button }}</g-link
>
<a
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"
>{{ main.button }}</a
>
<g-link
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"
>{{ main.button }}</g-link
>
</div>
</section>
</template>

35
src/components/marketing/sections/cta-sections/ShowcaseProducts.vue
View File

@@ -2,17 +2,20 @@
<div class="py-0 mb-5">
<div class="w-full text-center">
<h2
v-if="main !== null"
v-if="main !== null && main.title"
class="text-4xl font-semibold leading-tight font-heading"
>
{{ main.title }}
</h2>
<p v-if="main !== null" class="mb-6 text-m tracking-widest text-gray-800">
<p
v-if="main !== null && main.subtitle"
class="mb-6 text-m tracking-widest text-gray-800"
>
{{ main.subtitle }}
</p>
</div>
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2">
<div class="grid grid-cols-1 gap-4 sm:grid-cols-3 text-center">
<a
v-for="(product, idx) in products"
target="_blank"
@@ -22,11 +25,33 @@
>
<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> -->
<p v-html="product.content" class="text-gray-700 text-base"></p>
<div class="font-bold text-xl mb-2">{{ product.title }}</div>
<div v-html="product.content" class="text-gray-700 text-base"></div>
</div>
</a>
</div>
<div v-if="main.button" class="my-10 text-center">
<!-- <a
v-if="main.button"
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"
:href="main.link"
>{{ main.button }}</a
> -->
<a
v-if="main.link.includes('http')"
target="_blank"
:href="main.link"
class="bg-blue-900 text-sm uppercase learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 rounded shadow rounded-full"
>{{ main.button }}</a
>
<g-link
v-else
:href="main.link"
class="bg-blue-900 text-sm uppercase learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 rounded shadow rounded-full"
>{{ main.button }}</g-link
>
</div>
</div>
</template>

36
src/components/marketing/sections/cta-sections/ShowcaseProductsHome.vue
View File

@@ -1,35 +1,35 @@
<template>
<div class="py-12 mb-5" id="home">
<div class="w-full text-center">
<h2 v-if="main !== null" class="text-4xl font-semibold leading-tight font-heading">
{{ main.title }}
<h2
v-if="main !== null"
class="text-4xl font-semibold leading-tight font-heading"
>
{{ main.title }}
</h2>
<p v-if="main !== null" class="mb-6 text-m tracking-widest text-gray-800">{{ main.subtitle }}</p>
</div>
<p v-if="main !== null" class="mb-6 text-m tracking-widest text-gray-800">
{{ main.subtitle }}
</p>
</div>
<div class="grid grid-cols-1 gap-4 sm:grid-cols-3">
<a
<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> -->
<p v-html="product.content" class="text-gray-700 text-base"></p>
</div>
</a>
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>
</a>
</div>
</div>
</template>
<script>
export default {
props: ["products", "main"],