mirror of
https://github.com/gilbN/theme.park.git
synced 2024-09-11 19:32:24 +02:00
861 lines
19 KiB
CSS
861 lines
19 KiB
CSS
/* Set the Organizr theme to either Aquamarine or Hotline */
|
|
/* Import the glass-base.css and root variables in the Custom Theme CSS box like below */
|
|
/*
|
|
@import "/css/addons/organizr/glass/organizr-base-old.css"
|
|
@import "/css/addons/organizr/glass/glass-base.css";
|
|
:root {
|
|
--main-bg-color: url(https://domain.com/your/hosted/wallpaper.jpg) center center/cover no-repeat fixed;
|
|
--mobile-bg-color: radial-gradient(circle, #3a3a3a, #2d2d2d, #202020, #141414, #000000) center center/cover no-repeat fixed;
|
|
|
|
--link-color: #fff;
|
|
--custom-buttons-color: radial-gradient(ellipse at center, #3F51B5 0%, #009688 100%) center center/cover no-repeat fixed;
|
|
--hompage-item-hover: radial-gradient(ellipse at center, rgba(0, 150, 136, 0.33) 0%, #b53f3f73 100%) center center/cover no-repeat fixed;
|
|
--notification-box-line: #000;
|
|
|
|
--div-background-color-10: rgba(0, 0, 0, 0.15);
|
|
--div-background-color-15: rgba(0, 0, 0, 0.25);
|
|
--div-background-color-25: rgba(0, 0, 0, 0.35);
|
|
--div-background-color-35: rgba(0, 0, 0, 0.45);
|
|
}
|
|
|
|
*/
|
|
|
|
/* Replace the variables if you have a dark background */
|
|
/* Light colors for dark backgrounds */
|
|
/*
|
|
--div-background-color-10: rgba(255, 255, 255, 0.1);
|
|
--div-background-color-15: rgba(255, 255, 255, 0.15);
|
|
--div-background-color-25: rgba(255, 255, 255, 0.25);
|
|
--div-background-color-35: rgba(255, 255, 255, 0.35);
|
|
*/
|
|
/* Dark blur colors for bright backgrounds */
|
|
/*
|
|
--div-background-color-10: rgba(0, 0, 0, 0.15);
|
|
--div-background-color-15: rgba(0, 0, 0, 0.25);
|
|
--div-background-color-25: rgba(0, 0, 0, 0.35);
|
|
--div-background-color-35: rgba(0, 0, 0, 0.45);
|
|
|
|
*/
|
|
|
|
/*Settings */
|
|
|
|
.feeds li>div i {
|
|
color: black !important;
|
|
}
|
|
|
|
.row-in i {
|
|
font-size: 24px;
|
|
color: black;
|
|
}
|
|
|
|
.profile-social-icons a {
|
|
color: #eee;
|
|
}
|
|
|
|
.btn-info.btn-outline {
|
|
color: #eee !important;
|
|
}
|
|
|
|
.btn-info.btn-outline:hover {
|
|
background: var(--div-background-color-15);
|
|
color: #fff;
|
|
}
|
|
|
|
.content-wrap {
|
|
background: var(--div-background-color-15) !important;
|
|
border-radius: 0 0 15px 15px;
|
|
}
|
|
|
|
.content-wrap section.content-current {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: rgba(0, 0, 0, 0);
|
|
border-radius: 0 0 15px 15px;
|
|
}
|
|
|
|
.panel-blue .panel-heading,
|
|
.panel-info .panel-heading {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: transparent;
|
|
|
|
}
|
|
|
|
.panel .table {
|
|
background: transparent !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.sttabs nav ul {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 15px 15px 0 0;
|
|
|
|
}
|
|
|
|
.sttabs nav {
|
|
background: var(--div-background-color-25);
|
|
border-radius: 15px 15px 0 0;
|
|
}
|
|
|
|
#settings-main-system-settings-anchor>.sttabs nav ul li {
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.tab-content>.active {
|
|
background: transparent;
|
|
}
|
|
|
|
.bg-title {
|
|
background: var(--div-background-color-10);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.white-box {
|
|
background: transparent;
|
|
}
|
|
|
|
.white-popup-block {
|
|
background: var(--div-background-color-10) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
}
|
|
|
|
.user-bg {
|
|
border-top-left-radius: 15px;
|
|
border-top-right-radius: 15px;
|
|
}
|
|
|
|
#internal-Settings .nav-tabs>li.active>a,
|
|
.nav-tabs>li.active>a:hover {
|
|
padding-top: 10px;
|
|
}
|
|
|
|
/* Nav bar
|
|
.navbar-header {
|
|
background: transparent !important;
|
|
}
|
|
*/
|
|
@media (min-width: 768px) {
|
|
.navbar-static-top {
|
|
background: var(--main-bg) !important;
|
|
}
|
|
}
|
|
|
|
/* Dropdown */
|
|
.dropdown-menu {
|
|
background: var(--div-background-color-25);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.open>.dropdown-menu {
|
|
display: block;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.navbar-top-links .dropdown-user {
|
|
border-radius: 15px;
|
|
}
|
|
|
|
#plexRecent .recent-filter {
|
|
background: var(--div-background-color-25) !important;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
/* Side bar */
|
|
.sidebar {
|
|
background: var(--div-background-color-15) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
box-shadow: none;
|
|
|
|
}
|
|
|
|
.sidebar-head {
|
|
background: transparent !important;
|
|
}
|
|
|
|
/*Calendar */
|
|
.fc-toolbar {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-15) !important;
|
|
|
|
}
|
|
|
|
.fc-view {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-15) !important;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
.fc-popover {
|
|
background: var(--div-background-color-25);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
#homepageOrdercalendar .fc-toolbar {
|
|
border-top-left-radius: 15px;
|
|
border-top-right-radius: 15px;
|
|
|
|
}
|
|
|
|
.fc-row,
|
|
.fc-unthemed {
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
/* Calendar mobile*/
|
|
.fc th.fc-widget-header {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
/*Error page */
|
|
.error-body {
|
|
padding-top: 15%;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
height: -webkit-fill-available;
|
|
margin-top: -10%;
|
|
|
|
}
|
|
|
|
|
|
/* notify - popup */
|
|
.iziToast.update-notify.iziToast-layout2,
|
|
.iziToast.success-notify.iziToast-layout2 {
|
|
border: none;
|
|
background: var(--div-background-color-25) !important;
|
|
border-bottom: transparent;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.iziToast.warning-notify.iziToast-layout2 {
|
|
background: var(--div-background-color-25);
|
|
border: 1px solid transparent;
|
|
border-bottom: transparent;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.iziToast:after {
|
|
background: transparent !important;
|
|
}
|
|
|
|
.mfp-container {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.mfp-zoom-out.mfp-ready.mfp-bg {
|
|
opacity: 1 !important;
|
|
background: var(--main-bg-color) !important;
|
|
}
|
|
|
|
.mfp-wrap {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
.main-email-panel .panel-body {
|
|
background: var(--div-background-color-25) !important;
|
|
border-bottom-right-radius: 15px !important;
|
|
border-bottom-left-radius: 15px !important;
|
|
}
|
|
|
|
.white-popup-block {
|
|
background: var(--div-background-color-25) !important;
|
|
}
|
|
|
|
.white-popup .panel-footer {
|
|
background: var(--div-background-color-25);
|
|
border-top: 1px solid #fff;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
.panel>.table-responsive:last-child>.table:last-child,
|
|
.panel>.table:last-child {
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
/* Homepage downloader */
|
|
|
|
#homepageOrderdownloader {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-15);
|
|
padding: 10px;
|
|
border-radius: 15px;
|
|
|
|
}
|
|
|
|
#homepageOrderdownloader .nav-tabs>li.active>a,
|
|
.nav-tabs>li.active>a:hover {
|
|
padding-top: 14px;
|
|
}
|
|
|
|
#homepageOrderdownloader .nav-tabs>li>a {
|
|
padding-top: 14px;
|
|
}
|
|
|
|
/* Homepage card */
|
|
.nowPlayingItem>.white-box>.el-card-item {
|
|
background: var(--div-background-color-15) !important;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 15px;
|
|
|
|
}
|
|
|
|
.active-tab-Homepage .white-popup .panel-body,
|
|
.white-popup>.col-md-6>.white-box:nth-child(2) {
|
|
background: var(--div-background-color-25) !important;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
#plexStreams .el-element-overlay .el-card-item .el-overlay-1 img,
|
|
#plexStreams .el-element-overlay:hover .el-card-item:hover .el-overlay-1:hover img:hover {
|
|
border-top-right-radius: 15px;
|
|
border-top-left-radius: 15px;
|
|
}
|
|
|
|
.el-element-overlay .el-card-item .el-overlay-1 {
|
|
border-top-right-radius: 15px;
|
|
border-top-left-radius: 15px;
|
|
}
|
|
|
|
.el-element-overlay .el-card-item .el-overlay {
|
|
border-top-right-radius: 15px;
|
|
border-top-left-radius: 15px;
|
|
}
|
|
|
|
.white-popup .panel-heading,
|
|
.white-popup>.col-md-6>.white-box:first-child {
|
|
background: var(--div-background-color-25) !important;
|
|
border-top-right-radius: 15px;
|
|
border-top-left-radius: 15px;
|
|
}
|
|
|
|
|
|
.label-info {
|
|
background: var(--div-background-color-25);
|
|
}
|
|
|
|
#plexRecent,
|
|
#homepageOrderplexplaylist,
|
|
#homepageOrdercalendar,
|
|
#homepageOrderembyrecent,
|
|
#ombi-requests,
|
|
#homepageOrderdeluge,
|
|
#homepageOrdernzbget,
|
|
#homepageOrdertransmission,
|
|
#homepageOrderrTorrent,
|
|
#homepageOrderjdownloader,
|
|
#homepageOrdersabnzbd,
|
|
#homepageOrderqBittorrent {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-15);
|
|
margin: 5px;
|
|
border-radius: 15px;
|
|
|
|
}
|
|
|
|
.bg-info {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/* Health checks */
|
|
.card-body {
|
|
background: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
|
|
.bg-inverse .healthPosition {
|
|
background: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: saturate(180%) blur(30px);
|
|
backdrop-filter: saturate(180%) blur(30px);
|
|
|
|
}
|
|
|
|
/* Unifi cards */
|
|
.unifiCards .panel-wrapper.collapse.in {
|
|
background: var(--div-background-color-15);
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
|
|
}
|
|
|
|
.unifiCards .panel-heading {
|
|
background: var(--div-background-color-35) !important;
|
|
color: #fff !important;
|
|
border-color: transparent !important;
|
|
text-align: inherit !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-top-left-radius: 15px;
|
|
border-top-right-radius: 15px;
|
|
border-bottom: 0px;
|
|
}
|
|
|
|
.unifiCards .panel-warning .panel-heading,
|
|
.unifiCards .panel-success .panel-heading {
|
|
border-top-left-radius: 15px;
|
|
border-top-right-radius: 15px;
|
|
border-bottom-right-radius: 0px;
|
|
border-bottom-left-radius: 0px;
|
|
}
|
|
|
|
#allUnifi .unifiCards .panel .panel-warning {
|
|
border-radius: 15px !important;
|
|
|
|
}
|
|
|
|
.unifiCards .ti-close:before {
|
|
content: "\f111";
|
|
font-family: FontAwesome;
|
|
font-size: 20px;
|
|
color: rgba(255, 69, 58, 1);
|
|
}
|
|
|
|
.unifiCards .ti-minus:before {
|
|
content: "\f111";
|
|
font-family: FontAwesome;
|
|
font-size: 20px;
|
|
color: rgba(255, 204, 0, 1);
|
|
}
|
|
|
|
.unifiCards .ti-plus:before {
|
|
content: "\f111";
|
|
font-family: FontAwesome;
|
|
font-size: 20px;
|
|
color: rgba(40, 205, 65, 1);
|
|
}
|
|
|
|
/* Weather boxes */
|
|
#homepageOrderWeatherAndAir .col-lg-2 .white-box,
|
|
#homepageOrderWeatherAndAir>div:nth-child(1)>div.col-lg-4.col-sm-12.col-xs-12>div,
|
|
#homepageOrderWeatherAndAir>div:nth-child(2)>div.col-lg-4.col-sm-12.col-xs-12>div {
|
|
background: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px)
|
|
}
|
|
|
|
/* Custom HTML */
|
|
#homepageOrdercustomhtmlTwo,
|
|
#homepageOrdercustomhtml {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-15);
|
|
border-radius: 15px;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
margin-bottom: 5px;
|
|
}
|
|
|
|
/* Invite */
|
|
#invite-area .bg-org {
|
|
background: var(--div-background-color-15) !important;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
#new-invite-area .white-popup .panel-body,
|
|
#new-invite-area .white-popup>.col-md-6>.white-box:nth-child(2) {
|
|
background: var(--div-background-color-15) !important;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
.white-popup .panel-body,
|
|
.white-popup>.col-md-6>.white-box:nth-child(2) {
|
|
background: var(--div-background-color-15) !important;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
-webkit-backdrop-filter: blur(10px) !important;
|
|
backdrop-filter: blur(10px) !important;
|
|
}
|
|
|
|
/* Email users */
|
|
.email-div .panel-body {
|
|
border-radius: 0px !important;
|
|
}
|
|
|
|
/* Speedtest popup */
|
|
|
|
#speedtest-area .white-popup .panel-footer {
|
|
background: var(--div-background-color-25) !important;
|
|
border-bottom-right-radius: 15px;
|
|
border-bottom-left-radius: 15px;
|
|
}
|
|
|
|
#speedtest-area .white-popup .panel-body,
|
|
#speedtest-area .white-popup>.col-md-6>.white-box:nth-child(2) {
|
|
border-bottom-right-radius: 0px !important;
|
|
border-bottom-left-radius: 0px !important;
|
|
}
|
|
|
|
/* Modal */
|
|
.modal-content,
|
|
.modal-header,
|
|
.modal-footer,
|
|
.modal-body {
|
|
background: var(--div-background-color-10) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-color: transparent;
|
|
}
|
|
|
|
.modal-body {
|
|
border-bottom-left-radius: 15px;
|
|
border-bottom-right-radius: 15px;
|
|
}
|
|
|
|
.modal-header {
|
|
border-top-left-radius: 15px;
|
|
border-top-right-radius: 15px;
|
|
}
|
|
|
|
.modal-open .modal {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
.modal-content {
|
|
border-radius: 15px;
|
|
box-shadow: none;
|
|
}
|
|
|
|
/* loginpage sidemenu */
|
|
@media (max-width: 480px) {
|
|
#wrapper .login-register>.login-box>.white-box {
|
|
background: transparent !important;
|
|
margin-top: auto !important;
|
|
width: 100% !important;
|
|
-webkit-backdrop-filter: blur(0px) !important;
|
|
backdrop-filter: blur(0px) !important;
|
|
|
|
|
|
}
|
|
}
|
|
|
|
@media (max-width: 480px) {
|
|
.login-box.login-sidebar {
|
|
background: var(--div-background-color-15) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
|
|
}
|
|
}
|
|
|
|
/* logo */
|
|
.white-box .visible-xs {
|
|
display: block !important;
|
|
}
|
|
|
|
.loginLogo {
|
|
border: 0;
|
|
margin-top: -60%;
|
|
transform: translateY(-10%);
|
|
}
|
|
|
|
@media (max-width: 480px) {
|
|
.loginLogo {
|
|
margin-top: -10% !important;
|
|
}
|
|
}
|
|
|
|
.blockUI {
|
|
opacity: 1 !important;
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
.blockMsg {
|
|
background: rgba(0, 0, 0, 0.9) !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.login-register>.login-box>.white-box {
|
|
background: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 15px;
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
}
|
|
|
|
|
|
.login-register {
|
|
|
|
height: 100%;
|
|
position: fixed;
|
|
}
|
|
|
|
.slideInRight {
|
|
-webkit-animation-name: none;
|
|
animation-name: none;
|
|
}
|
|
|
|
.login-register .login-box .white-box .bg-org {
|
|
background-color: transparent !important;
|
|
}
|
|
|
|
/*2FA login button*/
|
|
.panel-wrapper .panel-body>.btn-warning,
|
|
.btn-warning.disabled {
|
|
background: var(--div-background-color-15) !important;
|
|
border: 1px solid #ffc36d00 !important;
|
|
}
|
|
|
|
/*2FA animation header*/
|
|
.panel-warning .panel-heading,
|
|
.panel-yellow .panel-heading {
|
|
color: #fff;
|
|
border-radius: 3px;
|
|
background-color: rgba(0, 0, 0, 0.3);
|
|
border-color: #00000000;
|
|
}
|
|
|
|
/*oAuth Successful*/
|
|
.panel-green .panel-heading,
|
|
.panel-success .panel-heading {
|
|
color: #53e69d;
|
|
text-align: center;
|
|
text-transform: uppercase;
|
|
border-radius: 3px;
|
|
background-color: transparent;
|
|
border-color: transparent;
|
|
}
|
|
|
|
/*Login sidebar*/
|
|
.login-box.login-sidebar,
|
|
#login-panels .panel-body,
|
|
#login-panels .panel {
|
|
background: transparent;
|
|
}
|
|
|
|
#login-panels .form-control,
|
|
#login-panels .btn {
|
|
background: rgba(255, 255, 255, 0.35);
|
|
color: white;
|
|
border-radius: 25px;
|
|
border: none;
|
|
}
|
|
|
|
/* #login-panels {
|
|
height: 44px;
|
|
}*/
|
|
#login-panles .btn-info.disabled.focus .btn-info.disabled:focus .btn-info.disabled:hover .btn-info.focus .btn-info:focus .btn-info:hover .btn:hover {
|
|
background: rgba(255, 255, 255, 0.65);
|
|
border: none;
|
|
|
|
}
|
|
|
|
/*Center login Box*/
|
|
.login-sidebar {
|
|
position: relative;
|
|
right: initial;
|
|
}
|
|
|
|
#lockScreen .white-box {
|
|
width: 400px;
|
|
height: 345px;
|
|
}
|
|
|
|
.login-sidebar .white-box {
|
|
width: 100%;
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
#lockScreen .white-box {
|
|
position: absolute;
|
|
top: 50%;
|
|
transform: translateY(-50%);
|
|
background: var(--div-background-color-25);
|
|
-webkit-box-shadow: none;
|
|
box-shadow: none;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.form-control::placeholder {
|
|
color: white;
|
|
}
|
|
|
|
#login-username-Input,
|
|
#login-password-Input {
|
|
text-align: center;
|
|
}
|
|
|
|
.panel .panel-heading .panel-title,
|
|
label,
|
|
span,
|
|
.fa-lock:before {
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* Lock screen */
|
|
#lockScreen .form-material .form-control,
|
|
.form-material .form-control:focus {
|
|
background: rgba(255, 255, 255, 0.35);
|
|
border-radius: 25px;
|
|
padding: inherit;
|
|
text-align: center;
|
|
}
|
|
|
|
#lockScreen .btn-info {
|
|
background: rgba(255, 255, 255, 0.35);
|
|
border-radius: 25px;
|
|
}
|
|
|
|
/* Extra */
|
|
.cbutton {
|
|
background-color: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
border-radius: 15px !important;
|
|
border: none !important;
|
|
padding: 4px !important;
|
|
|
|
}
|
|
|
|
.cbutton:hover {
|
|
background: var(--div-background-color-25) !important;
|
|
-webkit-backdrop-filter: saturate(180%) blur(30px) !important;
|
|
backdrop-filter: saturate(180%) blur(30px) !important;
|
|
opacity: 1 !important;
|
|
|
|
}
|
|
|
|
/* Debug modal */
|
|
.mdi-package-variant-closed:before {
|
|
content: "\F3D7";
|
|
color: black;
|
|
}
|
|
|
|
.mdi-receipt:before {
|
|
content: "\F449";
|
|
color: black;
|
|
}
|
|
|
|
.debugModal .modal-body {
|
|
border-bottom-left-radius: 0px !important;
|
|
border-bottom-right-radius: 0px !important;
|
|
}
|
|
|
|
.debugModal .modal-footer {
|
|
background: var(--div-background-color-10) !important;
|
|
border-bottom-left-radius: 15px !important;
|
|
border-bottom-right-radius: 15px !important;
|
|
}
|
|
|
|
#debugPreInfo .slimScrollDiv,
|
|
#debugResults .slimScrollDiv {
|
|
background: var(--div-background-color-15);
|
|
}
|
|
|
|
/* Swal popup */
|
|
.swal-overlay--show-modal .swal-modal {
|
|
-webkit-backdrop-filter: blur(10px);
|
|
backdrop-filter: blur(10px);
|
|
background: var(--div-background-color-25);
|
|
border-radius: 15px;
|
|
}
|
|
|
|
.swal-title {
|
|
color: white;
|
|
}
|
|
|
|
.swal-overlay--show-modal {
|
|
background: var(--main-bg-color);
|
|
}
|
|
|
|
/* Mobile*/
|
|
@media (max-width: 480px) {
|
|
* {
|
|
-webkit-backdrop-filter: none !important;
|
|
backdrop-filter: none !important;
|
|
}
|
|
|
|
#page-wrapper {
|
|
background: var(--mobile-bg-color) !important;
|
|
background-size: cover;
|
|
background-repeat: no-repeat;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
#side-menu {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
.navbar-header {
|
|
background: var(--div-background-color-25) !important;
|
|
}
|
|
|
|
.navbar-default,
|
|
.show-sidebar .sidebar .sidebar-head {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
.dropdown-menu {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
#internal-Settings {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
.mfp-zoom-out.mfp-ready.mfp-bg {
|
|
opacity: 1 !important;
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
.mfp-wrap {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
.modal-open .modal {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
#page-wrapper {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
#internal-Settings,
|
|
#preloader,
|
|
.preloader,
|
|
.active-tab-Settings,
|
|
.error-page {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
|
|
html {
|
|
background: var(--mobile-bg-color) !important;
|
|
}
|
|
} |