41 lines
1.6 KiB
CSS
41 lines
1.6 KiB
CSS
/*
|
|
* TweakDrag -- board drag/touch and column-gap tweaks.
|
|
*
|
|
* The wider column gap is applied conditionally from Template/layout/variable.php (only
|
|
* when the "Widen the gap between columns" setting is on), using border-spacing with the
|
|
* --td-column-gap value, so it is not in this static stylesheet.
|
|
*
|
|
* Below: click-and-drag horizontal scrolling (added by Asset/js/drag-scroll.js when the
|
|
* "Drag the board background to scroll" setting is enabled). The .td-drag-scroll class is
|
|
* set on #board-container by the script, so these rules are inert when disabled. A grab
|
|
* cursor advertises the empty background; cards keep the normal cursor since pressing them
|
|
* does a card drag, not a pan.
|
|
*/
|
|
#board-container.td-drag-scroll {
|
|
cursor: grab;
|
|
}
|
|
|
|
#board-container.td-drag-scroll .task-board {
|
|
cursor: default;
|
|
}
|
|
|
|
.td-grabbing,
|
|
.td-grabbing * {
|
|
cursor: grabbing !important;
|
|
user-select: none !important;
|
|
}
|
|
|
|
/*
|
|
* Enlarge the mobile card drag handle so it is a usable touch target.
|
|
* Kanboard reveals the .task-board-sort-handle (a FontAwesome fa-arrows-alt glyph) only
|
|
* on mobile (isMobile.any) and restricts card dragging to it; by default the glyph is
|
|
* tiny and hard to grab with a finger. FontAwesome icons are sized by font-size, so this
|
|
* is a pure font-size bump; it is inert on desktop where the handle stays display:none.
|
|
* Size comes from the --td-handle-size variable (Settings -> Tweak Drag), injected in the
|
|
* page head; falls back to 20px.
|
|
*/
|
|
.task-board-sort-handle,
|
|
.task-board-sort-handle i {
|
|
font-size: var(--td-handle-size, 20px);
|
|
}
|