Notification theme changed, fixes unwanted scrollbars in notifications on FF3.

Fixed datefield styles inside table (row height now remains the same).

svn changeset:5624/svn branch:trunk

diff --git a/WebContent/ITMILL/themes/default/notification/img/close-error.png b/WebContent/ITMILL/themes/default/notification/img/close-error.png
new file mode 100644 (file)
index 0000000..f52c922
Binary files /dev/null and b/WebContent/ITMILL/themes/default/notification/img/close-error.png differ

diff --git a/WebContent/ITMILL/themes/default/notification/notification.css b/WebContent/ITMILL/themes/default/notification/notification.css
index 085fc980bb5042f27d56aa6a023767fd4150f9ed..6ec5e7fc4b4a716db90d59060b836a6ff9d97f30 100644 (file)
--- a/WebContent/ITMILL/themes/default/notification/notification.css
+++ b/WebContent/ITMILL/themes/default/notification/notification.css
@@ -1,43 +1,70 @@
 
 .i-Notification {
        font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
-       background-color: #999999;
+       background-color: #818e92;
        color: #ffffff;
-       padding: 0.3em;
+       padding: 9px 12px;
        cursor: pointer;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
+       overflow: hidden;
 }
-.i-Notification H1,
+.i-Notification h1,
 .i-Notification p,
-.i-Notification.error H1,
+.i-Notification.error h1,
 .i-Notification.error p,
-.i-Notification.warning H1,
+.i-Notification.warning h1,
 .i-Notification.warning p {
        display: inline;
-       padding: 0.1em;
-}
-.i-Notification.tray H1,
-.i-Notification.tray p {
-       display: block;
-       font-size: 1em;
-       line-height: 0.5em;
+       font-weight: normal;
+       white-space: nowrap;
+       margin: 0 10px 0 0;
 }
 
 .i-Notification.warning {
-       background: #f14c1a;
+       background: #fff1e4;
+       color: #dd3400;
+       border: 2px solid #ffaa90;
+       -moz-border-radius: 5px;
+       -webkit-border-radius: 5px;
+       border-radius: 5px;
+       opacity: 1;
 }
 
 .i-Notification.error {
-       background-color: #ff0a0a;
-       /*background-image: url(img/notification-error.png);*/ /* FIXME where is this image? */
-       background-repeat: no-repeat;
-       background-position: center right;
+       background: #f23d00 url(img/close-error.png) no-repeat right 5px;
        padding-right: 30px;
+       border: 3px solid #c30000;
+       -moz-border-radius: 6px;
+       -webkit-border-radius: 6px;
+       border-radius: 6px;
 }
