Go Back   vb.org Archive > vBulletin Modifications > Archive > vB.org Archives > vBulletin 3.5 > vBulletin 3.5 Template Modifications
FAQ Community Calendar Today's Posts Search

Reply
 
Thread Tools
[CSS tip] Like those neat, flat buttons? Details »»
[CSS tip] Like those neat, flat buttons?
Version: 1.00, by Lea Verou Lea Verou is offline
Developer Last Online: Jul 2012 Show Printable Version Email this Page

Version: 3.5.0 Rating:
Released: 10-10-2005 Last Update: Never Installs: 46
 
No support by the author.

This is not a style, just some CSS definitions to make input boxes, dropdowns and buttons have this neat, flat, modern look like they do in IPB. If this is considered a template modification (I don't think so as you don't edit any templates) then mods, feel free to move it to the appropriate subforum.

Fistly go to Styles & Templates>Style Manager>Main CSS.

1. Buttons
Go to the CSS settings group Buttons and add this code to Extra CSS attributes:
Code:
border-color: #ΧΧΧΧΧΧ;
border-style:solid;
border-width:1px;
padding:2px;
margin: 2px;
Substitute the #XXXXXX above with the border color you want them to have.
Finally, add to the field Background the background color you want the button to have.That's it! You're done!
2. Input fields
Go to the CSS settings group Input fields and add this code to Extra CSS attributes:
Code:
border-color: #ΧΧΧΧΧΧ;
border-style:solid;
border-width:1px;
padding:2px;
margin: 2px;
Substitute the #XXXXXX above with the border color you want them to have.
Finally, add to the field Background the background color you want the input field to have.That's it! You're done!
3. Drop-downs
Go to the CSS settings group <select> Menus and add this code to Extra CSS attributes:
Code:
border-color: #ΧΧΧΧΧΧ;
border-style:solid;
border-width:1px;
padding:2px;
margin: 2px;
Substitute the #XXXXXX above with the border color you want them to have.
Finally, add to the field Background the background color you want the dropdown to have.That's it! You're done!

Chances are this works with 3.0.x as well
If you liked it and use it, please click

Show Your Support

  • This modification may not be copied, reproduced or published elsewhere without author's permission.

Comments
  #2  
Old 10-11-2005, 06:27 PM
FleaBag's Avatar
FleaBag FleaBag is offline
 
Join Date: Dec 2001
Posts: 1,674
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Awesome, installed.
Reply With Quote
  #3  
Old 10-11-2005, 06:36 PM
Lea Verou Lea Verou is offline
 
Join Date: Jul 2005
Location: Greece
Posts: 1,856
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by FleaBag
Awesome, installed.
Thanks!!!
Glad you liked it!
Reply With Quote
  #4  
Old 10-11-2005, 07:08 PM
Quillz's Avatar
Quillz Quillz is offline
 
Join Date: Jan 2005
Location: Los Angeles, CA
Posts: 128
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Very nice! I love IPB's modern and professional look, but not necessarily its software. This is the best of both worlds.
Reply With Quote
  #5  
Old 10-14-2005, 10:39 AM
Lea Verou Lea Verou is offline
 
Join Date: Jul 2005
Location: Greece
Posts: 1,856
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Quillz
Very nice! I love IPB's modern and professional look, but not necessarily its software. This is the best of both worlds.
Thanks a lot Quillz!

Wow, 10 installs! My first hack got a big fat zero (it has only 1 install which is mine) , so 10 looks quite a lot to me
Reply With Quote
  #6  
Old 10-14-2005, 04:16 PM
TruthElixirX's Avatar
TruthElixirX TruthElixirX is offline
 
Join Date: Sep 2004
Location: Oklahoma
Posts: 517
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Much appreciated.
Reply With Quote
  #7  
Old 10-20-2005, 02:33 PM
Citizen E's Avatar
Citizen E Citizen E is offline
 
Join Date: May 2005
Posts: 11
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Just a note, you can add a background color option as well:

border-color: #xxxxxx;
background-color: #xxxxxx;
border-style:solid;
border-width:1px;
padding:2px;
margin: 2px;
Reply With Quote
  #8  
Old 10-20-2005, 03:25 PM
Lea Verou Lea Verou is offline
 
Join Date: Jul 2005
Location: Greece
Posts: 1,856
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Citizen E
Just a note, you can add a background color option as well:

border-color: #xxxxxx;
background-color: #xxxxxx;
border-style:solid;
border-width:1px;
padding:2px;
margin: 2px;
Why would you? vBulletin has already a field for background color which does this exact thing
Reply With Quote
  #9  
Old 10-21-2005, 01:24 AM
Mr Chad's Avatar
Mr Chad Mr Chad is offline
 
Join Date: Jul 2005
Posts: 911
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Cool.
Reply With Quote
  #10  
Old 12-17-2005, 06:26 PM
yessir's Avatar
yessir yessir is offline
 
Join Date: Jul 2005
Location: Canada
Posts: 87
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Thanks lady.
Reply With Quote
Reply


Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 02:05 PM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.09067 seconds
  • Memory Usage 2,298KB
  • Queries Executed 23 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (3)bbcode_code
  • (3)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)modsystem_post
  • (1)navbar
  • (6)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (10)post_thanks_box
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (10)post_thanks_postbit_info
  • (9)postbit
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.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/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.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
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete