From f3568726c9723f64fd39527fafed0b4b276ec704 Mon Sep 17 00:00:00 2001
From: 124603ac <124603ac@maaaail.com>
Date: Tue, 10 Oct 2017 09:14:34 -0500
Subject: [PATCH] adding support for less styling

---
 addon/styles/ember-dialog.less            |   3 +
 addon/styles/ember-dialog/appearance.less | 104 ++++++++++++++++++++++
 addon/styles/ember-dialog/config.less     |   3 +
 addon/styles/ember-dialog/structure.less  |  50 +++++++++++
 4 files changed, 160 insertions(+)
 create mode 100644 addon/styles/ember-dialog.less
 create mode 100644 addon/styles/ember-dialog/appearance.less
 create mode 100644 addon/styles/ember-dialog/config.less
 create mode 100644 addon/styles/ember-dialog/structure.less

diff --git a/addon/styles/ember-dialog.less b/addon/styles/ember-dialog.less
new file mode 100644
index 0000000..eb3a3de
--- /dev/null
+++ b/addon/styles/ember-dialog.less
@@ -0,0 +1,3 @@
+@import "ember-dialog/config";
+@import "ember-dialog/structure";
+@import "ember-dialog/appearance";
diff --git a/addon/styles/ember-dialog/appearance.less b/addon/styles/ember-dialog/appearance.less
new file mode 100644
index 0000000..8369926
--- /dev/null
+++ b/addon/styles/ember-dialog/appearance.less
@@ -0,0 +1,104 @@
+.ember-dialog-dialog {
+  min-width: @dialog-min-width;
+  max-width: @dialog-max-width;
+
+  &.substrate {
+    background-image: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.1) 0, rgba(0, 0, 0, 0.3) 100%);
+
+    .dialog-content {
+      min-width: @dialog-min-width;
+      max-width: @dialog-max-width;
+    }
+  }
+
+  .dialog-content {
+    background-color: #fff;
+    border-radius: 6px;
+    -webkit-box-shadow: 0 0 0 9px rgba(255, 255, 255, 0.2);
+    box-shadow: 0 0 0 9px rgba(255, 255, 255, 0.2);
+    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+    font-size: 14px;
+
+    .dialog-header {
+      min-height: 15px;
+      padding: @dialog-padding;
+      .dialog-title {
+        font-weight: 900;
+      }
+      .dialog-close {
+        margin: 0;
+        padding: 0;
+        border: none;
+        outline: 0;
+        box-sizing: border-box;
+        text-decoration: none;
+        background-color: rgba(0, 0, 0, 0);
+        -webkit-appearance: none;
+        -webkit-border-radius: 0;
+        position: absolute;
+        right: 0;
+        top: 0;
+        z-index: 2;
+        height: 45px;
+        width: 45px;
+        cursor: pointer;
+      }
+      .dialog-close::after, .dialog-close::before {
+        position: absolute;
+        -webkit-transform: rotate(45deg);
+        transform: rotate(45deg);
+        background-color: #000;
+        content: '';
+      }
+      .dialog-close::before {
+        top: 20px;
+        left: 12px;
+        width: 21px;
+        height: 1px;
+      }
+      .dialog-close::after {
+        top: 10px;
+        left: 22px;
+        height: 21px;
+        width: 1px;
+      }
+    }
+    .dialog-body {
+      max-height: 400px;
+      overflow: auto;
+      padding: @dialog-padding;
+    }
+    .dialog-footer {
+      text-align: right;
+      padding: @dialog-padding;
+    }
+  }
+  .btn {
+    webkit-font-smoothing: antialiased;
+    moz-osx-font-smoothing: grayscale;
+    display: inline-block;
+    border: none;
+    border-radius: 3px;
+    box-shadow: inset 0 -1px 0 0 rgba(0,0,0,.2);
+    min-width: 89px;
+    max-width: 100%;
+    padding: 0 8px;
+    height: 34px;
+    cursor: pointer;
+    line-height: 34px;
+    text-align: center;
+    color: #fff;
+    transition: background-color .1s ease;
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+
+  .btn__accept {
+    background-color: #0E64CC;
+  }
+
+  .btn__decline {
+    background-color: #CCC;
+  }
+}
diff --git a/addon/styles/ember-dialog/config.less b/addon/styles/ember-dialog/config.less
new file mode 100644
index 0000000..103669c
--- /dev/null
+++ b/addon/styles/ember-dialog/config.less
@@ -0,0 +1,3 @@
+@dialog-padding: 10px;
+@dialog-min-width: 300px;
+@dialog-max-width: 500px;
diff --git a/addon/styles/ember-dialog/structure.less b/addon/styles/ember-dialog/structure.less
new file mode 100644
index 0000000..1cea418
--- /dev/null
+++ b/addon/styles/ember-dialog/structure.less
@@ -0,0 +1,50 @@
+.highest { z-index: 999999999!important; }
+
+.ember-dialog-dialog {
+  width: 75%;
+  left: 0;
+  right: 0;
+  position: absolute;
+  margin: auto;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+  -ms-transform: translateY(-50%);
+  transform: translateY(-50%);
+
+  &.substrate {
+    position: fixed;
+    width: 100%;
+    max-width: inherit;
+    height: 100%;
+    min-height: 100%;
+    margin: 0px;
+    padding-top: 10px;
+
+    .dialog-content {
+      width: 75%;
+      margin: auto;
+      top: 50%;
+      -webkit-transform: translateY(-50%);
+      -ms-transform: translateY(-50%);
+      transform: translateY(-50%);
+    }
+  }
+
+  .dialog-content {
+    position: relative;
+    -webkit-background-clip: padding-box;
+    background-clip: padding-box;
+    outline: 0;
+    width: 100%;
+    margin: 0;
+    top: 0;
+    -webkit-transform: none;
+    -ms-transform: none;
+    transform: none;
+    outline: 0;
+
+    .dialog-body {
+      position: relative;
+    }
+  }
+}