formatting

CSS/addons/organizr/glass/glass-base.css

@@ -41,67 +41,83 @@
 .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 {
+
+.btn-info.btn-outline {
     color: #eee !important;
 }
- .btn-info.btn-outline:hover {
+
+.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 {
+
+.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{
+
+#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);
@@ -113,19 +129,22 @@
     border-top-right-radius: 15px;
 }
 
-#internal-Settings .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover {
+#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 {
+    .navbar-static-top {
         background: var(--main-bg) !important;
+    }
 }
-}
+
 /* Dropdown */
 .dropdown-menu {
     background: var(--div-background-color-25);
@@ -133,17 +152,21 @@
     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;
@@ -152,17 +175,19 @@
     box-shadow: none;
 
 }
+
 .sidebar-head {
     background: transparent !important;
 }
 
 /*Calendar */
- .fc-toolbar {
+.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);
@@ -170,25 +195,31 @@
     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 {
+
+.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%;
@@ -201,7 +232,8 @@
 
 
 /* notify - popup */
-.iziToast.update-notify.iziToast-layout2, .iziToast.success-notify.iziToast-layout2 {
+.iziToast.update-notify.iziToast-layout2,
+.iziToast.success-notify.iziToast-layout2 {
     border: none;
     background: var(--div-background-color-25) !important;
     border-bottom: transparent;
@@ -209,6 +241,7 @@
     backdrop-filter: blur(10px);
 
 }
+
 .iziToast.warning-notify.iziToast-layout2 {
     background: var(--div-background-color-25);
     border: 1px solid transparent;
@@ -217,39 +250,49 @@
     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 {
+
+.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 {
@@ -260,15 +303,18 @@
     border-radius: 15px;
 
 }
-#homepageOrderdownloader .nav-tabs>li.active>a, .nav-tabs>li.active>a:hover {
+
+#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 {
+.nowPlayingItem>.white-box>.el-card-item {
     background: var(--div-background-color-15) !important;
     -webkit-box-shadow: none;
     box-shadow: none;
@@ -277,24 +323,32 @@
     border-radius: 15px;
 
 }
-.active-tab-Homepage .white-popup .panel-body, .white-popup>.col-md-6>.white-box:nth-child(2) {
+
+.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 {
+
+#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 {
+
+.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;
@@ -305,7 +359,18 @@
     background: var(--div-background-color-25);
 }
 
-#plexRecent, #homepageOrderplexplaylist, #homepageOrdercalendar, #homepageOrderembyrecent, #ombi-requests, #homepageOrderdeluge, #homepageOrdernzbget, #homepageOrdertransmission, #homepageOrderrTorrent, #homepageOrderjdownloader, #homepageOrdersabnzbd,#homepageOrderqBittorrent  {
+#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);
@@ -313,9 +378,11 @@
     border-radius: 15px;
 
 }
+
 .bg-info {
     background-color: transparent !important;
 }
+
 /* Health checks */
 .card-body {
     background: var(--div-background-color-25) !important;
@@ -323,6 +390,7 @@
     backdrop-filter: blur(10px);
 
 }
+
 .bg-inverse .healthPosition {
     background: var(--div-background-color-25) !important;
     -webkit-backdrop-filter: saturate(180%) blur(30px);
@@ -339,6 +407,7 @@
     border-bottom-left-radius: 15px;
 
 }
+
 .unifiCards .panel-heading {
     background: var(--div-background-color-35) !important;
     color: #fff !important;
@@ -351,46 +420,52 @@
     border-bottom: 0px;
 }
 
-.unifiCards .panel-warning .panel-heading, .unifiCards .panel-success .panel-heading {
+.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(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{
+#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 {
+#homepageOrdercustomhtmlTwo,
+#homepageOrdercustomhtml {
     -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     background: var(--div-background-color-15);
@@ -398,18 +473,23 @@
     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) {
+
+#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) {
+
+.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;
@@ -419,6 +499,7 @@
 .email-div .panel-body {
     border-radius: 0px !important;
 }
+
 /* Speedtest popup */
 
 #speedtest-area .white-popup .panel-footer {
@@ -426,21 +507,29 @@
     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) {
+
+#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 {
+.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;
@@ -449,13 +538,15 @@
 .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 {
+    #wrapper .login-register>.login-box>.white-box {
         background: transparent !important;
         margin-top: auto !important;
         width: 100% !important;
@@ -464,7 +555,7 @@
 
 
     }
-   }
+}
 
 @media (max-width: 480px) {
     .login-box.login-sidebar {
@@ -472,120 +563,131 @@
         -webkit-backdrop-filter: blur(10px);
         backdrop-filter: blur(10px);
 
-}
+    }
 }
 
 /* logo */
-	.white-box .visible-xs {
+.white-box .visible-xs {
-		display: block!important;
+    display: block !important;
-	}
+}
-	.loginLogo {
+
+.loginLogo {
     border: 0;
     margin-top: -60%;
     transform: translateY(-10%);
-	}
+}
-	@media (max-width: 480px) {
+
+@media (max-width: 480px) {
     .loginLogo {
         margin-top: -10% !important;
     }
-	}
+}
-	.blockUI {
+
+.blockUI {
     opacity: 1 !important;
     background-color: transparent !important;
-	}
+}
-	.blockMsg {
+
+.blockMsg {
     background: rgba(0, 0, 0, 0.9) !important;
     border: none !important;
-	}
+}
 
-    .login-register > .login-box > .white-box {
+.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 {
+.login-register {
 
     height: 100%;
     position: fixed;
-    }
+}
 
-	.slideInRight {
+.slideInRight {
     -webkit-animation-name: none;
     animation-name: none;
-	}
+}
 
-	.login-register  .login-box  .white-box  .bg-org {
+.login-register .login-box .white-box .bg-org {
     background-color: transparent !important;
-    }
+}
 
-	/*2FA login button*/
+/*2FA login button*/
-	.panel-wrapper .panel-body > .btn-warning, .btn-warning.disabled {
+.panel-wrapper .panel-body>.btn-warning,
+.btn-warning.disabled {
     background: var(--div-background-color-15) !important;
     border: 1px solid #ffc36d00 !important;
-        }
+}
 
-        /*2FA animation header*/
+/*2FA animation header*/
-        .panel-warning .panel-heading, .panel-yellow .panel-heading {
+.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*/
+/*oAuth Successful*/
-        .panel-green .panel-heading, .panel-success .panel-heading {
+.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 sidebar*/
-	.login-box.login-sidebar,
+.login-box.login-sidebar,
-	#login-panels .panel-body,
+#login-panels .panel-body,
-	#login-panels .panel {
+#login-panels .panel {
     background: transparent;
-	}
+}
 
-    #login-panels  .form-control ,  #login-panels .btn {
+#login-panels .form-control,
+#login-panels .btn {
     background: rgba(255, 255, 255, 0.35);
     color: white;
     border-radius: 25px;
     border: none;
-    }
+}
-  /*  #login-panels {
+
+/*  #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 {
+#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);
+    background: rgba(255, 255, 255, 0.65);
-    border:none;
+    border: none;
 
-    }
+}
-	/*Center login Box*/
+
-	.login-sidebar {
+/*Center login Box*/
+.login-sidebar {
     position: relative;
     right: initial;
-	}
+}
 
-	#lockScreen .white-box {
+#lockScreen .white-box {
     width: 400px;
     height: 345px;
-	}
+}
-	.login-sidebar .white-box {
+
+.login-sidebar .white-box {
     width: 100%;
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
-	}
+}
 
-	#lockScreen .white-box {
+#lockScreen .white-box {
     position: absolute;
     top: 50%;
     transform: translateY(-50%);
@@ -595,27 +697,37 @@
     -webkit-backdrop-filter: blur(10px);
     backdrop-filter: blur(10px);
     border-radius: 15px;
-    }
+}
-    .form-control::placeholder {
+
+.form-control::placeholder {
     color: white;
-    }
+}
-    #login-username-Input, #login-password-Input {
+
+#login-username-Input,
+#login-password-Input {
     text-align: center;
