index.vue 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <div>
  3. <div class="bg-[linear-gradient(rgba(0,0,0,0.40)),url('/img/landing_background.png')] bg-[center_24%] bg-no-repeat bg-cover rounded-br-[100px] md:rounded-br-[150px] lg:rounded-br-[300px] w-full h-[calc(100vh-126px)] lg:min-h-[530px] text-white-2 flex justify-center items-center px-4">
  4. <div class="flex flex-col justify-between items-center h-[80%]">
  5. <div class="flex flex-col justify-center items-center gap-10">
  6. <NuxtImg src="/img/white_logo.svg" class="w-20 md:w-31"/>
  7. <h4 class="font-bold text-[28px] md:text-4xl lg:text-5xl max-w-[60rem] text-center lg:leading-16">Transforme sua Paixão pelo Café em <span class="text-[#E38B37]">Sucesso</span></h4>
  8. </div>
  9. <div>
  10. <p class="text-lg lg:mt-6 md:text-xl lg:text-2xl text-center lg:max-w-[94%] xl:max-w-max">Aprenda com os melhores especialistas e eleve a qualidade do seu café ao próximo nível</p>
  11. <div class="flex flex-col justify-center items-center gap-4 mt-18">
  12. <button class="underline text-primary-4 text-sm font-bold bg-primary w-[246px] h-[50px] rounded-lg cursor-pointer hover:bg-primary/85 transition duration-300" @click="goToLoginPage">Acessar conta</button>
  13. <span class="text-sm text-white font-bold">ou</span>
  14. <button class="underline text-primary text-sm font-bold cursor-pointer hover:text-primary/85 transition duration-300" @click="goToRegisterPage">Registrar-se</button>
  15. </div>
  16. </div>
  17. </div>
  18. </div>
  19. </div>
  20. </template>
  21. <script setup lang="ts">
  22. useHead({
  23. title: `Landing Page - Viver Café`
  24. })
  25. definePageMeta({
  26. layout: 'default',
  27. });
  28. const config = useRuntimeConfig();
  29. const quasarAppUrlRegister = config.public.studentPlatform + '/register';
  30. const quasarAppUrlLogin = config.public.studentPlatform + '/login';
  31. const goToRegisterPage = () => {
  32. window.open(quasarAppUrlRegister, '_blank');
  33. };
  34. const goToLoginPage = () => {
  35. window.open(quasarAppUrlLogin, '_blank');
  36. };
  37. </script>