convert better internet sec

This commit is contained in:
samaradel
2021-04-06 15:32:18 +02:00
parent b2cbfb96d3
commit 90353da3b1
17 changed files with 80 additions and 40 deletions

View File

@@ -4,7 +4,36 @@
{{ main.title }}
</h2>
<p class="text-gray-600">{{ main.description }}</p>
<div class="flex flex-wrap items-center -mx-8 mt-12 mb-2">
<div class="flex flex-wrap -mx-8 mt-12 mb-2" v-if="id == 'home'">
<div
class="lg:w-1/3 px-6 mb-10"
v-for="(section, index) in sections"
:key="index"
>
<g-link :to="section.link">
<g-image
class="mx-auto"
:src="section.svg.src"
:alt="section.title"
/>
<div class="part py-1">
<h3 class="text-2xl font-semibold font-heading">
<!-- <span
class="inline-flex items-center justify-center h-12 w-12 mr-2 border rounded-full"
>{{ index + 1 }}</span
> -->
{{ section.title }}
</h3>
<div
class="mb-4 px-5 text-black-700"
v-html="section.content"
></div>
</div>
</g-link>
</div>
</div>
<div class="flex flex-wrap items-center -mx-8 mt-12 mb-2" v-else>
<div
class="lg:w-1/3 px-6 mb-2"
v-for="(section, index) in sections"
@@ -25,25 +54,19 @@
<div class="text-gray-700" v-html="section.content"></div>
</div>
</div>
<div>
<!-- <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
> -->
<div v-if="main.button">
<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"
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 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"
class="bg-blue-900 text-sm learn-button hover:bg-blue-800 text-gray-100 px-12 py-2 mr-5 shadow rounded-full"
>{{ main.button }}</g-link
>
</div>
@@ -52,6 +75,15 @@
<script>
export default {
props: ["main", "sections"],
props: ["main", "sections", "id"],
};
</script>
</script>
<style scoped>
.part {
height: 160px;
background-color: #66efc5;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
</style>

View File

@@ -25,19 +25,21 @@
<h3 class="font-bold text-2xl">{{ product.title }}</h3>
<div v-html="product.content" class="pb-8 px-5 text-gray-600"></div>
<a
v-if="product.url.includes('http')"
target="_blank"
:href="product.url"
class="bg-gray-800 text-lg text-bold learn-button hover:bg-gray-700 text-gray-100 px-12 py-2 mr-5 shadow rounded-full transition duration-500 ease-in-out"
>{{ product.button }}</a
>
<g-link
v-else
:href="product.url"
class="bg-gray-800 text-lg text-bold learn-button hover:bg-gray-700 text-gray-100 px-12 py-2 mr-5 shadow rounded-full transition duration-500 ease-in-out"
>{{ product.button }}</g-link
>
<div v-if="product.button">
<a
v-if="product.url.includes('http')"
target="_blank"
:href="product.url"
class="bg-gray-800 text-lg text-bold learn-button hover:bg-gray-700 text-gray-100 px-12 py-2 mr-5 shadow rounded-full transition duration-500 ease-in-out"
>{{ product.button }}</a
>
<g-link
v-else
:href="product.url"
class="bg-gray-800 text-lg text-bold learn-button hover:bg-gray-700 text-gray-100 px-12 py-2 mr-5 shadow rounded-full transition duration-500 ease-in-out"
>{{ product.button }}</g-link
>
</div>
</div>
</a>
</div>