Ravens PHP Scripts: Forums
 

 

View next topic
View previous topic
Post new topic   Reply to topic    Ravens PHP Scripts And Web Hosting Forum Index -> RavenNuke(tm) v2.5x
Author Message
spasticdonkey
RavenNuke(tm) Development Team



Joined: Dec 02, 2006
Posts: 1693
Location: Texas, USA

PostPosted: Sat Feb 04, 2012 12:29 pm Reply with quote

We have a new wiki doc regarding Block Functionality and Styling changes in 2.5: [ Only registered users can see links on this board! Get registered or login! ]

As part of the block styling changes, background image(s) and/or CSS Sprites are used in place of standard list markers/numbers to maintain IE7 compatibility. CSS sprites are required for ordered lists. The default sprites provided only come in Black, Off White, and an example of number icons for Simply Blue. That is until now Smile

For those that need a custom colored number sprite, how about 70+ colors, a PSD file, and a Sprite Picker demo that will help you pick a sprite and output the appropriate CSS to your theme??

Sprite Picker Demo
Arrow [ Only registered users can see links on this board! Get registered or login! ]

Image

Step 1: Style to Match Your Theme using the jQuery Colorpicker, then "toggle" thru the sprites to find your match!

Image

Step 2: Copy/Paste CSS and upload images/css

Image

Step 3: Refresh and Enjoy!

DOWNLOAD
Arrow [ Only registered users can see links on this board! Get registered or login! ]

Note: The online demo may not run "great" in all browsers. The colorpicker hasn't been updated in a few years and generates some JavaScript warnings, although for the purposes of a demo it functions well enough. Also, this page is not a good example of optimization as it includes 70+ small CSS files to toggle the sprites; which some older browsers may choke on. Embarassed

Also note that the first several sprites are in shades of gray and may not look much different until you get into some of the other colors.
 
View user's profile Send private message Visit poster's website
Palbin
Site Admin



Joined: Mar 30, 2006
Posts: 2583
Location: Pittsburgh, Pennsylvania

PostPosted: Sat Feb 04, 2012 4:50 pm Reply with quote

Nice work as usual.

_________________
"Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." — Brian W. Kernighan. 
View user's profile Send private message
nextgen
Worker
Worker



Joined: Sep 28, 2006
Posts: 241

PostPosted: Sun Feb 05, 2012 8:17 am Reply with quote

Wow, another great extra for RN.

_________________
alterednuke.com Your source for Ravennuke themes. 
View user's profile Send private message Send e-mail
duck
Involved
Involved



Joined: Jul 03, 2006
Posts: 273

PostPosted: Sun Feb 05, 2012 5:03 pm Reply with quote

I'm sorry but I am a little lost as to why someone would use an image for a numbered list? (at least one that does nothing more than change the color of the number??)
 
View user's profile Send private message
spasticdonkey







PostPosted: Sun Feb 05, 2012 8:22 pm Reply with quote

It was done for IE7 compatibility, which at the time the code was being worked on still had about a 10% market share. Fortunately its down to about 4% now. If you try floating list items in IE7 you will see the problem... Both in ordered and unordered lists...

But I understand, I wasn't 100% thrilled about sprites in this situation Wink

Overriding is easy enough within your style.css.. Didn't test, but something like this should do.

Code:
ol.rn-ol{padding-left:20px;list-style-type:decimal}

ol.rn-ol li{padding:0 4px 0 0;list-style-type:decimal}
.ol-num{background-image:none}
 
Display posts from previous:       
Post new topic   Reply to topic    Ravens PHP Scripts And Web Hosting Forum Index -> RavenNuke(tm) v2.5x

View next topic
View previous topic
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
You can attach files in this forum
You can download files in this forum


Powered by phpBB © 2001-2007 phpBB Group
All times are GMT - 6 Hours
 
Forums ©