some more support for squared style
This commit is contained in:
parent
53bc6e9e56
commit
32252a1dfd
7 changed files with 24 additions and 5 deletions
|
@ -1228,10 +1228,17 @@ OxSelect
|
||||||
border-top-left-radius: 8px;
|
border-top-left-radius: 8px;
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
}
|
}
|
||||||
|
.OxLabelSelect.OxSquared > .OxTitle {
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
}
|
||||||
.OxLabelSelect.OxRounded.OxSelected {
|
.OxLabelSelect.OxRounded.OxSelected {
|
||||||
border-bottom-left-radius: 8px;
|
border-bottom-left-radius: 8px;
|
||||||
}
|
}
|
||||||
.OxLabelSelect.OxRounded.OxSelected > .OxTitle {
|
.OxLabelSelect.Squared.OxSelected {
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
}
|
||||||
|
.OxLabelSelect.OxSelected > .OxTitle {
|
||||||
border-bottom-left-radius: 0;
|
border-bottom-left-radius: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -58,6 +58,7 @@ Ox.ButtonGroup = function(options, self) {
|
||||||
overlap: self.options.overlap == 'left' && i == 0 ? 'left'
|
overlap: self.options.overlap == 'left' && i == 0 ? 'left'
|
||||||
: self.options.overlap == 'right' && i == self.options.buttons.length - 1 ? 'right'
|
: self.options.overlap == 'right' && i == self.options.buttons.length - 1 ? 'right'
|
||||||
: 'none',
|
: 'none',
|
||||||
|
style: self.options.style,
|
||||||
title: button.title || button,
|
title: button.title || button,
|
||||||
tooltip: button.tooltip,
|
tooltip: button.tooltip,
|
||||||
width: button.width
|
width: button.width
|
||||||
|
|
|
@ -94,7 +94,7 @@ Ox.Checkbox = function(options, self) {
|
||||||
self.$button = Ox.Button({
|
self.$button = Ox.Button({
|
||||||
disabled: self.options.disabled,
|
disabled: self.options.disabled,
|
||||||
id: self.options.id + 'Button',
|
id: self.options.id + 'Button',
|
||||||
style: self.options.style,
|
style: self.options.style != 'rounded' ? self.options.style : '',
|
||||||
type: 'image',
|
type: 'image',
|
||||||
value: self.options.value ? 'check' : 'none',
|
value: self.options.value ? 'check' : 'none',
|
||||||
values: ['none', 'check']
|
values: ['none', 'check']
|
||||||
|
|
|
@ -212,6 +212,7 @@ Ox.Input = function(options, self) {
|
||||||
if (self.options.label) {
|
if (self.options.label) {
|
||||||
self.$label = Ox.Label({
|
self.$label = Ox.Label({
|
||||||
overlap: 'right',
|
overlap: 'right',
|
||||||
|
style: self.options.style,
|
||||||
textAlign: 'right',
|
textAlign: 'right',
|
||||||
title: self.options.label,
|
title: self.options.label,
|
||||||
width: self.options.labelWidth
|
width: self.options.labelWidth
|
||||||
|
|
|
@ -27,13 +27,19 @@ Ox.Label = function(options, self) {
|
||||||
width: function() {
|
width: function() {
|
||||||
that.css({
|
that.css({
|
||||||
width: self.options.width - (
|
width: self.options.width - (
|
||||||
self.options.style == 'rounded' ? 14 : 8
|
Ox.contains(['rounded', 'squared'], self.options.style)
|
||||||
|
? 14 : 8
|
||||||
) + 'px'
|
) + 'px'
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.addClass(
|
.addClass(
|
||||||
'OxLabel Ox' + Ox.toTitleCase(self.options.style)
|
'OxLabel'
|
||||||
|
+ (
|
||||||
|
self.options.style != 'rounded'
|
||||||
|
? ' Ox' + Ox.toTitleCase(self.options.style)
|
||||||
|
: ''
|
||||||
|
)
|
||||||
+ (self.options.disabled ? ' OxDisabled' : '')
|
+ (self.options.disabled ? ' OxDisabled' : '')
|
||||||
+ (
|
+ (
|
||||||
self.options.overlap != 'none'
|
self.options.overlap != 'none'
|
||||||
|
@ -42,7 +48,8 @@ Ox.Label = function(options, self) {
|
||||||
)
|
)
|
||||||
.css(Ox.extend(self.options.width == 'auto' ? {} : {
|
.css(Ox.extend(self.options.width == 'auto' ? {} : {
|
||||||
width: self.options.width - (
|
width: self.options.width - (
|
||||||
self.options.style == 'rounded' ? 14 : 8
|
Ox.contains(['rounded', 'squared'], self.options.style)
|
||||||
|
? 14 : 8
|
||||||
) + 'px'
|
) + 'px'
|
||||||
}, {
|
}, {
|
||||||
textAlign: self.options.textAlign
|
textAlign: self.options.textAlign
|
||||||
|
|
|
@ -127,6 +127,7 @@ Ox.Select = function(options, self) {
|
||||||
if (self.options.label) {
|
if (self.options.label) {
|
||||||
self.$label = Ox.Label({
|
self.$label = Ox.Label({
|
||||||
overlap: 'right',
|
overlap: 'right',
|
||||||
|
style: self.options.style,
|
||||||
textAlign: 'right',
|
textAlign: 'right',
|
||||||
title: self.options.label,
|
title: self.options.label,
|
||||||
width: self.options.labelWidth
|
width: self.options.labelWidth
|
||||||
|
|
|
@ -22,6 +22,7 @@ Ox.TabPanel = function(options, self) {
|
||||||
.defaults({
|
.defaults({
|
||||||
content: null,
|
content: null,
|
||||||
size: 24,
|
size: 24,
|
||||||
|
style: 'default',
|
||||||
tabs: []
|
tabs: []
|
||||||
})
|
})
|
||||||
.options(options || {})
|
.options(options || {})
|
||||||
|
@ -40,6 +41,7 @@ Ox.TabPanel = function(options, self) {
|
||||||
buttons: self.options.tabs,
|
buttons: self.options.tabs,
|
||||||
id: 'tabs',
|
id: 'tabs',
|
||||||
selectable: true,
|
selectable: true,
|
||||||
|
style: self.options.style,
|
||||||
value: self.selected
|
value: self.selected
|
||||||
})
|
})
|
||||||
.css({top: (self.options.size - 16) / 2 + 'px'})
|
.css({top: (self.options.size - 16) / 2 + 'px'})
|
||||||
|
|
Loading…
Reference in a new issue