Our flexible Kanban board for managing tasks with drag drop


Post by rodel.ocfemia »

Hi,

Is it possible to customize the taskMenu icon. Something like this.

headerItems: {
            menu: { type: 'taskMenu', icon: 'my-custom-icon' }
         },

Thanks


Post by tasnim »

Hi,
Are you talking about these icons?

Attachments
81KNwtAJR7.png
81KNwtAJR7.png (22.65 KiB) Viewed 931 times

Post by rodel.ocfemia »

Hi Tasnim,
I'm referring to the default 3 dots icon located at the upper right corner of the card. It's the default icon displayed if we add the taskMenu.


Post by tasnim »

Here is how you can achieve it

    features : {
        columnHeaderMenu : {
            items : {
                addTask : {
                    icon : 'b-fa-solid b-fa-square-plus'
                }
            }
        }
    }

Please check docs https://bryntum.com/docs/taskboard/api/TaskBoard/feature/ColumnHeaderMenu
And for icons, please check this guide https://bryntum.com/docs/taskboard/guide/Grid/customization/iconfont#font-awesome

Attachments
Screenshot 2022-10-07 172749.png
Screenshot 2022-10-07 172749.png (3.6 KiB) Viewed 928 times

Post by rodel.ocfemia »

Hi Tasnim,
I'm referring to the ... icon. I tried inspecting the element using browser and I got the following

<i class="b-taskboard-taskitem b-taskboard-task-menu b-icon b-icon-menu-horizontal" data-role="item-menu" data-field="menu" data-ref="menu" role="presentation" style=""></i>

Post by tasnim »

Hi,
You can achieve it with this CSS;

.b-column-header-button::before {
  content : '\f805';
}

You can search for all of the icons in here https://fontawesome.com/search

Attachments
Screenshot 2022-10-07 184800.png
Screenshot 2022-10-07 184800.png (5.35 KiB) Viewed 926 times

Post Reply