3319 posts
  • Provided great contribution to our forums
  • Nominated Community Superstar of the month
  • Helps us moderate the forums
  • Has been part of the Envato Community for over 5 years
+18 more
dtbaker Moderator says

How many authors split their CSS file into layout (width, height, margin, padding, float, etc..) and design (color, background-image, etc..) files? To make it easier to update the layout if you have multiple color options in a theme?

I just created a basic “splitter” tool that will take a single CSS file and spit out two CSS files. One with all your layout in it, one with all your design colors/images in it.

http://dtbaker.com.au/css_splitter/

Hopefully someone finds it useful, I certainly find it easier in the long run to have a layout.css file then separate green.css, blue.css, red.css etc… stylesheets.

Enjoy!

399 posts
  • Has referred 100+ members
  • Has sold $250,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
+5 more
EugeneO says

This could be very useful. I’ll be giving it a whirl.

501 posts
  • Has referred 1000+ members
  • Has sold $250,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Elite Author: Sold more than $75,000 on Envato Market
+8 more
pixelentity says

Hey, Yeah we do this for our work, so will defo give this a try, could save us a few hours of mind numbing work :D Cheers dtbaker

332 posts
  • Has referred 1+ members
  • Has sold $5,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Has collected 1+ items on Envato Market
+2 more
dekciw says

Awesome! Perfect tool for skinning ;) Thanks, man!

1058 posts It's in the pipeline!
  • Has sold $500,000+ on Envato Market
  • Has been part of the Envato Community for over 6 years
  • Elite Author: Sold more than $75,000 on Envato Market
  • Sells items exclusively on Envato Market
+7 more
purethemes says

Awesome! I always do it manually. These could save me a lot of time!

815 posts
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Contributed a free file of the month
+3 more
rvision_ says

Awesome, just what I needed, thank you dtbaker.

Any chance of improving output formatting?

EDIT : it depends on a file, sorry

815 posts
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 1+ items on Envato Market
  • Contributed a free file of the month
+3 more
rvision_ says

Please let me know if a particular “design” element is missed (eg: border color).

-moz-box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085); -webkit-box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085); box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085);

2196 posts
  • Located in Europe
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
  • Participated in a focus group or interview to improve the user experience on Envato Market
+10 more
revaxarts says

Great work man! This is bookmarked!

3319 posts
  • Provided great contribution to our forums
  • Nominated Community Superstar of the month
  • Helps us moderate the forums
  • Has been part of the Envato Community for over 5 years
+18 more
dtbaker Moderator says


Please let me know if a particular “design” element is missed (eg: border color).
-moz-box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085); -webkit-box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085); box-shadow:0px -1px 2px rgba(0, 0, 0, .085), 1px 1px 0px rgba(0, 0, 0, .085);

thanks. forgot about rgba colors and shadows :) I’ll try to add these in.

2196 posts
  • Located in Europe
  • Made it to the Authors' Hall of Fame
  • Had an item featured on Envato Market
  • Participated in a focus group or interview to improve the user experience on Envato Market
+10 more
revaxarts says

I would love to see a textarea where I can simple paste my style from the editor cause the file is always deep down in my file jungle :)

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by