From a6cd7bc875b46bf54ee5a2962bd60ae8e1608bbe Mon Sep 17 00:00:00 2001 From: Marc Englund Date: Wed, 29 Nov 2006 15:58:52 +0000 Subject: Bare-bones theme (native style) started; cleanups, improvements. Note: table still missing completely. svn changeset:123/svn branch:toolkit --- WebContent/themes/default/calendar-default.css | 1 - WebContent/themes/default/theme.css | 1028 ++++++------------------ WebContent/themes/default/theme.js | 61 +- 3 files changed, 258 insertions(+), 832 deletions(-) diff --git a/WebContent/themes/default/calendar-default.css b/WebContent/themes/default/calendar-default.css index d018ff7fac..c766d64ee2 100644 --- a/WebContent/themes/default/calendar-default.css +++ b/WebContent/themes/default/calendar-default.css @@ -28,7 +28,6 @@ div.calendar { position: relative; } font-weight: bold; /* Pressing it will take you to the current date */ text-align: center; background: #fff; - background-image: url('img/bg1.gif'); background-repeat: repeat-x; color: #000; padding: 2px; } diff --git a/WebContent/themes/default/theme.css b/WebContent/themes/default/theme.css index 985efac13b..e63affa8c2 100644 --- a/WebContent/themes/default/theme.css +++ b/WebContent/themes/default/theme.css @@ -1,803 +1,225 @@ -/** -* Various styles for debug mode -*/ -.uidl { - z-index: 1001; - text-indent: 18px; - border: 1px dashed red; - font-weight: normal; - white-space: nowrap; - cursor: hand; - cursor: pointer; -} - -.minimized { - overflow: hidden; - width: 5px; - height: 5px; - z-index: 1000; - float: left; -} - - - -/** -* Common attribute classes -*/ -.abs { position: absolute; } -.right { float: right; } -.nobr { white-space: nowrap; } -.inline { display: inline; } -.hidden { display: none; } -.pad { - padding: 3px 7px 3px 10px; -} -.padnr { - padding: 4px 0 4px 10px; -} - -/** -* Background used in various headers -*/ -.bg { - background-image: url(img/bg1.gif); - background-repeat: repeat-x; - background-color: white; -} - - - - - - - - - - - -.disabled { - color: #999999; - opacity: 0.5; - filter: alpha(opacity=50); -} -.disabled .caption { - color: #999999; -} -.disabled .border .caption { - color:#999999; -} -.disabled * { - color:#999999; -} - -.caption { - font-weight:bold; - color: black; - white-space:nowrap; - /*height: 16px;*/ -} -.caption .error { - /*width: 16px; - height: 16px;*/ - padding-left:5px; -} - -.content { - padding:5px; -} - -.clickable { - cursor:hand; - cursor:pointer; -} - - -/*.over { - border: 1px solid #eeeeee; -} -.over .border { - border: 1px solid #9999ee; - margin-left:-1px; -}*/ - -/* -.over.outset { - border: 1px solid #eeeeee !important; - border: inherit; -}*/ - -.border { - border: 1px solid #aaaaaa; -} - -.border.error { - border-color: #ee6666; -} - -IMG.overlay { - position: absolute; - z-index: 5; -} -IMG.error { - width: 11px; - height: 16px; -} - -.inset { - border-top: 2px solid #eeeeee; - border-left: 2px solid #eeeeee; -} - -.outset { - border-bottom: 2px solid #eeeeee; - border-right: 2px solid #eeeeee; -} - -.odd { - background-color:#f1f1f1; -} - - -.selectable { - color:white; - background:#0075d9; -} -.selected { - background-color:#c6e5fa; -} - -/* Popup */ -.popup { - font-weight: normal; - position: absolute; - z-index: 10000; - background: #f5f5fa; -} -.popup TD { - padding: 0px; - border: 0px; - margin: 0px; -} -.popup .icon { - vertical-align: middle; - display: inline; - /*width: auto; - height: auto;*/ -} -.popup .error { - border: 1px solid red; -} -.popup.hide { - display: none; -}/* -.popup.hide .border { - display: inline; - border: none; -} -.popup.hide .icon { - display: inline; - /*width: 16px; - height: 16px; -} -.popup.hide .content { - display: none; -} -.popup.hide .error { - display: none; -}*/ - - - -.item { - border: 1px solid #e9e9ef; - border-top: 1px solid white; - white-space: nowrap; -} -.item.over { - border: 1px solid #9999ee; - background-color: white; - background-image: url('img/bg1.gif'); - background-repeat: repeat-x; -} -.item .icon { - width:16px; - height:16px; -} - - - - - -/** -* Icons -*/ - -.icon { - vertical-align:bottom; - width:32px; - height:32px; -} -.icon-mini { - width:14px; - height:11px; - display:-moz-inline-box; - display:inline-block; - vertical-align:top; -} -.icon.error { - background:url(img/icon/error.gif) no-repeat top right; -} -.icon-mini.error { - background:url(img/icon/error-mini.gif) no-repeat; -} -.icon.info { - background:url(img/icon/info.gif) no-repeat; -} -.icon-mini.info { - background:url(img/icon/info-mini.gif) no-repeat top right; -} - - -/* COMPONENTS */ - - -/** -* Layouts -*/ -.gridlayout TABLE TD { - text-align: left; - vertical-align: top; -} - -.orderedlayout TABLE { - /* TODO works in FF not IE */ - Xwidth: 100%; -} - - -/** -* Button -*/ - -/* Button-style */ -.button { - margin-left:-5px; -} -.button .icon-mini { - padding-left:5px; -} -.btn { - float:left; - padding:5px 12px 0 0; - height:23px; - color:#fff; - background:url(img/button/btn-bg.gif) repeat-x; -} - -.over .btn { - background:url(img/button/btn-bg.gif) repeat-x bottom left; - border:none; -} -.btn-left, .btn-right { - width:16px; - height:28px; - float:left; - background:url(img/button/btn-left.gif) no-repeat; -} -.btn-right { - background:url(img/button/btn-right.gif) no-repeat; -} -.over .btn-left { - background:url(img/button/btn-left.gif) no-repeat bottom left; -} -.over .btn-right { - background:url(img/button/btn-right.gif) no-repeat bottom left; -} -.btn .caption { - color:#fff; -} -.btn .popup, .btn .popup .caption { - color:#494949; -} -.button.over { - border:none; -} -.button.over .btn .caption { - color:#fff; -} - -/* Link-style */ -.button-link .caption { - color:#6db201; - text-decoration:underline; -} -.button-link.over .caption { - color:#2a7acc; -} -.button-link .popup, .button-link .popup .caption, .button-link.over .caption .popup .content { - color:#494949; - text-decoration:none; -} - - - -/** -* Link -*/ -.link { - -} -.link.over { - background:none; -} -.link .caption { - color:#6db201; - text-decoration:underline; -} -.link.over .caption { - color:#2a7acc; -} -.link .description { - font-size:0.9em; -} -.link .popup .caption, .link .popup .content { - color:#494949; - text-decoration:none; -} - - - - -/** -* Tabsheet -*/ -/* -.tabs { - padding-left: 0px !important; - padding-left: 1px; - padding-top: 5px; - padding-bottom: 3px !important; - padding-bottom: 2px; - white-space: nowrap; -} -.tab, .tab-on { - border-right: 2px solid #eeeeee; - border-bottom: none; -} -.tab-on { - position: relative; - top: 1px; -} -.tab .caption { - background-image: url('img/bg1.gif'); - background-repeat: repeat-x; - border-bottom: none; -} -.tab .over { - /*border: 1px solid #9999ee; - border-bottom: none; -} -.tab-on .caption { - border-bottom: 1px solid white; - border-bottom: none; - background-color: white; -} -*/ - - -.node { - border: 1px solid white; - white-space: nowrap; - padding-bottom: 2px; -} -.nodes { - padding-left: 16px; -} -.node .caption { - vertical-align: top; - font-weight: normal; -} - -.node.over { - /*border: 1px solid #9999ee; - background-image: url('img/bg1.gif'); - background-repeat: repeat-x; - background-color: white;*/ -} -.node.over .caption { - /*color: blue;*/ -} -.node .icon { - width:16px; - height:16px; -} - -/** -* Panel -*/ - -/* Normal style */ -.panel { - margin:14px 9px 14px 0; -} -.panel .top { - height:35px; -} -.panel .top .left { - background:transparent url(img/panel/top-left.gif) no-repeat; - margin-right:19px; - height:35px; -} -.panel .top .right { - background:transparent url(img/panel/top-right.gif) no-repeat right top; - margin-left:-19px; - width:19px; - height:35px; - float:right; - display:inline; -} -.panel .middle { - background:#f8f8f8 url(img/panel/middle.gif) repeat-x; - border-left:solid 2px #ededed; - border-right:solid 2px #ededed; - padding:12px 19px 12px 19px; - overflow:auto; -} -.panel .bottom { - height:21px; -} -.panel .bottom .left { - background:url(img/panel/bottom-left.gif) no-repeat; - margin-right:19px; - height:21px; - -} -.panel .bottom .right { - background:url(img/panel/bottom-right.gif) no-repeat right top; - width:19px; - height:21px; - float:right; -} -/* FIX IE6 (5.5) leaves a four pixel gap between left and right div's */ -* html .panel .bottom .right { - position:relative; - left:-4px; -} -.panel .top .left .title { - padding:8px 19px 3px 19px; - height:22px; - margin-right:-19px; - border-bottom:solid 1px #dedede; -} -.panel .top .left .title .caption { - font-family:'Trebuchet MS', Tahoma, Arial, Helvetica, sans-serif; - color:#0076c9; - font-style:italic; - font-weight:bold; - font-size:12pt; - letter-spacing:-0.04em; - white-space:nowrap; -} - - -/* Light style */ -.panel-light { - margin:20px 9px 20px 0; -} -.panel-light .top { - height:31px; - overflow:hidden; -} -.panel-light .top .left { - background:transparent url(img/panel/top-left-light.gif) no-repeat; - margin-right:19px; - height:31px; -} -.panel-light .top .right { - background:transparent url(img/panel/top-right-light.gif) no-repeat right top; - margin-left:-19px; - width:19px; - height:31px; - float:right; - display:inline; -} -.panel-light .middle { - background:#fff url(img/panel/middle-light.gif) repeat-x; - padding:12px 19px 12px 19px; - overflow:auto; -} -.panel-light .top .left .title { - padding:5px 19px 3px 19px; - height:18px; -} -.panel-light .top .left .title .caption { - font-family:'Trebuchet MS', Tahoma, Arial, Helvetica, sans-serif; - color:#0076c9; - font-style:italic; - font-weight:bold; - font-size:11pt; - letter-spacing:-0.04em; - white-space:nowrap; -} - -/* Description popup fixes */ -.panel .title .caption .popup .caption, .panel .title .caption .popup .caption { - font-family:Tahoma, Arial, Helvetica, sans-serif; - font-style:normal; - font-size:8pt; - color:#494949; -} - - - - - -/* -.textfield.over .border { - border: 1px solid #9999ee; -} -*/ -.textfield INPUT { - border: none; - padding-top: 2px; - padding-bottom: 2px; - padding-left: 5px; - padding-right: 5px; -} - - - - -/* -* Table - */ - -/* Renewed theme styles, 8.6.2006 - Jouni Koivuviita */ -.table { - margin:14px 10px 14px 0; - color:#494949; -} -.table .header { - height:25px; - overflow:hidden; - position:relative; - top:3px; - z-index:1; -} -.table .header .left { - width:20px; - height:25px; - float:left; - background:url(img/table/caption-left.gif) no-repeat; -} -.table .header .title { - height:25px; - float:left; - background:url(img/table/caption-bg.gif) repeat-x; - padding-right:20px; -} -.table .header .right { - width:20px; - height:25px; - float:left; - background:url(img/table/caption-right.gif) no-repeat; -} -.table .header .title { - padding-top:7px; - color:#fff; -} -.table .top { - height:3px; - overflow:hidden; -} -.table .top .left { - background:url(img/table/top-left.gif) no-repeat; - margin-right:4px; - height:3px; -} -.table .top .right { - background:url(img/table/top-right.gif) no-repeat right top; - width:4px; - height:3px; - float:right; -} - -.table .middle { - background-color:#f8f8f8; - border-left:solid 3px #f1f1f1; - border-right:solid 3px #f1f1f1; - color:#494949; -} -.table .bottom { - height:3px; -} -.table .bottom .left { - background:url(img/table/bottom-left.gif) no-repeat; - margin-right:4px; - height:3px; - -} -.table .bottom .right { - background:url(img/table/bottom-right.gif) no-repeat right top; - width:4px; - height:3px; - float:right; -} -.table .header .title .caption { - color:#fff; -} -.table .col-headers { - background:#f4f4f4 url(img/table/col-header-bg.gif) repeat-x; - color:#0076c9; -} - - -/* Old table styles */ -.list .bg { - background-image: none; -} -.list .cheader { - border-width: 1px 1px 1px 1px; -} -.list .content TABLE { - width: 100%; -} -.list .nav { - border-top: 2px solid #eeeeee; - text-align: center; - font-size: smaller; -} -.list .nav .small { - font-size: smaller; -} -.list .content TR.over { - background-image: url('img/bg1.gif'); - background-repeat: repeat-x; - background-color: white; -} -.list .content TD.scroll { - background: white; -} -.list .content TD.scroll { - background: white; -} -.table .content { - padding: 0px; -} -.table .content TABLE { - border-collapse: collapse; - empty-cells: show; - width: 100%; -} -.table .content TD { - padding-left: 5px; - padding-right: 5px; - padding-top: 3px; - padding-bottom: 3px; - border-left: 1px solid #eeeeee; - border-bottom: 1px solid #eeeeee; -} - -.table .cheader { - border-bottom-color: #999999; - border-left: 1px solid #cdcdcd; - padding-top: 5px; - padding-bottom: 5px; - vertical-align: middle; -} -.table .cheader.over { - border-color: #9999ee; - padding-bottom: 4px; -} -.table .cheader.sorted { - border-color: #9999ee; - padding-bottom: 4px; -} -.table .rheader { - text-align: right; - border-right-color: #999999; - border-left: none; -} -.table .selected .rheader { - background-color: white; -} -.table .empty { - border-bottom-color: #999999; - border-right-color: #999999; -} -.table .nav { - border-top: 2px solid #eeeeee; - text-align: center; - font-size: smaller; -} -.table .nav .small { - font-size: smaller; -} -.table .content TR.over { - background-image: url(img/bg1.gif); - background-repeat: repeat-x; - background-color: white; -} -.table .content TR.over TD { - border-bottom: 1px solid #9999ee; -} - -.table .content TD.scroll { - padding: 0px; - border: none; - width: 16px; - height: 100%; -} -.table .content TD.cheader.scroll { - border-left: 1px solid #999999; - border-bottom: 1px solid #999999; - width: 16px; -} -.table DIV.scroll { - width: 16px; - border-left: 1px solid #eeeeee; - /*overflow: scroll;*/ - height: 100%; -} -td.header { - background: url(img/bg1.gif); - background-repeat: repeat-x; -} -.table .icon { - width:16px; - height:16px; - background:url(img/table/col-header-bg.gif) repeat-x; -} - - -/** -* General HTML-tag styles -* Added 6.6.2006 -* Jouni Koivuviita -**/ - -body { - margin:0; - padding:20px; - background: url(img/body_bg.gif) repeat-x #fff; - color:#494949; - font-family:Tahoma, Arial, Helvetica, sans-serif; - font-size:62.5%; -} -td { - font-size:8pt; -} -p { - font-size:1em; -} - -h1, h2, h3, h4, h5, h6 { - font-family: "Trebuchet MS", sans-serif; - color:#494949; - letter-spacing:-0.03em; -} -h1 { - font-size: 18pt; - text-transform:uppercase; - margin:1em 0 0.6em 0; -} -h2 { - font-size:17pt; - font-weight:normal; - color:#0076c9; - margin:0.8em 0 0.5em 0; -} -h3 { - font-size: 14pt; - margin:0.6em 0 0.4em 0; -} -h4 { - font-size:12.4pt; - font-style:italic; - color:#0076c9; - margin:0.4em 0 0.3em 0; -} -h5 { - font-size:10pt; - margin:0.3em 0 0.2em 0; -} \ No newline at end of file +/* Debug styles */ +.uidl { + position: absolute; + z-index: 1001; + text-indent: 18px; + background-color: white; + background-image: url('img/debug.gif'); + background-repeat: no-repeat; + background-position: 1 1; + font-weight: normal; + white-space: nowrap; +} +.minimized { + overflow: hidden; + width: 18px; + height: 18px; + z-index: 1000; +} + +/* General styles */ + +* { + background-color: ThreeDFace; + font-family: sans-serif; + Xfont-size: 10pt; + font-weight: normal; +} + +.inline { + display: inline; +} + +.hidden { + display: none; +} + +.border { + background-color: ButtonFace; + border-width: 1px; + border-style: solid; + border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight; +} + +.outset { + border: 1px solid ButtonFace; +} +/* DISABLED */ +.disabled { + color: GrayText; + opacity: 0.5; + filter: alpha(opacity=50); +} +.disabled .caption { + color: GrayText; +} +.disabled .border .caption { + color: GrayText; +} +INPUT, SELECT, SELECT OPTION, TEXTAREA { + background-color: ThreeDHighlight; +} +.disabled INPUT, .disabled SELECT, .disabled SELECT OPTION { + background-color: ThreeDFace; +} + +/* CAPTION */ +.caption { + color: ButtonText; +} +.caption .icon { + width: 1em; + height: 1em; + vertical-align: middle; + padding-right: 5px; +} + +.clickable { + cursor: hand; + cursor: pointer; +} + +.over { + border: 1px solid ThreeDDarkShadow; +} +.over .caption { + color: ActiveCaption; +} + +.selected { + font-weight: bold; + background: #aaaaaa; +} + +.content { + padding: 7px; +} + +/* TOOLTIP */ +IMG.overlay { + position: absolute; + z-index: 5; +} +.popup { + position: absolute; + z-index: 99999; + overflow: hidden; +} +.popup.hide { + display: none; +} +.popup .border { + border: 1px solid InfoText; + background-color: InfoBackground; +} +.popup .caption { + text-align: left; +} +.popup * { + white-space: nowrap; + color: InfoText; + background-color: InfoBackground; +} +.popup .error { + font-size: 0.9em; +} + +/* COMPONENTS */ + +/* Button */ +.button .border { + height: 1.2em; + overflow: hidden; + padding: 0.2em 0.4em 0.2em 0.4em; + text-align: center; +} + +.button-link .caption { + color: ActiveCaption; + font-style: italic; +} +.button-link .over { + border: none; +} +.button-link .over .caption { + text-decoration: underline; +} + +/* DateField */ +.datefield .btn { + background-color: ButtonFace; + margin-right: 3px; +} + +/* Link */ +.link .caption { + color: ActiveCaption; + font-style: italic; +} +.link .over { + border: none; +} +.link .over .caption { + text-decoration: underline; +} +.link .description { + font-size: 0.8em; + text-indent: 1.5em; +} + +/* Panel */ +.panelcaption { + padding: 0.2em 0.4em 0.2em 0.4em; +} +.panel .panelcaption { + border-bottom: 2px groove ButtonShadow; + color: CaptionText; + background-color: ActiveCaption; +} +.panel-light .borderlight { + border: 2px groove ThreeDHighlight; +} + +/* Select */ +.select-optiongroup INPUT.option { + background-color: ThreeDFace; +} +.select-optiongroup DIV.newitem { + margin-left: 1.2em; + margin-top: 0.3em; +} + +/* TabSheet */ +.tabsheet .tabs { + margin-top: 0.5em; +} +.tabsheet .tabs .tab .caption, .tabsheet .tabs .tab-on .caption { + margin-left: 1px; + margin-right: 1px; + padding: 0.2em 0.4em 0.1em 0.4em; +} +.tabsheet .tabs .tab .border { + border-bottom: 1px solid ThreeDHighlight; +} +.tabsheet .tabs .tab-on .border { + border-bottom: 1px solid ThreeDFace; +} +.tabsheet .tabs .over { + border: none; +} +.tabsheet .tabs .over .border { + border-bottom: 1px solid ThreeDFace; +} + + +/* TextField */ +.textfield { + margin-top: 0.05em; +} +.textfield .border { + border: none; +} +.textfield INPUT { + font-size: 1em; + padding: 0.12em 0.4em 0.12em 0.4em; +} diff --git a/WebContent/themes/default/theme.js b/WebContent/themes/default/theme.js index 3b0ea0a1cf..6ac94987df 100644 --- a/WebContent/themes/default/theme.js +++ b/WebContent/themes/default/theme.js @@ -791,9 +791,12 @@ DefaultTheme.prototype.showPopup = function(client,popup, x, y, delay, defWidth) this.hidePopup(); } this.popup = popup; +/* THIS CODE IS NOT NEEDED IF WE CAN POSITION THE POPUP BEFOREHAND + popup.style.left = 0+"px"; popup.style.top = 0+"px"; this.removeCSSClass(popup,"hide"); + var p = client.getElementPosition(popup); this.addCSSClass(popup,"hide"); // TODOO!!! width not working properly @@ -822,7 +825,7 @@ DefaultTheme.prototype.showPopup = function(client,popup, x, y, delay, defWidth) popup.style.left = posX+"px"; popup.style.top = posY+"px"; - +*/ if (delay > 0) { with ({theme:this}) { theme.popupTimeout = setTimeout(function(){ @@ -1336,6 +1339,8 @@ DefaultTheme.prototype.renderPanel = function(renderer,uidl,target,layoutInfo) { var style = uidl.getAttribute("style"); + var borderStyle = "border"; + // Create component element var outer = theme.createPaintableElement(renderer,uidl,target,layoutInfo); if (uidl.getAttribute("invisible")) return; // Don't render content if invisible @@ -1345,19 +1350,20 @@ DefaultTheme.prototype.renderPanel = function(renderer,uidl,target,layoutInfo) { } if ("light"==style) { theme.addCSSClass(div,"light"); + borderStyle += "light"; } // Create extra DIV for visual layout var div = theme.createElementTo(outer,"div"); if ("none"!=style) { - theme.setCSSClass(div,"border"); + theme.setCSSClass(div,borderStyle); } // Create default header var caption = theme.renderDefaultComponentHeader(renderer,uidl,div); - theme.addCSSClass(caption,"pad"); + theme.addCSSClass(caption,"panelcaption"); if ("light"==style) { - theme.addCSSClass(caption,"lightcap"); + theme.addCSSClass(caption,"panelcaptionlight"); } // Create content DIV @@ -1382,7 +1388,6 @@ DefaultTheme.prototype.renderTabSheet = function(renderer,uidl,target,layoutInfo // Create default header var caption = renderer.theme.renderDefaultComponentHeader(renderer,uidl,div,layoutInfo); - theme.createElementTo(div,"br"); // Render tabs var tabs = theme.createElementTo(div,"div","tabs"); @@ -1404,7 +1409,9 @@ DefaultTheme.prototype.renderTabSheet = function(renderer,uidl,target,layoutInfo if (tabNode.getAttribute("selected") == "true") { theme.addCSSClass(tab,"tab-on inline"); selectedTabNode = tabNode; - } else if (tabNode.getAttribute("disabled") == "true") { + } else if (tabNode.getAttribute("disabled") == "true" + || uidl.getAttribute("disabled") == "true" + || uidl.getAttribute("readonly") == "true") { theme.setCSSClass(tab,"tab disabled inline"); } else { theme.setCSSClass(tab,"tab clickable inline"); @@ -1417,22 +1424,18 @@ DefaultTheme.prototype.renderTabSheet = function(renderer,uidl,target,layoutInfo // Icon if (iconUrl) { - tab.innerHTML = ""+tabNode.getAttribute("caption"); - //var icon = theme.createElementTo(tab,"img","icon"); - //icon.src = iconUrl; + tab.innerHTML = "" + tabNode.getAttribute("caption"); } else { tab.innerHTML = tabNode.getAttribute("caption"); } - - // Caption - //theme.createTextNodeTo(tab,tabNode.getAttribute("caption")); } } - // Render content + // Render content (IE renderbug need three) var content = theme.createElementTo(div,"div","outset"); - content = theme.createElementTo(content,"div","content border"); + content = theme.createElementTo(content,"div","border"); + content = theme.createElementTo(content,"div","content"); if (selectedTabNode != null) { theme.renderChildNodes(renderer,selectedTabNode, content); } @@ -1617,21 +1620,20 @@ DefaultTheme.prototype.renderTextField = function(renderer,uidl,target, layoutIn input.focusid = focusid; } } else { - input = renderer.theme.createInputElementTo(border,(secret?"password":"text"),null,focusid); - + input = renderer.theme.createInputElementTo(border,(secret?"password":"text"),null,focusid); } if (tabindex) input.tabIndex = tabindex; if (disabled||readonly) { input.disabled = "true"; } - // Assign cols and rows if (cols >0) { if (multiline) { input.cols = cols; } else { input.size = cols; + input.maxlength = cols; } } if (rows >0) { @@ -1740,7 +1742,7 @@ DefaultTheme.prototype.renderDateField = function(renderer,uidl,target,layoutInf } // Create button - var button = theme.createInputElementTo(div,"button"); + var button = theme.createInputElementTo(div,"button","btn clickable"); button.id =buttonId; button.value = "..."; if (disabled||readonly) { @@ -2305,8 +2307,8 @@ DefaultTheme.prototype.renderLink = function(renderer,uidl,target,layoutInfo) { var link = theme.createElementTo(div,"div", "link pad clickable"); if (!disabled&&!readonly) { - theme.addAddClassListener(theme,client,div,"mouseover","over"); - theme.addRemoveClassListener(theme,client,div,"mouseout","over"); + theme.addAddClassListener(theme,client,link,"mouseover","over"); + theme.addRemoveClassListener(theme,client,link,"mouseout","over"); var feat; switch (border) { @@ -3273,7 +3275,7 @@ DefaultTheme.prototype.renderSelect = function(renderer,uidl,target,layoutInfo) if (focusid) select.focusid = focusid; if (tabindex) select.tabIndex = tabindex; if (selectMode == "multi") { - select.setAttribute("multiple", "true"); + select.setAttribute("multiple", "true"); if (newitem) { theme.createElementTo(div,"br"); } @@ -3285,6 +3287,9 @@ DefaultTheme.prototype.renderSelect = function(renderer,uidl,target,layoutInfo) var options = theme.getFirstElement(uidl,"options"); if (options != null) { options = options.getElementsByTagName("so"); + if (options && options.length && selectMode == "multi") { + select.size = (options.length>7?7:options.length); + } } if (disabled||readonly) { select.disabled = "true"; @@ -3313,7 +3318,7 @@ DefaultTheme.prototype.renderSelect = function(renderer,uidl,target,layoutInfo) var button = theme.createElementTo(div,"button"); theme.createTextNodeTo(button,"+"); var newitemVariable = theme.createVariableElementTo(div,theme.getVariableElement(uidl,"string","newitem")); - theme.addSetVarListener(theme,client,input,"change",newitemVariable,input,immediate); + theme.addSetVarListener(theme,client,input,"change",newitemVariable,input,true); } } @@ -3364,9 +3369,9 @@ DefaultTheme.prototype.renderSelectOptionGroup = function(renderer,uidl,target,l var caption = optionUidl.getAttribute("caption"); var html; if (selectMode == "multi") { - html = "