From 305a06b1e702ea262402391c80dfd72466581f86 Mon Sep 17 00:00:00 2001 From: "John Molakvoæ (skjnldsv)" Date: Tue, 3 Oct 2017 05:48:23 +0200 Subject: Jquery ocdialogs to scss and variables implementation MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: John Molakvoæ (skjnldsv) --- core/css/jquery.ocdialog.css | 79 ------------------------------------------ core/css/jquery.ocdialog.scss | 80 +++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 80 insertions(+), 79 deletions(-) delete mode 100644 core/css/jquery.ocdialog.css create mode 100644 core/css/jquery.ocdialog.scss diff --git a/core/css/jquery.ocdialog.css b/core/css/jquery.ocdialog.css deleted file mode 100644 index 2100a3db7a6..00000000000 --- a/core/css/jquery.ocdialog.css +++ /dev/null @@ -1,79 +0,0 @@ -.oc-dialog { - background: #fff; - color: #333; - border-radius: 3px; box-shadow: 0 0 7px #888; - padding: 15px; - z-index: 10000; - font-size: 100%; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - min-width: 200px; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - max-height: calc(100% - 20px); - max-width: calc(100% - 20px); - overflow: auto; -} -.oc-dialog-title { - background: #fff; - margin-left: 12px; -} -.oc-dialog-buttonrow { - position: relative; - display: block; - background: transparent; - right: 0; - bottom: 0; - padding: 10px; - padding-bottom: 0; - box-sizing: border-box; - width: 100%; - background-image: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 1)); - border-bottom-left-radius: 3px; - border-bottom-right-radius: 3px; -} -/* align primary button to right, other buttons to left */ -.oc-dialog-buttonrow.twobuttons button:nth-child(1) { - float: left; -} -.oc-dialog-buttonrow.twobuttons.aside button:nth-child(1) { - float: none; -} -.oc-dialog-buttonrow.twobuttons button:nth-child(2) { - float: right; -} - -.oc-dialog-buttonrow.onebutton button { - float: right; -} -.oc-dialog-buttonrow:after { - visibility: hidden; - display: block; - font-size: 0; - content: " "; - clear: both; - height: 0; -} - -.oc-dialog-close { - position: absolute; - top: 0; - right: 0; - padding: 25px; - background: url('../img/actions/close.svg') no-repeat center; -} - -.oc-dialog-dim { - background-color: #000; - opacity: .20; - z-index: 999; - position: fixed; - top: 0; left: 0; - width: 100%; height: 100%; -} - -.oc-dialog-content { - width: 100%; -} diff --git a/core/css/jquery.ocdialog.scss b/core/css/jquery.ocdialog.scss new file mode 100644 index 00000000000..efb2cc2f2e3 --- /dev/null +++ b/core/css/jquery.ocdialog.scss @@ -0,0 +1,80 @@ +.oc-dialog { + background: $color-main-background; + color: nc-darken($color-main-text, 20%); + border-radius: 3px; + box-shadow: 0 0 7px $color-box-shadow; + padding: 15px; + z-index: 10000; + font-size: 100%; + -webkit-box-sizing: border-box; + -moz-box-sizing: border-box; + box-sizing: border-box; + min-width: 200px; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + max-height: calc(100% - 20px); + max-width: calc(100% - 20px); + overflow: auto; +} +.oc-dialog-title { + background: $color-main-background; + margin-left: 12px; +} +.oc-dialog-buttonrow { + position: relative; + display: block; + background: transparent; + right: 0; + bottom: 0; + padding: 10px; + padding-bottom: 0; + box-sizing: border-box; + width: 100%; + background-image: linear-gradient(transparent, $color-main-background); + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} +/* align primary button to right, other buttons to left */ +.oc-dialog-buttonrow.twobuttons button:nth-child(1) { + float: left; +} +.oc-dialog-buttonrow.twobuttons.aside button:nth-child(1) { + float: none; +} +.oc-dialog-buttonrow.twobuttons button:nth-child(2) { + float: right; +} + +.oc-dialog-buttonrow.onebutton button { + float: right; +} +.oc-dialog-buttonrow:after { + visibility: hidden; + display: block; + font-size: 0; + content: " "; + clear: both; + height: 0; +} + +.oc-dialog-close { + position: absolute; + top: 0; + right: 0; + padding: 25px; + background: url('../img/actions/close.svg') no-repeat center; +} + +.oc-dialog-dim { + background-color: #000; + opacity: .20; + z-index: 999; + position: fixed; + top: 0; left: 0; + width: 100%; height: 100%; +} + +.oc-dialog-content { + width: 100%; +} -- cgit v1.2.3