Hi,
is there a solution to add the menu-pin-button to the atlantis menu like in the Barcelona theme?
I want to show the menu always without fading.
Thanks!
Regards,
Martin
menu-pin-button like the Barcelona theme
Forum rules
Please note that response time for technical support is within 3-5 business days.
Please note that response time for technical support is within 3-5 business days.
-
- Posts: 5281
- Joined: 29 Jun 2013, 12:38
I added this feature to next version. For now, you need to override layout.js and TabMenuRenderer.java;
Code: Select all
// TabMenuRenderer.java
...
writer.endElement("a");
/* Please add this lines. Line 77 */
writer.startElement("a", tab);
writer.writeAttribute("href", "#", null);
writer.writeAttribute("class", "menu-pin-button", null);
writer.startElement("i", null);
writer.writeAttribute("class", "fa fa-thumb-tack fa-rotate-90", null);
writer.endElement("i");
writer.endElement("a");
/******************************************/
writer.endElement("div");
...
Code: Select all
// layout.js
PrimeFaces.widget.Atlantis = PrimeFaces.widget.BaseWidget.extend({
init: function(cfg) {
...
this.tabMenuContents = this.tabMenu.find('.layout-tabmenu-content'); // Please add this line
this._bindEvents();
this._restoreMenuState(); // Please add this line
},
_bindEvents: function() {
....
this.tabMenu.find('.menu-pin-button').on('click', function(e) { // Please add this event
var icon = $(this).children('i');
if(icon.hasClass('fa-rotate-90'))
$this._saveMenuState($(this).closest('.layout-tabmenu-content').index());
else
$this.clearMenuState();
$this.tabMenuContents.find('.menu-pin-button').children('i').toggleClass('fa-rotate-90');
e.preventDefault();
});
...
}
Code: Select all
//Css
.layout-wrapper .layout-sidebar .layout-tabmenu .layout-tabmenu-contents .layout-tabmenu-content .layout-submenu-title .menu-pin-button {
padding: 0px 7px;
float: right;
text-align: center;
-moz-transition: background-color 0.3s;
-o-transition: background-color 0.3s;
-webkit-transition: background-color 0.3s;
transition: background-color 0.3s;
}
.layout-wrapper .layout-sidebar .layout-tabmenu .layout-tabmenu-contents .layout-tabmenu-content .layout-submenu-title .menu-pin-button:hover {
background-color: #E0E0E0;
}
Github Profile: https://github.com/mertsincan
-
- Information
-
Who is online
Users browsing this forum: No registered users and 9 guests