ami/tl-vikunja
1
0
Fork 0
Code

feat(task): use focus-visible for task focus styles

Browse Source 
(cherry picked from commit a7bd9dad24edfa8eabf1ba6617361d6ffeb2256f)
This commit is contained in:
kolaente 2024-09-19 13:01:18 +02:00
parent f732082708
commit 2b9b9216dc
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
1 changed files with 12 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/components/tasks/partials/SingleTaskInProject.vue
View File

@ -378,7 +378,7 @@ function openTaskDetail(event: MouseEvent | KeyboardEvent) {
background-color: var(--grey-100); background-color: var(--grey-100);
} }
&:focus-within { &:has(*:focus-visible) {
box-shadow: 0 0 0 2px hsla(var(--primary-hsl), 0.5); box-shadow: 0 0 0 2px hsla(var(--primary-hsl), 0.5);
a.task-link { a.task-link {
@ -412,6 +412,15 @@ function openTaskDetail(event: MouseEvent | KeyboardEvent) {
.dueDate { .dueDate {
display: inline-block; display: inline-block;
margin-left: 5px; margin-left: 5px;
&:focus-visible {
box-shadow: none;
time {
box-shadow: 0 0 0 1px hsla(var(--primary-hsl), 0.5);
border-radius: 3px;
}
}
} }
.overdue { .overdue {
@ -457,6 +466,7 @@ function openTaskDetail(event: MouseEvent | KeyboardEvent) {
text-align: center; text-align: center;
width: 27px; width: 27px;
transition: opacity $transition, color $transition; transition: opacity $transition, color $transition;
border-radius: $radius;
&:hover { &:hover {
color: var(--warning); color: var(--warning);