Add dark mode

Signed-off-by: nurRiyad <asadnurriyad@gmail.com>
This commit is contained in:
nurRiyad
2023-09-09 15:42:25 +06:00
parent 7d7d737294
commit 83a5dbe156
25 changed files with 1244 additions and 1139 deletions

View File

@@ -25,7 +25,7 @@ withDefaults(defineProps<Props>(), {
</script>
<template>
<article class="group border m-2 overflow-hidden rounded-2xl shadow-sm text-zinc-700">
<article class="group border dark:border-gray-800 m-2 overflow-hidden rounded-2xl shadow-sm text-zinc-700 dark:text-zinc-300 ">
<NuxtLink :to="path">
<NuxtImg
class="lg:h-48 md:h-36 w-full object-cover object-center rounded-t-2xl shadow-lg group-hover:scale-[1.02] transition-all duration-500"
@@ -33,7 +33,7 @@ withDefaults(defineProps<Props>(), {
:alt="alt"
/>
<div class="px-3 pb-4">
<div class="text-black pt-3 pb-2">
<div class="text-black dark:text-zinc-300 pt-3 pb-2">
<div class="flex items-center">
<LogoDate />
{{ date }}
@@ -45,7 +45,7 @@ withDefaults(defineProps<Props>(), {
</template>
</div>
</div>
<h2 class="text-xl font-semibold text-black pb-1 group-hover:text-sky-700">
<h2 class="text-xl font-semibold text-black dark:text-zinc-300 pb-1 group-hover:text-sky-700">
{{ title }}
</h2>
<p class="text-ellipsis line-clamp-2 text-base">