• REGISTRATION REQUIREMENTS:

    Your username here MUST MATCH your XenForo username (connected to your XF license).

    Once you have registered here, then you need to start a conversation at xenforo.com w/Bob and provide the following:
    1. Your XenForo License Validation Token
    2. The Domain Name associated with the License
    NOTE: Your account will be validated once ALL requirements are verified/met. Thank you for your patience.

Showcase recentimage block background color

3rd angle

Member
Showcase
Hi Bob,

The above mentioned block is not looking good on a dark style.... how can i change the color of the back ground to match the style..
 

Attachments

  • Screen Shot 2014-01-14 at 9.30.04 PM.png
    Screen Shot 2014-01-14 at 9.30.04 PM.png
    657.3 KB · Views: 11
Last edited:
Its kinda tricky (just was messing around with it myself). Its a combo of core XF CSS, Showcase CSS and BX Slider CSS.

You can try and over ride this...

.bx-wrapper .bx-viewport and set a different background

try this in Extra.css

.showcaseModularItemsContainer .bx-wrapper .bx-viewport {background: none repeat scroll 0 0 #000000;}

This is just ONE part of what you'd have to do.
 
this is the kind of block (from XMG) i am intending to get..without much padding in the thumbnail. The pictures are emphasized
 

Attachments

  • Screen Shot 2014-01-14 at 9.41.37 PM.png
    Screen Shot 2014-01-14 at 9.41.37 PM.png
    1 MB · Views: 4
I was just taking a guess on it (the above)... to really do any fine tune customization, you should take a look at the following CSS templates:

nflj_showcase_item_layout_modular.css
nflj_showcase_bxslider.css

Can you create a new thread in the suggestions forum (when you have time) to ask for Modular Layout Settings (to be able to set what things display), that way you can just chose to display images (kinda like you can with the Forum Home Page slider).

I am looking into the CSS stuff now so I will post what I find when I figure out a decent solution for a dark layout :)
 
ok, this works for ME... (Note: I only did the GRAY area's as it looks like you got the rest covered.

put this in Extra.css (for the correct STYLE)

replace CCCCCC with the correct background-color that you have set for the .sectionMain style var

HTML:
.showcaseMain .bx-viewport {
    background: none repeat scroll 0 0 #CCCCCC !important;
    border: 5px solid #CCCCCC !important;
}

Selection_017.png
 
This is how I did it:

Edit: nflj_showcase_bxslider.css

Code:
.bx-wrapper .bx-viewport {
    /*-moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;*/
    border: solid @primaryLighterStill 5px;
    left: -5px;
    background: @primaryLighterStill;
}

upload_2014-1-16_16-28-20.png


Dark Theme:
upload_2014-1-16_16-28-51.png

Light Theme
upload_2014-1-16_16-29-23.png
 
I've changed CORE to this as it matches with .SectionMain that also uses @contentBackground;

Code:
.bx-wrapper .bx-viewport {
    /*-moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;*/
    border: solid @contentBackground 5px;
    left: -5px;
    background: @contentBackground;
}
 
I've changed CORE to this as it matches with .SectionMain that also uses @contentBackground;

Code:
.bx-wrapper .bx-viewport {
    /*-moz-box-shadow: 0 0 5px #ccc;
    -webkit-box-shadow: 0 0 5px #ccc;
    box-shadow: 0 0 5px #ccc;*/
    border: solid @contentBackground 5px;
    left: -5px;
    background: @contentBackground;
}
looks like this is permission based.. when i logged in it is fine otherwise it still shows white background
 
Back
Top