0x2620/oxjs
2
0
Fork 1
Code Issues 172 Pull requests Releases Wiki Activity

some improvements for textareas with labels

Browse source
This commit is contained in:
Rolux 2010-02-27 08:54:45 +01:00
parent e0c0abb1e2
commit e805486d86
3 changed files with 17 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
build/css/ox.ui.css
View file

@ -217,11 +217,12 @@ input::-moz-focus-inner {
border: none; border: none;
} }
textarea { textarea {
padding: 2px 4px 2px 4px; //padding: 2px 4px 2px 4px;
margin: -1px 0 0 -1px; padding: 0 4px 0 4px;
margin: -1px 0 0 0;
resize: none; resize: none;
//-moz-border-radius: 8px; -moz-border-radius: 8px;
//-webkit-border-radius: 8px; -webkit-border-radius: 8px;
} }
.OxButton.OxSymbol, .OxButton.OxSymbol,
.OxButton.OxSymbol:active, .OxButton.OxSymbol:active,

6
build/js/ox.ui.js
View file

@ -2003,7 +2003,7 @@ requires
background: "-moz-linear-gradient(top, rgb(224, 224, 224), rgb(240, 240, 240) " + percent + "%, rgb(240, 240, 240) " + (100 - percent) + "%, rgb(255, 255, 255))" background: "-moz-linear-gradient(top, rgb(224, 224, 224), rgb(240, 240, 240) " + percent + "%, rgb(240, 240, 240) " + (100 - percent) + "%, rgb(255, 255, 255))"
}) })
.css({ .css({
background: "-webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), color-stop(" + (percent / 100) + ", rgb(240, 240, 240)), color-stop(" + (1 - percent / 100) + ", rgb(240, 240, 240)), to(rgb(255, 255, 255)));" background: "-webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), color-stop(" + (percent / 100) + ", rgb(240, 240, 240)), color-stop(" + (1 - percent / 100) + ", rgb(240, 240, 240)), to(rgb(255, 255, 255)))"
}); });
} }
return that; return that;
@ -2012,9 +2012,9 @@ requires
that.width = function(value) { that.width = function(value) {
that.$element.width(value); that.$element.width(value);
that.$input.width(value - (self.options.type == "textarea" ? 0 : 2) - that.$input.width(value - (self.options.type == "textarea" ? 0 : 2) -
(self.options.labelWidth ? self.options.labelWidth + 34 : 0) - (self.options.labelWidth ? self.options.labelWidth + 18 : 0) -
(self.options.placeholder.length > 1 ? 26 : 0) - (self.options.placeholder.length > 1 ? 26 : 0) -
(self.options.clear ? 15 : 0)); (self.options.clear ? 31 : 0));
// fixme: the values above are all weird guesswork // fixme: the values above are all weird guesswork
return that; return that;
} }

10
demos/test/index.html
View file

@ -517,7 +517,15 @@
$("<br>").appendTo(mainPanel.$element); $("<br>").appendTo(mainPanel.$element);
$("<br>").appendTo(mainPanel.$element); $("<br>").appendTo(mainPanel.$element);
Ox.Input({ Ox.Input({
placeholder: "some\ntext", label: "Label",
labelWidth: 48,
}).width(400).addClass("margin").appendTo(mainPanel);
$("<br>").appendTo(mainPanel.$element);
$("<br>").appendTo(mainPanel.$element);
Ox.Input({
label: "Label",
labelWidth: 48,
//placeholder: "some\ntext",
type: "textarea" type: "textarea"
}).width(400).height(100).addClass("margin").appendTo(mainPanel); }).width(400).height(100).addClass("margin").appendTo(mainPanel);