-.i-Notification.tray {
 
+
+.i-Notification.tray {
+       background: #575e60;
+       padding: 0.5em;
+       margin: 0 5px 5px 0;
+}
+.i-Notification.tray h1 {
+       display: block;
+       font-weight: bold;
+       font-size: 0.9em;
+       line-height: 1.1;
+       background: #3b4245;
+       padding: 4px 10px;
+       margin: 0;
+       -moz-border-radius: 3px;
+       -webkit-border-radius: 3px;
+       border-radius: 3px;
+}
+.i-Notification.tray p {
+       display: block;
+       font-size: 0.9em;
+       line-height: 1.1;
+       margin: 8px 10px 5px 10px;
+       color: #e4e7ea;
 }\r
 \r
 .i-Notification.system {\r
@@ -45,9 +72,9 @@
        opacity: 0.7;\r
        filter: alpha(opacity=70);\r
 }\r
-.i-Notification.system H1 {\r
+.i-Notification.system h1 {\r
        display: block;\r
-       margin: 0px;\r
+       margin: 0;\r
 }\r
 .i-Notification.system p {\r
        white-space: nowrap;\r

diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css
index 41915969db43df91de9a6a550961dd19c1f39ec3..e03e9ce45d825d5fb3c6e56f1e64a9d06921c97a 100644 (file)
--- a/WebContent/ITMILL/themes/default/styles.css
+++ b/WebContent/ITMILL/themes/default/styles.css
@@ -818,43 +818,70 @@ input.i-modified,
 
 .i-Notification {
        font-family: "Trebuchet MS", geneva, helvetica, arial, tahoma, verdana, sans-serif;
-       background-color: #999999;
+       background-color: #818e92;
        color: #ffffff;
-       padding: 0.3em;
+       padding: 9px 12px;
        cursor: pointer;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
+       overflow: hidden;
 }
-.i-Notification H1,
+.i-Notification h1,
 .i-Notification p,
-.i-Notification.error H1,
+.i-Notification.error h1,
 .i-Notification.error p,
-.i-Notification.warning H1,
+.i-Notification.warning h1,
 .i-Notification.warning p {
        display: inline;
-       padding: 0.1em;
-}
-.i-Notification.tray H1,
-.i-Notification.tray p {
-       display: block;
-       font-size: 1em;
-       line-height: 0.5em;
+       font-weight: normal;
+       white-space: nowrap;
+       margin: 0 10px 0 0;
 }
 
 .i-Notification.warning {
-       background: #f14c1a;
+       background: #fff1e4;
+       color: #dd3400;
+       border: 2px solid #ffaa90;
+       -moz-border-radius: 5px;
+       -webkit-border-radius: 5px;
+       border-radius: 5px;
+       opacity: 1;
 }
 
 .i-Notification.error {
-       background-color: #ff0a0a;
-       /*background-image: url(notification/img/notification-error.png);*/ /* FIXME where is this image? */
-       background-repeat: no-repeat;
-       background-position: center right;
+       background: #f23d00 url(notification/img/close-error.png) no-repeat right 5px;
        padding-right: 30px;
+       border: 3px solid #c30000;
+       -moz-border-radius: 6px;
+       -webkit-border-radius: 6px;
+       border-radius: 6px;
 }
-.i-Notification.tray {
 
+
+.i-Notification.tray {
+       background: #575e60;
+       padding: 0.5em;
+       margin: 0 5px 5px 0;
+}
+.i-Notification.tray h1 {
+       display: block;
+       font-weight: bold;
+       font-size: 0.9em;
+       line-height: 1.1;
+       background: #3b4245;
+       padding: 4px 10px;
+       margin: 0;
+       -moz-border-radius: 3px;
+       -webkit-border-radius: 3px;
+       border-radius: 3px;
+}
+.i-Notification.tray p {
+       display: block;
+       font-size: 0.9em;
+       line-height: 1.1;
+       margin: 8px 10px 5px 10px;
+       color: #e4e7ea;
 }
 
 .i-Notification.system {
@@ -862,9 +889,9 @@ input.i-modified,
        opacity: 0.7;
        filter: alpha(opacity=70);
 }
-.i-Notification.system H1 {
+.i-Notification.system h1 {
        display: block;
-       margin: 0px;
+       margin: 0;
 }
 .i-Notification.system p {
        white-space: nowrap;
@@ -1748,11 +1775,12 @@ input.i-modified,
 /* ...but not for datefield textarea */
 .i-table-cell-content .i-datefield .i-textfield {
        width: auto;
-       margin: 0;
+       
 }
 /* datefield button is too high for table cell */
 .i-table-cell-content .i-datefield-button {
        height: 25px;
+       margin: -2px 0;
 }
 
 
@@ -1814,11 +1842,9 @@ input.i-modified,
 }
 
 
-/* rowe in column selector */
+/* row in column selector */
 .i-on div {
-       background-image: url(table/img/check.gif);
-       background-repeat: no-repeat;
-       background-position: 2px center;
+       background: transparent url(table/img/check.gif) no-repeat 2px 50%;
        text-indent: 6px;
 }
 .i-off div {
@@ -1832,6 +1858,7 @@ input.i-modified,
        /* 
        AlphaImageLoader uses src attribute relative to host page, not CSS
        We need multiple different filters because we cannot be sure how host page is served compared to theme resources
+       TODO: This actually does not work as expected, since only the last filter is applied.
         */
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");

diff --git a/WebContent/ITMILL/themes/default/table/table.css b/WebContent/ITMILL/themes/default/table/table.css
index becd06fe49cf4d4c45ea3e15617600eb0a19c790..ace79261dbd9fc303191f254504431840d0dcfb8 100644 (file)
--- a/WebContent/ITMILL/themes/default/table/table.css
+++ b/WebContent/ITMILL/themes/default/table/table.css
@@ -125,11 +125,12 @@
 /* ...but not for datefield textarea */
 .i-table-cell-content .i-datefield .i-textfield {
        width: auto;
-       margin: 0;
+       
 }
 /* datefield button is too high for table cell */
 .i-table-cell-content .i-datefield-button {
        height: 25px;
+       margin: -2px 0;
 }
 
 
@@ -191,11 +192,9 @@
 }
 
 
-/* rowe in column selector */\r
+/* row in column selector */\r
 .i-on div {\r
-       background-image: url(img/check.gif);\r
-       background-repeat: no-repeat;\r
-       background-position: 2px center;\r
+       background: transparent url(img/check.gif) no-repeat 2px 50%;\r
        text-indent: 6px;\r
 }
 .i-off div {\r
@@ -209,6 +208,7 @@
        /* 
        AlphaImageLoader uses src attribute relative to host page, not CSS
        We need multiple different filters because we cannot be sure how host page is served compared to theme resources
+       TODO: This actually does not work as expected, since only the last filter is applied.
         */
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../../ITMILL/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");
        filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="../ITMILL/themes/default/table/img/scroll-position-bg.png", sizingMethod="scale");