Philip Gwyn > POE-XUL-0.0600 > POE::XUL::Style

Download:
POE-XUL-0.0600.tar.gz

Dependencies

Annotate this POD

CPAN RT

Open  0
View/Report Bugs
Module Version: 0.0600   Source  

NAME ^

POE::XUL::Style - XUL style object

SYNOPSIS ^

    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 ''

DESCRIPTION ^

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?

EQUIVALENTS ^

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.

    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.

    $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:

    $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.

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.

There are currently no equivalents for the font property.

LIMITATIONS ^

SEE ALSO ^

POE::XUL::Node

http://developer.mozilla.org/en/docs/CSS has a good CSS reference.

http://www.w3.org/TR/CSS/ the CSS specification.

AUTHOR ^

Philip Gwyn <gwyn-at-cpan.org>

COPYRIGHT AND LICENSE ^

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.

syntax highlighting: