HTML Elements › Forums › General Discussions › Remove \"pin\" header button from docking LayoutPanel
Tagged: angular DockingLayout, custo elements, custom dokcingLayout header buttons, custom layout, custom layout panels, Docking Layout LayoutPanel, smart DockingLayout. custom DockingLayout
This topic contains 2 replies, has 2 voices, and was last updated by 
Anonymous 1 year, 8 months ago.
How can I remove the “pin” button in the header of a docking LayoutPanel? I’ve tried setting “headerButtons: [“close”]” in the config, but this doesn’t do anything.
Hi velocitytoo,
the “pin” button in the header of the LayoutPanels acts as “autoHide” button when the item is docked inside the DockingLayout and as “dock” button when the item is autoHidden. Since these are the basic operations of the DockingLayout items it’s not possible to hide the button for them via the offical API of the element (using the headerButtons property). However you can still hide them using a simple CSS selector:
smart-docking-layout .smart-auto-hide-button {
display: none;
}
You can event target specific LayoutPanels by their id (id must be explicitly set in the DockingLayout’s layout configuration) and hide the button only for them:
smart-docking-layout #itemA .smart-auto-hide-button {
display: none;
}
Best Regards,
Christopher
Smart HTML Elements Team
https://www.htmlelements.com
Great, thank you, that worked!
You must be logged in to reply to this topic.