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> <template>
<div class="py-12 bg-white justify-center"> <div class="mt-6 bg-white justify-center w-screen">
<div id="contact" class="border-gray-700 rounded w-11/12"> <div id="contact" class="grid place-items-center w-full">
<div class="mb-12 lg:mb-0 text-gray-700"> <div class="lg:mb-0 text-gray-700 w-full">
<h2 <div class="mx-4">
class="text-primary-dark mb-6 uppercase font-bold text-[32px] sm:text-[40px] lg:text-[36px] xl:text-[40px]" <h2 class="text-primary-dark mb-6 uppercase font-bold text-2xl">
> Kontakt oss
GET IN TOUCH WITH US </h2>
</h2> <p class="text-gray-500 leading-relaxed mb-9">
<p class="text-gray-500 leading-relaxed mb-9"> {{ contact.description }}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eius </p>
tempor incididunt ut labore et dolore magna aliqua. Ut enim adiqua </div>
minim veniam quis nostrud exercitation ullamco <div class="flex mb-8 ml-2 w-full">
</p> <div class="max-w-14 max-h-14 min-h-14 min-w-14">
<div class="flex mb-8 w-full"> <LocationMarkerIcon
<div class="flex items-center justify-center mr-6 overflow-hidden"> class="w-14 h-14 text-primary-dark rounded mr-4"
<LocationMarkerIcon class="w-14 h-14 text-primary-dark rounded" /> />
</div> </div>
<div class="w-full"> <div class="">
<h4 class="font-bold text-gray-800 text-xl mb-1">Our Location</h4> <h4 class="font-bold text-gray-800 text-xl mb-1">Lokaler</h4>
<p>{{ contact.address }},</p> <p>{{ contact.address }},</p>
<p>{{ contact.city }},</p> <p>{{ contact.city }},</p>
<p>{{ contact.country }}</p> <p>{{ contact.country }}</p>
</div> </div>
</div> </div>
<div class="flex mb-8 max-w-[370px] w-full"> <div class="flex mb-8 ml-2 max-w-[370px] w-full">
<div class="flex items-center justify-center mr-6 overflow-hidden"> <div class="max-w-14 max-h-14 min-h-14 min-w-14">
<MailIcon class="w-16 h-16 text-primary-dark rounded" /> <MailIcon class="w-14 h-14 text-primary-dark rounded mr-4" />
</div> </div>
<div class="w-full"> <div class="">
<h4 class="font-bold text-gray-800 text-xl mb-1">Email Address</h4> <h4 class="font-bold text-gray-800 text-xl mb-1">Epost Addresse</h4>
<p>{{ contact.email }}</p> <p>{{ contact.email }}</p>
</div> </div>
</div> </div>
...@@ -36,45 +36,45 @@ ...@@ -36,45 +36,45 @@
</div> </div>
<div id="faq"> <div id="faq">
<div <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 Frequently Asked Questions
</div> </div>
<dl <div
v-for="(faqItem, index) in FAQ" class="mt-8 mx-auto max-w-screen-sm lg:max-w-screen-lg flex flex-col lg:grid lg:grid-cols-2"
: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 id="faqItem" class="lg:w-1/2"> <dl v-for="(faqItem, index) in FAQ" :key="index">
<div <div id="faqItem" class="">
id="question-and-answer" <div
class="select-none cursor-pointer border-2 mx-8 my-3 px-6 py-4 rounded-lg text-sm group" 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"> <dt id="question">
<div class="font-bold"> <div class="flex justify-between text-gray-800">
{{ faqItem.question }} <div class="font-bold">
</div> {{ faqItem.question }}
<div>
<div v-if="!faqItem.toggle" @click="toggle(faqItem)">
<ChevronDoubleDownIcon
class="h-5 w-5 block rounded-full p-1"
/>
</div> </div>
<div v-else @click="toggle(faqItem)"> <div>
<ChevronDoubleUpIcon <div v-if="!faqItem.toggle" @click="toggle(faqItem)">
class="h-5 w-5 block rounded-full p-1" <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> </div>
</div> </dt>
</dt> <dd v-if="faqItem.toggle" class="mt-2 leading-snug text-gray-700">
<dd v-if="faqItem.toggle" class="mt-2 leading-snug text-gray-700"> {{ faqItem.answer }}
{{ faqItem.answer }} </dd>
</dd> </div>
</div> </div>
</div> </dl>
</dl> </div>
</div> </div>
</div> </div>
</template> </template>
...@@ -91,6 +91,8 @@ export default { ...@@ -91,6 +91,8 @@ export default {
data() { data() {
return { return {
contact: { 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", email: "BorrowCompany@BorrowCommunity.com",
address: "O. S. Bragstads Plass 2G", address: "O. S. Bragstads Plass 2G",
city: "Trondheim", city: "Trondheim",
...@@ -103,6 +105,12 @@ export default { ...@@ -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.", "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, 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