diff --git a/build/Ox.UI/themes/classic/css/classic.css b/build/Ox.UI/themes/classic/css/classic.css deleted file mode 120000 index ea4eca1b..00000000 --- a/build/Ox.UI/themes/classic/css/classic.css +++ /dev/null @@ -1 +0,0 @@ -../../../../../source/Ox.UI/themes/classic/css/classic.css \ No newline at end of file diff --git a/build/Ox.UI/themes/classic/css/classic.css b/build/Ox.UI/themes/classic/css/classic.css new file mode 100644 index 00000000..42761923 --- /dev/null +++ b/build/Ox.UI/themes/classic/css/classic.css @@ -0,0 +1,700 @@ +body.OxThemeClassic { + background: rgb(240, 240, 240); +} +.OxThemeClassic a { + color: rgb(0, 0, 128); +} +.OxThemeClassic div { + color: rgb(16, 16, 16); +} +.OxThemeClassic .OxHighlight { + background: rgb(255, 255, 0); +} + + +/* +================================================================================ +Bars +================================================================================ +*/ + +.OxThemeClassic .OxBar.OxHorizontal { + //background: -moz-linear-gradient(top, rgb(192, 192, 192), rgb(160, 160, 160)); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(192, 192, 192)), to(rgb(160, 160, 160))); + background-image: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic .OxBar.OxMainMenu { + background-image: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} + +.OxThemeClassic .OxProgressbar { + border-color: rgb(176, 176, 176); + background-image: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic .OxProgressbar .OxTrack { + border-color: rgb(176, 176, 176); + background-image: -moz-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); + background-image: -o-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); + background-image: -webkit-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); +} +.OxThemeClassic .OxProgressbar .OxProgress { + border-color: rgb(176, 176, 176); + background-image: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic .OxProgressbar .OxProgress.OxAnimate { + background-image: + -moz-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.05) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.05) 100% + ), + -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: + -o-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.05) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.05) 100% + ), + -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-image: + -webkit-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.05) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.05) 100% + ), + -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background-size: 32px 32px, 16px 16px; + +} + +.OxThemeClassic .OxResizebar > .OxLine { + background-color: rgb(208, 208, 208); +} + +/* +================================================================================ +Calendar +================================================================================ +*/ + +.OxThemeClassic .OxCalendar .OxTimeline > div.odd { + background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} + +.OxThemeClassic .OxCalendar .OxTimeline > div.even { + background: -moz-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -o-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -webkit-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); +} + +.OxThemeClassic .OxCalendar .OxBackground > div { + //background: rgb(20, 20, 20); + background: rgb(232, 232, 232); +} +.OxThemeClassic .OxCalendar .OxBackground > div.line { + background: rgb(224, 224, 224); +} + +.OxThemeClassic .OxCalendar .OxLine > .OxEvent { + color: rgb(0, 0, 0); +} + +.OxThemeClassic .OxCalendar .OxOverlay div:nth-child(even) { + border-top: 1px solid rgba(0, 0, 0, 0.5); + border-bottom: 1px solid rgba(0, 0, 0, 0.5); +} +.OxThemeClassic .OxCalendar .OxOverlay div:nth-child(odd) { + background-color: rgba(255, 255, 255, 0.5); +} + +/* +================================================================================ +Dialog +================================================================================ +*/ + +.OxThemeClassic .OxDialog { + -moz-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.75); + -o-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(224, 224, 224, 0.95), rgba(192, 192, 192, 0.95)); + background: -o-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(208, 208, 208, 0.95); +} +.OxThemeClassic .OxDialog .OxIconList .OxContent { + background: transparent; +} + +.OxThemeClassic .OxDialog .OxTitle { + //color: rgb(48, 48, 48); +} + +.OxThemeClassic .OxLayer { + background: rgb(255, 255, 255); +} + +/* +================================================================================ +Document +================================================================================ +*/ + +.OxThemeClassic .OxDocument code { + color: rgb(0, 0, 128); + //background: rgb(255, 255, 255); +} +.OxThemeClassic .OxDocument div { + border-color: rgb(192, 192, 192); +} + +/* +================================================================================ +Forms +================================================================================ +*/ + +.OxThemeClassic .OxButton, +.OxThemeClassic input.OxCheckbox, +.OxThemeClassic input.OxInput, +.OxThemeClassic textarea, +.OxThemeClassic .OxLabel, +.OxThemeClassic .OxTrack { + border-color: rgb(176, 176, 176); + //border: 1px solid rgb(160, 160, 160); + color: rgb(64, 64, 64); +} +.OxThemeClassic .OxSelect { + border-color: rgb(176, 176, 176); +} +.OxThemeClassic .OxSelect > .OxTitle { + color: rgb(64, 64, 64); +} +.OxThemeClassic .OxInputLabel { + color: rgb(64, 64, 64); +} +.OxThemeClassic .OxButton, +.OxThemeClassic div.OxInput, +.OxThemeClassic .OxSelect { + //background: -moz-linear-gradient(left top, left bottom, from(rgb(192, 192, 192)), to(rgb(160, 160, 160))); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(192, 192, 192)), to(rgb(160, 160, 160))); + background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic .OxButton:active { + //background: rgb(160, 160, 160); + background: rgb(192, 192, 192); + color: rgb(48, 48, 48); +} +.OxThemeClassic .OxCheckbox:active { + background: -moz-linear-gradient(top, rgb(192, 192, 192), rgb(240, 240, 240)); + background: -o-linear-gradient(top, rgb(192, 192, 192), rgb(240, 240, 240)); + background: -webkit-linear-gradient(top, rgb(192, 192, 192), rgb(240, 240, 240)); +} +.OxThemeClassic .OxButton:focus { + -moz-box-shadow: 0 0 2px rgb(128, 128, 128); + -o-box-shadow: 0 0 2px rgb(128, 128, 128); + -webkit-box-shadow: 0 2 4px rgb(128, 128, 128); +} +.OxThemeClassic .OxButton.OxDisabled { + background: rgb(192, 192, 192); + color: rgb(128, 128, 128); +} +.OxThemeClassic .OxButton.OxSymbol.OxDisabled { + background: rgba(0, 0, 0, 0); + opacity: 0.5; +} + + +.OxThemeClassic .OxButton.OxSelected, +.OxThemeClassic .OxSelect.OxSelected { + background: -moz-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + background: -o-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + //background: -moz-linear-gradient(top, rgb(128, 128, 128), rgb(160, 160, 160) 10%, rgb(192, 192, 192)); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(128, 128, 128)), color-stop(0.1, rgb(160, 160, 160)), to(rgb(192, 192, 192))); + color: rgb(32, 32, 32); +} + +.OxThemeClassic .OxButton.OxTab { + //background: -moz-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + //background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); +} +.OxThemeClassic .OxButton.OxTab.OxSelected { + //background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + //background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + border-bottom: 1px solid rgb(192, 192, 192); +} + + +.OxThemeClassic .OxFormMessage { + color: rgb(192, 64, 64); +} + +.OxThemeClassic .OxLabel.OxDisabled { + color: rgb(128, 128, 128); +} + + +.OxThemeClassic input.OxCheckbox, +.OxThemeClassic input.OxInput, +.OxThemeClassic .OxTrack { + //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))); + background: -moz-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); + background: -o-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); + background: -webkit-linear-gradient(top, rgb(208, 208, 208), rgb(255, 255, 255)); +} +.OxThemeClassic div.OxInput.OxError input { + color: rgb(192, 64, 64); +} +.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 div.OxInput.OxFocus, +.OxThemeClassic .OxSelect.OxFocus { + -moz-box-shadow: 0 0 2px rgb(128, 128, 128); + -o-box-shadow: 0 0 2px rgb(128, 128, 128); + -webkit-box-shadow: 0 0 2px rgb(128, 128, 128); +} + +.OxThemeClassic .OxInput.OxPlaceholder { + color: rgb(160, 160, 160) +} + +.OxThemeClassic .OxLabel { + background: rgb(208, 208, 208); +} + +.OxThemeClassic input.OxCheckbox.OxDisabled, +.OxThemeClassic input.OxInput:disabled { + background: rgb(224, 224, 224); +} + +.OxThemeClassic textarea { + background: rgb(240, 240, 240); +} + +.OxThemeClassic .OxLabelSelect > .OxTitle { + border-color: rgb(176, 176, 176); + background: -moz-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -o-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic .OxLabelSelect.OxSelected > .OxTitle { + background: -moz-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + background: -o-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); + background: -webkit-linear-gradient(top, rgb(160, 160, 160), rgb(192, 192, 192)); +} + + +/* +================================================================================ +Images +================================================================================ +*/ + +.OxThemeClassic .OxReflection > div { + background: -moz-linear-gradient(top, rgba(240, 240, 240, 0.75), rgba(240, 240, 240, 1)); + background: -o-linear-gradient(top, rgba(240, 240, 240, 0.75), rgba(240, 240, 240, 1)); + background: -webkit-linear-gradient(top, rgba(240, 240, 240, 0.75), rgba(240, 240, 240, 1)); +} +.OxThemeClassic .OxDialog .OxReflection > div { + background: -moz-linear-gradient(top, rgba(208, 208, 208, 0.75), rgba(208, 208, 208, 1)); + background: -o-linear-gradient(top, rgba(208, 208, 208, 0.75), rgba(208, 208, 208, 1)); + background: -webkit-linear-gradient(top, rgba(208, 208, 208, 0.75), rgba(208, 208, 208, 1)); +} + +/* +================================================================================ +Lists +================================================================================ +*/ + +.OxThemeClassic .OxIconList .OxItem img.OxLoading { + border-color: rgb(208, 208, 208); + background: -moz-linear-gradient(top, rgb(255, 255, 255), rgb(224, 224, 224)); + background: -o-linear-gradient(top, rgb(255, 255, 255), rgb(224, 224, 224)); + background: -webkit-linear-gradient(top, rgb(255, 255, 255), rgb(224, 224, 224)); +} +.OxThemeClassic .OxIconList .OxItem.OxSelected > .OxIcon > img, +.OxThemeClassic .OxIconList .OxItem.OxSelected > .OxIcon > .OxVideoPlayer { + border-color: rgb(192, 192, 192); + -moz-box-shadow: 0 0 4px rgba(192, 192, 192, 1); + -o-box-shadow: 0 0 4px rgba(192, 192, 192, 1); + -webkit-box-shadow: 0 0 4px rgba(192, 192, 192, 1); +} +.OxThemeClassic .OxIconList.OxFocus .OxItem.OxSelected > .OxIcon > img, +.OxThemeClassic .OxIconList.OxFocus .OxItem.OxSelected > .OxIcon > .OxVideoPlayer { + border-color: rgb(128, 128, 128); + -moz-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -o-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -webkit-box-shadow: 0 0 4px rgba(128, 128, 128, 1); +} +.OxThemeClassic .OxIconList .OxItem > .OxText > div { + text-shadow: rgb(255, 255, 255) -1px -1px 0, + rgb(255, 255, 255) -1px 1px 0, + rgb(255, 255, 255) 1px -1px 0, + rgb(255, 255, 255) 1px 1px 0; +} +.OxThemeClassic .OxIconList .OxItem.OxSelected > .OxText > div { + border-color: rgb(192, 192, 192); + background: rgba(192, 192, 192, 0.5); + -moz-box-shadow: 0 0 4px rgba(192, 192, 192, 1); + -o-box-shadow: 0 0 4px rgba(192, 192, 192, 1); + -webkit-box-shadow: 0 0 4px rgba(192, 192, 192, 1); +} +.OxThemeClassic .OxIconList.OxFocus .OxItem.OxSelected > .OxText > div { + border-color: rgb(128, 128, 128); + background: rgba(128, 128, 128, 0.5); + -moz-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -moz-o-shadow: 0 0 4px rgba(128, 128, 128, 1); + -webkit-box-shadow: 0 0 4px rgba(128, 128, 128, 1); +} +.OxThemeClassic .OxIconList .OxItem > .OxText > div > .OxInfo { + color: rgb(128, 128, 128); +} + + +.OxThemeClassic .OxTextList .OxContent { + background: rgb(240, 240, 240); +} +.OxThemeClassic .OxTextList .OxItem .OxCell { + border-right-color: rgb(224, 224, 224); +} +.OxThemeClassic .OxTextList .OxItem:nth-child(odd) { + background: rgb(242, 242, 242); +} +.OxThemeClassic .OxTextList .OxItem:nth-child(even) { + background: rgb(238, 238, 238); +} +.OxThemeClassic .OxTextList .OxItem.OxSelected:nth-child(odd) { + background: rgb(226, 226, 226); +} +.OxThemeClassic .OxTextList .OxItem.OxSelected:nth-child(even) { + background: rgb(222, 222, 222); +} +.OxThemeClassic .OxTextList .OxFocus .OxItem.OxSelected:nth-child(odd) { + background: rgb(210, 210, 210); +} +.OxThemeClassic .OxTextList .OxFocus .OxItem.OxSelected:nth-child(even) { + background: rgb(206, 206, 206); +} +.OxThemeClassic .OxTextList .OxItem.OxDroppable.OxDrop:nth-child(odd) .OxCell { + background: rgb(194, 194, 194); +} +.OxThemeClassic .OxTextList .OxItem.OxDroppable.OxDrop:nth-child(even) .OxCell { + background: rgb(190, 190, 190); +} + + +.OxThemeClassic .OxTextList .OxHead .OxSelected { + background: -moz-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -o-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -webkit-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + color: rgb(0, 0, 0); +} +.OxThemeClassic .OxTextList .OxHead .OxResize .OxCenter { + background: rgb(192, 192, 192); +} +.OxThemeClassic .OxTextList .OxHead .OxSelect { + border-color: rgb(192, 192, 192); +} +.OxThemeClassic .OxTextList .OxBody .OxItem .OxCell { + border-color: rgb(232, 232, 232); +} +.OxThemeClassic .OxTextList .OxItem.OxSelected .OxCell { + border-color: rgb(216, 216, 216); +} +.OxThemeClassic .OxTextList .OxFocus .OxItem.OxSelected .OxCell { + border-color: rgb(200, 200, 200); + color: rgb(0, 0, 0); +} +.OxThemeClassic .OxTextList .OxBody .OxItem .OxLine { + background: rgb(232, 232, 232); +} + + +/* +================================================================================ +Maps +================================================================================ +*/ + +.OxThemeClassic .OxMapControl { + border-color: rgb(64, 64, 64); + background: rgba(255, 255, 255, 0.75); + color: rgb(64, 64, 64); +} + +/* +================================================================================ +Menus +================================================================================ +*/ + +.OxThemeClassic .OxMainMenu > .OxTitle.OxSelected { + background: -moz-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -o-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); + background: -webkit-linear-gradient(top, rgb(208, 208, 208), rgb(176, 176, 176)); +} + +.OxThemeClassic .OxMenu { + -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); + -moz-o-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); + -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); +} +.OxThemeClassic .OxMenu .OxBottom, +.OxThemeClassic .OxMenu .OxItem, +.OxThemeClassic .OxMenu .OxScrollbar, +.OxThemeClassic .OxMenu .OxSpace, +.OxThemeClassic .OxMenu .OxTop { + background: rgba(208, 208, 208, 0.96); +} +.OxThemeClassic .OxMenu .OxItem.OxSelected, +.OxThemeClassic .OxMenu .OxLine, +.OxThemeClassic .OxMenu .OxScrollbar.OxSelected { + background: rgba(192, 192, 192, 0.96); +} +.OxThemeClassic .OxMenu .OxItem.OxDisabled .OxCell { + color: rgb(160, 160, 160); +} + +/* +================================================================================ +Requests +================================================================================ +*/ + +/* +================================================================================ +Scrollbars +================================================================================ +*/ + +.OxThemeClassic ::-webkit-scrollbar:horizontal { + border-top: 1px solid rgb(176, 176, 176); + border-bottom: 1px solid rgb(176, 176, 176); + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic ::-webkit-scrollbar:vertical { + border-left: 1px solid rgb(176, 176, 176); + border-right: 1px solid rgb(176, 176, 176); + background: -webkit-linear-gradient(left, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic ::-webkit-scrollbar-button:horizontal:decrement { + background: url(../png/scrollbarHorizontalDecrement.png); +} +.OxThemeClassic ::-webkit-scrollbar-button:horizontal:increment { + background: url(../png/scrollbarHorizontalIncrement.png); +} +.OxThemeClassic ::-webkit-scrollbar-button:vertical:decrement { + background: url(../png/scrollbarVerticalDecrement.png); +} +.OxThemeClassic ::-webkit-scrollbar-button:vertical:increment { + background: url(../png/scrollbarVerticalIncrement.png); +} +.OxThemeClassic ::-webkit-scrollbar-corner { + border-right: 1px solid rgb(176, 176, 176); + border-bottom: 1px solid rgb(176, 176, 176); + background: -webkit-linear-gradient(top left, rgb(224, 224, 224), rgb(160, 160, 160)); +} +.OxThemeClassic ::-webkit-scrollbar-thumb { + border: 1px solid rgb(176, 176, 176); +} +.OxThemeClassic ::-webkit-scrollbar-thumb:horizontal { + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic ::-webkit-scrollbar-thumb:vertical { + background: -webkit-linear-gradient(left, rgb(224, 224, 224), rgb(192, 192, 192)); +} +.OxThemeClassic ::-webkit-scrollbar-track { + border: 1px solid rgb(176, 176, 176); +} +.OxThemeClassic ::-webkit-scrollbar-track:horizontal { + background: -webkit-linear-gradient(top, rgb(224, 224, 224), rgb(255, 255, 255)); +} +.OxThemeClassic ::-webkit-scrollbar-track:vertical { + background: -webkit-linear-gradient(left, rgb(224, 224, 224), rgb(255, 255, 255)); +} +.OxThemeClassic ::-webkit-scrollbar:active, +.OxThemeClassic ::-webkit-scrollbar-thumb:active { + background: rgb(208, 208, 208); +} + +/* +================================================================================ +SyntaxHighlighter +================================================================================ +*/ + +.OxThemeClassic .OxSyntaxHighlighter { + background-color: rgb(255, 255, 255); +} +.OxThemeClassic .OxSyntaxHighlighter .OxLineNumbers { + background-color: rgb(224, 224, 224); + color: rgb(128, 128, 128); +} +.OxThemeClassic .OxSourceCode .OxComment { + color: rgb(128, 128, 128); + font-style: italic; +} +.OxThemeClassic .OxSourceCode .OxConstant { + color: rgb(128, 0, 0); + font-weight: bold; +} +.OxThemeClassic .OxSourceCode .OxIdentifier { + color: rgb(0, 0, 0); +} +.OxThemeClassic .OxSourceCode .OxKeyword { + color: rgb(0, 0, 128); + font-weight: bold; +} +.OxThemeClassic .OxSourceCode .OxLinebreak { + color: rgb(192, 192, 192); + font-weight: normal; + font-style: normal; +} +.OxThemeClassic .OxSourceCode .OxMethod { + color: rgb(0, 128, 128); +} +.OxThemeClassic .OxSourceCode .OxNumber { + color: rgb(128, 0, 0); +} +.OxThemeClassic .OxSourceCode .OxObject { + color: rgb(0, 128, 128); + font-weight: bold; +} +.OxThemeClassic .OxSourceCode .OxOperator { + color: rgb(0, 0, 128); +} +.OxThemeClassic .OxSourceCode .OxProperty { + color: rgb(0, 128, 0); + font-weight: bold; +} +.OxThemeClassic .OxSourceCode .OxRegexp { + color: rgb(128, 128, 0); +} +.OxThemeClassic .OxSourceCode .OxString { + color: rgb(0, 128, 0); +} +.OxThemeClassic .OxSourceCode .OxTab { + color: rgb(192, 192, 192); +} +.OxThemeClassic .OxSourceCode .OxWhitespace { + color: rgb(192, 192, 192); +} +.OxThemeClassic .OxSourceCode .OxWhitespace.OxLeading, +.OxThemeClassic .OxSourceCode .OxWhitespace.OxTrailing { + background: rgb(255, 128, 128); +} + +/* +================================================================================ +Video +================================================================================ +*/ + +.OxThemeClassic .OxSmallVideoTimeline .OxMarkerPlay { + border-color: rgba(0, 0, 0, 0.5); +} +.OxThemeClassic .OxSmallVideoTimeline .OxMarkerPlay > div { + border-color: rgba(255, 255, 255, 1); +} +.OxThemeClassic .OxSmallVideoTimeline .OxMarkerPlay.OxPaused > div { + border-color: rgba(255, 255, 255, 0.5); +} +.OxThemeClassic .OxSmallVideoTimeline .OxMarkerPlay > div > div { + border-color: rgba(0, 0, 0, 0.5); +} + +.OxThemeClassic .OxVideoPlayer .OxControls.OxOnScreen { + background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); +} +.OxThemeClassic .OxVideoPlayer .OxFind { + background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); +} +.OxThemeClassic .OxVideoPlayer input.OxInput { + background-image: -moz-linear-gradient(top, rgba(176, 176, 176, 1), rgba(224, 224, 224, 1)); + background-image: -o-linear-gradient(top, rgba(176, 176, 176, 1), rgba(224, 224, 224, 1)); + background-image: -webkit-linear-gradient(top, rgba(176, 176, 176, 1), rgba(224, 224, 224, 1)); +} +.OxThemeClassic .OxVideoPlayer .OxResolution > div { + background: rgba(224, 224, 224, 0.5); +} +.OxThemeClassic .OxVideoPlayer .OxResolution > div.OxSelected { + background-image: -moz-linear-gradient(top, rgba(240, 240, 240, 0.5), rgba(208, 208, 208, 0.5)); + background-image: -o-linear-gradient(top, rgba(240, 240, 240, 0.5), rgba(208, 208, 208, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(240, 240, 240, 0.5), rgba(208, 208, 208, 0.5)); +} +.OxThemeClassic .OxVideoPlayer .OxVolume { + background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); +} +.OxThemeClassic .OxVideoPlayer .OxVolume .OxRange .OxTrack { + background-image: -moz-linear-gradient(top, rgba(192, 192, 192, 0.5), rgba(255, 255, 255, 0.5)); + background-image: -o-linear-gradient(top, rgba(192, 192, 192, 0.5), rgba(255, 255, 255, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(192, 192, 192, 0.5), rgba(255, 255, 255, 0.5)); +} +.OxThemeClassic .OxVideoPlayer .OxVolume .OxRange .OxThumb { + background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); +} +.OxThemeClassic .OxVideoPlayer .OxVolume .OxRange .OxThumb:active { + background-image: -moz-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -o-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.5), rgba(192, 192, 192, 0.5)); +} + +/* +================================================================================ +Miscellaneous +================================================================================ +*/ + +.OxThemeClassic .OxScreen { + background: rgb(224, 224, 224); + color: rgb(32, 32, 32); +} +.OxThemeClassic .OxScreen .OxReflection { + background-image: -moz-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1)); + background-image: -o-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1)); + background-image: -webkit-linear-gradient(top, rgba(224, 224, 224, 0.75), rgba(224, 224, 224, 1), rgba(224, 224, 224, 1)); +} + +.OxThemeClassic .OxTooltip { + border: 1px solid rgba(128, 128, 128, 0.96); + background: rgba(255, 255, 255, 0.96); + color: rgba(128, 128, 128, 1); + -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); + -o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); +} diff --git a/build/Ox.UI/themes/modern/css/modern.css b/build/Ox.UI/themes/modern/css/modern.css deleted file mode 120000 index 2e8fbc7f..00000000 --- a/build/Ox.UI/themes/modern/css/modern.css +++ /dev/null @@ -1 +0,0 @@ -../../../../../source/Ox.UI/themes/modern/css/modern.css \ No newline at end of file diff --git a/build/Ox.UI/themes/modern/css/modern.css b/build/Ox.UI/themes/modern/css/modern.css new file mode 100644 index 00000000..3e4f3750 --- /dev/null +++ b/build/Ox.UI/themes/modern/css/modern.css @@ -0,0 +1,715 @@ +body.OxThemeModern { + background: rgb(16, 16, 16); +} +.OxThemeModern a { + color: rgb(128, 128, 255); +} +.OxThemeModern div { + color: rgb(240, 240, 240); +} +.OxThemeModern .OxHighlight { + //background: rgb(255, 255, 0); + //font-weight: bold; + //color: rgb(0, 0, 0); + color: rgb(255, 255, 0); +} +.OxThemeModern .OxBright { + color: rgb(255, 255, 255); +} + +/* +================================================================================ +Bars +================================================================================ +*/ + +.OxThemeModern .OxBar.OxHorizontal { + //background: -moz-linear-gradient(left top, left bottom, from(rgb(96, 96, 96)), to(rgb(64, 64, 64))); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(96, 96, 96)), to(rgb(64, 64, 64))); + background-image: -moz-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); + background-image: -o-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); + background-image: -webkit-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); +} + +.OxThemeModern .OxProgressbar { + border-color: rgb(48, 48, 48); + background-image: -moz-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: -o-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern .OxProgressbar .OxTrack { + border-color: rgb(48, 48, 48); + background-image: -moz-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); + background-image: -o-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); + background-image: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); +} +.OxThemeModern .OxProgressbar .OxProgress { + border-color: rgb(48, 48, 48); + background-image: -moz-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: -o-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern .OxProgressbar .OxProgress.OxAnimate { + background-image: + -moz-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.1) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.1) 100% + ), + -moz-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: + -o-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.1) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.1) 100% + ), + -o-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-image: + -webkit-repeating-linear-gradient( + -45deg, transparent 0, transparent 25%, + rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.1) 50%, + transparent 50%, transparent 75%, + rgba(0, 0, 0, 0.05) 75%, rgba(0, 0, 0, 0.1) 100% + ), + -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background-size: 32px 32px, 16px 16px; +} + +.OxThemeModern .OxResizebar > .OxLine { + background-color: rgb(48, 48, 48); +} + +/* +================================================================================ +Calendar +================================================================================ +*/ + +.OxThemeModern .OxCalendar .OxTimeline > div.odd { + background-image: -moz-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); + background-image: -o-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); + background-image: -webkit-linear-gradient(top, rgb(64, 64, 64), rgb(32, 32, 32)); +} + +.OxThemeModern .OxCalendar .OxTimeline > div.even { + background-image: -moz-linear-gradient(top, rgb(48, 48, 48), rgb(24, 24, 24)); + background-image: -o-linear-gradient(top, rgb(48, 48, 48), rgb(24, 24, 24)); + background-image: -webkit-linear-gradient(top, rgb(48, 48, 48), rgb(24, 24, 24)); +} + +.OxThemeModern .OxCalendar .OxBackground > div { + //background: rgb(20, 20, 20); + background: rgb(24, 24, 24); +} +.OxThemeModern .OxCalendar .OxBackground > div.line { + background: rgb(32, 32, 32); +} + +.OxThemeModern .OxCalendar .OxLine > .OxEvent { + color: rgb(255, 255, 255); +} + +.OxThemeModern .OxCalendar .OxOverlay div:nth-child(even) { + border-top: 1px solid rgba(255, 255, 255, 0.5); + border-bottom: 1px solid rgba(255, 255, 255, 0.5); +} +.OxThemeModern .OxCalendar .OxOverlay div:nth-child(odd) { + background-color: rgba(0, 0, 0, 0.5); +} + + +/* +================================================================================ +Dialog +================================================================================ +*/ + +.OxThemeModern .OxDialog { + -moz-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1); + -o-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1); + -webkit-box-shadow: 2px 2px 8px rgba(0, 0, 0, 1); +} + +.OxThemeModern .OxDialog .OxBar { + background: -moz-linear-gradient(top, rgba(64, 64, 64, 0.95), rgba(32, 32, 32, 0.95)); + background: -o-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 { + background: rgba(48, 48, 48, 0.95); +} +.OxThemeModern .OxDialog .OxIconList .OxContent { + background: transparent; +} + +.OxThemeModern .OxLayer { + background: rgb(0, 0, 0); +} + + + +/* +================================================================================ +Document +================================================================================ +*/ + +.OxThemeModern .OxDocument code { + color: rgb(128, 128, 255); +} +.OxThemeModern .OxDocument div { + border-color: rgb(64, 64, 64); +} + +/* +================================================================================ +Forms +================================================================================ +*/ + +/* +.OxThemeModern .OxInput::-selection { + background: rgb(80, 80, 80); +} +*/ + + +.OxThemeModern input.OxCheckbox, +.OxThemeModern input.OxInput, +.OxThemeModern textarea, +.OxThemeModern .OxButton, +.OxThemeModern .OxLabel, +.OxThemeModern .OxTrack { + //border: 1px solid rgb(80, 80, 80); + border-color: rgb(48, 48, 48); + color: rgb(192, 192, 192); +} +.OxThemeModern .OxSelect { + border-color: rgb(48, 48, 48); +} +.OxThemeModern .OxSelect > .OxTitle { + color: rgb(192, 192, 192); +} + +.OxThemeModern .OxInputLabel { + color: rgb(192, 192, 192); +} +.OxThemeModern .OxButton, +.OxThemeModern div.OxInput, +.OxThemeModern .OxSelect { + background: -moz-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background: -o-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + //background: -moz-linear-gradient(left top, left bottom, from(rgb(64, 64, 64)), to(rgb(32, 32, 32))); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(64, 64, 64)), to(rgb(32, 32, 32))); +} +.OxThemeModern .OxButton:active { + background: rgb(80, 80, 80); + //background: rgb(64, 64, 64); +} +.OxThemeModern .OxCheckbox:active { + background: -moz-linear-gradient(top, rgb(16, 16, 16), rgb(48, 48, 48)); + background: -o-linear-gradient(top, rgb(16, 16, 16), rgb(48, 48, 48)); + background: -webkit-linear-gradient(top, rgb(16, 16, 16), rgb(48, 48, 48)); +} + +.OxThemeModern .OxButton.OxDisabled { + background: rgb(80, 80, 80); + color: rgb(128, 128, 128); +} +.OxThemeModern .OxButton.OxSymbol.OxDisabled { + background: rgba(0, 0, 0, 0); + opacity: 0.5; +} + +.OxThemeModern .OxButton.OxSelected, +.OxThemeModern .OxSelect.OxSelected, +.OxThemeModern .OxCollapsePanel > .OxBar > .OxExtras > .OxSelect.OxSelected { + //background: -moz-linear-gradient(left top, left bottom, from(rgb(80, 80, 80)), to(rgb(112, 112, 112))); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(80, 80, 80)), to(rgb(112, 112, 112))); + background: -moz-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); + background: -o-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); + background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); + //background: -webkit-gradient(linear, left top, left bottom, from(rgb(0, 0, 0)), color-stop(0.1, rgb(32, 32, 32)), to(rgb(64, 64, 64))); + color: rgb(224, 224, 224); +} +.OxThemeModern .OxButton.OxTab.OxSelected { + border-bottom: 1px solid rgb(64, 64, 64); +} +.OxThemeModern .OxFormMessage { + color: rgb(255, 64, 64); +} + +.OxThemeModern .OxLabel.OxDisabled { + color: rgb(128, 128, 128); +} + +.OxThemeModern input.OxCheckbox, +.OxThemeModern input.OxInput, +.OxThemeModern .OxTrack { + background: -moz-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); + background: -o-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); + background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); +} +.OxThemeModern div.OxInput.OxError input { + color: rgb(255, 64, 64); +} +.OxThemeModern div.OxInput.OxFocus, +.OxThemeModern .OxSelect.OxFocus { + //border: 1px solid rgb(80, 80, 80); + -moz-box-shadow: 0 0 2px rgb(128, 128, 128); + -o-box-shadow: 0 0 2px rgb(128, 128, 128); + -webkit-box-shadow: 0 0 2px rgb(128, 128, 128); +} +.OxThemeModern div.OxInput.OxFocus > .OxInputLabel { + border-color: rgb(80, 80, 80); +} +.OxThemeModern .OxInput.OxPlaceholder { + color: rgb(96, 96, 96) +} +.OxThemeModern .OxLabel { + border-color: rgb(48, 48, 48); + background: rgb(80, 80, 80); + color: rgb(192, 192, 192); +} + +.OxThemeModern input.OxCheckbox.OxDisabled, +.OxThemeModern input.OxInput:disabled { + background: rgb(16, 16, 16); +} + + +.OxThemeModern .OxLabelSelect > .OxTitle { + border-color: rgb(48, 48, 48); + background: -moz-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background: -o-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); + background: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern .OxLabelSelect.OxSelected > .OxTitle { + background: -moz-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); + background: -o-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); + background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32) 10%, rgb(64, 64, 64)); +} + + + +/* +================================================================================ +Images +================================================================================ +*/ + +.OxThemeModern .OxReflection > div { + background: -moz-linear-gradient(top, rgba(16, 16, 16, 0.75), rgba(16, 16, 16, 1)); + background: -o-linear-gradient(top, rgba(16, 16, 16, 0.75), rgba(16, 16, 16, 1)); + background: -webkit-linear-gradient(top, rgba(16, 16, 16, 0.75), rgba(16, 16, 16, 1)); +} +.OxThemeModern .OxDialog .OxReflection > div { + background: -moz-linear-gradient(top, rgba(48, 48, 48, 0.75), rgba(48, 48, 48, 1)); + background: -o-linear-gradient(top, rgba(48, 48, 48, 0.75), rgba(48, 48, 48, 1)); + background: -webkit-linear-gradient(top, rgba(48, 48, 48, 0.75), rgba(48, 48, 48, 1)); +} + +/* +================================================================================ +Lists +================================================================================ +*/ + +.OxThemeModern .OxIconList .OxItem > .OxIcon > img.OxLoading, +.OxThemeModern .OxInfoList .OxItem > .OxIcon > img.OxLoading { + border-color: rgb(48, 48, 48); + background: -moz-linear-gradient(top, rgb(32, 32, 32), rgb(0, 0, 0)); + background: -o-linear-gradient(top, rgb(32, 32, 32), rgb(0, 0, 0)); + background: -webkit-linear-gradient(top, rgb(32, 32, 32), rgb(0, 0, 0)); +} +.OxThemeModern .OxIconList .OxItem.OxSelected > .OxIcon > img, +.OxThemeModern .OxIconList .OxItem.OxSelected > .OxIcon > .OxVideoPlayer { + border-color: rgb(64, 64, 64); + -moz-box-shadow: 0 0 4px rgba(64, 64, 64, 1); + -o-box-shadow: 0 0 4px rgba(64, 64, 64, 1); + -webkit-box-shadow: 0 0 4px rgba(64, 64, 64, 1); +} +.OxThemeModern .OxIconList.OxFocus .OxItem.OxSelected > .OxIcon > img, +.OxThemeModern .OxIconList.OxFocus .OxItem.OxSelected > .OxIcon .OxVideoPlayer { + border-color: rgb(128, 128, 128); + -moz-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -o-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -webkit-box-shadow: 0 0 4px rgba(128, 128, 128, 1); +} +.OxThemeModern .OxIconList .OxItem > .OxText > div { + text-shadow: rgb(0, 0, 0) -1px -1px 0, + rgb(0, 0, 0) -1px 1px 0, + rgb(0, 0, 0) 1px -1px 0, + rgb(0, 0, 0) 1px 1px 0; +} +.OxThemeModern .OxIconList .OxItem.OxSelected > .OxText > div { + border-color: rgb(64, 64, 64); + background: rgba(64, 64, 64, 0.5); + -moz-box-shadow: 0 0 4px rgba(64, 64, 64, 1); + -o-box-shadow: 0 0 4px rgba(64, 64, 64, 1); + -webkit-box-shadow: 0 0 4px rgba(64, 64, 64, 1); +} +.OxThemeModern .OxIconList.OxFocus .OxItem.OxSelected > .OxText > div { + border-color: rgb(128, 128, 128); + background: rgba(128, 128, 128, 0.5); + -moz-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -o-box-shadow: 0 0 4px rgba(128, 128, 128, 1); + -webkit-box-shadow: 0 0 4px rgba(128, 128, 128, 1); +} +.OxThemeModern .OxIconList .OxItem > .OxText > div > .OxInfo { + color: rgb(128, 128, 128); +} + + +.OxThemeModern .OxTextList .OxContent { + background: rgb(16, 16, 16); +} +.OxThemeModern .OxTextList .OxItem .OxCell { + border-right-color: rgb(32, 32, 32); +} +.OxThemeModern .OxTextList .OxItem:nth-child(odd) { + background: rgb(14, 14, 14); +} +.OxThemeModern .OxTextList .OxItem:nth-child(even) { + background: rgb(18, 18, 18); +} +.OxThemeModern .OxTextList .OxItem.OxSelected:nth-child(odd) { + background: rgb(46, 46, 46); +} +.OxThemeModern .OxTextList .OxItem.OxSelected:nth-child(even) { + background: rgb(50, 50, 50); +} +.OxThemeModern .OxTextList .OxFocus .OxItem.OxSelected:nth-child(odd) { + background: rgb(62, 62, 62); +} +.OxThemeModern .OxTextList .OxFocus .OxItem.OxSelected:nth-child(even) { + background: rgb(66, 66, 66); +} +.OxThemeModern .OxTextList .OxItem.OxDroppable.OxDrop:nth-child(odd) .OxCell { + background: rgb(78, 78, 78); +} +.OxThemeModern .OxTextList .OxItem.OxDroppable.OxDrop:nth-child(even) .OxCell { + background: rgb(82, 82, 82); +} + + +.OxThemeModern .OxTextList .OxHead .OxSelected { + background: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); + background: -o-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); + background: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); + color: rgb(255, 255, 255); +} +.OxThemeModern .OxTextList .OxHead .OxResize .OxCenter { + background: rgb(24, 24, 24); +} +.OxThemeModern .OxTextList .OxHead .OxSelect { + border-color: rgb(24, 24, 24); +} +.OxThemeModern .OxTextList .OxBody .OxItem .OxCell { + border-right-color: rgb(24, 24, 24); +} +.OxThemeModern .OxTextList .OxItem.OxSelected .OxCell { + border-right-color: rgb(40, 40, 40); +} +.OxThemeModern .OxTextList .OxFocus .OxItem.OxSelected .OxCell { + border-right-color: rgb(72, 72, 72); + color: rgb(255, 255, 255); +} +.OxThemeModern .OxTextList .OxBody .OxItem .OxLine { + background: rgb(24, 24, 24); +} + + +/* +================================================================================ +Maps +================================================================================ +*/ + +.OxThemeModern .OxMapControl { + border-color: rgb(192, 192, 192); + background: rgba(0, 0, 0, 0.5); + color: rgb(192, 192, 192); +} + +/* +================================================================================ +Menus +================================================================================ +*/ + +.OxThemeModern .OxMainMenu > .OxTitle.OxSelected { + background: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); + background: -o-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); + background: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48)); +} + +.OxThemeModern .OxMenu { + -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); + -o-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); + -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75); +} +.OxThemeModern .OxMenu .OxBottom, +.OxThemeModern .OxMenu .OxItem, +.OxThemeModern .OxMenu .OxScrollbar, +.OxThemeModern .OxMenu .OxSpace, +.OxThemeModern .OxMenu .OxTop { + background: rgba(48, 48, 48, 0.96); +} +.OxThemeModern .OxMenu .OxItem.OxSelected, +.OxThemeModern .OxMenu .OxLine, +.OxThemeModern .OxMenu .OxScrollbar.OxSelected { + background: rgba(64, 64, 64, 0.96); +} +.OxThemeModern .OxMenu .OxItem.OxDisabled .OxCell { + color: rgb(128, 128, 128); +} + +/* +================================================================================ +Scrollbars +================================================================================ +*/ + +.OxThemeModern ::-webkit-scrollbar:horizontal { + border-top: 1px solid rgb(48, 48, 48); + border-bottom: 1px solid rgb(48, 48, 48); + background: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern ::-webkit-scrollbar:vertical { + border-left: 1px solid rgb(48, 48, 48); + border-right: 1px solid rgb(48, 48, 48); + background: -webkit-linear-gradient(left, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern ::-webkit-scrollbar-button:horizontal:decrement { + background: url(../png/scrollbarHorizontalDecrement.png); +} +.OxThemeModern ::-webkit-scrollbar-button:horizontal:increment { + background: url(../png/scrollbarHorizontalIncrement.png); +} +.OxThemeModern ::-webkit-scrollbar-button:vertical:decrement { + background: url(../png/scrollbarVerticalDecrement.png); +} +.OxThemeModern ::-webkit-scrollbar-button:vertical:increment { + background: url(../png/scrollbarVerticalIncrement.png); +} +.OxThemeModern ::-webkit-scrollbar-corner { + border-right: 1px solid rgb(48, 48, 48); + border-bottom: 1px solid rgb(48, 48, 48); + background: -webkit-linear-gradient(left top, rgb(96, 96, 96), rgb(32, 32, 32)); +} +.OxThemeModern ::-webkit-scrollbar-thumb { + border: 1px solid rgb(48, 48, 48); +} +.OxThemeModern ::-webkit-scrollbar-thumb:horizontal { + background: -webkit-linear-gradient(top, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern ::-webkit-scrollbar-thumb:vertical { + background: -webkit-linear-gradient(left, rgb(96, 96, 96), rgb(64, 64, 64)); +} +.OxThemeModern ::-webkit-scrollbar-track { + border: 1px solid rgb(32, 32, 32); +} +.OxThemeModern ::-webkit-scrollbar-track:horizontal { + background: -webkit-linear-gradient(top, rgb(0, 0, 0), rgb(32, 32, 32)); +} +.OxThemeModern ::-webkit-scrollbar-track:vertical { + background: -webkit-linear-gradient(left, rgb(0, 0, 0), rgb(32, 32, 32)); +} +.OxThemeModern ::-webkit-scrollbar:active, +.OxThemeModern ::-webkit-scrollbar-thumb:active { + background: rgb(64, 64, 64); +} + +/* +================================================================================ +SyntaxHighlighter +================================================================================ +*/ + +.OxThemeModern .OxSyntaxHighlighter { + background-color: rgb(0, 0, 0); +} +.OxThemeModern .OxSyntaxHighlighter .OxLineNumbers { + background-color: rgb(32, 32, 32); + color: rgb(128, 128, 128); +} +.OxThemeModern .OxSyntaxHighlighter .OxComment { + color: rgb(128, 128, 128); + font-style: italic; +} +.OxThemeModern .OxSyntaxHighlighter .OxConstant { + color: rgb(255, 128, 128); + font-weight: bold; +} +.OxThemeModern .OxSyntaxHighlighter .OxIdentifier { + color: rgb(255, 255, 255); +} +.OxThemeModern .OxSyntaxHighlighter .OxKeyword { + color: rgb(128, 128, 255); + font-weight: bold; +} +.OxThemeModern .OxSyntaxHighlighter .OxLinebreak { + color: rgb(64, 64, 64); + font-weight: normal; + font-style: normal; +} +.OxThemeModern .OxSyntaxHighlighter .OxMethod { + color: rgb(128, 255, 255); +} +.OxThemeModern .OxSyntaxHighlighter .OxNumber { + color: rgb(255, 128, 128); +} +.OxThemeModern .OxSyntaxHighlighter .OxObject { + color: rgb(128, 255, 255); + font-weight: bold; +} +.OxThemeModern .OxSyntaxHighlighter .OxOperator { + color: rgb(128, 128, 255); +} +.OxThemeModern .OxSyntaxHighlighter .OxProperty { + color: rgb(128, 255, 128); + font-weight: bold; +} +.OxThemeModern .OxSyntaxHighlighter .OxRegexp { + color: rgb(255, 255, 128); +} +.OxThemeModern .OxSyntaxHighlighter .OxString { + color: rgb(128, 255, 128); +} +.OxThemeModern .OxSyntaxHighlighter .OxWhitespace { +} +.OxThemeModern .OxSyntaxHighlighter .OxWhitespace.OxTrailing { + background: rgb(255, 255, 255); +} + +/* +================================================================================ +Video +================================================================================ +*/ + +.OxThemeModern .OxAnnotation { + border-color: rgb(48, 48, 48); +} +.OxThemeModern .OxAnnotation.OxSelected { + background: rgb(48, 48, 48); +} + + +.OxThemeModern .OxSmallVideoTimeline .OxMarkerPlay { + border-color: rgba(0, 0, 0, 0.5); +} +.OxThemeModern .OxSmallVideoTimeline .OxMarkerPlay > div { + border-color: rgba(255, 255, 255, 1); +} +.OxThemeModern .OxSmallVideoTimeline .OxMarkerPlay.OxPaused > div { + border-color: rgba(255, 255, 255, 0.5); +} +.OxThemeModern .OxSmallVideoTimeline .OxMarkerPlay > div > div { + border-color: rgba(0, 0, 0, 0.5); +} + + +.OxThemeModern .OxVideoPlayer .OxButton.OxDisabled { + background: transparent; + opacity: 0.25; +} + +.OxThemeModern .OxVideoPlayer .OxControls.OxOnScreen { + background-image: -moz-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -o-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); +} +.OxThemeModern .OxVideoPlayer .OxFind { + background-image: -moz-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -o-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); +} +.OxThemeModern .OxVideoPlayer input.OxInput { + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5)); + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 1), rgba(32, 32, 32, 1)); +} +.OxThemeModern .OxVideoPlayer .OxResolution > div { + background: rgba(32, 32, 32, 0.5); +} +.OxThemeModern .OxVideoPlayer .OxResolution > div.OxSelected { + background-image: -moz-linear-gradient(top, rgba(48, 48, 48, 0.5), rgba(16, 16, 16, 0.5)); + background-image: -o-linear-gradient(top, rgba(48, 48, 48, 0.5), rgba(16, 16, 16, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(48, 48, 48, 0.5), rgba(16, 16, 16, 0.5)); +} +.OxThemeModern .OxVideoPlayer .OxVolume { + background-image: -moz-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -o-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); +} +.OxThemeModern .OxVideoPlayer .OxVolume .OxRange .OxTrack { + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5)); + background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(64, 64, 64, 0.5)); +} +.OxThemeModern .OxVideoPlayer .OxVolume .OxRange .OxThumb { + background-image: -moz-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -o-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); +} +.OxThemeModern .OxVideoPlayer .OxVolume .OxRange .OxThumb:active { + background-image: -moz-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -o-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); + background-image: -webkit-linear-gradient(top, rgba(64, 64, 64, 0.5), rgba(0, 0, 0, 0.5)); +} + + +// fixme: used? +.OxThemeModern .OxVideoPlayer .OxSelect { + border-color: transparent; + //margin-left: 0px; + //margin-right: -18px; + background: transparent; + //font-size: 9px; +} +.OxThemeModern .OxVideoPlayer .OxSelect.OxFocus { + -moz-box-shadow: 0 0 0; + -o-box-shadow: 0 0 0; + -webkit-box-shadow: 0 0 0; +} +.OxThemeModern .OxVideoPlayer .OxSelect div { + //padding: 0 0 0 2px; + //font-size: 9px; +} + +.OxThemeModern .OxVideoPlayer .OxSelect input { + //display: none; +} + + +/* +================================================================================ +Miscellaneous +================================================================================ +*/ + +.OxThemeModern .OxScreen { + background: rgb(32, 32, 32); + color: rgb(224, 224, 224); +} +.OxThemeModern .OxScreen .OxReflection { + background-image: -moz-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1)); + background-image: -o-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1)); + background-image: -webkit-linear-gradient(top, rgba(32, 32, 32, 0.75), rgba(32, 32, 32, 1), rgba(32, 32, 32, 1)); +} + + +.OxThemeModern .OxTooltip { + border: 1px solid rgba(128, 128, 128, 0.96); + background: rgba(0, 0, 0, 0.96); + color: rgba(128, 128, 128, 1); + -moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); + -o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); + -webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5); +} diff --git a/demos/doc2/index.html b/demos/doc2/index.html index 7e3b8b03..b25c9885 100644 --- a/demos/doc2/index.html +++ b/demos/doc2/index.html @@ -3,7 +3,7 @@