Styling Issues

[Brad]

I am setting up the theme on my site at http://tradingpremium.com

I am having the following issues:
1.) The menu button is white on a white background on mobile devices
2.) The logo blends into the background on http://tradingpremium.com/wp-login.php
3.) There is a blue line above the login button on the above noted page.
4.) When the side menu is compressed, the icons turn blue on mouseover — I cannot determine how to change these.

Any help correcting these issues will be most appreciated!

Thank you,

Brad

[Anonymous]

@tradingpremium nice social network topic. Could you tell me what plugin you are using for your forum? It may be bbPress, but I wouldn’t know because I have never used it I just know its popular. Yours has a nice, simple, and clean look.

Bucky

[Brad]

@ryanmaler I am using bbPress — compliments to the designers for the clean look!

Regarding styling issue #1, the following code corrected the icons that were blending in with the white background:

.sidebar-btn {
    color: #999;
}

.sidebar-btn:hover {
    color: #999;
}

[Brad]

I should also note that while logged in on mobile, I am not seeing any of the “My Profile” links (photo attached)…

[Anonymous]

Hi @tradingpremium , You can manage all possible color customization option from the customize option under Appearence.

For point no. 3 ‘There is a blue line above the login button on the above noted page.’

You need to add custom css there

.post_li{ list-style: none;padding: 10px 0;}
.tablet .menu-panel #nav-menu > ul > li.dropdown > a:before,
.tablet .menu-panel .bp_components ul li ul li.menupop.dropdown > a:before,    
body:not(.tablet) .menu-panel .screen-reader-shortcut:hover:before,
body:not(.tablet) .menu-panel #nav-menu > ul > li:hover > a:before, 
body:not(.tablet) .menu-panel .bp_components ul li ul li.menupop:hover > a:before{
    color: #fff;
}

and for color you can add any color what you need for hover

Regards
Varun Dubey

[Brad]

Hello Varun,

I note that not all colours are changeable from the admin panel, specifically with regards to #4.

Also, some of my colour selections are conflicting in some areas but look great in others, as presented in #2.

Can you please provide guidance with how to correct these issues?

Thanks,

Brad

[Brad]

Also, I should note that the CSS proposed did not solve my concern.

As such, issues 2, 3, and 4 are still present.

I’ve attached a screenshot of my login page to demonstrate what I am seeing regarding 2 and 3.

[Brad]

Regarding #4, the attached image demonstrates the icon hover color — I have not specified this color in any case on the customize page.

[Brad]

Update: it appears that the above noted CSS code was intended to correct issue #4. It was successful.

Accordingly, items 2 and 3 are still outstanding.

[Anonymous]

Hi, Brad ( @tradingpremium ) ,

for login page it is coming from wordpress core files

You can add some custom css to override it

http://tradingpremium.com/wp-includes/css/buttons.min.css?ver=4.2.2

add this to custom css

.wp-core-ui .button-primary {
-webkit-box-shadow: inset 0 1px 0 #8fc063,0 1px 0 #8fc063 !important;
box-shadow: inset 0 1px 0 #8fc063,0 1px 0 rgba(0,0,0,.15) !important;
}

and for point number 4

it is just your color combination issue

body.login {
background-color: #878A8C;
width: 100%;
}
http://tradingpremium.com/wp-content/uploads/2015/05/logo.png
your logo is transparent with green text and thus it will not be visible with same color background

Regards
Varun Dubey

[Brad]

Hello Varun,

Thank you for this. I’ve added the noted code to custom.css but am not seeing any changes. I don’t believe custom.css is called by the login page. What should I do?

Also, I understand why the logo is blending in — as a suggestion for the theme, since the logo is on the login page, perhaps the main background of this page should be defined by the background color behind the logo on the site?

Thanks,

Brad

[Brad]

I’ve also noticed that my color selections have caused styling issues on the pop out message menu (demonstration attached). Can you please also assist with this?

[Brad]

Because adding code to custom.css did not work, I attempted to change the background color directly in the theme… http://tradingpremium.com/wp-content/themes/boss/css/style-login.css

Even with changing this color, there was no change to the presentation of the login page.

[Brad]

@tjchester @michael @vapvarun Can I have some assistance regarding issues presented? Boss is great theme, but I have been very disappointed with the after-sales service.

[Anonymous]

@tradingpremium

I’ll make sure you get helped. TJ is on vacation this week, and will be back Monday. So we are at half speed this week, sorry for any delays.