quirinecker/dayplanner
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added overflow for tasks and overflow shadow to all overflows. also

Browse Source 
minimum drag distance is now 10px
This commit is contained in:
quirinecker
2025-06-16 19:51:31 +02:00
parent c4daa88ea2
commit 7588661a59
9 changed files with 124 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
web/components/ui/Sidebar.vue
View File

@@ -75,19 +75,19 @@ const selectedDate = computed({
})
type Task = {
id: number
userid: string
title: string
description: string
done: number
estimated_time: string
due_date: string
created_at: string
updated_at: string
id: number
userid: string
title: string
description: string
done: number
estimated_time: string
due_date: string
created_at: string
updated_at: string
}
defineProps<{
todos: Task[]
todos: Task[]
}>()
@@ -109,7 +109,7 @@ function editTodo() {
</script>
<template>
<UCard class="flex w-64 h-full">
<UCard class="flex w-64 h-full" :ui="{ body: 'w-full' }">
<div class="flex flex-col h-full w-full gap-5">
<header class="flex flex-col gap-2">
<Title1>Calendar</Title1>
@@ -120,20 +120,37 @@ function editTodo() {
<Title1>Todos</Title1>
<div class="flex gap-2 flex-col">
<ListItem v-for="todo in todos">
<div class="flex justify-between">
<span>
<div class="flex w-full gap-4 items-center">
<span class="grow overflow-scroll py-3 overflow-shadow">
{{ todo.title }}
</span>
<div class="flex gap-1">
<UButton size="xs" color="neutral" class="flex justify-center" @click="editTodo">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil"><path d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z"></path><path d="m15 5 4 4"></path></svg>
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-pencil">
<path
d="M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z">
</path>
<path d="m15 5 4 4"></path>
</svg>
</UButton>
<UButton size="xs" class="flex justify-center" color="primary" @click="() => deleteTodo(todo)">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-trash-2"><path d="M3 6h18"></path><path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path><path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path><line x1="10" x2="10" y1="11" y2="17"></line><line x1="14" x2="14" y1="11" y2="17"></line></svg>
<UButton size="xs" class="flex justify-center" color="primary"
@click="() => deleteTodo(todo)">
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="15"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"
stroke-linecap="round" stroke-linejoin="round"
class="lucide lucide-trash-2">
<path d="M3 6h18"></path>
<path d="M19 6v14c0 1-2 2-2 2H7c-1 0-2-1-2-2V6"></path>
<path d="M8 6V4c0-1 1-2 2-2h4c1 0 2 1 2 2v2"></path>
<line x1="10" x2="10" y1="11" y2="17"></line>
<line x1="14" x2="14" y1="11" y2="17"></line>
</svg>
</UButton>
</div>
</div>
</ListItem>
</ListItem>
</div>
</div>
<div class="flex">
@@ -157,4 +174,6 @@ function editTodo() {
</UCard>
</template>
<style scoped></style>
<style scoped>
</style>