Rosyweb Posted September 24, 2018 Share Posted September 24, 2018 Thank you, that's great. Now to complete the horizontal menu it would be great it I can change the categories button that appears on re-size to a hamburger button. Of course I'll have to re-think the top menu hamburger button, but I think its better placed for the navigation bar, people are more accustom to it there. I'll post when I work out how to do this, but if anyone already has I would love to hear. Link to comment Share on other sites More sharing options...
Rosyweb Posted September 24, 2018 Share Posted September 24, 2018 Ok so that was relatively simple. Simply go into includes / modules / content / header / templates / catmenu.php line 27 you will find: <i class="fas fa-chevron-down"></i> <?php echo TEXT_COLLAPSE_MENU; ?> replace this with: <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span> which draws the 3 lines of the hamburger! just need to left float this now. Link to comment Share on other sites More sharing options...
Rosyweb Posted September 26, 2018 Share Posted September 26, 2018 Whilst changing the categories button to a hamburger button was relatively simply, the styles are not. The style to edit is: .navbar-toggle this is linked to in style sheet (although also present in bootstrap.css) ext/bootstrap/css/bootstrap.min.css but you can over-ride this by creating this style in user.css if you don't want to meddle with bootstrap.min.css. So float to left and adjust other spacing! Link to comment Share on other sites More sharing options...
Rosyweb Posted September 28, 2018 Share Posted September 28, 2018 So trying to change the font colour on this horizontal navigation menu. I don't just want to go to inverse. I've tried every style I can, to see what is governing this. navbar-default navbar-nav dropdown dropdown-toggle none work! See code snippet below: <div class="collapse navbar-collapse" id="bs-navbar-collapse"> <ul class="nav navbar-nav"> <li class="dropdown"><a href="#" tabindex="-1" class="dropdown-toggle" data-toggle="dropdown">Category item 1 text<span class="fas fa-caret-down"></span></a><ul class="dropdown-menu"><li><a href="http://www.yachtandski.co.uk/test2/index.php?cPath=22"> In the end I had to hack it and wrote the style color #FFFFF inline - which I hate doing! <li class="dropdown"><a href="#" tabindex="-1" class="dropdown-toggle" data-toggle="dropdown" style="color:#FFFFFF">Category item 1 text ---------------------------------------------- It will do for now, but can anyone shed any light on this. What style can I change a style in the css to change the colour on the main product category titles, but leave the dropdown text in black? thanks all! Link to comment Share on other sites More sharing options...
♥JcMagpie Posted September 28, 2018 Share Posted September 28, 2018 The dropdown is using <a for the font color, a:focus, .navbar-default .navbar-nav > li > a:hover { color: #e62626; background-color: transparent; For none hover add this to css .navbar-default .navbar-nav > li > a { color: #ec1717; } will change to red! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.