Prime Community Forum

Hi,

I would like to change the background colour of the Layout Config Button.

I want the background colour of the Layout Config Button to follow the rules below.

1) In Light Colour Scheme, the background colour should be the same as Menu Theme's colour
2) In Dim Colour Scheme, the background colour should be the same as the Component Theme's colour (lightness 10%)
3) In the Dark colour Scheme, the background colour should be the same as the Component Theme's colour (lightness -10%)

I look through _config.scss file (the public/assets/sass/layout/_config.scss) and try to change the variables under the ".layout-config-button.p-button" class without success

.layout-config-button.p-button {
position: fixed;
top: 80%;
right: 0;
width: 3.5rem;
height: 3.5rem;
text-align: center;
border-top-right-radius: 0;
border-bottom-right-radius: 0;
overflow: hidden;
cursor: pointer;
z-index: 999;
box-shadow: -.25rem 0 1rem rgba(0,0,0,.15);
transition: background-color $transitionDuration;
background: $accentColor; /* try to change this to $primaryColor but unsuccessful */
color: $accentTextColor; /* also try to change this but unsuccessful */
border-right: none;

.p-button-icon {
font-size: 2.5rem;
line-height: inherit;
transform: rotate(0deg);
transition: transform 1s;
}
}

Would you be able to tell me how I should go about changing the background colour of the layout configuring button? Thanks!

Hey there!
Sure I will gladly help. Actually, you went on the right track.
After your changes, you have to write below this code block and run it on the terminal.
You might see the changes.
Best