From 7c2bcb55574ebbea6c51b67b5994149400da4895 Mon Sep 17 00:00:00 2001 From: matthewt Date: Wed, 30 Jan 2008 17:56:22 +0000 Subject: skin inheritnace within a single search path --- componentui.conf | 4 +- lib/Reaction/UI/Skin.pm | 15 ++ share/skin/componentui/layout/site_layout.tt | 56 +++++++ share/skin/componentui/skin.conf | 1 + share/skin/componentui/web/componentui-basic.css | 201 +++++++++++++++++++++++ share/skin/default/layout/site_layout.tt | 60 +++---- share/skin/default/web/componentui-basic.css | 201 ----------------------- 7 files changed, 297 insertions(+), 241 deletions(-) create mode 100644 share/skin/componentui/layout/site_layout.tt create mode 100644 share/skin/componentui/skin.conf create mode 100644 share/skin/componentui/web/componentui-basic.css delete mode 100644 share/skin/default/web/componentui-basic.css diff --git a/componentui.conf b/componentui.conf index 008ce1d..54ea3d3 100644 --- a/componentui.conf +++ b/componentui.conf @@ -1,5 +1,5 @@ using_frontend_proxy 1 - skin_name default - \ No newline at end of file + skin_name componentui + diff --git a/lib/Reaction/UI/Skin.pm b/lib/Reaction/UI/Skin.pm index ff31a3a..7f3f1ca 100644 --- a/lib/Reaction/UI/Skin.pm +++ b/lib/Reaction/UI/Skin.pm @@ -33,6 +33,21 @@ class Skin which { my $base = $self->skin_base_path; confess "No such skin base directory ${base}" unless -d $base; + if (-e (my $conf_file = $base->file('skin.conf'))) { + # we get [ { $file => $conf } ] + my ($cfg) = values %{ + Config::Any->load_files({ + files => [ $conf_file ], use_ext => 1 + })->[0] + }; + if (my $super_name = $cfg->{extends}) { + my $super_dir = $base->parent->subdir($super_name); + my $super = $self->new( + view => $self->view, skin_base_path => $super_dir + ); + $self->super($super); + } + } } implements 'create_layout_set' => as { diff --git a/share/skin/componentui/layout/site_layout.tt b/share/skin/componentui/layout/site_layout.tt new file mode 100644 index 0000000..0a1448a --- /dev/null +++ b/share/skin/componentui/layout/site_layout.tt @@ -0,0 +1,56 @@ +=for layout widget + + + + + + Component UI Test Title + + + + + + + +
+ + + + +
+
+ [% sidebar %] + [% inner %] +
+
+
+
+ + + + +=for layout inner + +[% call_next %] + +=for layout header + +

Component UI Header

+ +=for layout sidebar +
+ Nothing to see here. Move along. +
+ +=for layout menu + +=cut diff --git a/share/skin/componentui/skin.conf b/share/skin/componentui/skin.conf new file mode 100644 index 0000000..a9827b2 --- /dev/null +++ b/share/skin/componentui/skin.conf @@ -0,0 +1 @@ +extends default diff --git a/share/skin/componentui/web/componentui-basic.css b/share/skin/componentui/web/componentui-basic.css new file mode 100644 index 0000000..1f25ddb --- /dev/null +++ b/share/skin/componentui/web/componentui-basic.css @@ -0,0 +1,201 @@ +html { + min-width: 915px; +} /*IE7*/ + +body { + color: #393733; + margin: 0; + padding: 0 20px; + text-align: center; + background: #DDDDDD; +} + +img { + border: none; +} + +p { + line-height: 1.4; +} + +input{ + line-height: 1; +} + +#container { + text-align: left; + margin: 0 auto; + max-width: 1200px; + position: relative; +} + +#wrapper { + padding: 15px 0 0 19px; + min-height: 500px; +} /*IE6*/ + +#contents { + clear: both; + padding: 0 15px 30px 0; + margin-top: 7px; + background: #FFFFFF; +} + +.spacer{ clear: both; } +.sidebar { + float: right; + width: 300px; + clear: both; + margin: 0 0 2em 0; + min-height: 500px; +} +.sidebar_section { + margin: 1em 0 1em 0; + min-height: 100px; +} + +.sidebar_section h2{ + border-bottom: 2px solid #036; + padding: 0 1em 0 0em; + font-size: 120%; + text-align: right; +} + +#header { + background: #036; + color: #fff; + float: left; + width: 100%; + margin-bottom: 0px; + border-bottom: 1px solid white; + position: relative; + text-align: left; +} + +#header h1 { + font-size: 150%; + padding: .2em; + margin: .2em; +} + +#nav { + background: #036; + color: #fff; + float: left; + width: 100%; + margin-bottom: 5px; + position: relative; + text-align: right; +} + +#nav .menu { + display: inline + width: 75%; + float: left; + margin: 0px; + padding: 0px; + list-style-type: none; + color: #FFFFFF; + background: #036 +} + +#nav .menu li { + display: inline; +} + +#nav .menu li a { + float: left; + width: 7em; + color: #FFFFFF; + background:color #036; + padding: 0.2em .2em; + text-decoration: none; + border-right: 1px solid #fff; + text-align: center; + font-size: 105%; + font-weight: bold; +} + +#nav .menu li a:hover { + background-color: #369; + color: #fff; +} + +#login-status{ + padding: .2em 1em 0 0; + font-size: 80%; +} + +#search{ + float: right; + width: 300; + padding: 1em; +} +#searchbox{ + line-height: 1.4; + font-size: 90%; + border: 2px solid #FFF; + padding-left: 3px; +} +#searchsub{ + background-color: #036; + font-weight: bold; + font-size: 90%; + color: white; + border: 2px solid #369; +} + +.pager { + display: inline + margin: 0px; + padding: 0px; + list-style-type: none; + font-size: 80%; +} + +.pager li { + display: inline; + margin: 1px; +} + +.pager li a { + padding: 1px 3px 1px 3px; + text-decoration: none; + color: #036; + border: 1px solid #036; + text-align: center; + font-weight: bold; +} + +.pager li a:hover { + color: #369; + border: 1px solid #369; +} + +.collection_actions ul { + display: inline + margin: 0px; + padding: 0px; + list-style-type: none; +} + +.collection_actions ul li { + display: inline; + margin: 0.2em; +} + +.collection_actions ul li a { + /* background-color #9CF; */ + /* padding: 0.2em .2em; */ + /* text-decoration: none; */ + /* border: 1px solid #369; */ + text-align: center; + font-weight: bold; +} + +th { + font-weight: bold; + padding-left: 4px; + padding-right: 4px; + text-align: center; +} \ No newline at end of file diff --git a/share/skin/default/layout/site_layout.tt b/share/skin/default/layout/site_layout.tt index 0a1448a..1e7afa1 100644 --- a/share/skin/default/layout/site_layout.tt +++ b/share/skin/default/layout/site_layout.tt @@ -5,52 +5,36 @@ - Component UI Test Title - - - - + [% head %] -
- - - - -
-
- [% sidebar %] - [% inner %] -
-
-
-
+ [% body %] -=for layout inner - -[% call_next %] - -=for layout header +=for layout head + + [% title %] + + [% head_meta %] + [% head_style %] + +=for layout head_meta -

Component UI Header

+ + +=for layout head_style + + + +=for layout body + +[% inner %] + +=for layout header -=for layout sidebar -
- Nothing to see here. Move along. -
+

[% title %]

-=for layout menu - =cut diff --git a/share/skin/default/web/componentui-basic.css b/share/skin/default/web/componentui-basic.css deleted file mode 100644 index 1f25ddb..0000000 --- a/share/skin/default/web/componentui-basic.css +++ /dev/null @@ -1,201 +0,0 @@ -html { - min-width: 915px; -} /*IE7*/ - -body { - color: #393733; - margin: 0; - padding: 0 20px; - text-align: center; - background: #DDDDDD; -} - -img { - border: none; -} - -p { - line-height: 1.4; -} - -input{ - line-height: 1; -} - -#container { - text-align: left; - margin: 0 auto; - max-width: 1200px; - position: relative; -} - -#wrapper { - padding: 15px 0 0 19px; - min-height: 500px; -} /*IE6*/ - -#contents { - clear: both; - padding: 0 15px 30px 0; - margin-top: 7px; - background: #FFFFFF; -} - -.spacer{ clear: both; } -.sidebar { - float: right; - width: 300px; - clear: both; - margin: 0 0 2em 0; - min-height: 500px; -} -.sidebar_section { - margin: 1em 0 1em 0; - min-height: 100px; -} - -.sidebar_section h2{ - border-bottom: 2px solid #036; - padding: 0 1em 0 0em; - font-size: 120%; - text-align: right; -} - -#header { - background: #036; - color: #fff; - float: left; - width: 100%; - margin-bottom: 0px; - border-bottom: 1px solid white; - position: relative; - text-align: left; -} - -#header h1 { - font-size: 150%; - padding: .2em; - margin: .2em; -} - -#nav { - background: #036; - color: #fff; - float: left; - width: 100%; - margin-bottom: 5px; - position: relative; - text-align: right; -} - -#nav .menu { - display: inline - width: 75%; - float: left; - margin: 0px; - padding: 0px; - list-style-type: none; - color: #FFFFFF; - background: #036 -} - -#nav .menu li { - display: inline; -} - -#nav .menu li a { - float: left; - width: 7em; - color: #FFFFFF; - background:color #036; - padding: 0.2em .2em; - text-decoration: none; - border-right: 1px solid #fff; - text-align: center; - font-size: 105%; - font-weight: bold; -} - -#nav .menu li a:hover { - background-color: #369; - color: #fff; -} - -#login-status{ - padding: .2em 1em 0 0; - font-size: 80%; -} - -#search{ - float: right; - width: 300; - padding: 1em; -} -#searchbox{ - line-height: 1.4; - font-size: 90%; - border: 2px solid #FFF; - padding-left: 3px; -} -#searchsub{ - background-color: #036; - font-weight: bold; - font-size: 90%; - color: white; - border: 2px solid #369; -} - -.pager { - display: inline - margin: 0px; - padding: 0px; - list-style-type: none; - font-size: 80%; -} - -.pager li { - display: inline; - margin: 1px; -} - -.pager li a { - padding: 1px 3px 1px 3px; - text-decoration: none; - color: #036; - border: 1px solid #036; - text-align: center; - font-weight: bold; -} - -.pager li a:hover { - color: #369; - border: 1px solid #369; -} - -.collection_actions ul { - display: inline - margin: 0px; - padding: 0px; - list-style-type: none; -} - -.collection_actions ul li { - display: inline; - margin: 0.2em; -} - -.collection_actions ul li a { - /* background-color #9CF; */ - /* padding: 0.2em .2em; */ - /* text-decoration: none; */ - /* border: 1px solid #369; */ - text-align: center; - font-weight: bold; -} - -th { - font-weight: bold; - padding-left: 4px; - padding-right: 4px; - text-align: center; -} \ No newline at end of file -- cgit v1.2.3-54-g00ecf