diff --git a/source/Ox.UI/css/Ox.UI.css b/source/Ox.UI/css/Ox.UI.css index ff53382d..c8ffc1c0 100644 --- a/source/Ox.UI/css/Ox.UI.css +++ b/source/Ox.UI/css/Ox.UI.css @@ -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; diff --git a/source/Ox.UI/js/Window/Ox.Dialog.js b/source/Ox.UI/js/Window/Ox.Dialog.js index 21196f0d..1759f770 100644 --- a/source/Ox.UI/js/Window/Ox.Dialog.js +++ b/source/Ox.UI/js/Window/Ox.Dialog.js @@ -1,13 +1,13 @@ // vim: et:ts=4:sw=4:sts=4:ft=javascript /*@ -Ox.Dialog Window object - () -> Window object - (options) -> Window object - (options, self) -> Window object +Ox.Dialog Dialog object + () -> Dialog object + (options) -> Dialog object + (options, self) -> Dialog object options Options object draggable is window draggable fullscreenable fixme: silly name - height height + height height resizeable resizeable scaleable sccaleable width width @@ -40,7 +40,7 @@ Ox.Dialog = function(options, self) { width: 400 }) .options(options || {}) - .addClass('OxWindow') + .addClass('OxDialog') .hide() .appendTo(Ox.UI.$body); diff --git a/source/Ox.UI/themes/classic/css/classic.css b/source/Ox.UI/themes/classic/css/classic.css index 0cf3ba96..76c5f7c4 100644 --- a/source/Ox.UI/themes/classic/css/classic.css +++ b/source/Ox.UI/themes/classic/css/classic.css @@ -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 diff --git a/source/Ox.UI/themes/modern/css/modern.css b/source/Ox.UI/themes/modern/css/modern.css index 64ef90f1..087ffa5c 100644 --- a/source/Ox.UI/themes/modern/css/modern.css +++ b/source/Ox.UI/themes/modern/css/modern.css @@ -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); -} /*