RhenCloud/Cloud-Blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add archive page

Browse Source 
Signed-off-by: nurRiyad <asadnurriyad@gmail.com>
This commit is contained in:
nurRiyad
2023-01-08 23:23:44 +06:00
parent acac2aff61
commit 5f41fe784d
7 changed files with 285 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
components/archive/card.vue Normal file
View File

@@ -0,0 +1,46 @@
<script lang="ts" setup>
defineProps<{
title: string
excerpt?: string
image?: string
slug?: string
}>()
</script>
<template>
<article class="group border p-5 m-2 rounded-2xl shadow-lg text-zinc-700">
<NuxtLink to="/home" class="grid grid-cols-1 sm:grid-cols-9 gap-5">
<div class="sm:col-span-2">
<img
class="lg:h-48 md:h-36 sm:h-36 w-full object-cover object-center rounded-2xl shadow-lg group-hover:scale-[1.05] transition-all duration-500"
src="/blogs/hello-world/riyad.jpg"
alt="card photo"
/>
</div>
<div class="sm:col-span-7">
<h2 class="text-3xl font-semibold text-black pb-1 group-hover:text-sky-600">
This is the card title
</h2>
<p class="text-ellipsis line-clamp-2">
{{ excerpt }}
</p>
<div class="text-black text-sm pt-4 pb-2">
<div class="flex items-center">
<LogoDate />
3rd July 2022
</div>
<div class="flex items-center gap-1 flex-wrap">
<LogoTag />
<span>JavaScript</span>
<span>Typescript</span>
<span>Clean</span>
</div>
</div>
<div class="flex group-hover:underline text-sky-600 items-center pt-2">
<p>Read More</p>
<LogoArrow />
</div>
</div>
</NuxtLink>
</article>
</template>

13
components/archive/hero.vue Normal file
View File

@@ -0,0 +1,13 @@
<template>
<div class="container mx-auto mb-5">
<div class="grid grid-cols-1 sm:grid-cols-2 items-center">
<div class="px-6">
<h1 class="text-black font-semibold leading-tight text-4xl md:text-5xl my-5">Archive</h1>
<p>Here you will find all the blog post I have written & publish in this site.</p>
</div>
<div class="px-6 justify-self-center">
<LogoDogpow />
</div>
</div>
</div>
</template>