Question
JSC Sberbank of Russia - Ukraine
UA
Last activity: 10 Oct 2016 2:36 EDT
How to remove background color in Screen layouts Slider (Skin)
Hello, Guys ! In the Skin of Application (Menu: Open Application Skin -> Screen layouts -> Style: Header Left ) I can customize Left Panel (Sidebar). When I added Responsive Breakpoint for it "At the dimensions provided below, this panel will be accessible from an icon in the header." it works well. But when Left Panel (Sidebar) appears by pressing the "icon in the header", it has dark background color. The Center Panel has dark background color too at that moment. My question is: How to manage this dark background color from Application Skin ? How to remove it to see original colors and make Left Panel (Sidebar) just slide lift-right by clicking on Icon ? Thanks for your help.
***Updated by Moderator: Vidyaranjan. Removed user added #helpme and Ask the Expert tags. Apologies for confusion, shouldn't have been an end-user option***Tagged SRexists***
Accepted Solution
Pegasystems Inc.
GB
The dark background colour used by the side menu is defined in the py-responsive-overrides css rule attached to the pyEndUser skin (Included Styles / Additional Style Sheets) inside a media query. So you would either need to edit this, or comment out that style to remove it.
The darker middle panel is a screen mask, as when the menu is open you cannot interact with the middle panel.
JSC Sberbank of Russia - Ukraine
UA
Blue Rose Technologies GmbH
DE
This is the jquery code snippet which is used to hide / display the left pane in designer studio screen. Basically this is accompolished by adding and removing the bodyClass style.
$("aside#sidebar-region-one" || "#screen-layout-mask").click(function(){
var bodyelem= $("body.with-fixed-header");
var bodyClass="left-panel-collapsed";
var resizeElem=$("#sidebar-collapse-left");
if (resizeElem.hasClass("collapsed")){
bodyelem.addClass(bodyClass)
}else{
if(bodyelem.hasClass(bodyClass)){
bodyelem.removeClass(bodyClass);
}
}
});
JSC Sberbank of Russia - Ukraine
UA
Blue Rose Technologies GmbH
DE
Always welcome!!
JSC Sberbank of Russia - Ukraine
UA
Blue Rose Technologies GmbH
DE
First you need to check if there are elements with id "sidebar-region-one" (or) "screen-layout-mask" in the DOM. If it does exist then you can check whether its entering our function using console.log statements.
SB
UA
SB
UA