Submenu links don't appear as links

[tgross]

Links in the submenus don't appear as links; they're just black text on a gray box. For example:

I was going to make a PR with a tweak but you're using Less and I got a bit lost trying to find where I was supposed to be. 😊 The compiled asset is http://www.devopsdays.org//css/devops.min.css and with this fix:

 .submenu h3 a {
    color: #333333;
    /* text-decoration: none; */
}

You end up with this nicer submenu:

cc @bridgetkromhout as you asked me to drop a line here

[bridgetkromhout]

Thanks, @tgross! We have a branch going with a responsive redesign (probably landing this weekend) and then I'll chat with our site mastermind @mattstratton and figure out how best to clear up this admittedly confusing visual. I appreciate the detailed issue.

[mattstratton]

Totally get where you're coming from; this is inherited from the previous design which I assume had some reason for making them not have underlines. :)

We will noodle on the change.

[bridgetkromhout]

I think one minimal thing we could do is make a hover-over lead to an underline appearing, much like on the program pages in the responsive redesign (I'm hovering over Ben Zvan's talk on the right):

[bridgetkromhout]

The underlining works for me in Chrome on the front page:

But it doesn't work on the site-specific pages:

[yvovandoorn]

So I spent some time debugging this and my CSS foo is at wits end. The hover action for the CSS class ID has been defined but its been overruled elsewhere as its not being triggered or interpreted by the browser (at least with the built in Chrome DevTools).

[mattstratton]

Do you know the trick in Dev Tools to expose the :hover psudoclass?

[yvovandoorn]

Yup. The trick works on the front page but not on the event headers.

On Sunday, 12 June 2016, Matt Stratton notifications@github.com wrote:

Do you know the trick in Dev Tools to expose the :hover psudoclass?

—
You are receiving this because you modified the open/close state.
Reply to this email directly, view it on GitHub
#510 (comment),
or mute the thread
https://github.com/notifications/unsubscribe/ACkd_5BXbSCHJaD-zSfhHMVS2D4Aoi2iks5qLHf2gaJpZM4It594
.

Yvo van Doorn — Manager, Technical Services (EMEA)

+31 6 38 74 07 46 <+316740746> – yvo@chef.io – *my: *Linkedin
http://www.linkedin.com/in/yvovandoorn/ Twitter
https://twitter.com/yvov

CHEF

CHEF.IO http://www.chef.io/

TM

chef.io http://www.chef.io/ Blog http://www.chef.io/blog/ Facebook
https://www.facebook.com/getchefdotcom Twitter
https://twitter.com/chef Youtube https://www.youtube.com/getchef

[mattstratton]

Ok so I think I fixed it, but I don't like how I had to fix it.

This actually all goes back to issues with us using <h3> tags for navigation which is semantically crap, and I'll refactor that later. Anyway, it seems that setting the text-decoration on the a element instead of on the h3 element was causing some weirdness. This is all around bad, but it now matches the way I did the CSS on the homepage, so it seems to work. I'm submitting the PR with the fix in a minute.