modal backdrop blur

This commit is contained in:
Yuri Kuznetsov
2022-07-22 13:37:29 +03:00
parent dfcb63c18a
commit c6fdff53c3
6 changed files with 11 additions and 10 deletions
+1 -2
View File
@@ -54,11 +54,10 @@
@default-heading-bg-color-value: #2c3546;
@modal-backdrop-bg-value: #060403;
@modal-backdrop-bg-value: fade(#060403, 45%);
@modal-header-bg-value: @body-bg-value;
@modal-footer-bg-value: @body-bg-value;
@modal-content-bg-value: @body-bg-value;
@modal-backdrop-opacity-value: 0.45;
@modal-box-shadow-value: none;
@modal-header-border-color-value: @modal-content-bg-value;
+3 -3
View File
@@ -18,11 +18,11 @@
}
.side-menu-backdrop {
background-color: @modal-backdrop-bg;
opacity: var(--modal-backdrop-opacity);
background-color: var(--modal-backdrop-bg);
backdrop-filter: var(--modal-backdrop-filter);
opacity: 1;
}
input.global-search-input {
border: 1px solid var(--navbar-bg);
}
+3 -1
View File
@@ -76,7 +76,9 @@
}
.modal-backdrop.in {
opacity: var(--modal-backdrop-opacity);
background-color: var(--modal-backdrop-bg);
backdrop-filter: var(--modal-backdrop-filter);
opacity: 1;
}
.modal-footer {
+1 -1
View File
@@ -204,11 +204,11 @@
--input-border-width: @input-border-width-value;
--modal-backdrop-bg: @modal-backdrop-bg-value;
--modal-backdrop-filter: @modal-backdrop-filter-value;
--modal-header-border-color: @modal-header-border-color-value;
--modal-header-bg: @modal-header-bg-value;
--modal-footer-bg: @modal-footer-bg-value;
--modal-content-bg: @modal-content-bg-value;
--modal-backdrop-opacity: @modal-backdrop-opacity-value;
--modal-box-shadow: @modal-box-shadow-value;
--text-color: @text-color-value;
+2 -2
View File
@@ -60,12 +60,12 @@
@input-box-shadow-value: inset 0 1px 1px rgb(0 0 0 / 4%);
@input-border-width-value: 1px;
@modal-backdrop-bg-value: #DBDBDB;
@modal-backdrop-bg-value: fade(#DBDBDB, 50%);
@modal-backdrop-filter-value: blur(3px);
@modal-header-border-color-value: #e5e5e5;
@modal-header-bg-value: @default-heading-bg-color-value;
@modal-footer-bg-value: @body-bg-value;
@modal-content-bg-value: @body-bg-value;
@modal-backdrop-opacity-value: 0.5;
@modal-box-shadow-value: 0 5px 15px rgb(0 0 0 / 50%);
@text-color-value: @gray-dark-value;
@@ -1,7 +1,6 @@
@body-bg-value: #f3f3f3;
@white-color-value: #FFF;
@panel-bg-value: @white-color-value;
@modal-backdrop-bg-value: #a3b3c7;
@navbar-inverse-bg-value: #546E7A;
@state-info-bg-value: #dbd0f5;
@@ -28,6 +27,7 @@
@site-footer-bg-value: @body-bg-value;
@modal-backdrop-bg-value: fade(#a3b3c7, 50%);
@modal-header-bg-value: @white-color-value;
@modal-footer-bg-value: @white-color-value;
@modal-content-bg-value: @white-color-value;