Skip to content
Snippets Groups Projects
Commit de2867b2 authored by Gilgard's avatar Gilgard
Browse files

Help view complete

parent da2d9d20
No related branches found
No related tags found
1 merge request!100Help page
Pipeline #180540 passed
Stage: test
Hide whitespace changes
Inline Side-by-side
Showing
with 62 additions and 54 deletions
src/views/HelpView.vue
+ 62
− 54
View file @ de2867b2
<template>
<div class="py-12 bg-white justify-center">
<div id="contact" class="border-gray-700 rounded w-11/12">
<div class="mb-12 lg:mb-0 text-gray-700">
<h2
class="text-primary-dark mb-6 uppercase font-bold text-[32px] sm:text-[40px] lg:text-[36px] xl:text-[40px]"
>
GET IN TOUCH WITH US
</h2>
<p class="text-gray-500 leading-relaxed mb-9">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eius
tempor incididunt ut labore et dolore magna aliqua. Ut enim adiqua
minim veniam quis nostrud exercitation ullamco
</p>
<div class="flex mb-8 w-full">
<div class="flex items-center justify-center mr-6 overflow-hidden">
<LocationMarkerIcon class="w-14 h-14 text-primary-dark rounded" />
<div class="mt-6 bg-white justify-center w-screen">
<div id="contact" class="grid place-items-center w-full">
<div class="lg:mb-0 text-gray-700 w-full">
<div class="mx-4">
<h2 class="text-primary-dark mb-6 uppercase font-bold text-2xl">
Kontakt oss
</h2>
<p class="text-gray-500 leading-relaxed mb-9">
{{ contact.description }}
</p>
</div>
<div class="flex mb-8 ml-2 w-full">
<div class="max-w-14 max-h-14 min-h-14 min-w-14">
<LocationMarkerIcon
class="w-14 h-14 text-primary-dark rounded mr-4"
/>
</div>
<div class="w-full">
<h4 class="font-bold text-gray-800 text-xl mb-1">Our Location</h4>
<div class="">
<h4 class="font-bold text-gray-800 text-xl mb-1">Lokaler</h4>
<p>{{ contact.address }},</p>
<p>{{ contact.city }},</p>
<p>{{ contact.country }}</p>
</div>
</div>
<div class="flex mb-8 max-w-[370px] w-full">
<div class="flex items-center justify-center mr-6 overflow-hidden">
<MailIcon class="w-16 h-16 text-primary-dark rounded" />
<div class="flex mb-8 ml-2 max-w-[370px] w-full">
<div class="max-w-14 max-h-14 min-h-14 min-w-14">
<MailIcon class="w-14 h-14 text-primary-dark rounded mr-4" />
</div>
<div class="w-full">
<h4 class="font-bold text-gray-800 text-xl mb-1">Email Address</h4>
<div class="">
<h4 class="font-bold text-gray-800 text-xl mb-1">Epost Addresse</h4>
<p>{{ contact.email }}</p>
</div>
</div>
......@@ -36,45 +36,45 @@
</div>
<div id="faq">
<div
class="mx-auto text-center px-4 mt-12 text-2xl text-primary-dark font-semibold"
class="mx-auto text-center px-4 text-2xl text-primary-dark font-semibold"
>
Frequently Asked Questions
</div>
<dl
v-for="(faqItem, index) in FAQ"
:key="index"
class="mt-8 mx-auto max-w-screen-sm lg:max-w-screen-lg flex flex-col lg:flex-row lg:flex-wrap"
<div
class="mt-8 mx-auto max-w-screen-sm lg:max-w-screen-lg flex flex-col lg:grid lg:grid-cols-2"
>
<div id="faqItem" class="lg:w-1/2">
<div
id="question-and-answer"
class="select-none cursor-pointer border-2 mx-8 my-3 px-6 py-4 rounded-lg text-sm group"
>
<dt id="question">
<div class="flex justify-between text-gray-800">
<div class="font-bold">
{{ faqItem.question }}
</div>
<div>
<div v-if="!faqItem.toggle" @click="toggle(faqItem)">
<ChevronDoubleDownIcon
class="h-5 w-5 block rounded-full p-1"
/>
<dl v-for="(faqItem, index) in FAQ" :key="index">
<div id="faqItem" class="">
<div
id="question-and-answer"
class="select-none cursor-pointer border-2 mx-8 my-3 px-6 py-4 rounded-lg text-sm group"
>
<dt id="question">
<div class="flex justify-between text-gray-800">
<div class="font-bold">
{{ faqItem.question }}
</div>
<div v-else @click="toggle(faqItem)">
<ChevronDoubleUpIcon
class="h-5 w-5 block rounded-full p-1"
/>
<div>
<div v-if="!faqItem.toggle" @click="toggle(faqItem)">
<ChevronDoubleDownIcon
class="h-5 w-5 block rounded-full p-1"
/>
</div>
<div v-else @click="toggle(faqItem)">
<ChevronDoubleUpIcon
class="h-5 w-5 block rounded-full p-1"
/>
</div>
</div>
</div>
</div>
</dt>
<dd v-if="faqItem.toggle" class="mt-2 leading-snug text-gray-700">
{{ faqItem.answer }}
</dd>
</dt>
<dd v-if="faqItem.toggle" class="mt-2 leading-snug text-gray-700">
{{ faqItem.answer }}
</dd>
</div>
</div>
</div>
</dl>
</dl>
</div>
</div>
</div>
</template>
......@@ -91,6 +91,8 @@ export default {
data() {
return {
contact: {
description:
"BoCo (Borrow Community) er et norsk selskap som tilbyr en plattform for utlån av gjenstander for privatpersoner og bedrifter. BoCo streber for å bli den foretrukne plattformen for lån for privatpersoner og bedrifter i Norge.",
email: "BorrowCompany@BorrowCommunity.com",
address: "O. S. Bragstads Plass 2G",
city: "Trondheim",
......@@ -103,6 +105,12 @@ export default {
"Ved å trykke på plus-ikonet i navigasjons-baren øverst på siden. Dette vil ta deg til et skjema for å legge ut en ny gjenstand.",
toggle: false,
},
{
question: "Hvordan kan jeg bli med i en gruppe?",
answer:
"Fra hovedsiden kan man trykke på pluss-person-ikonet ved siden av mine grupper som vil ta deg til skjemaet for å lage en ny gruppe.",
toggle: false,
},
],
};
},
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment