github-starred/vikunja
2
0
Fork 0
mirror of https://github.com/go-vikunja/vikunja.git synced 2026-05-06 11:37:49 -05:00
Code Issues 690 Packages Projects Releases 11 Wiki Activity

[PR #2665] [MERGED] refactor(frontend): drop Bulma form/checkbox-radio import #8441

New Issue
Closed
opened 2026-04-20 18:13:16 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-04-20 18:13:16 -05:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/go-vikunja/vikunja/pull/2665
Author: @tink-bot
Created: 4/20/2026
Status: ✅ Merged
Merged: 4/20/2026
Merged by: @kolaente

Base: main ← Head: refactor-drop-bulma-form-checkbox-radio

📝 Commits (1)

  • 0554c78 refactor(frontend): port checkbox-radio rules into FormCheckbox and drop Bulma import

📊 Changes

4 files changed (+80 additions, -1 deletions)

View changed files

📝 frontend/src/components/input/FormCheckbox.vue (+21 -0)
📝 frontend/src/components/project/views/ViewEditForm.vue (+28 -0)
📝 frontend/src/styles/global.scss (+1 -1)
📝 frontend/src/views/user/settings/Avatar.vue (+30 -0)

📄 Description

The Bulma form/checkbox-radio partial only defined two selectors:
.checkbox (rendered exclusively by FormCheckbox.vue) and .radio
(rendered by ViewEditForm.vue and views/user/settings/Avatar.vue).
Ports the rules into those components' scoped styles so we can drop the
global @import.

What was ported

  • %checkbox-radio placeholder rules (cursor, line-height, position,
    hover/disabled color states, input cursor) into FormCheckbox.vue's
    scoped <style> for the .checkbox side.
  • The same rules plus the .radio + .radio sibling spacing (via
    margin-inline-start: .5em) into scoped blocks on ViewEditForm.vue
    and Avatar.vue for the .radio side.
  • Commented out @import "bulma-css-variables/sass/form/checkbox-radio"
    in styles/global.scss.

Call-site audit

Grepped frontend/src/ for raw class="checkbox" / class="radio":

File Class Handling
components/input/FormCheckbox.vue .checkbox Scoped rules now live here
components/project/views/ViewEditForm.vue .radio x2 Scoped .radio block added
views/user/settings/Avatar.vue .radio Scoped .radio block added

No other usages of those classes (only incidental matches: v-cy="'checkbox'" and input[type='checkbox'] selectors).

Pixel-perfect verification

Baseline (main on :4175) vs this branch (:4180). All values from getBoundingClientRect() and getComputedStyle().

/login — "Stay logged in" checkbox

Metric Before After Diff
label rect (w x h @ x,y) 124.359 x 20 @ 672,390.719 124.359 x 20 @ 672,390.719 0
label display / gap / cursor / lineHeight / position flex / 8px / pointer / 20px / relative flex / 8px / pointer / 20px / relative 0
label margin 0px 0px 12px 0px 0px 12px 0
input rect 13 x 13 @ 672,394.219 13 x 13 @ 672,394.219 0

/user/settings/general — 8 checkboxes (5 sampled)

All 5 sampled labels and inputs: identical rects, display: flex, gap: 8px, cursor: pointer, line-height: 20px, margin: 0px 0px 12px. 0px diff across every metric.

/user/settings/avatar — 5 radio labels

idx Before (rect / display / margin) After Diff
0 71.578 x 20 @ 582,163 / inline-block / 0px same 0
1 65.781 x 20 @ 661.578,163 / inline-block / 0px 0px 0px 8px same 0
2 82.234 x 20 @ 735.359,163 / inline-block / 0px 0px 0px 8px same 0
3 69.797 x 20 @ 825.594,163 / inline-block / 0px 0px 0px 8px same 0
4 70.953 x 20 @ 903.391,163 / inline-block / 0px 0px 0px 8px same 0

The .radio + .radio sibling spacing (0.5em = 8px) is preserved via
margin-inline-start: .5em.

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/go-vikunja/vikunja/pull/2665 **Author:** [@tink-bot](https://github.com/tink-bot) **Created:** 4/20/2026 **Status:** ✅ Merged **Merged:** 4/20/2026 **Merged by:** [@kolaente](https://github.com/kolaente) **Base:** `main` ← **Head:** `refactor-drop-bulma-form-checkbox-radio` --- ### 📝 Commits (1) - [`0554c78`](https://github.com/go-vikunja/vikunja/commit/0554c78961523e86fad81c1b56024bf7fb8467ff) refactor(frontend): port checkbox-radio rules into FormCheckbox and drop Bulma import ### 📊 Changes **4 files changed** (+80 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/components/input/FormCheckbox.vue` (+21 -0) 📝 `frontend/src/components/project/views/ViewEditForm.vue` (+28 -0) 📝 `frontend/src/styles/global.scss` (+1 -1) 📝 `frontend/src/views/user/settings/Avatar.vue` (+30 -0) </details> ### 📄 Description The Bulma `form/checkbox-radio` partial only defined two selectors: `.checkbox` (rendered exclusively by `FormCheckbox.vue`) and `.radio` (rendered by `ViewEditForm.vue` and `views/user/settings/Avatar.vue`). Ports the rules into those components' scoped styles so we can drop the global `@import`. ## What was ported - `%checkbox-radio` placeholder rules (cursor, line-height, position, hover/disabled color states, input cursor) into `FormCheckbox.vue`'s scoped `<style>` for the `.checkbox` side. - The same rules plus the `.radio + .radio` sibling spacing (via `margin-inline-start: .5em`) into scoped blocks on `ViewEditForm.vue` and `Avatar.vue` for the `.radio` side. - Commented out `@import "bulma-css-variables/sass/form/checkbox-radio"` in `styles/global.scss`. ## Call-site audit Grepped `frontend/src/` for raw `class="checkbox"` / `class="radio"`: | File | Class | Handling | | ---- | ----- | -------- | | `components/input/FormCheckbox.vue` | `.checkbox` | Scoped rules now live here | | `components/project/views/ViewEditForm.vue` | `.radio` x2 | Scoped `.radio` block added | | `views/user/settings/Avatar.vue` | `.radio` | Scoped `.radio` block added | No other usages of those classes (only incidental matches: `v-cy="'checkbox'"` and `input[type='checkbox']` selectors). ## Pixel-perfect verification Baseline (`main` on :4175) vs this branch (:4180). All values from `getBoundingClientRect()` and `getComputedStyle()`. ### `/login` — "Stay logged in" checkbox | Metric | Before | After | Diff | | ------ | ------ | ----- | ---- | | label rect (w x h @ x,y) | 124.359 x 20 @ 672,390.719 | 124.359 x 20 @ 672,390.719 | 0 | | label display / gap / cursor / lineHeight / position | flex / 8px / pointer / 20px / relative | flex / 8px / pointer / 20px / relative | 0 | | label margin | `0px 0px 12px` | `0px 0px 12px` | 0 | | input rect | 13 x 13 @ 672,394.219 | 13 x 13 @ 672,394.219 | 0 | ### `/user/settings/general` — 8 checkboxes (5 sampled) All 5 sampled labels and inputs: identical rects, `display: flex`, `gap: 8px`, `cursor: pointer`, `line-height: 20px`, `margin: 0px 0px 12px`. 0px diff across every metric. ### `/user/settings/avatar` — 5 radio labels | idx | Before (rect / display / margin) | After | Diff | | --- | -------------------------------- | ----- | ---- | | 0 | 71.578 x 20 @ 582,163 / inline-block / 0px | same | 0 | | 1 | 65.781 x 20 @ 661.578,163 / inline-block / `0px 0px 0px 8px` | same | 0 | | 2 | 82.234 x 20 @ 735.359,163 / inline-block / `0px 0px 0px 8px` | same | 0 | | 3 | 69.797 x 20 @ 825.594,163 / inline-block / `0px 0px 0px 8px` | same | 0 | | 4 | 70.953 x 20 @ 903.391,163 / inline-block / `0px 0px 0px 8px` | same | 0 | The `.radio + .radio` sibling spacing (`0.5em` = `8px`) is preserved via `margin-inline-start: .5em`. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-04-20 18:13:16 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
area/api
area/attachments
area/auth
area/avatars
area/backup-restore
area/caldav
area/calendar-view
area/comments
area/config
area/database
area/desktop
area/docker
area/email
area/favorites
area/filters
area/frontend
area/gantt
area/i18n
area/import-export
area/internal-code
area/kanban
area/labels
area/list-view
area/mobile
area/notifications
area/permissions
area/projects
area/pwa
area/recurring-tasks
area/reminders
area/search
area/shortcuts
area/subtasks
area/sync
area/table-view
area/task-editor
area/task-metadata
area/task-relations
area/teams
area/theming
area/time-tracking
area/typesense
area/views
area/webhooks
bug
changes requested
concern/accessibility
concern/performance
concern/regression
concern/ux
confirmed
db/mysql
dependencies
enhancement
good first issue
help wanted
integration/inbound
integration/outbound
kind/bug
kind/feature
needs reproduction
pull-request
Mirrored from GitHub Pull Request
 question
security
support
upstream issue
waiting for reply
wontfix
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/vikunja#8441
Delete Branch "%!s()"

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?