-    }
+}
-    .panel .panel-heading .panel-title, label, span, .fa-lock:before {
+
+.panel .panel-heading .panel-title,
+label,
+span,
+.fa-lock:before {
     color: #ffffff;
-    }
+}
-	/* Lock screen */ 
+
-	#lockScreen .form-material .form-control, .form-material .form-control:focus {
+/* 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 {
+
+#lockScreen .btn-info {
     background: rgba(255, 255, 255, 0.35);
     border-radius: 25px;
-	 }
+}
 
 /* Extra */
 .cbutton {
@@ -627,10 +739,11 @@
     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;
+    backdrop-filter: saturate(180%) blur(30px) !important;
     opacity: 1 !important;
 
 }
@@ -640,22 +753,28 @@
     content: "\F3D7";
     color: black;
 }
+
 .mdi-receipt:before {
     content: "\F449";
     color: black;
 }
-.debugModal .modal-body{
+
+.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 {
+
+#debugPreInfo .slimScrollDiv,
+#debugResults .slimScrollDiv {
     background: var(--div-background-color-15);
 }
+
 /* Swal popup */
 .swal-overlay--show-modal .swal-modal {
     -webkit-backdrop-filter: blur(10px);
@@ -663,58 +782,77 @@
     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 {
+
+    #page-wrapper {
         background: var(--mobile-bg-color) !important;
         background-size: cover;
         background-repeat: no-repeat;
         width: 100%;
         height: 100%;
-}
+    }
-#side-menu {
+
+    #side-menu {
         background: var(--mobile-bg-color) !important;
-}	
+    }
-.navbar-header {
+
+    .navbar-header {
         background: var(--div-background-color-25) !important;
-}
+    }
-.navbar-default,.show-sidebar .sidebar .sidebar-head {
+
+    .navbar-default,
+    .show-sidebar .sidebar .sidebar-head {
         background: var(--mobile-bg-color) !important;
-}
+    }
-.dropdown-menu {
+
+    .dropdown-menu {
         background: var(--mobile-bg-color) !important;
-}
+    }
-#internal-Settings {
+
+    #internal-Settings {
         background: var(--mobile-bg-color) !important;
-}
+    }
-.mfp-zoom-out.mfp-ready.mfp-bg {
+
+    .mfp-zoom-out.mfp-ready.mfp-bg {
         opacity: 1 !important;
         background: var(--mobile-bg-color) !important;
-}
+    }
-.mfp-wrap {
+
-    background: var(--mobile-bg-color)!important;
+    .mfp-wrap {
-}
-.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 {
+
+    .modal-open .modal {
         background: var(--mobile-bg-color) !important;
-}
+    }
-html {
+
+    #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;
+    }
 }