Search…

X3 Photo Gallery Support Forums

Search…
 
dsellung
Experienced
Topic Author
Posts: 25
Joined: 17 Jan 2015, 17:36

3 bars missing on mobile

10 Apr 2020, 17:49

Hi there and thanks a lot for all the work you put into X3! 👍🏻

I have a small issue with the menu button on mobile devices (iPad with Chrome and Safari, Android with Chrome):
The button is black until I hit it. Then the 3 white bars are visible, until I go to another page. Same there.

I checked some other websites using X3 but didn't notice this issue, so maybe it's a setting that I made by mistake? I couldn't find any though.

My site: www.dominiksellung.de

Thanks in advance!!
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: 3 bars missing on mobile

11 Apr 2020, 06:52

This is because you have set BLACK skin primary color (in Style > Skin settings). The primary color is meant to be a contrast to the rest of the website, and will emphasize various BUTTONS (like the sidebar menu). However, if you set it to BLACK (or white), the icons and text that overlay some buttons will not be visible. In the case of your sidebar button, the icon is semi-transparent black overlaying black, which then makes the icon invisible. On the case of HOVER (or touch focus), the icon turns WHITE to emphasize action, thus becomes visible.

In conclusion, really you should be using a COLOR for "primary color" (or grey), that contrasts well with black and white used for icons. If not, you will need to use custom CSS to specify the icon color. Go to settings > custom > custom CSS, and add this:
Code
.sb-toggle > button {
  color: white;
}
 
dsellung
Experienced
Topic Author
Posts: 25
Joined: 17 Jan 2015, 17:36

Re: 3 bars missing on mobile

11 Apr 2020, 13:12

Ahh okay, thank you very much for the support! Actually I used custom CSS you suggested. 😄