Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
Pages: 1
Finally got the mobile navigation to work on my test site
pideja.ca/luc.
-Why does the navigation show as a rounded square on the iPhone? Any way to change that?
-Any way to control the size, color of that side panel (containing the navigation, menus) that swings out?
Offline
First, you can simply type in the url to your site, you don't need to put it in code brackets. That will make it easier for us to simply click on a link.
-Why does the navigation show as a rounded square on the iPhone? Any way to change that?
That's the way it's designed. You can change the border radius with custom css. From the inspector, it looks like this might be the selector:
.page__toggle__buttons li
-Any way to control the size, color of that side panel (containing the navigation, menus) that swings out?
that's controlled by the pallet width under Layout.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Sorry about that URL. Won't do it again.
As suggested,I used the inspector to look over the site.
Also, I modified the .page__toggle__buttons li and this is what I put in:
.page__toggle__buttons li {
color: #d5cab8;
font-size: 0.875rem;
line-height: 36px;
list-style: none;
list-style-type: none;
text-align: center;
}This is the exact code showing up in the inspector except for the color that I changed for the beige used throughout the site. But, no change apparent. The whole point of this exercise is to change the menu in mobile size from the black or white blob that's there now to something more significant. Would prefer the word "menu" but would settle for the regular hamburger with contrasting horizontal lines.
Offline
your custom css file for that page (http://pideja.ca/luc/) does not contain that css. but it does contain some syntax errors
also, you can change the colors in the button in the page template in Top Pallet > Buttons.
But if you must use custom css, then this will change border radius and background-color
.page__toggle__buttons li {
border-radius:0;
background-color: red;
}And this will change the color of the horizontal lines in the hamburger icon:
ul.palletToggle li {
background-color: white;
}Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Thanks, Rod,
For some reason, the CSS file does not respond. But, the good news is that in the Top Palette menu (as indicated by you) I did succeed in making the change.
Offline
I think your css file is not responding because that page is not using the file you think it is. Look at the page template and see if it's using the right custom css file
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Pages: 1