diff --git a/frappe/public/js/frappe/views/kanban/kanban_view.js b/frappe/public/js/frappe/views/kanban/kanban_view.js
index 5781052ca3..421bf60e8c 100644
--- a/frappe/public/js/frappe/views/kanban/kanban_view.js
+++ b/frappe/public/js/frappe/views/kanban/kanban_view.js
@@ -136,10 +136,13 @@ frappe.views.KanbanView = class KanbanView extends frappe.views.ListView {
this.hide_card_layout = true;
this.hide_sort_selector = true;
super.setup_page();
+
+ this.page.disable_sidebar_toggle = true;
+ this.page.setup_sidebar_toggle();
}
setup_view() {
- if (this.board.columns.length > 5) {
+ if (this.board.columns.filter((col) => col.status !== "Archived").length > 5) {
this.page.container.addClass("full-width");
}
this.setup_realtime_updates();
diff --git a/frappe/public/scss/desk/kanban.scss b/frappe/public/scss/desk/kanban.scss
index a711a6f820..2eb79ec4de 100644
--- a/frappe/public/scss/desk/kanban.scss
+++ b/frappe/public/scss/desk/kanban.scss
@@ -15,6 +15,7 @@
.kanban {
display: flex;
+ gap: 0.5em;
overflow-y: hidden;
-ms-overflow-style: none; /* IE and Edge */
@@ -27,19 +28,17 @@
.kanban-column {
@include transition();
- flex: 0 0 260px;
- max-width: 260px;
+ flex: 1 0 260px;
border-radius: var(--border-radius);
padding: var(--padding-md);
- min-height: calc(100vh - 250px);
- max-height: calc(100vh - var(--navbar-height) - var(--page-bottom-margin) - 80px);
+ min-height: calc(100vh - 150px);
.add-card {
@include flex(flex, center, center, null);
@include transition();
color: var(--text-light);
- background-color: var(--kanban-new-card-bg);
+ background-color: var(--bg-color);
height: 27px;
font-size: var(--text-md);
margin-bottom: var(--margin-sm);
@@ -105,10 +104,6 @@
margin: 0;
}
}
-
- &:hover {
- cursor: pointer;
- }
}
.kanban-column-title {
@@ -123,6 +118,7 @@
.kanban-title {
@include get_textstyle("lg", "semibold");
margin-left: var(--margin-sm);
+ cursor: grab;
}
}
@@ -182,7 +178,7 @@
.kanban-card-body {
cursor: grab;
- padding: var(--padding-sm);
+ padding: var(--padding-md);
.kanban-title-area {
margin-bottom: 12px;