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

updating css

Browse source
This commit is contained in:
Rolux 2010-02-27 09:16:58 +01:00
parent e805486d86
commit dc84b4ccf9
3 changed files with 16 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
build/css/ox.ui.classic.css
View file

@ -103,13 +103,12 @@ Forms
background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(255, 255, 255));
background: -webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), to(rgb(255, 255, 255)));
}
.OxThemeClassic textarea.OxInput:focus {
.OxThemeClassic .OxInput:focus {
border: 1px solid rgb(160, 160, 160);
-moz-box-shadow: 0 0 2px rgb(128, 128, 128);
-webkit-box-shadow: 0 0 2px rgb(128, 128, 128);
}
.OxThemeClassic input.OxInput.OxPlaceholder,
.OxThemeClassic textarea.OxInput.OxPlaceholder {
.OxThemeClassic .OxInput.OxPlaceholder {
color: rgb(160, 160, 160)
}

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

@ -1734,7 +1734,7 @@ requires
highlight: false,
id: "",
label: "",
labelWidth: 0,
labelWidth: 64,
placeholder: "",
selected: 0,
size: "medium",
@ -1994,16 +1994,23 @@ requires
}
that.height = function(value) {
var percent = 8 / value * 100;
var stop = 8 / value;
if (self.options.type == "textarea") {
that.$element.height(value);
that.$element
.height(value)
.css({
background: "-moz-linear-gradient(top, rgb(224, 224, 224), rgb(208, 208, 208) " + (stop * 100) + "%, rgb(208, 208, 208) " + (100 - stop * 100) + "%, rgb(192, 192, 192))"
})
.css({
background: "-webkit-gradient(linear, left top, left bottom, from(rgb(224, 224, 224)), color-stop(" + stop + ", rgb(208, 208, 208)), color-stop(" + (1 - stop) + ", rgb(208, 208, 208)), to(rgb(192, 192, 192)))"
});
that.$input
.height(value)
.css({
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) " + (stop * 100) + "%, rgb(240, 240, 240) " + (100 - stop * 100) + "%, rgb(255, 255, 255))"
})
.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(" + stop + ", rgb(240, 240, 240)), color-stop(" + (1 - stop) + ", rgb(240, 240, 240)), to(rgb(255, 255, 255)))"
});
}
return that;
@ -2012,7 +2019,7 @@ requires
that.width = function(value) {
that.$element.width(value);
that.$input.width(value - (self.options.type == "textarea" ? 0 : 2) -
(self.options.labelWidth ? self.options.labelWidth + 18 : 0) -
(self.options.label ? self.options.labelWidth + 18 : 0) -
(self.options.placeholder.length > 1 ? 26 : 0) -
(self.options.clear ? 31 : 0));
// fixme: the values above are all weird guesswork

4
demos/test/index.html
View file

@ -517,14 +517,12 @@
$("<br>").appendTo(mainPanel.$element);
$("<br>").appendTo(mainPanel.$element);
Ox.Input({
label: "Label",
labelWidth: 48,
label: "Label"
}).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"
}).width(400).height(100).addClass("margin").appendTo(mainPanel);