feat: improved checkbox #1800
No reviewers
Labels
No Label
area/internal-code
changes requested
confirmed
dependencies
duplicate
good first issue
help wanted
hosting
invalid
kind/bug
kind/feature
question
wontfix
No Milestone
No project
No Assignees
3 Participants
Due Date
No due date set.
Depends on
#1812 feature/feat-improve-ts-setup
vikunja/frontend
Reference: vikunja/frontend#1800
Loading…
Reference in New Issue
No description provided.
Delete Branch "dpschen/frontend:feature/improve-checkbox"
Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?
Still WIP.
Extending from: #1812
2501c385bd
toe9439a2ec2
e9439a2ec2
tocfeac226cf
cfeac226cf
to675d366370
675d366370
toc97b3d4b16
c97b3d4b16
to38ee9f5528
WIP: improved ts setup / better testing on the example of an improved checkboxto WIP: improved testing / with example checkbox38ee9f5528
to5bf738ceef
WIP: improved testing / with example checkboxto WIP: improved checkbox5bf738ceef
toe6f5c8f2b9
e6f5c8f2b9
tod7ab79599e
d7ab79599e
to81eaf6e2b3
81eaf6e2b3
to879a77ed88
879a77ed88
to4b0b1dd41a
Hi dpschen!
Thank you for creating a PR!
I've deployed the changes of this PR on a preview environment under this URL: https://1800-feature-improve-checkbox--vikunja-frontend-preview.netlify.app
You can use this url to view the changes live and test them out.
You will need to manually connect this to an api running somehwere. The easiest to use is https://try.vikunja.io/.
Have a nice day!
4b0b1dd41a
to73bfd43560
73bfd43560
to599843452f
599843452f
to536c08ac3e
536c08ac3e
to8e5ea521ea
WIP: improved checkboxto feat: improved checkboxTests are still failing, probably related to changed selectors.
@ -22,3 +18,3 @@
<script setup lang="ts">
import {ref, toRef, watch} from 'vue'
import CheckboxImg from '@/assets/checkbox.svg?component'
Nit-picking, but can we call this something other than "Img"? That makes me thing of a css-sprite png image from 2000...
Done!
@ -23,3 +23,3 @@
</div>
</div>
<fancycheckbox class="is-block" v-model="filters.showTasksWithoutDates">
<fancycheckbox is-block v-model="filters.showTasksWithoutDates">
Doesn't the
is-block
attribute require a value?AFAIK
is-block
and:is-block="true"
are identical. See https://vuejs.org/guide/components/props.html#prop-passing-details8e5ea521ea
to3f3d2c2517
Looks good now, but tests are still failing.
3f3d2c2517
to893c009201
893c009201
toe5b9fa6c61
I had to undo #3176 because it made the now nested lable unclickable.
As a rule of thumb interactive elements should never be nested. This is especially true for interactive elements (
<a>
and<label>
in this case).In order to fix that issue we should rebase #3180 instead
Sadly, it looks like the checkbox doesn't work anymore:
You mean merge #3180 first and then rebase this PR on it?
When did this appear (can't reproduce).
No
I marked a task done and expected the checkbox to show that accordingly
For me everything works in the linked preview branch.
In case you tested locally you might have had an outdated branch, because this issue was existent without the last commit
Looks like it works fine in Chrome, but not in Firefox.
Seems like FF doesn't support the has selector yet… The polyfill needs to be activated. I tried a bit but couldn't get it running yet.
e5b9fa6c61
to4703f9c4d5
@konrad should work now!
Looks good now!
Finally Yiehaa