From 891ccaa2eca38b3462950e0dd9362f8be9c2cef4 Mon Sep 17 00:00:00 2001 From: Jouni Koivuviita Date: Thu, 30 Apr 2009 12:12:31 +0000 Subject: New theme button almost themed (error indicator missing). Includes SmartSprites syntax as well. svn changeset:7597/svn branch:theme_2009_03 --- WebContent/ITMILL/themes/base/button/button.css | 35 ++-- WebContent/ITMILL/themes/base/styles.css | 34 ++-- WebContent/ITMILL/themes/base/window/window.css | 1 + WebContent/ITMILL/themes/default/common/common.css | 2 + WebContent/ITMILL/themes/default/panel/panel.css | 9 +- WebContent/ITMILL/themes/default/styles.css | 66 ++++--- .../ITMILL/themes/default/tabsheet/tabsheet.css | 21 +- .../ITMILL/themes/reindeer/button/button.css | 139 ++++++++++++++ .../themes/reindeer/button/img/left-focus.png | Bin 0 -> 436 bytes .../themes/reindeer/button/img/left-pressed.png | Bin 0 -> 354 bytes .../ITMILL/themes/reindeer/button/img/left.png | Bin 0 -> 390 bytes .../themes/reindeer/button/img/right-focus.png | Bin 0 -> 735 bytes .../themes/reindeer/button/img/right-pressed.png | Bin 0 -> 648 bytes .../ITMILL/themes/reindeer/button/img/right.png | Bin 0 -> 623 bytes .../ITMILL/themes/reindeer/common/common.css | 45 +++++ WebContent/ITMILL/themes/reindeer/styles.css | 213 +++++++++++++++++++-- .../ITMILL/themes/sampler/sampler/styles.css | 6 +- WebContent/ITMILL/themes/sampler/styles.css | 2 +- 18 files changed, 471 insertions(+), 102 deletions(-) create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/left-focus.png create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/left-pressed.png create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/left.png create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/right-focus.png create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/right-pressed.png create mode 100644 WebContent/ITMILL/themes/reindeer/button/img/right.png create mode 100644 WebContent/ITMILL/themes/reindeer/common/common.css (limited to 'WebContent/ITMILL/themes') diff --git a/WebContent/ITMILL/themes/base/button/button.css b/WebContent/ITMILL/themes/base/button/button.css index f7a3e6ae28..ce0e0d430f 100644 --- a/WebContent/ITMILL/themes/base/button/button.css +++ b/WebContent/ITMILL/themes/base/button/button.css @@ -3,6 +3,9 @@ white-space: nowrap; margin: 0; } +.i-button span { + white-space: nowrap; +} .i-checkbox input { vertical-align: middle; } @@ -12,7 +15,8 @@ vertical-align: middle; margin-right: 3px; } -.i-button span, .i-checkbox label { +.i-button span, +.i-checkbox label { vertical-align: middle; } .i-button-link { @@ -37,22 +41,17 @@ padding-left: 1em; background-position: left; } - -/* Fixes streched buttons in IE6 */ +/* Fixes streched buttons in IE6 and IE7*/ .i-ie6 .i-button { width: 1px; - overflow: visible; - padding-left: 1em; - padding-right: 1em; } - -/* Fixes streched buttons in IE7 */ -.i-ie7 .i-button { +.i-ie6 .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { overflow: visible; padding-left: 1em; padding-right: 1em; } - /* Error indicator on checkbox fix for IE6 */ .i-ie6 .i-checkbox * { float: left; @@ -65,34 +64,32 @@ padding-left: 0; padding-right: 0.4em; } - /* Error indicator on checkbox fix for IE7 */ -.i-ie7 .i-checkbox * { +.i-ie7 .i-checkbox *, +.i-ie8 .i-checkbox * { float: left; } -.i-ie7 .i-checkbox .i-errorindicator { +.i-ie7 .i-checkbox .i-errorindicator, +.i-ie8 .i-checkbox .i-errorindicator { background-position: right; float: left; padding-left: 0; padding-right: 0.7em; } - /* Error indicator on button fix for IE */ .i-ie6 button .i-errorindicator, -.i-ie7 button .i-errorindicator { +.i-ie7 button .i-errorindicator, +.i-ie8 button .i-errorindicator { display: inline; padding-right: 0.5em; } - - /* Disabled by default .i-checkbox-error { background: #ffe0e0; } */ - /* Disabled by default .i-checkbox-required { background: #ffe0e0; } -*/ +*/ \ No newline at end of file diff --git a/WebContent/ITMILL/themes/base/styles.css b/WebContent/ITMILL/themes/base/styles.css index 5d059fb2b8..3a7f29ea22 100644 --- a/WebContent/ITMILL/themes/base/styles.css +++ b/WebContent/ITMILL/themes/base/styles.css @@ -40,6 +40,9 @@ white-space: nowrap; margin: 0; } +.i-button span { + white-space: nowrap; +} .i-checkbox input { vertical-align: middle; } @@ -49,7 +52,8 @@ vertical-align: middle; margin-right: 3px; } -.i-button span, .i-checkbox label { +.i-button span, +.i-checkbox label { vertical-align: middle; } .i-button-link { @@ -74,22 +78,17 @@ padding-left: 1em; background-position: left; } - -/* Fixes streched buttons in IE6 */ +/* Fixes streched buttons in IE6 and IE7*/ .i-ie6 .i-button { width: 1px; - overflow: visible; - padding-left: 1em; - padding-right: 1em; } - -/* Fixes streched buttons in IE7 */ -.i-ie7 .i-button { +.i-ie6 .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { overflow: visible; padding-left: 1em; padding-right: 1em; } - /* Error indicator on checkbox fix for IE6 */ .i-ie6 .i-checkbox * { float: left; @@ -102,32 +101,30 @@ padding-left: 0; padding-right: 0.4em; } - /* Error indicator on checkbox fix for IE7 */ -.i-ie7 .i-checkbox * { +.i-ie7 .i-checkbox *, +.i-ie8 .i-checkbox * { float: left; } -.i-ie7 .i-checkbox .i-errorindicator { +.i-ie7 .i-checkbox .i-errorindicator, +.i-ie8 .i-checkbox .i-errorindicator { background-position: right; float: left; padding-left: 0; padding-right: 0.7em; } - /* Error indicator on button fix for IE */ .i-ie6 button .i-errorindicator, -.i-ie7 button .i-errorindicator { +.i-ie7 button .i-errorindicator, +.i-ie8 button .i-errorindicator { display: inline; padding-right: 0.5em; } - - /* Disabled by default .i-checkbox-error { background: #ffe0e0; } */ - /* Disabled by default .i-checkbox-required { background: #ffe0e0; @@ -1418,6 +1415,7 @@ div.i-tree-node-leaf { div.i-window-header { white-space: nowrap; text-overflow: ellipsis; + -ms-text-overflow: ellipsis; overflow: hidden; padding: 0; } diff --git a/WebContent/ITMILL/themes/base/window/window.css b/WebContent/ITMILL/themes/base/window/window.css index 3a9094dc4c..75bd915a7b 100644 --- a/WebContent/ITMILL/themes/base/window/window.css +++ b/WebContent/ITMILL/themes/base/window/window.css @@ -13,6 +13,7 @@ div.i-window-header { white-space: nowrap; text-overflow: ellipsis; + -ms-text-overflow: ellipsis; overflow: hidden; padding: 0; } diff --git a/WebContent/ITMILL/themes/default/common/common.css b/WebContent/ITMILL/themes/default/common/common.css index 9629875244..a4e3f82612 100644 --- a/WebContent/ITMILL/themes/default/common/common.css +++ b/WebContent/ITMILL/themes/default/common/common.css @@ -14,6 +14,8 @@ background-position: 50%; } /* Global font styles */ +.i-window, +.i-popupview-popup, .i-app input, .i-app select, .i-app button, diff --git a/WebContent/ITMILL/themes/default/panel/panel.css b/WebContent/ITMILL/themes/default/panel/panel.css index 47a2cbebaf..55b435a3eb 100644 --- a/WebContent/ITMILL/themes/default/panel/panel.css +++ b/WebContent/ITMILL/themes/default/panel/panel.css @@ -82,15 +82,18 @@ background: transparent; } .i-ie6 .i-panel-content, -.i-ie7 .i-panel-content { +.i-ie7 .i-panel-content, +.i-ie8 .i-panel-content { border-bottom: 1px solid #babfc0; } .i-ie6 .i-panel-content-light, -.i-ie7 .i-panel-content-light { +.i-ie7 .i-panel-content-light, +.i-ie8 .i-panel-content-light { border-bottom: none; } .i-ie6 .i-panel-deco, -.i-ie7 .i-panel-deco { +.i-ie7 .i-panel-deco, +.i-ie8 .i-panel-deco { height: 0; overflow: hidden; } \ No newline at end of file diff --git a/WebContent/ITMILL/themes/default/styles.css b/WebContent/ITMILL/themes/default/styles.css index c453d0ae46..4e262aa44b 100644 --- a/WebContent/ITMILL/themes/default/styles.css +++ b/WebContent/ITMILL/themes/default/styles.css @@ -40,6 +40,9 @@ white-space: nowrap; margin: 0; } +.i-button span { + white-space: nowrap; +} .i-checkbox input { vertical-align: middle; } @@ -49,7 +52,8 @@ vertical-align: middle; margin-right: 3px; } -.i-button span, .i-checkbox label { +.i-button span, +.i-checkbox label { vertical-align: middle; } .i-button-link { @@ -74,22 +78,17 @@ padding-left: 1em; background-position: left; } - -/* Fixes streched buttons in IE6 */ +/* Fixes streched buttons in IE6 and IE7*/ .i-ie6 .i-button { width: 1px; - overflow: visible; - padding-left: 1em; - padding-right: 1em; } - -/* Fixes streched buttons in IE7 */ -.i-ie7 .i-button { +.i-ie6 .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { overflow: visible; padding-left: 1em; padding-right: 1em; } - /* Error indicator on checkbox fix for IE6 */ .i-ie6 .i-checkbox * { float: left; @@ -102,32 +101,30 @@ padding-left: 0; padding-right: 0.4em; } - /* Error indicator on checkbox fix for IE7 */ -.i-ie7 .i-checkbox * { +.i-ie7 .i-checkbox *, +.i-ie8 .i-checkbox * { float: left; } -.i-ie7 .i-checkbox .i-errorindicator { +.i-ie7 .i-checkbox .i-errorindicator, +.i-ie8 .i-checkbox .i-errorindicator { background-position: right; float: left; padding-left: 0; padding-right: 0.7em; } - /* Error indicator on button fix for IE */ .i-ie6 button .i-errorindicator, -.i-ie7 button .i-errorindicator { +.i-ie7 button .i-errorindicator, +.i-ie8 button .i-errorindicator { display: inline; padding-right: 0.5em; } - - /* Disabled by default .i-checkbox-error { background: #ffe0e0; } */ - /* Disabled by default .i-checkbox-required { background: #ffe0e0; @@ -1418,6 +1415,7 @@ div.i-tree-node-leaf { div.i-window-header { white-space: nowrap; text-overflow: ellipsis; + -ms-text-overflow: ellipsis; overflow: hidden; padding: 0; } @@ -1634,6 +1632,8 @@ div.i-window-header { background-position: 50%; } /* Global font styles */ +.i-window, +.i-popupview-popup, .i-app input, .i-app select, .i-app button, @@ -2174,15 +2174,18 @@ div.i-window-header { background: transparent; } .i-ie6 .i-panel-content, -.i-ie7 .i-panel-content { +.i-ie7 .i-panel-content, +.i-ie8 .i-panel-content { border-bottom: 1px solid #babfc0; } .i-ie6 .i-panel-content-light, -.i-ie7 .i-panel-content-light { +.i-ie7 .i-panel-content-light, +.i-ie8 .i-panel-content-light { border-bottom: none; } .i-ie6 .i-panel-deco, -.i-ie7 .i-panel-deco { +.i-ie7 .i-panel-deco, +.i-ie8 .i-panel-deco { height: 0; overflow: hidden; } @@ -2849,12 +2852,10 @@ div.i-window-header { padding-top: 12px; } /* IE specific styles */ -.i-ie6 .i-tabsheet-tabs, -.i-ie7 .i-tabsheet-tabs { +.i-ie6 .i-tabsheet-tabs { height: 46px; } -.i-ie6 .i-tabsheet-tabitem-selected, -.i-ie7 .i-tabsheet-tabitem-selected { +.i-ie6 .i-tabsheet-tabitem-selected { border: 1px solid #babfc0; border-bottom: none; background: #fff; @@ -2864,24 +2865,26 @@ div.i-window-header { cursor: default; color: #ee5311; } -.i-ie6 .i-tabsheet-tabitem-selected .i-caption, -.i-ie7 .i-tabsheet-tabitem-selected .i-caption { +.i-ie6 .i-tabsheet-tabitem-selected .i-caption { background: transparent; padding: 0; margin: 0; } .i-ie6 .i-tabsheet-content, -.i-ie7 .i-tabsheet-content { +.i-ie7 .i-tabsheet-content, +.i-ie8 .i-tabsheet-content { border-bottom: none; } .i-ie6 .i-tabsheet-deco, -.i-ie7 .i-tabsheet-deco { +.i-ie7 .i-tabsheet-deco, +.i-ie8 .i-tabsheet-deco { height: 1px; background: #babfc0; overflow: hidden; margin: 0; } -.i-ie7 .i-tabsheet-deco { +.i-ie7 .i-tabsheet-deco, +.i-ie8 .i-tabsheet-deco { width: 100%; } /* Light-style */ @@ -2995,7 +2998,8 @@ div.i-window-header { padding: 9px 11px 0 11px; } .i-ie6 .i-tabsheet-deco-light, -.i-ie6 .i-tabsheet-deco-light { +.i-ie7 .i-tabsheet-deco-light, +.i-ie8 .i-tabsheet-deco-light { height: 0; } diff --git a/WebContent/ITMILL/themes/default/tabsheet/tabsheet.css b/WebContent/ITMILL/themes/default/tabsheet/tabsheet.css index 7ae7fd6d7a..3dd1f6ffec 100644 --- a/WebContent/ITMILL/themes/default/tabsheet/tabsheet.css +++ b/WebContent/ITMILL/themes/default/tabsheet/tabsheet.css @@ -117,12 +117,10 @@ padding-top: 12px; } /* IE specific styles */ -.i-ie6 .i-tabsheet-tabs, -.i-ie7 .i-tabsheet-tabs { +.i-ie6 .i-tabsheet-tabs { height: 46px; } -.i-ie6 .i-tabsheet-tabitem-selected, -.i-ie7 .i-tabsheet-tabitem-selected { +.i-ie6 .i-tabsheet-tabitem-selected { border: 1px solid #babfc0; border-bottom: none; background: #fff; @@ -132,24 +130,26 @@ cursor: default; color: #ee5311; } -.i-ie6 .i-tabsheet-tabitem-selected .i-caption, -.i-ie7 .i-tabsheet-tabitem-selected .i-caption { +.i-ie6 .i-tabsheet-tabitem-selected .i-caption { background: transparent; padding: 0; margin: 0; } .i-ie6 .i-tabsheet-content, -.i-ie7 .i-tabsheet-content { +.i-ie7 .i-tabsheet-content, +.i-ie8 .i-tabsheet-content { border-bottom: none; } .i-ie6 .i-tabsheet-deco, -.i-ie7 .i-tabsheet-deco { +.i-ie7 .i-tabsheet-deco, +.i-ie8 .i-tabsheet-deco { height: 1px; background: #babfc0; overflow: hidden; margin: 0; } -.i-ie7 .i-tabsheet-deco { +.i-ie7 .i-tabsheet-deco, +.i-ie8 .i-tabsheet-deco { width: 100%; } /* Light-style */ @@ -263,6 +263,7 @@ padding: 9px 11px 0 11px; } .i-ie6 .i-tabsheet-deco-light, -.i-ie6 .i-tabsheet-deco-light { +.i-ie7 .i-tabsheet-deco-light, +.i-ie8 .i-tabsheet-deco-light { height: 0; } \ No newline at end of file diff --git a/WebContent/ITMILL/themes/reindeer/button/button.css b/WebContent/ITMILL/themes/reindeer/button/button.css index e69de29bb2..cef518e073 100644 --- a/WebContent/ITMILL/themes/reindeer/button/button.css +++ b/WebContent/ITMILL/themes/reindeer/button/button.css @@ -0,0 +1,139 @@ +/** sprite: buttons; sprite-image: url('img/buttons.png'); sprite-layout: vertical */ + +/* IE6 gets native buttons, since it doesn't support the adjacent child selector (>) that is needed to position i-icon properly */ +div > .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { + height: 26px; + padding: 0 0 0 6px; + background-color: transparent; + background-repeat: none; + background-image: url(img/left.png); /** sprite-ref: buttons */ + border: none; + cursor: default; +} +div > .i-button span, +.i-ie7 .i-button span, +.i-ie8 .i-button span { + display: inline-block; + height: 21px; + padding: 5px 15px 0 9px; + background-color: transparent; + background-repeat: no-repeat; + background-position: right top; + background-image: url(img/right.png); /** sprite-ref: buttons; sprite-alignment: right */ + text-shadow: #fff 0 1px 0; + font-weight: bold; + float: none; + line-height: 16px; +} +.i-ie7 .i-button span, +.i-ie8 .i-button span { + padding: 5px 15px 0 9px; + height: 21px; +} +.i-button:focus { + background-image: url(img/left-focus.png); /** sprite-ref: buttons */ + outline: none; +} +.i-button:focus span { + background-image: url(img/right-focus.png); /** sprite-ref: buttons; sprite-alignment: right */ + outline: none; +} +.i-button:active { + background-image: url(img/left-pressed.png); /** sprite-ref: buttons */ + outline: none; +} +.i-button:active span { + background-image: url(img/right-pressed.png); /** sprite-ref: buttons; sprite-alignment: right */ + outline: none; +} +/* FF3 & FF2 */ +.i-button::-moz-focus-inner { + border: none; + padding: 0; +} +.i-ff2 .i-button span { + display: -moz-inline-box; +} +/* IE7 */ +.i-ie7 .i-button.i-pressed, +.i-ie8 .i-button.i-pressed { + background-image: url(img/left-pressed.png); /** sprite-ref: buttons */ +} +.i-ie7 .i-button.i-pressed span, +.i-ie8 .i-button.i-pressed span { + background-image: url(img/right-pressed.png); /** sprite-ref: buttons; sprite-alignment: right */ + position: relative; +} +.i-ie7 .i-button.i-pressed .i-icon, +.i-ie8 .i-button.i-pressed .i-icon { + position: relative; + z-index: 2; +} +/* IE8 */ +/* TODO +.i-ie8 .i-button:active { + background-position: 1px -39px; +} +.i-ie8 .i-button:active span { + position: relative; +} +*/ +/* Opera */ +.i-op .i-button:active span { + margin-top: -1px; + margin-left: -1px; +} +/* Modifications for buttons with icons */ +div > .i-button .i-icon, +.i-ie7 .i-button .i-icon, +.i-ie8 .i-button .i-icon { + display: inline-block; + width: 16px; + height: 16px; + overflow: hidden; + position: relative; + margin: 0 3px 0 0; +} +.i-ff2 .i-button .i-icon { + display: block; + float: left; + margin-top: 4px; +} +.i-ff2 .i-button-link .i-icon { + margin: 0; +} +.i-button .i-icon + span { + margin-left: -19px; + padding-left: 19px; +} +.i-ie7 .i-button .i-icon + span, +.i-ie8 .i-button .i-icon + span { + margin-left: -23px; + padding-left: 23px; +} +/* Link style buttons */ +.i-button.i-button-link, +.i-ie .i-button-link.i-pressed { + background: transparent; + height: auto; + padding: 0; + cursor: pointer; +} +.i-button.i-button-link span, +.i-ie .i-button-link.i-pressed span { + background: transparent; + height: auto; + padding: 0; + display: inline; + font-weight: normal; + color: #1b699f; +} +.i-button.i-button-link .i-icon + span { + margin: 0; + padding: 0; +} +.i-button-link:focus { + outline: 1px dotted #1b699f; +} \ No newline at end of file diff --git a/WebContent/ITMILL/themes/reindeer/button/img/left-focus.png b/WebContent/ITMILL/themes/reindeer/button/img/left-focus.png new file mode 100644 index 0000000000..636cf840c3 Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/left-focus.png differ diff --git a/WebContent/ITMILL/themes/reindeer/button/img/left-pressed.png b/WebContent/ITMILL/themes/reindeer/button/img/left-pressed.png new file mode 100644 index 0000000000..e70f56b84b Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/left-pressed.png differ diff --git a/WebContent/ITMILL/themes/reindeer/button/img/left.png b/WebContent/ITMILL/themes/reindeer/button/img/left.png new file mode 100644 index 0000000000..c4209e8119 Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/left.png differ diff --git a/WebContent/ITMILL/themes/reindeer/button/img/right-focus.png b/WebContent/ITMILL/themes/reindeer/button/img/right-focus.png new file mode 100644 index 0000000000..dbb0677ac7 Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/right-focus.png differ diff --git a/WebContent/ITMILL/themes/reindeer/button/img/right-pressed.png b/WebContent/ITMILL/themes/reindeer/button/img/right-pressed.png new file mode 100644 index 0000000000..0a99111e60 Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/right-pressed.png differ diff --git a/WebContent/ITMILL/themes/reindeer/button/img/right.png b/WebContent/ITMILL/themes/reindeer/button/img/right.png new file mode 100644 index 0000000000..e70a7be739 Binary files /dev/null and b/WebContent/ITMILL/themes/reindeer/button/img/right.png differ diff --git a/WebContent/ITMILL/themes/reindeer/common/common.css b/WebContent/ITMILL/themes/reindeer/common/common.css new file mode 100644 index 0000000000..7d3e413978 --- /dev/null +++ b/WebContent/ITMILL/themes/reindeer/common/common.css @@ -0,0 +1,45 @@ +.i-generated-body, +.i-app { + background: #f5f5f5; +} +/* Global font styles */ +.i-app, +.i-window, +.i-popupview-popup, +.i-tooltip, +.i-app input, +.i-app select, +.i-app button, +.i-app textarea, +.i-window input, +.i-window select, +.i-window button, +.i-window textarea, +.i-popupview-popup input, +.i-popupview-popup select, +.i-popupview-popup button, +.i-popupview-popup textarea { + font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; + font-size: 12px; + line-height: normal; + color: #222; +} +/* Fonts for Safari, exchange Helvetica for Arial */ +.i-sa .i-app, +.i-sa .i-window, +.i-sa .i-popupview-popup, +.i-sa .i-tooltip, +.i-sa .i-app input, +.i-sa .i-app select, +.i-sa .i-app button, +.i-sa .i-app textarea, +.i-sa .i-window input, +.i-sa .i-window select, +.i-sa .i-window button, +.i-sa .i-window textarea, +.i-sa .i-popupview-popup input, +.i-sa .i-popupview-popup select, +.i-sa .i-popupview-popup button, +.i-sa .i-popupview-popup textarea { + font-family: Helvetica, Arial, "Lucida Grande", Geneva, Tahoma, Verdana, sans-serif; +} \ No newline at end of file diff --git a/WebContent/ITMILL/themes/reindeer/styles.css b/WebContent/ITMILL/themes/reindeer/styles.css index b759ebdd20..1906b69143 100644 --- a/WebContent/ITMILL/themes/reindeer/styles.css +++ b/WebContent/ITMILL/themes/reindeer/styles.css @@ -40,6 +40,9 @@ white-space: nowrap; margin: 0; } +.i-button span { + white-space: nowrap; +} .i-checkbox input { vertical-align: middle; } @@ -49,7 +52,8 @@ vertical-align: middle; margin-right: 3px; } -.i-button span, .i-checkbox label { +.i-button span, +.i-checkbox label { vertical-align: middle; } .i-button-link { @@ -74,22 +78,17 @@ padding-left: 1em; background-position: left; } - -/* Fixes streched buttons in IE6 */ +/* Fixes streched buttons in IE6 and IE7*/ .i-ie6 .i-button { width: 1px; - overflow: visible; - padding-left: 1em; - padding-right: 1em; } - -/* Fixes streched buttons in IE7 */ -.i-ie7 .i-button { +.i-ie6 .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { overflow: visible; padding-left: 1em; padding-right: 1em; } - /* Error indicator on checkbox fix for IE6 */ .i-ie6 .i-checkbox * { float: left; @@ -102,32 +101,30 @@ padding-left: 0; padding-right: 0.4em; } - /* Error indicator on checkbox fix for IE7 */ -.i-ie7 .i-checkbox * { +.i-ie7 .i-checkbox *, +.i-ie8 .i-checkbox * { float: left; } -.i-ie7 .i-checkbox .i-errorindicator { +.i-ie7 .i-checkbox .i-errorindicator, +.i-ie8 .i-checkbox .i-errorindicator { background-position: right; float: left; padding-left: 0; padding-right: 0.7em; } - /* Error indicator on button fix for IE */ .i-ie6 button .i-errorindicator, -.i-ie7 button .i-errorindicator { +.i-ie7 button .i-errorindicator, +.i-ie8 button .i-errorindicator { display: inline; padding-right: 0.5em; } - - /* Disabled by default .i-checkbox-error { background: #ffe0e0; } */ - /* Disabled by default .i-checkbox-required { background: #ffe0e0; @@ -1418,6 +1415,7 @@ div.i-tree-node-leaf { div.i-window-header { white-space: nowrap; text-overflow: ellipsis; + -ms-text-overflow: ellipsis; overflow: hidden; padding: 0; } @@ -1555,3 +1553,182 @@ div.i-window-header { /* Automatically compiled css file from subdirectories. */ /* ./WebContent/ITMILL/themes/reindeer/button/button.css */ +/* IE6 gets native buttons, since it doesn't support the adjacent child selector (>) that is needed to position i-icon properly */ +div > .i-button, +.i-ie7 .i-button, +.i-ie8 .i-button { + height: 26px; + padding: 0 0 0 6px; /* Left side padding width the same amount as left.png */ + background: transparent url(button/img/left.png) no-repeat; + border: none; + cursor: default; +} +div > .i-button span, +.i-ie7 .i-button span, +.i-ie8 .i-button span { + display: inline-block; + height: 21px; + padding: 5px 15px 0 9px; + background: transparent url(button/img/right.png) no-repeat right top; + text-shadow: #fff 0 1px 0; + font-weight: bold; + float: none; + line-height: 16px; +} +.i-ie7 .i-button span, +.i-ie8 .i-button span { + padding: 5px 15px 0 9px; + height: 21px; +} +.i-button:focus { + background-image: url(button/img/left-focus.png); + outline: none; +} +.i-button:focus span { + background-image: url(button/img/right-focus.png); + outline: none; +} +.i-button:active { + background-image: url(button/img/left-pressed.png); + outline: none; +} +.i-button:active span { + background-image: url(button/img/right-pressed.png); + outline: none; +} +/* FF3 & FF2 */ +.i-button::-moz-focus-inner { + border: none; + padding: 0; +} +.i-ff2 .i-button span { + display: -moz-inline-box; +} +/* IE7 */ +.i-ie7 .i-button.i-pressed, +.i-ie8 .i-button.i-pressed { + background-image: url(button/img/left-pressed.png); +} +.i-ie7 .i-button.i-pressed span, +.i-ie8 .i-button.i-pressed span { + background-image: url(button/img/right-pressed.png); + position: relative; +} +.i-ie7 .i-button.i-pressed .i-icon, +.i-ie8 .i-button.i-pressed .i-icon { + position: relative; + z-index: 2; +} +/* IE8 */ +/* TODO +.i-ie8 .i-button:active { + background-position: 1px -39px; +} +.i-ie8 .i-button:active span { + position: relative; +} +*/ +/* Opera */ +.i-op .i-button:active span { + margin-top: -1px; + margin-left: -1px; +} +/* Modifications for buttons with icons */ +div > .i-button .i-icon, +.i-ie7 .i-button .i-icon, +.i-ie8 .i-button .i-icon { + display: inline-block; + width: 16px; + height: 16px; + overflow: hidden; + position: relative; + margin: 0 3px 0 0; +} +.i-ff2 .i-button .i-icon { + display: block; + float: left; + margin-top: 4px; +} +.i-ff2 .i-button-link .i-icon { + margin: 0; +} +.i-button .i-icon + span { + margin-left: -19px; + padding-left: 19px; +} +.i-ie7 .i-button .i-icon + span, +.i-ie8 .i-button .i-icon + span { + margin-left: -23px; + padding-left: 23px; +} +/* Link style buttons */ +.i-button.i-button-link, +.i-ie .i-button-link.i-pressed { + background: transparent; + height: auto; + padding: 0; + cursor: pointer; +} +.i-button.i-button-link span, +.i-ie .i-button-link.i-pressed span { + background: transparent; + height: auto; + padding: 0; + display: inline; + font-weight: normal; + color: #1b699f; +} +.i-button.i-button-link .i-icon + span { + margin: 0; + padding: 0; +} +.i-button-link:focus { + outline: 1px dotted #1b699f; +} + +/* ./WebContent/ITMILL/themes/reindeer/common/common.css */ +.i-generated-body, +.i-app { + background: #f5f5f5; +} +/* Global font styles */ +.i-app, +.i-window, +.i-popupview-popup, +.i-tooltip, +.i-app input, +.i-app select, +.i-app button, +.i-app textarea, +.i-window input, +.i-window select, +.i-window button, +.i-window textarea, +.i-popupview-popup input, +.i-popupview-popup select, +.i-popupview-popup button, +.i-popupview-popup textarea { + font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; + font-size: 12px; + line-height: normal; + color: #222; +} +/* Fonts for Safari, exchange Helvetica for Arial */ +.i-sa .i-app, +.i-sa .i-window, +.i-sa .i-popupview-popup, +.i-sa .i-tooltip, +.i-sa .i-app input, +.i-sa .i-app select, +.i-sa .i-app button, +.i-sa .i-app textarea, +.i-sa .i-window input, +.i-sa .i-window select, +.i-sa .i-window button, +.i-sa .i-window textarea, +.i-sa .i-popupview-popup input, +.i-sa .i-popupview-popup select, +.i-sa .i-popupview-popup button, +.i-sa .i-popupview-popup textarea { + font-family: Helvetica, Arial, "Lucida Grande", Geneva, Tahoma, Verdana, sans-serif; +} diff --git a/WebContent/ITMILL/themes/sampler/sampler/styles.css b/WebContent/ITMILL/themes/sampler/sampler/styles.css index 8e68b5f97e..6e6144d639 100644 --- a/WebContent/ITMILL/themes/sampler/sampler/styles.css +++ b/WebContent/ITMILL/themes/sampler/sampler/styles.css @@ -143,13 +143,14 @@ display: block; height: 24px; background-repeat: no-repeat; - background-position: 50% 40%; + background-position: 50% 30%; } .i-app-SamplerApplication .i-horizontallayout-segment .i-button-tree-switch span { background-image: url(tree.png); } .i-app-SamplerApplication .i-horizontallayout-segment .i-popupview span { background-image: url(magnifier.png); + background-position: 50% 40%; } .i-app-SamplerApplication .i-horizontallayout-segment .i-button-previous span { background-image: url(prev.png); @@ -303,8 +304,9 @@ text-shadow: 0 1px 0 #272a2b; background: transparent url(info-bubble-top.png); margin: 0; - padding-bottom: 10px; + padding-bottom: 12px; padding-left: 28px; + padding-top: 15px; } .i-app-SamplerApplication .feature-info .i-panel-content { background: transparent url(info-bubble-top.png) no-repeat 0 -44px; diff --git a/WebContent/ITMILL/themes/sampler/styles.css b/WebContent/ITMILL/themes/sampler/styles.css index bcd1cfab44..2707893d3d 100644 --- a/WebContent/ITMILL/themes/sampler/styles.css +++ b/WebContent/ITMILL/themes/sampler/styles.css @@ -1,4 +1,4 @@ -@import url(../default/styles.css); +@import url(../reindeer/styles.css); @import url(sampler/styles.css); -- cgit v1.2.3