💻 | Working on mobile version

This commit is contained in:
2021-04-07 22:51:22 +02:00
parent caaef95497
commit 4c9f128e61
5 changed files with 9 additions and 9 deletions

View File

@@ -1,17 +1,17 @@
<template>
<section v-if="info && info.age" class="w-full flex items-center justify-center my-12">
<div class="flex justify-between items-center">
<div class="w-1/2 flex justify-center">
<div class="flex flex-col md:flex-row justify-between items-center">
<div class="mb-12 md:mb-0 md:w-1/2 flex justify-center">
<img src="@/assets/images/Logo.jpg" alt="Logo Image" class="w-1/2 rounded-2xl border-2 border-gray-100 dark:border-transparent">
</div>
<div class="w-1/2 text-justify">
<h2 class="text-4xl font-bold">
<div class="md:w-1/2 text-justify">
<h2 class="text-4xl font-bold text-center md:text-justify">
Who am I ?
</h2>
<p class="text-xl my-6 text-gray-700 dark:text-gray-400">
{{ $t('home.banner.description', {age: info.age}) }}
</p>
<div class="flex">
<div class="flex justify-center md:justify-start">
<Button content="Decouvrir mon profil" link="about"/>
</div>
</div>

View File

@@ -1,5 +1,5 @@
<template>
<section class="my-32 w-full flex items-center justify-center">
<section class="my-16 md:my-32 w-full flex items-center justify-center">
<div class="text-center">
<h1 class="text-6xl font-bold text-gray-700 dark:text-gray-400">
Hello I am <span class="text-black dark:text-white">Arthur Danjou</span>

View File

@@ -1,5 +1,5 @@
<template>
<header class="dark:bg-black dark:text-white fixed z-50 top-0 left-0 bg-white w-full duration-400" :class="scrollPosition > 50 ? ' shadow-md dark:shadow-white h-10 lg:h-18' : 'h-16 lg:h-24'">
<header class="dark:bg-black dark:text-white fixed z-50 top-0 left-0 bg-white w-full duration-400" :class="scrollPosition > 50 ? ' shadow-md dark:shadow-white h-16 lg:h-20' : 'h-20 lg:h-24'">
<div class="header-container z-index-50 flex justify-between items-center h-full px-5 xl:px-32">
<nuxt-link to="/">
<img src="@/assets/images/logo-header.png" alt="Logo Circle" class="h-10 left cursor-pointer duration-500" />

View File

@@ -1,6 +1,6 @@
<template>
<nuxt-link :to="`/blog/${slug}`">
<div class="rounded-lg shadow-lg h-116 w-100 text-left dark:bg-gray-800 transform hover:scale-103 duration-300">
<div class="rounded-lg shadow-lg h-116 w-full md:w-100 text-left dark:bg-gray-800 transform hover:scale-103 duration-300">
<div class="h-2/5 post rounded-t-lg"
:style="{ backgroundImage: `url(${getBackgroundCover})` }">
</div>

View File

@@ -14,7 +14,7 @@
<h1 v-if="posts.length === 0" class="text-xl font-bold text-center my-8 w-full">{{ $t('blog.no_posts') }}</h1>
<div class="w-full" v-else>
<div class="flex py-8 w-full flex-wrap" >
<div class="mx-3 my-2" v-for="post in posts">
<div class="md:mx-3 my-2" v-for="post in posts">
<Post
:title="post.title"
:cover="post.cover"