vb.org Archive - vB4 board shadow effect?

Page 1 of 2

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vB4 Design and Graphics Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=253)

- - vB4 board shadow effect? (https://vborg.vbsupport.ru/showthread.php?t=310987)

EliasAlucard

05-02-2014 05:31 PM

vB4 board shadow effect?

On vB3, and as we can see on this very forum, there's a small shadow around the forum board. This effect seems to have been removed in vB4? Because I cannot find it, nor have I ever seen a skin with this shadow effect.

Is there any way in stylevars to skin a vB4 forum with a shadow like this vB3 skin?

Mr_Running

05-02-2014 09:41 PM

Styles & Templates --> Search in Templates --> Search for Text --> additonal.css (In style of your choice) --> Add to additional css...

Try Something like this in the additional.css

Code:

.body_wrapper {

   -moz-box-shadow: 4px 4px 5px #FF0000;

   -webkit-box-shadow: 4px 4px 5px #FF0000;

   box-shadow: 4px 4px 5px #FF0000;

}

Code:

Change #FF0000 to your shadow colour / color

EliasAlucard

05-03-2014 06:02 AM

^^ Yeah, that worked. However, it only shows the shadow on one side, and only in the body, not in the header. I'd like to have the shadow effect all over the board so to say, on both sides and under the footer as well as above the header.

billstelling

05-03-2014 11:06 AM

This will help..

https://vborg.vbsupport.ru/external/2014/05/70.png

Code:

#Example_E {

-moz-box-shadow: 0 0 5px #888;

-webkit-box-shadow: 0 0 5px #888;

box-shadow: 0 0 5px #888;

}

Code:

#Example_F {

-moz-box-shadow: 0 0 5px 5px #888;

-webkit-box-shadow: 0 0 5px 5px #888;

box-shadow: 0 0 5px 5px #888;

}

http://www.css3.info/preview/box-shadow/

DreadsUK

05-03-2014 11:34 AM

Quote:

Originally Posted by billstelling (Post 2495995)

This will help..

https://vborg.vbsupport.ru/external/2014/05/70.png

Code:

#Example_E {

-moz-box-shadow: 0 0 5px #888;

-webkit-box-shadow: 0 0 5px #888;

box-shadow: 0 0 5px #888;

}

Code:

#Example_F {

-moz-box-shadow: 0 0 5px 5px #888;

-webkit-box-shadow: 0 0 5px 5px #888;

box-shadow: 0 0 5px 5px #888;

}

http://www.css3.info/preview/box-shadow/

Hope you guys dont mind me jumping in (dont mean to hijack) just interested in this also

just tried the code but it doesn't cover the top of the page

https://vborg.vbsupport.ru/external/2014/05/71.png

billstelling

05-03-2014 03:45 PM

Because those elements are above the body. You will have to add it for the header and nav, as well as getting the shadow code correct to pull off the effect.

DreadsUK

05-04-2014 08:25 AM

The code is for box which puts the shadow all around the nav bar. How to i add it to just the sides of it?

EliasAlucard

05-04-2014 09:20 AM

Quote:

Originally Posted by billstelling (Post 2496038)

Because those elements are above the body. You will have to add it for the header and nav, as well as getting the shadow code correct to pull off the effect.

Where do I place the shadow code in the header and nav elements? ;)

billstelling

05-04-2014 11:06 AM

Any css style element can be change via Additional CSS. So most times anything you don't change using the stylevars gets added to it.

for the header it would be:

Code:

.header {

-moz-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

-webkit-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

}

for the navbar it would be:

Code:

.navbar {

-moz-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

-webkit-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

}

It should be something like that..

DreadsUK

05-04-2014 11:17 AM

Quote:

Originally Posted by billstelling (Post 2496104)

Any css style element can be change via Additional CSS. So most times anything you don't change using the stylevars gets added to it.

for the header it would be:

Code:

.header {

-moz-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

-webkit-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

}

for the navbar it would be:

Code:

.navbar {

-moz-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

-webkit-box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

box-shadow: 0 2px 5px 5px #888, -0 -2px 5px 5px #888;

}

It should be something like that..

neither of those worked

--------------- Added [DATE]1399206015[/DATE] at [TIME]1399206015[/TIME] ---------------

This is what i've got so for working

https://vborg.vbsupport.ru/external/2014/05/63.png

resulting in this

https://vborg.vbsupport.ru/external/2014/05/64.png

All times are GMT. The time now is 09:25 AM.

Page 1 of 2

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01090 seconds Memory Usage 1,739KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (10)bbcode_code_printable (3)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (1)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (10)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: