|
|
@@ -1,37 +1,37 @@
|
|
|
<template>
|
|
|
- <section class="w-full bg-[#F6FFE9] py-24">
|
|
|
- <div class="max-w-[1200px] mx-auto flex items-start justify-between gap-16">
|
|
|
- <div class="flex flex-col items-start gap-4">
|
|
|
- <span class="inline-flex items-center justify-center w-[127px] h-[53.05px] rounded-[154.87px]
|
|
|
- border-[1.55px] border-[var(--color-primary)] bg-[var(--color-primary)] text-white text-2xl font-bold">
|
|
|
+ <section class="w-full bg-[#F6FFE9] py-18">
|
|
|
+ <div class="max-w-[1200px] mx-auto flex justify-between gap-30">
|
|
|
+ <div class="flex flex-col gap-4 itens-center">
|
|
|
+ <span class="inline-flex items-center justify-center max-w-[127px] h-[53.05px] rounded-full
|
|
|
+ border-[1.55px] border-[#8DC63F] bg-[var(--color-primary)] text-white text-2xl font-bold">
|
|
|
FAQ</span>
|
|
|
<p style="font-family: var(--font-inter)" class="font-semibold text-[88px] leading-[106px] tracking-[-0.03em]">
|
|
|
Perguntas <br>Frequentes
|
|
|
</p>
|
|
|
</div>
|
|
|
- <div class="flex flex-col items-end gap-5">
|
|
|
- <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-[25px] px-8 py-7 flex items-center justify-between">
|
|
|
+ <div class="flex flex-col items-end gap-4">
|
|
|
+ <div class="min-w-[677px] bg-[#0C0D17] border border-white/10 rounded-3xl px-8 py-7 flex items-center justify-between">
|
|
|
<p class="font-inter font-normal text-[21.07px] leading-[31.61px] text-white">
|
|
|
A Kyon substitui todos os sistemas que uso hoje?
|
|
|
</p>
|
|
|
<span class="text-white text-[26.34px] leading-none">+</span>
|
|
|
</div>
|
|
|
|
|
|
- <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-[25px] px-8 py-7 flex items-center justify-between">
|
|
|
+ <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-3xl px-8 py-7 flex items-center justify-between">
|
|
|
<p class="font-inter font-normal text-[21.07px] leading-[31.61px] text-white">
|
|
|
Como funciona o Prontuário unificado?
|
|
|
</p>
|
|
|
<span class="text-white text-[26.34px] leading-none">+</span>
|
|
|
- </div>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-[25px] px-8 py-7 flex items-center justify-between">
|
|
|
+ <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-3xl px-8 py-7 flex items-center justify-between">
|
|
|
<p class="font-inter font-normal text-[21.07px] leading-[31.61px] text-white">
|
|
|
O agente de IA realmente atende pacientes no WhatsApp?
|
|
|
</p>
|
|
|
<span class="text-white text-[26.34px] leading-none">+</span>
|
|
|
</div>
|
|
|
|
|
|
- <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-[25px] px-8 py-7 flex items-center justify-between">
|
|
|
+ <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-3xl px-8 py-7 flex items-center justify-between">
|
|
|
<p class="font-inter font-normal text-[21.07px] leading-[31.61px] text-white">
|
|
|
A telemedicina é integrada ou preciso de outra plataforma?
|
|
|
</p>
|
|
|
@@ -39,13 +39,12 @@
|
|
|
<span class="text-white text-[26.34px] leading-none">+</span>
|
|
|
</div>
|
|
|
|
|
|
- <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-[25px] px-8 py-7 flex items-center justify-between">
|
|
|
+ <div class="w-[677px] h-20 bg-[#0C0D17] border border-white/10 rounded-3xl px-8 py-7 flex items-center justify-between">
|
|
|
<p class="font-inter font-normal text-[21.07px] leading-[31.61px] text-white">
|
|
|
Como funciona a auditoria LGPD?
|
|
|
</p>
|
|
|
<span class="text-white text-[26.34px] leading-none">+</span>
|
|
|
</div>
|
|
|
-
|
|
|
</div>
|
|
|
</div>
|
|
|
|
|
|
@@ -54,4 +53,10 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
+import { ref } from 'vue'
|
|
|
+
|
|
|
+ const openIndex = ref<number | null>(null)
|
|
|
+ function toggleIsOpen(indexClicked: number) {
|
|
|
+ openIndex.value = openIndex.value === indexClicked ? null : indexClicked
|
|
|
+ }
|
|
|
</script>
|