Maximum width + burger overlay

[ac-rosebud]

Hello,

I would appreciate some help with a current project. I have two questions:

1. I am working on a website where I use a maximum width for large screen sizes. I would like to use a burger menu (burger overlay), but the burger icon does not respect the maximum width of the website and stays full-width instead. How can I make the burger icon align with the same maximum width as the rest of the content?

2. I would like to use an icon for the search instead of displaying the word “Suche”. Is this possible in Laytheme, and if so, how can it be implemented?

Here is the link to the Work-in-Progress Website: https://neueschule.at/neueschule/home/

Thank you very much for your help.

Best,

Annija

[arminunruh]

ok i will add a setting for 1:

i will release an update for it now

for 2: let me think about it more

[ac-rosebud]

Hi Armin,

thank you so much! That’s amazing. Now there is only the same issue with the X (close) button.

Thank you very much for your help :)

[arminunruh]

Mmmh well the X close Icon is tied to how the overlay is shown

overlays can be set to have different widths and can be on the left side of the screen or right, or be 100% width

its getting a little too complicated to code and im not sure many people would even use this

if you think your x icon is too far out, you could use some custom css like

.overlay-close{
right: 200px!important;
}

if for example you only want this for bigger screens, add this in:
lay options -> custom css & html -> custom css

/* Media query for screens 1024px and wider */
@media (min-width: 1024px) {
  .overlay-close {
    right: 200px!important;
  }
}

this may not exactly match the position of the burger icon or may need some tweaking or even sth like

right: 15vw;

(a percentage width based position, "vw" instead of px)

but this is all i can offer you :/

[ac-rosebud]

Thank you!