How to make the default Gantry menu rounded corners square
I finally got through the stumbling blocks from last time: finding files etc. and setting up XAMPP/Bitnami to edit our site locally. This morning I figured out something that I could not find out how to do correctly on the internet, so I'll post it here: how to change Gantry's default rounded menu corners to square corners. And this means all of the menus and menu items. Not just some of them.
In our installation, wp-content/themes/rt_gantry_wp/less/menu.less contains all the default menu setup. There are a lot of instances of foo.border-radius(@menuItemRadius) in there. So there are two readily obvious ways to change rounded corners:
Get rid of all these foo.border-radius entries. I don't recommend it, since if you don't like your new 0px corners it won't be so simple to go back.
Find where @menuItemRadius is set and change it there.
I went with option 2. Our variables are set in wp-content/themes/rt_gantry_wp/less/variables.less. @menuItemRadius was set to 4px by default. First I changed it to 0px. The corners looked incredibly sharp. I found that 1px and even 2px still look square but have a nicer, antialised appearance.
At this point a few corners in the menu were still decidedly rounded. These turned out to be hard-coded to 5px in menu.less. I'm not well-versed enough in Gantry to understand the design decision behind that, but they are easy enough to fix once we know where to look!
I hope this helps others. It seems to be a fairly common question and I did not find a complete answer to it other than hacking the CSS under Gantry Theme->Style (none of the information I found about this covered every case, in my menu).
Also in order to view our LESS files properly on Windows, I had to download an editor that understands *nix line endings. Notepad wasn't up to the task.
