@silexlabs/silex 3.0.0-alpha.126 → 3.0.0-alpha.128

package/dist/client/css/admin.css

@@ -3863,10 +3863,16 @@ See http://bgrins.github.io/spectrum/themes/ for instructions.
   width: 100%;
 }
 
+.silex-hidden {
+  visibility: hidden;
+  position: absolute;
+  opacity: 0;
+}
+
 .settings-dialog > div {
   max-width: none;
   width: 100%;
-  max-height: 100vh;
+  height: 100vh;
   overflow: auto;
 }
 .settings-dialog > div form.silex-form {
@@ -3952,25 +3958,29 @@ input.silex-button[type=submit] {
   display: block;
 }
 
+.silex-sidebar-dialog,
 .silex-bar {
   display: flex;
 }
+.silex-sidebar-dialog > *,
 .silex-bar > * {
   margin: 5px;
 }
+.silex-sidebar-dialog main,
+.silex-bar main {
+  width: 100%;
+}
 
 ol.silex-list,
 ul.silex-list {
   list-style: none;
   margin: 0;
   padding: 0;
-  background-color: #575757;
 }
 ol.silex-list > li,
 ul.silex-list > li {
   padding: 5px;
   border-bottom: 1px solid #575757;
-  background-color: #444;
   margin: 5px;
 }
 ol.silex-list fieldset,
@@ -4003,6 +4013,26 @@ ul.silex-list .silex-list__item__footer button {
   padding-top: 8px;
 }
 
+ol.silex-list--menu > li,
+ul.silex-list--menu > li {
+  padding: 15px;
+  margin: 0;
+  border: 1px solid transparent;
+  border-bottom-color: #575757;
+  text-align: center;
+  cursor: pointer;
+}
+ol.silex-list--menu > li:first-child,
+ul.silex-list--menu > li:first-child {
+  border-top-color: #575757;
+}
+ol.silex-list--menu .active, ol.silex-list--menu > li:hover,
+ul.silex-list--menu .active,
+ul.silex-list--menu > li:hover {
+  color: #8873FE;
+  background-color: #292929;
+}
+
 form.silex-form {
   display: flex;
   flex-direction: column;
@@ -4059,17 +4089,17 @@ form.silex-form .silex-form__group.col2 {
 }
 
 .silex-main {
-  transition: opacity 0.35s 0.5s ease;
+  transition: opacity 0.15s 0.5s ease;
 }
 
 .silex-dialog {
-  transition: opacity 0.35s ease;
+  transition: opacity 0.15s ease;
 }
 
 .silex-dialog-hide {
   opacity: 0;
   visibility: hidden;
-  transition: opacity 0.35s ease, visibility 0.5s 1s ease;
+  transition: opacity 0.15s ease, visibility 0.3s 1s ease;
 }
 
 .silex-dialog-inline {
@@ -4077,20 +4107,25 @@ form.silex-form .silex-form__group.col2 {
   background-color: #333333;
   z-index: 10;
   border-radius: 3px;
-  border: 2px solid rgba(0, 0, 0, 0.25);
+  border: 2px solid #575757;
+  box-shadow: 0 0 10px 0 #575757;
   display: flex;
   flex-direction: column;
 }
 .silex-dialog-inline header {
   padding: 10px;
+  border-bottom: 1px solid #575757;
 }
 .silex-dialog-inline main {
   flex-grow: 1;
   padding: 10px;
+  max-height: 50vh;
+  overflow-y: auto;
 }
 .silex-dialog-inline footer {
   padding: 10px;
   text-align: right;
+  border-top: 1px solid #575757;
 }
 .silex-dialog-inline a {
   color: #A291FF;
@@ -4099,8 +4134,53 @@ form.silex-form .silex-form__group.col2 {
   margin: 0;
 }
 
+.silex-help {
+  margin: 10px 0;
+  padding: 10px;
+  border: 1px solid #575757;
+  border-radius: 3px;
+  background-color: #575757;
+  color: #ddd;
+  font-size: small;
+}
+.silex-help p {
+  margin: 0;
+}
+.silex-help a {
+  color: #A291FF;
+}
+
+.fonts-dialog .gjs-mdl-dialog {
+  width: 100%;
+  max-width: unset;
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+.fonts-dialog .gjs-mdl-content {
+  flex: 1 1 auto;
+}
+.fonts-dialog .silex-form__element {
+  margin-bottom: 80px;
+}
+.fonts-dialog .silex-list li {
+  border-bottom: none;
+}
+.fonts-dialog h2 {
+  border-radius: 0;
+  background-color: transparent;
+}
+.fonts-dialog footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 20px !important;
+  background-color: #333333;
+}
+
 iframe.enable-squeeze.gjs-frame {
-  transition: width 0.35s, height 0.35s, left 0.35s;
+  transition: width 0.15s, height 0.15s, left 0.15s;
 }
 
 iframe.enable-squeeze.silex-squeeze-left {
@@ -4469,6 +4549,16 @@ iframe.enable-squeeze.silex-squeeze-left {
   font-size: 0.75rem;
 }
 
+.gjs-mdl-header {
+  background-color: #333333;
+  color: #ddd;
+  padding: 20px;
+  border-bottom: 1px solid #575757;
+}
+.gjs-mdl-header .gjs-mdl-btn-close {
+  top: 15px;
+}
+
 .gjs-toolbar {
   background-color: #8873FE;
 }