8000 darkmode fix · WilliamBostrom/Nuxt-vue@fd9d3f8 · GitHub
[go: up one dir, main page]

Skip to content

Commit fd9d3f8

Browse files
darkmode fix
1 parent 9718606 commit fd9d3f8

File tree

6 files changed

+15
-13
lines changed

6 files changed

+15
-13
lines changed

assets/css/tailwind.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ body {
1111
@apply bg-[#12b488] text-white px-3 py-2 rounded-md text-sm;
1212
}
1313
.card {
14-
@apply p-3 rounded-md bg-white shadow-md h-full mt-3;
14+
@apply p-3 rounded-md bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300 shadow-md h-full mt-3;
1515
}
1616
.default-margin {
1717
@apply mx-auto;

layouts/default.vue

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
22
<div>
3-
<header class="shadow-sm bg-white">
4-
<nav class="container-mx-auto p-4 flex justify-between items-center">
3+
<header class="shadow-sm bg-white dark:bg-slate-900">
4+
<nav class="container mx-auto p-4 flex justify-between items-center">
55
<NuxtLink to="/" class="font-bold text-2xl"
6-
>Nuxt<span class="text-black">Home</span></NuxtLink
6+
>Nuxt<span class="text-black dark:text-gray-300">Home</span></NuxtLink
77
>
88
<ul class="flex gap-4">
99
<li><NuxtLink to="/todo">To-Dos</NuxtLink></li>
@@ -25,4 +25,8 @@
2525
.btn {
2626
color: white;
2727
}
28+
29+
body {
30+
@apply bg-white dark:bg-gray-800 text-gray-700 dark:text-gray-300;
31+
}
2832
</style>

layouts/menu.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
22
<div>
3-
<header class="shadow-sm bg-white">
3+
<header class="shadow-sm bg-white dark:bg-slate-900">
44
<nav class="container mx-auto p-4 flex justify-between items-center">
55
<NuxtLink to="/menu" class="font-bold text-2xl grow text-[#12b488]"
6-
>Nuxt<span class="text-black">Menu</span></NuxtLink
6+
>Nuxt<span class="text-black dark:text-gray-300">Menu</span></NuxtLink
77
>
88
<ul class="flex gap-4">
99
<li><NuxtLink to="/">Home</NuxtLink></li>

layouts/todo.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
22
<div>
3-
<header class="shadow-sm bg-white">
3+
<header class="shadow-sm bg-white dark:bg-slate-900">
44
<nav class="container mx-auto p-4 text-[#12b488]">
55
<NuxtLink to="/menu" class="font-bold text-2xl"
6-
>Nuxt<span class="text-black">Todo</span></NuxtLink
6+
>Nuxt<span class="text-black dark:text-gray-300">Todo</span></NuxtLink
77
>
88
</nav>
99
</header>

pages/index.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<main>
3-
<section class="bg-[#f1f1f1]">
3+
<section class="bg-[#f1f1f1] dark:bg-slate-800">
44
<div
55
class="container flex flex-col lg:flex-row items-center py-20 gap-10"
66
>

pages/menu/index.vue

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,10 +31,8 @@ const { data } = await useFetch<Recipe[]>("api/food/menus");
3131
const recipes: Recipe[] = data.value || [];
3232
3333
const filteredMeals = computed(() =>
34-
recipes.filter(
35-
(
36-
meal // Ingen .value här på recipes
37-
) => meal.name.toLowerCase().includes(filterText.value.toLowerCase()) // använd filterText här istället
34+
recipes.filter((meal) =>
35+
meal.name.toLowerCase().includes(filterText.value.toLowerCase())
3836
)
3937
);
4038
</script>

0 commit comments

Comments
 (0)
0