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

update CSS

Browse source
This commit is contained in:
rolux 2011-08-15 14:25:58 +02:00
parent e063626bdc
commit ee93ed673e
4 changed files with 36 additions and 125 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

109
source/Ox.UI/css/Ox.UI.css
View file

@ -222,87 +222,12 @@ Dialog
*/
.OxDialog {
position: absolute;
//left: 0;
//top: 0;
//right: 0;
//bottom: 0;
//margin: auto;
z-index: 11;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
}
.OxDialog > .OxTitleBar {
//left: 0px;
//right: 0px;
//height: 16px;
//padding: 3px 8px 5px 8px;
//padding: 3px 0 5px 0;
cursor: move;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 8px;
}
.OxDialog > .OxTitleBar > .OxTitle {
margin: 4px 8px 0 8px;
font-size: 11px;
font-weight: bold;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.OxDialog > .OxContent {
position: relative;
top: 0;
bottom: 24px;
height: 100%;
//padding: 16px;
//font-size: 12px;
//line-height: 16px;
}
.OxDialog > .OxButtonsBar {
left: 0;
right: 0;
bottom: 0;
height: 24px;
//text-align: right;
-moz-border-radius-bottomleft: 8px;
-moz-border-radius-bottomright: 8px;
-webkit-border-bottom-left-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
}
.OxDialog > .OxButtonsBar > .OxButton {
margin: 4px 2px 0 2px;
}
.OxDialog > .OxButtonsBar > .OxButton.OxLeft {
float: left;
}
.OxDialog > .OxButtonsBar > .OxButton.OxLeft:first-child {
margin-left: 16px;
}
.OxDialog > .OxButtonsBar > .OxButton.OxRight {
float: right;
}
.OxDialog > .OxButtonsBar > .OxResize {
float: right;
height: 24px;
width: 14px;
cursor: se-resize;
}
.OxWindow {
position: absolute;
border-radius: 8px;
z-index: 11;
}
.OxWindow > .OxTitlebar {
.OxDialog > .OxTitlebar {
position: absolute;
height: 24px;
text-align: center;
@ -310,11 +235,11 @@ Dialog
border-top-right-radius: 8px;
}
.OxWindow > .OxTitlebar > .OxButton {
.OxDialog > .OxTitlebar > .OxButton {
position: absolute;
}
.OxWindow > .OxTitlebar > .OxTitle {
.OxDialog > .OxTitlebar > .OxTitle {
margin-top: 3px;
font-size: 13px;
font-weight: bold;
@ -323,7 +248,7 @@ Dialog
white-space: nowrap;
}
.OxWindow > .OxContent {
.OxDialog > .OxContent {
position: absolute;
left: 0;
top: 24px;
@ -331,7 +256,7 @@ Dialog
overflow: auto;
}
.OxWindow > .OxButtonsbar {
.OxDialog > .OxButtonsbar {
position: absolute;
bottom: 0;
height: 24px;
@ -339,71 +264,71 @@ Dialog
border-bottom-right-radius: 8px;
cursor: move;
}
.OxWindow > .OxButtonsbar > .OxButtonsLeft {
.OxDialog > .OxButtonsbar > .OxButtonsLeft {
margin-left: 4px;
float: left;
}
.OxWindow > .OxButtonsbar > .OxButtonsRight {
.OxDialog > .OxButtonsbar > .OxButtonsRight {
margin-right: 4px;
float: right;
}
.OxWindow > .OxButtonsbar .OxButton {
.OxDialog > .OxButtonsbar .OxButton {
margin: 4px 2px 4px 2px;
}
.OxWindow > .OxResize {
.OxDialog > .OxResize {
position: absolute;
}
.OxWindow > .OxResizeTopLeft {
.OxDialog > .OxResizeTopLeft {
left: -2px;
top: -2px;
width: 10px;
height: 10px;
cursor: nwse-resize;
}
.OxWindow > .OxResizeTop {
.OxDialog > .OxResizeTop {
left: 8px;
top: -2px;
right: 8px;
height: 5px;
cursor: ns-resize;
}
.OxWindow > .OxResizeTopRight {
.OxDialog > .OxResizeTopRight {
right: -2px;
top: -2px;
width: 10px;
height: 10px;
cursor: nesw-resize;
}
.OxWindow > .OxResizeLeft {
.OxDialog > .OxResizeLeft {
left: -2px;
top: 8px;
width: 5px;
bottom: 8px;
cursor: ew-resize;
}
.OxWindow > .OxResizeRight {
.OxDialog > .OxResizeRight {
right: -2px;
top: 8px;
width: 5px;
bottom: 8px;
cursor: ew-resize;
}
.OxWindow > .OxResizeBottomLeft {
.OxDialog > .OxResizeBottomLeft {
left: -2px;
bottom: -2px;
width: 10px;
height: 10px;
cursor: nesw-resize;
}
.OxWindow > .OxResizeBottom {
.OxDialog > .OxResizeBottom {
left: 8px;
bottom: -2px;
right: 8px;
height: 5px;
cursor: ns-resize;
}
.OxWindow > .OxResizeBottomRight {
.OxDialog > .OxResizeBottomRight {
right: -2px;
bottom: -2px;
width: 10px;

12
source/Ox.UI/js/Window/Ox.Dialog.js
View file

@ -1,13 +1,13 @@
// vim: et:ts=4:sw=4:sts=4:ft=javascript
/*@
Ox.Dialog <f:Ox.Element> Window object
() -> <f> Window object
(options) -> <f> Window object
(options, self) -> <f> Window object
Ox.Dialog <f:Ox.Element> Dialog object
() -> <f> Dialog object
(options) -> <f> Dialog object
(options, self) -> <f> Dialog object
options <o> Options object
draggable <b|true> is window draggable
fullscreenable <b|true> fixme: silly name
height <n|225> height
height <n|200> height
resizeable <b|true> resizeable
scaleable <b|true> sccaleable
width <n|400> width
@ -40,7 +40,7 @@ Ox.Dialog = function(options, self) {
width: 400
})
.options(options || {})
.addClass('OxWindow')
.addClass('OxDialog')
.hide()
.appendTo(Ox.UI.$body);

22
source/Ox.UI/themes/classic/css/classic.css
View file

@ -75,37 +75,27 @@ Dialog
*/
.OxThemeClassic .OxDialog {
-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75);
-webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75);
-moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
-webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
}
.OxThemeClassic .OxDialog .OxBar {
//background: -moz-linear-gradient(top, rgba(208, 208, 208, 0.96), rgba(176, 176, 176, 0.96));
//background: -webkit-gradient(linear, left top, left bottom, from(rgba(208, 208, 208, 0.96)), to(rgba(176, 176, 176, 0.96)));
background: -moz-linear-gradient(top, rgba(224, 224, 224, 0.96), rgba(192, 192, 192, 0.96));
background: -webkit-linear-gradient(top, rgba(224, 224, 224, 0.96), rgba(192, 192, 192, 0.96));
background: -moz-linear-gradient(top, rgba(224, 224, 224, 0.95), rgba(192, 192, 192, 0.95));
background: -webkit-linear-gradient(top, rgba(224, 224, 224, 0.95), rgba(192, 192, 192, 0.95));
}
.OxThemeClassic .OxDialog .OxContent {
//background: rgba(224, 224, 224, 0.96);
background: rgba(208, 208, 208, 0.96);
background: rgba(208, 208, 208, 0.95);
}
.OxThemeClassic .OxDialog .OxTitle {
color: rgb(48, 48, 48);
//color: rgb(48, 48, 48);
}
.OxThemeClassic .OxLayer {
background: rgb(255, 255, 255);
}
.OxThemeClassic .OxWindow {
-moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
-webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75);
}
.OxThemeClassic .OxWindow .OxContent {
background: rgba(208, 208, 208, 0.95);
}
/*
================================================================================
Document

18
source/Ox.UI/themes/modern/css/modern.css
View file

@ -78,13 +78,16 @@ Dialog
*/
.OxThemeModern .OxDialog {
-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 1);
-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 1);
-moz-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1);
-webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1);
}
.OxThemeModern .OxDialog .OxContent {
background: rgba(48, 48, 48, 0.95);
}
.OxThemeModern .OxDialog .OxBar {
background: -moz-linear-gradient(top, rgba(64, 64, 64, 0.96), rgba(32, 32, 32, 0.96));
background: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.96), rgba(32, 32, 32, 0.96));
background: -moz-linear-gradient(top, rgba(64, 64, 64, 0.95), rgba(32, 32, 32, 0.95));
background: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.95), rgba(32, 32, 32, 0.95));
}
.OxThemeModern .OxDialog .OxContent {
@ -95,13 +98,6 @@ Dialog
background: rgb(0, 0, 0);
}
.OxThemeModern .OxWindow > div {
-moz-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1);
-webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1);
}
.OxThemeModern .OxWindow .OxContent {
background: rgba(48, 48, 48, 0.95);
}
/*