POE::XUL::Style - XUL style object
use POE::XUL::Node; my $node = Description( style => "color: red; font-weight: bold", content => "YES!" ); print $node->style->color; # prints 'red' print $node->style->fontWeight; # prints 'bold' $node->style->fontSize( '150%' ); $node->style( "overflow: hidden;" ); # DOM spec tells us this is bad print $node->style->color; # now it prints ''
POE::XUL::Style is a DOM-like object that encapsulates the CSS style of a XUL element. It uses POE::XUL::ChangeManager to make sure all style are mirrored in the browser's DOM. However, style changes in the browser's DOM are not mirrored in the POE::XUL app.
CSS parsing is round-trip safe; All formating and comments are preserved.
The POE::XUL::Style object will stringize as a full CSS declaration. This means the old-school code that follows should still work.
my $css = $node->style; $css .= "overflow-y: auto;" unless $css =~ s/(overflow-y: ).+?;/${1}auto/; $node->style( $css );
But please update your code to the following:
$node->style->overflowY( 'auto' );
Isn't that much, much nicer?
If missing, the margin-top, margin-left, margin-right, margin-bottom properties will be filled in from margin property. The padding and border properties also support this.
margin-top
margin-left
margin-right
margin-bottom
margin
padding
border
my $style = $node->style; $style->margin( '1px' ); my $top = $style->marginTop(); # will be 1px $style->padding( '1px 3px 2px' ); my $left = $style->marginLeft(); # will be 3px $style->border( 'thin solid red' ); my $right = $style->borderRight(); # will be 'thin solid red'
What's more, the various sub-fields of the border property (-width, -style, -color) will be automaticaly found.
-width
-style
-color
$style->border( 'thin dotted black' ); $style->borderBottom( '3px inset threedface' ); my $topW = $style->borderTopWidth; # will be 'thin' my $bottomS = $style->borderBottomStyle; # will be 'inset'
The sub-fields of outline and list-style also support this:
outline
list-style
$style->outline( 'this dotted orange' ); my $X = $style->outlineColor; # will be 'orange' $style->listStyle( 'circle inside' ); my $X = $style->outlinePosition; # will be 'inside'
The overflow-x and overflow-y properties default to overflow.
overflow-x
overflow-y
overflow
The -moz-border-radius-topleft, -moz-border-radius-topright, -moz-border-radius-bottomright and -moz-border-radius-bottomleft properties default to sub-fields of -moz-border-radius.
-moz-border-radius-topleft
-moz-border-radius-topright
-moz-border-radius-bottomright
-moz-border-radius-bottomleft
-moz-border-radius
There are currently no equivalents for the font property.
font
Setting a sub-fields of the border property will not modify the corresponding border property.
$style->borderBottom( '3px inset puce' ); $style->borderBottomStyle( 'groove' ); my $bottom = $style->borderBottom; # $bottom will still be '3px inset puce', not '3px groove puce'
Likewise with padding and margin.
$style->margin( '1px 5px 1px 0' ); $style->marginRight( 0 ); my $margin = $style->margin; # still '1px 5px 1px 0'
If you set a sub-property, and then set the parent property, the sub-property is not changed to reflect the new parent.
$style->marginRight( 0 ); $style->margin( '1px 5px 1px 0' ); my $R = $style->marginRight; # still 0, not 5px
No attempt is made to ensure that values are valid. The CSS spec limits various values to a set of keywords, like inset, groove, solid, etc for border-style. Any value outside of the specification will be merrily passed on to the browser.
inset, groove, solid
border-style
POE::XUL::Node
http://developer.mozilla.org/en/docs/CSS has a good CSS reference.
http://www.w3.org/TR/CSS/ the CSS specification.
Philip Gwyn <gwyn-at-cpan.org>
Copyright 2008-2010 by Philip Gwyn. All rights reserved;
This library is free software; you can redistribute it and/or modify it under the same terms as Perl itself.
To install POE::XUL::RDF, copy and paste the appropriate command in to your terminal.
cpanm
cpanm POE::XUL::RDF
CPAN shell
perl -MCPAN -e shell install POE::XUL::RDF
For more information on module installation, please visit the detailed CPAN module installation guide.