Melbourne PMer Scott Penrose asked on the Melbourne-PM mailing list about merging and simplifying CSS. If you view the source of the page you're currently looking at you'll see the default Perl Monk CSS at the top, then if you've set your own, yours is underneath it.

Scott wanted a way to merge multiple sheets to provide a single simplified CSS. Thinking about this I've cobbled together the following solution. Its not elegant and it doesn't run fast. But it was fast to write and it does the job. Well I assume it does. Scott, if you're reading this let me know :)

Basically this script will take input from one or more CSS files:
File 1
P { align: left; font-family: sans; font-size: 12pt; }
File 2
TD { text-align: left; font-family: sans; font-size: 12pt; } P { text-align: left; width: 80%; }
It will then return a simplified 'cascading' (inherited) style sheet:
P, TD { text-align: left; font-family: sans; font-size: 12pt; } P { width: 80%; }
#!/usr/bin/perl use CSS; use Strict; #--------------------------------------------------------------------- +----------- # USAGE: # simplify(list_of_files); # NOTE: # list_of_files should be in _increasing_ importance. Styles from th +e last # file will overwrite any duplicate styles of all previous files. # RETURNS: # Simplified formatted CSS #--------------------------------------------------------------------- +----------- # NOTE CAREFULLY: # CSS.pm is very strict in its parsing. Make sure your style sheets +use a # semi-colon after every parameter, even at the end of a block: # body { # font-family: 'times'; # font-size: '12pt'; <--- this semicolon MUST exist # } even though its at the end of the bloc +k # This ain't perl buster! #--------------------------------------------------------------------- +----------- # Author's jottings: This is probably not the most 'golf' way to do th +is, but # its a working solution. #--------------------------------------------------------------------- +----------- print simplify('pmdefault.css','pmuser.css'); #--------------------------------------------------------------------- +----------- # The routine #--------------------------------------------------------------------- +----------- sub simplify { my ($output, %usedby, %css); my @files = @_; die("You have to tell me at least one css file to simplify.") unle +ss @files; my $stylesheet = CSS->new(-source=>$files[0]); shift @files; foreach my $file (@files) { $stylesheet->add_file($file); } my @styles = $stylesheet->styles; foreach my $style (@styles) { my %props = $style->properties; foreach my $property (keys %props) { $props{$property} = "'$props{$property}'" if $props{$prope +rty}=~/\D/; push (@{$usedby{sprintf("%19s : %s",$property,$props{$prop +erty})}}, $style->selector); } } foreach my $style (sort keys %usedby) { my $stylename = join(', ',sort @{$usedby{$style}}); push(@{$css{$stylename}},$style); } foreach my $style (sort keys %css) { $output .= "$style {\n"; $output .= join(";\n",@{$css{$style}}); $output .= ";\n}\n\n"; } return $output; }

In reply to Simplifying CSS by BigLug

Title:
Use:  <p> text here (a paragraph) </p>
and:  <code> code here </code>
to format your post, it's "PerlMonks-approved HTML":



  • Posts are HTML formatted. Put <p> </p> tags around your paragraphs. Put <code> </code> tags around your code and data!
  • Titles consisting of a single word are discouraged, and in most cases are disallowed outright.
  • Read Where should I post X? if you're not absolutely sure you're posting in the right place.
  • Please read these before you post! —
  • Posts may use any of the Perl Monks Approved HTML tags:
    a, abbr, b, big, blockquote, br, caption, center, col, colgroup, dd, del, details, div, dl, dt, em, font, h1, h2, h3, h4, h5, h6, hr, i, ins, li, ol, p, pre, readmore, small, span, spoiler, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, tr, tt, u, ul, wbr
  • You may need to use entities for some characters, as follows. (Exception: Within code tags, you can put the characters literally.)
            For:     Use:
    & &amp;
    < &lt;
    > &gt;
    [ &#91;
    ] &#93;
  • Link using PerlMonks shortcuts! What shortcuts can I use for linking?
  • See Writeup Formatting Tips and other pages linked from there for more info.