- This topic has 13 replies, 2 voices, and was last updated 6 years, 5 months ago by Skandha.
-
AuthorPosts
-
May 23, 2018 at 3:08 pm #146374PositivelyVisualParticipant
Hi,
I love how this theme looks, but not the default color scheme. I would like to change all of that purple and orange. Is there CSS to do this? Also, is there a way to increase the logo size on mobile. It comes out sooo small on my phone.
Thanks for any help.
May 23, 2018 at 8:33 pm #146382PositivelyVisualParticipantActually, the only color I seem to need help with now is the menu color that changes to white when scrolling down… that and the logo size on mobile still.
Thanks for any help.
May 23, 2018 at 10:03 pm #146384PositivelyVisualParticipantAlso, I was wondering if there is a way to shrink the header area. I have it set so there is no header image, but the header area seems just as large as the default image (a lot of empty space).
Thanks for any help.
May 24, 2018 at 1:27 am #146397SkandhaParticipant@positivelyvisual: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
To change the color of header when scrolling down.fixed-nav #masthead { background-color:#1a1a1a; }
To change the size of logo in mobile view
@media screen and (max-width:1023px) { .site-branding img { width:125px; } }
To shrink header area
.header-media-disabled #masthead.main-nav-scrolled { height:100px; }
Let me know if this works out.
Kind Regards,
SkandhaMay 24, 2018 at 2:44 pm #146489PositivelyVisualParticipant@Skandha: Thanks Skandha! I appreciate your help. I love the new logo size on mobile and I love having control over the header color and size when scrolling down. When I originally mentioned wanting to change the header size, what I mean is the space behind the page titles (is not there on home page). Perhaps this page will clarify:
http://positivevisdev.com/architectureThere is sooo much space around the word architecture and I don’t want to put an image there to fill it up.
Also, I love having the menu header near-black as I scroll down, but then I can’t see the search button, the menu button, or the word ‘MENU’. Is there css code to change these elements to #fff?
I appreciate all the help you’ve already given (and for a free theme user!).
Thanks for any additional help you are able to give.
May 25, 2018 at 3:18 am #146513SkandhaParticipant@positivelyvisual: To reduce the space around page-title
Go to => Appearance => Customize => Additional CSS and add the following CSS Code..custom-header .entry-container { padding-top:100px; padding-bottom:25px; }
To change color of menu item and search
Go to => Appearance => Customize => Additional CSS and add the following CSS Code.#search-toggle a, .menu-label { color:#fff !important; } .fixed-nav .menu-toggle .fa, .fixed-nav .menu-close .fa { color:#fff !important; border-color:#fff !important; } #search-toggle .fa.fa-search:hover { color:#000 !important; } .menu-toggle .fa.fa-bars:hover { background-color:#000 !important; }
Let me know if this works out.
Kind Regards,
SkandhaMay 25, 2018 at 1:47 pm #146550PositivelyVisualParticipant@Skandha: Thank you for the continued support. I love the new spacing around my titles. I like the new control over the menu colors, though there are a couple elements that don’t quite work out…
On mobile, the close button doesn’t show… the reason seeming is that the x symbol is linked to the menu bar symbol, and changing one seemingly changes the other:
http://positivevisdev.com/wp-content/uploads/2018/05/Capture_2018-05-25-10-12-31-1.pngOn PC the words Close doesn’t show… the reason seeming is that those words are linked to the words Menu:
http://positivevisdev.com/wp-content/uploads/2018/05/capturepc.pngSo my guess is, unless there is some CSS to isolate these elements, I may need to find a work around and that a black vs white theme won’t work exactly as planned… so I decided to use the code you gave me and tried out a hue/color that will show against both black and white (green), and it all works nicely except the circle and the menu bars symbol are white when the page is stationary and sitting at the top (not scrolled down at all). None of the code you gave me seems to affect these two elements in this state. If there is no solution to the issues described above I’m wondering if you can please give me the css to change these two elements in this state to green as well:
http://positivevisdev.com/wp-content/uploads/2018/05/alternative.pngAlso, I seem to have control over the circle hover color when the point is on the circle, but not when the pointer is on the word “Menu”:
“http://positivevisdev.com/wp-content/uploads/2018/05/alternative.png”Other than that, everything seems WONDERFUL. Thank you for your support,
JoshuaMay 25, 2018 at 1:48 pm #146551PositivelyVisualParticipant@skandha: Sorry, my last link wasn’t setup properly and wasn’t the correct address. The hover elements:
http://positivevisdev.com/wp-content/uploads/2018/05/pointerhover.pngMay 26, 2018 at 3:03 pm #146598PositivelyVisualParticipant@skandha: Hi Skandha. I actually figured out how to change many things myself! Thanks for your help! If I decide to upgrade, purchase a theme, or recommend a theme to anyone Catch Themes is at the top of my list!
I love how the theme looks on my PC. I love how it looks even more on my android phone.
I only have one thing left I haven’t figured out. I don’t know how to change what I thought may be
.menu-toggle .fa.fa-bars, but I didn’t seem to find a state that worked… maybe I missed it?Anyways, I would like behind the bars to be #1a1a1a rather than green, which is making a completely green circle at the moment:
http://positivevisdev.com/wp-content/uploads/2018/05/lastthing.pngThis seems to only happen on PC after clicking.
May 28, 2018 at 3:38 am #146654SkandhaParticipant@positivelyvisual: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
.menu-close:hover .fa, .menu-close:focus .fa { background:none !important; }
Let me know if this works out.
Kind Regards,
SkandhaMay 29, 2018 at 2:29 pm #146759PositivelyVisualParticipantWonderful. Thanks for everything!
May 29, 2018 at 8:39 pm #146770SkandhaParticipant@positivelyvisual: Hello there, I hope I was able to resolve your issue. If it’s not too much trouble, I have a quick request: could you please leave an honest review?
https://wordpress.org/support/theme/personal-trainer/reviews/#new-post
Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated. Thanks, and if there’s anything else at all that I can do to help,
don’t hesitate to let me know. Have a good day!Kind Regards,
SkandhaMay 30, 2018 at 2:57 pm #146836PositivelyVisualParticipant@skandha: You sure did. I left a review. 5 stars.
Thanks again and kind regards as well,
Joshua Townsend
http://www.positivevisdev.comMay 31, 2018 at 12:33 am #146845SkandhaParticipant@positivelyvisual:
Dear Joshua,
I have read your comments. They were really helpful. I greatly
appreciate you took the time to write them. Thank you! 🙂Kind Regards,
Skandha -
AuthorPosts
- The topic ‘Change Colors And Mobile Logo Size’ is closed to new replies.