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

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

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