diff --git a/resources/www/admin/styles/main.scss b/resources/www/admin/styles/main.scss
index cde6eec71f..1ee2799b96 100644
--- a/resources/www/admin/styles/main.scss
+++ b/resources/www/admin/styles/main.scss
@@ -232,12 +232,83 @@ div.switch_right.unchecked {
z-index: 1500;
}
-#template_add_dialog.ui-dialog-content {
- margin-bottom: 0;
- margin-top: 8px;
+.dialog_container {
+ #template_add_dialog, #user_add_dialog, #dialog-form {
+ &.ui-dialog-content {
+ margin-bottom: 0;
+ margin-top: 8px;
+ }
+ form {
+ margin-bottom: 10px;
+ }
+ label {
+ font-family: Roboto;
+ font-size: 14px;
+ font-weight: normal;
+ font-style: normal;
+ font-stretch: normal;
+ line-height: normal;
+ letter-spacing: normal;
+ color: #1d1d1d;
+ }
+ input[type=text] {
+ width: 94%;
+ background-color: #ffffff;
+ border: solid 1px #979797;
+ }
+ }
}
-.template_add_dialog_container {
+.dialog_container {
+ #dialog-form {
+ .selectdiv {
+ position: relative;
+ }
+ select::-ms-expand {
+ display: none;
+ }
+ .selectdiv:after {
+ content: "";
+ /* background-color: #000; */
+ background-image: url(/assets/common/images/icons/arrow.png);
+ background-position: center;
+ background-size: cover;
+ right: 18px;
+ top: 9px;
+ position: absolute;
+ width: 8px;
+ height: 12px;
+ pointer-events: none;
+ }
+ .selectdiv select {
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ display: block;
+ width: 98%;
+ height: 30px;
+ margin: 5px 0px;
+ padding: 0px 8px;
+ line-height: 1.75;
+ -ms-word-break: normal;
+ word-break: normal;
+ border: solid 1px #979797;
+ background-image: linear-gradient(16deg, transparent 50%, transparent 50%),
+ linear-gradient(135deg, transparent, transparent), linear-gradient(to right, #979797, #979797);
+ background-position: calc(100% - 3px) calc(1em + 2px), calc(100% - 4px) calc(1em + 2px), 100% 0;
+ background-size: 5px 5px, 5px 5px, 30px 2.5em;
+ background-repeat: no-repeat;
+ margin-bottom: 20px;
+ }
+ input[type=text] {
+ margin-bottom: 20px;
+ }
+ }
+}
+
+.dialog_container {
.ui-dialog-title {
font-family: Roboto;
font-size: 18px;
@@ -253,8 +324,12 @@ div.switch_right.unchecked {
margin-right: 4px;
}
.ui-icon.ui-icon-closethick {
- background-image: url("/assets/common/images/icons/button-close-gray.png");
+ background-image: url("/assets/common/images/icons/cross-white.png");
background-position: center;
+ background-size: cover;
+ }
+ .ui-dialog-buttonpane {
+ border-top: solid 1px #979797;
}
.ui-dialog-buttonpane .ui-button {
border-radius: 15px;
@@ -272,30 +347,20 @@ div.switch_right.unchecked {
min-width: 135px;
padding-left: 20px;
padding-right: 20px;
+ margin-left: 10px;
+ margin-right: 10px;
}
.ui-dialog-buttonpane .ui-button:nth-child(2) {
background-color: #4a4a4a;
color: #FFFFFF;
}
- #template_add_dialog {
- form {
- margin-bottom: 10px;
- }
- label: {
- font-family: Roboto;
- font-size: 14px;
- font-weight: normal;
- font-style: normal;
- font-stretch: normal;
- line-height: normal;
- letter-spacing: normal;
- color: #1d1d1d;
- }
- #template-add-input {
- width: 94%;
- background-color: #ffffff;
- border: solid 1px #979797;
- }
+ .ui-button-icon-only {
+ text-indent: -9999px;
+ background: transparent;
+ }
+ .ui-dialog-buttonpane .ui-dialog-buttonset {
+ float: none;
+ text-align: center;
}
}
diff --git a/resources/www/common/images/icons/arrow.png b/resources/www/common/images/icons/arrow.png
new file mode 100644
index 0000000000..b2c1574217
Binary files /dev/null and b/resources/www/common/images/icons/arrow.png differ
diff --git a/resources/www/common/images/icons/cross-white.png b/resources/www/common/images/icons/cross-white.png
new file mode 100644
index 0000000000..9804aa4409
Binary files /dev/null and b/resources/www/common/images/icons/cross-white.png differ
diff --git a/templates/web/admin/subdefs.html.twig b/templates/web/admin/subdefs.html.twig
index fe26b7645c..d96e1be51f 100644
--- a/templates/web/admin/subdefs.html.twig
+++ b/templates/web/admin/subdefs.html.twig
@@ -244,12 +244,14 @@
}
- $("#dialog-form").dialog({
+ var subdefCreateDialog = $("#dialog-form").dialog({
autoOpen: false,
- height: 420,
- width: 300,
+ width: 382,
modal: true,
buttons: {
+ Cancel: function () {
+ $(this).dialog("close");
+ },
"Create a Subdef": function () {
var bValid = true;
@@ -268,9 +270,6 @@
$(this).dialog("close");
$('form.subdefs').submit();
}
- },
- Cancel: function () {
- $(this).dialog("close");
}
},
close: function () {
@@ -278,6 +277,8 @@
}
});
+ subdefCreateDialog.closest('.ui-dialog').addClass('dialog_container');
+
$("#create-subdef")
// .button()
.click(function () {
@@ -335,28 +336,37 @@
-
+