[Catalyst-commits] r10708 -
trunk/Catalyst-Example-InstantCRUD/lib/Catalyst/Helper/View
zby at dev.catalyst.perl.org
zby at dev.catalyst.perl.org
Sun Jun 28 19:39:39 GMT 2009
Author: zby
Date: 2009-06-28 19:39:37 +0000 (Sun, 28 Jun 2009)
New Revision: 10708
Modified:
trunk/Catalyst-Example-InstantCRUD/lib/Catalyst/Helper/View/InstantCRUD.pm
Log:
css for forms cleaned by Dana
Modified: trunk/Catalyst-Example-InstantCRUD/lib/Catalyst/Helper/View/InstantCRUD.pm
===================================================================
--- trunk/Catalyst-Example-InstantCRUD/lib/Catalyst/Helper/View/InstantCRUD.pm 2009-06-28 17:53:11 UTC (rev 10707)
+++ trunk/Catalyst-Example-InstantCRUD/lib/Catalyst/Helper/View/InstantCRUD.pm 2009-06-28 19:39:37 UTC (rev 10708)
@@ -40,7 +40,7 @@
my $staticdir = dir( $helper->{dir}, 'root', 'static' );
$helper->mk_dir( $staticdir );
$helper->render_file( style => file( $staticdir, 'pagingandsort.css' ) );
- $helper->render_file( formfu_style => file( $staticdir, 'formfu.css' ) );
+ $helper->render_file( form_style => file( $staticdir, 'form.css' ) );
# javascript
# $helper->mk_file( file( $staticdir, 'doubleselect.js' ),
@@ -225,8 +225,7 @@
<title>[% appname %]</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<link href="[%base%]static/pagingandsort.css" type="text/css" rel="stylesheet"/>
-<link href="[%base%]static/formfu.css" type="text/css" rel="stylesheet"/>
-<script src="[%base%]static/doubleselect.js" type="text/javascript" /></script>
+<link href="[%base%]static/form.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<div class="table_menu">
@@ -299,28 +298,41 @@
body {
font: bold 12px Verdana, sans-serif;
+ background-color:#F8F8F8;
+ color: #00283F;
}
+.table_menu {
+ text-align: center;
+ font-size: 16px;
+ padding: 15px 15px 15px 15px;
+ color: #7CBFE5;
+}
+
.content {
- padding: 12px;
- margin-top: 1px;
- margin-bottom:0px;
- margin-left: 15px;
- margin-right: 15px;
- border-color: #000000;
- border-top: 0px;
- border-bottom: 0px;
- border-left: 1px;
- border-right: 1px;
+ clear: both;
+ padding: 30px 12px 12px 12px;
+ font-size: 16px;
}
+hr {
+ border: 1px solid #7CBFE5;
+ margin: 10px 0 15px 0;
+}
+
A {
text-decoration: none;
- color:#225
+ color:#006DAC;
+ font-weight: bold;
}
+
+A:visited {
+ color:#0073B5;
+}
+
A:hover {
text-decoration: underline;
- color:#222
+ color:#006DAC;
}
#title {
@@ -339,23 +351,31 @@
}
table {
- border: 0px solid;
+ margin: 0 auto 20px auto;
background-color: #ffffff;
+ border-collapse: collapse;
}
+table .view_label{
+ background-color: #DFF6E6;
+}
+
th {
- background-color: #b5cadc;
- border: 1px solid #778;
- font: bold 12px Verdana, sans-serif;
+ background-color: #DFF6E6;
+ border: 1px solid #7CBFE5;
+ font: bol 14px Verdana, sans-serif;
+ padding: 4px 4px 4px 4px;
}
tr.alternate { background-color:#e3eaf0; }
tr:hover { background-color: #b5cadc; }
-td { font: 12px Verdana, sans-serif; }
+td {
+ font: 14px Verdana, sans-serif;
+ border: 1px solid #7CBFE5;
+ padding: 4px 4px 4px 4px;
+}
-td { font: 12px Verdana, sans-serif; }
-
.action {
border: 1px outset #7d95b5;
}
@@ -367,327 +387,98 @@
}
.pager {
- font: 11px Arial, Helvetica, sans-serif;
+ font: bold 14px Verdana, sans-serif;
+ color: #7CBFE5;
text-align: center;
border: solid 1px #e2e2e2;
border-left: 0;
border-right: 0;
- padding-top: 10px;
- padding-bottom: 10px;
- margin: 0px;
- background-color: #f3f6f8;
+ padding: 15px 0 15px 0;
+ background-color: #EBF8EF;
}
-.pager a {
- padding: 2px 6px;
- border: solid 1px #ddd;
- background: #fff;
- text-decoration: none;
+.pager .counter{
+ padding: 0 0 10px 0;
}
-.pager a:visited {
- padding: 2px 6px;
- border: solid 1px #ddd;
- background: #fff;
- text-decoration: none;
+.pager a {
+ padding: 2px 6px 2px 6px;
}
-.pager .current-page {
- padding: 2px 6px;
- font-weight: bold;
- vertical-align: top;
-}
-
.pager a:hover {
color: #fff;
background: #7d95b5;
- border-color: #036;
text-decoration: none;
}
-/* IDs */
-
-#widget_submit
-{
- display: block;
- margin: 0 0 1em 0;
- border: 0 solid #000000;
- border-top: 0 solid #000000;
- padding: 0 1em 1em 1em;
+.pager .current {
+ padding: 2px 6px;
+ font-weight: bold;
+ vertical-align: top;
}
-#widget
-{
- display: block;
- margin: 0 0 1em 0;
- border: 1px solid #FFFFFF;
- /*border-top: 1px solid #000000;*/
- padding: 0 1em 1em 1em;
- background-color: #f3f6f8;
- font: 11px sans-serif;
+.pager .current-page {
+ padding: 2px 6px;
+ font-weight: bold;
+ vertical-align: top;
}
+__form_style__
-#widget fieldset
-{
- display: block;
- margin: 0 0 1em 0;
- border: 0 solid #FFFFFF;
- /*border-top: 1px solid #000000;*/
- border-top: 0 solid #000000;
- padding: 0 1em 1em 1em;
+fieldset {
+ padding: 12px 12px 12px 12px;
+ border: 1px solid #7CBFE5;
+ background-color: #FFFFFF;
}
-#widget fieldset.radio
-{
- margin: 0 0 0 -1em;
- border: 0 solid #FFFFFF;
+.main_fieldset {
+ font-size: 12px;
}
-#widget fieldset.radio input
-{
- position: static;
- clear: both;
- float: left;
- font: 12px sans-serif;
+.main_fieldset fieldset {
+ margin: 20px 0 20px 0;
}
-#widget fieldset.radio label
+fieldset input,
+fieldset password,
+fieldset radio,
+fieldset select,
+fieldset textarea
{
- position: relative;
- top: -1.25em;
- display: inline;
- width: auto;
- margin: 0 0 0 8em;
- font-weight: bold;
- font-weight: normal;
+ margin: 8px 0 8px 0;
}
-#widget fieldset.radio legend
-{
- float: left;
- font-weight: bold;
+label {
+ float: left;
+ width: 120px;
+ margin: 8px 10px 8px 0;
+ text-align: right;
}
-#widget input
-{
- position: relative;
- top: -1.4em;
- left: 8em;
- display: block;
- font: 12px sans-serif;
+.main_fieldset fieldset label{
+ width: 108px;
font-weight: normal;
+
}
-#widget input.submit
-{
- clear: both;
- display: block;
- position: relative;
- top: -1.4em;
- left: 8em;
-}
-
-.allornone_errors,
-.equal_errors,
-.empty_errors,
-.in_errors,
-.ascii_errors,
-.any_errors,
-.callback_errors,
-.date_errors,
-.datetime_errors,
-.dependon_errors,
-.email_errors,
-.http_errors,
-.integer_errors,
-.lenght_errors,
-.maybe_errors,
-.number_errors,
-.printable_errors,
-.range_errors,
-.regex_errors,
-.string_errors,
-.time_errors,
-.all_errors
-{
- display: block;
-}
-
-.error_messages
-{
- clear: right;
- float: left;
- display: block;
- width: 80%;
- margin-top: -15px;
- margin-left: 96px;
- padding-bottom: 0px;
- font-weight: normal;
- color: #d00;
-}
-
-.doubleselect
-{
- display: block;
-}
-
-.doubleselect_left
-{
- position: relative;
- float: left;
-}
-
-.doubleselect_right
-{
- position: relative;
- float: left;
- margin-left: 5px;
-}
-
-.doubleselect_buttons
-{
- position: relative;
- float: left;
- margin-left: 5px;
- margin-top: 20px;
-}
-
-.doubleselect_button_left
-{
- position: relative;
- float: left;
-}
-
-.doubleselect_button_right
-{
- position: relative;
- float: left;
-}
-
-.label_comments
-{
- display: block;
- width: 8em;
- margin-top: 0px;
- font: 11px sans-serif;
- font-weight: normal;
-}
-
-#widget label
-{
- clear: both;
- float: left;
- display: block;
- width: 100%;
- margin-top: 10px;
- font-weight: bold;
-}
-
-#widget select
-{
- position: relative;
- top: -1.4em;
- left: 8em;
- display: block;
- width: 10em;
- font-weight: normal;
- font: 12px sans-serif;
-}
-
-#widget textarea
-{
- position: relative;
- top: -1.4em;
- left: 8em;
- display: block;
- font-weight: normal;
- font: 12px sans-serif;
-}
-__formfu_style__
-
-fieldset {
- padding: 1em;
-}
-
-fieldset .button,
-fieldset .checkbox,
-fieldset .contentbutton,
-fieldset .file,
-fieldset .image,
-fieldset .multi,
-fieldset .password,
-fieldset .radio,
-fieldset .reset,
-fieldset .select,
-fieldset .submit,
-fieldset .text,
-fieldset .textarea
-{
- display: block;
- clear: left;
- border: 0;
- margin: 1px;
- /* when no label */
- margin-left: 12em;
-}
-
-fieldset .button.label,
-fieldset .checkbox.label,
-fieldset .contentbutton.label,
-fieldset .file.label,
-fieldset .image.label,
-fieldset .multi.label,
-fieldset .password.label,
-fieldset .radio.label,
-fieldset .reset.label,
-fieldset .select.label,
-fieldset .submit.label,
-fieldset .text.label,
-fieldset .textarea.label
-{
- margin-left: 1px;
-}
-
-fieldset .error.label {
- /* border + margin swap values with above, to ensure rows align */
- border: 1px #fff;
- margin: 0;
-}
-
fieldset .error_message {
display: block;
color: #ff0000;
+ margin: 20px 0 20px 0;
}
-fieldset .label .error_message {
- /* padding-left eq label width + padding-right */
- padding-left: 12em;
-}
-
fieldset .error input,
fieldset .error textarea,
fieldset .error select {
- background-color: #ffdddd;
+ background-color: #FFF0F0;
+ border: 1px solid #ff0000;
}
-fieldset .button label,
-fieldset .contentbutton label,
-fieldset .checkbox label,
-fieldset .file label,
-fieldset .image label,
-fieldset .multi label,
-fieldset .password label,
-fieldset .radio label,
-fieldset .radiogroup label,
-fieldset .select label,
-fieldset .text label,
-fieldset .textarea label
-{
- display: inline;
- float: left;
- width: 11em;
- text-align: right;
- padding-right: 1em;
+#submit{
+ margin: 20px 0 10px 0;
+ padding: 2px 2px 2px 2px;
+ background-color:#DFF6E6;;
+ font: bold 14px Verdana, sans-serif;
+ color:#006DAC;
}
fieldset .radiogroup span label {
@@ -698,24 +489,6 @@
padding-right: 0;
}
-fieldset .multi .elements {
- display: block;
- float: left;
-}
-
-fieldset .multi .elements label {
- display: block;
- width: auto;
- padding-right: 0.25em;
-}
-
-fieldset .multi input,
-fieldset .multi select {
- display: block;
- float: left;
- margin-right: 0.5em;
-}
-
fieldset.checkboxgroup,
fieldset.radiogroup
{
@@ -730,79 +503,6 @@
margin-left: 0em;
}
-fieldset .comment .comment {
- /* when no label */
- display: block;
- margin-left: 0em;
-}
-
-fieldset .label .comment {
- display: block;
- margin-left: 12em;
-}
-
-/*** Alternative Layouts ***/
-
-fieldset .notes {
- float: right;
- width: 30%;
- border: 1px dotted;
-}
-
-fieldset .multi.vertical input,
-fieldset.checkboxgroup.vertical input,
-fieldset.radiogroup.vertical input
-{
- display: block;
- float: left;
- clear: left;
-}
-
-fieldset .multi.vertical select {
- display: block;
- float: left;
- clear: right;
-}
-
-fieldset.checkboxgroup.vertical label,
-fieldset.radiogroup.vertical label
-{
- display: block;
- clear: right;
-}
-
-fieldset.radiogroup.vertical .subgroup {
- float: left;
-}
-
-fieldset .fullwidth label
-{
- display: block;
- float: left;
- width: auto;
- text-align: left;
-}
-
-fieldset .fullwidth .error_message {
- padding-left: 0em;
-}
-
-fieldset .fullwidth textarea
-{
- display: block;
- clear: left;
- width: 30em;
-}
-
-fieldset .dojoeditor2 .RichTextEditable { /* Dojo::Editor2 */
- display: inline;
- float: left;
- background-color: #ffc;
- padding-bottom: 0.1em;
-}
-
-
-
__END__
=head1 NAME
More information about the Catalyst-commits
mailing list