diff --git a/static/css/bazarr.css b/static/css/bazarr.css index 6b6af0df2..83c74768c 100644 --- a/static/css/bazarr.css +++ b/static/css/bazarr.css @@ -12,47 +12,62 @@ File: scss /*Extra Variable*/ /*Preloader*/ @import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,600,700"); + .preloader { - width: 100%; - height: 100%; - top: 0px; - position: fixed; - z-index: 99999; - background: #fff; } - .preloader .cssload-speeding-wheel { + width: 100%; + height: 100%; + top: 0px; + position: fixed; + z-index: 99999; + background: #fff; +} + +.preloader .cssload-speeding-wheel { position: absolute; top: calc(50% - 3.5px); - left: calc(50% - 3.5px); } + left: calc(50% - 3.5px); +} body { - font-family: "Roboto", "open sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif; } + font-family: "Roboto", "open sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif; +} /******************* /*Top bar *******************/ .buttons_bars { - position: fixed; - top: 60px; - z-index: 19; } + position: fixed; + top: 60px; + z-index: 19; +} .topbar { - background: #911f93; } - .topbar .top-navbar .navbar-header .navbar-brand .light-logo { + background: #911f93; +} + +.topbar .top-navbar .navbar-header .navbar-brand .light-logo { display: inline-block; - color: rgba(255, 255, 255, 0.8); } - .topbar .navbar-light .navbar-nav .nav-item > a.nav-link { - color: #ffffff !important; } - .topbar .navbar-light .navbar-nav .nav-item > a.nav-link:hover, .topbar .navbar-light .navbar-nav .nav-item > a.nav-link:focus { - color: rgba(255, 255, 255, 0.8) !important; } + color: rgba(255, 255, 255, 0.8); +} + +.topbar .navbar-light .navbar-nav .nav-item > a.nav-link { + color: #ffffff !important; +} + +.topbar .navbar-light .navbar-nav .nav-item > a.nav-link:hover, .topbar .navbar-light .navbar-nav .nav-item > a.nav-link:focus { + color: rgba(255, 255, 255, 0.8) !important; +} /******************* /*General Elements *******************/ a.link:hover, a.link:focus { - color: #3a3f51 !important; } + color: #3a3f51 !important; +} .bg-theme { - background-color: #3a3f51 !important; } + background-color: #3a3f51 !important; +} .pagination > .active > a, .pagination > .active > span, @@ -60,320 +75,452 @@ a.link:hover, a.link:focus { .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus { - background-color: #3a3f51; - border-color: #3a3f51; } + background-color: #3a3f51; + border-color: #3a3f51; +} .right-sidebar .rpanel-title { - background: #3a3f51; } + background: #3a3f51; +} .stylish-table tbody tr:hover, .stylish-table tbody tr.active { - border-left: 4px solid #3a3f51; } + border-left: 4px solid #3a3f51; +} .text-themecolor { - color: #e1e2e3 !important; } + color: #e1e2e3 !important; +} .profile-tab li a.nav-link.active, .customtab li a.nav-link.active { - border-bottom: 2px solid #3a3f51; - color: #3a3f51; } + border-bottom: 2px solid #3a3f51; + color: #3a3f51; +} + .profile-tab li a.nav-link:hover, .customtab li a.nav-link:hover { - color: #3a3f51; } + color: #3a3f51; +} .left-sidebar { - position: absolute; - width: 240px; - height: 100%; - top: 0; - z-index: 20; - padding-top: 60px; - background: #3a3f51; - box-shadow: 0 0 0 rgba(0, 0, 0, 0.08); } + position: absolute; + width: 240px; + height: 100%; + top: 0; + z-index: 20; + padding-top: 60px; + background: #3a3f51; + box-shadow: 0 0 0 rgba(0, 0, 0, 0.08); +} .sidebar-nav { - background: #3a3f51; - padding: 0; } - .sidebar-nav > ul { - padding: 0 0 60px; } - .sidebar-nav ul { - margin: 0; } - .sidebar-nav ul li { - list-style: none; } - .sidebar-nav ul li a { - color: #e1e2e3; - font-weight: 400; - padding: 8px 35px 8px 40px; - display: block; - font-size: 14px; - border-radius: 0; - white-space: nowrap; } - .sidebar-nav ul li a i { - color: #e1e2e3; - font-size: 14px; } - .sidebar-nav ul li a.active, .sidebar-nav ul li a:hover { - color: #ffffff; - cursor: pointer; - background: #911f93; } - .sidebar-nav ul li a.active { - font-weight: 400; - color: #ffffff; - background: #252833; } - .sidebar-nav ul li ul { - padding-left: 0px; - padding-top: 0; - transition-delay: inherit; - border-left: 3px solid #911f93; } - .sidebar-nav ul li ul li a { - padding-left: 60px; } - .sidebar-nav ul li ul ul { - padding-left: 35px; } - .sidebar-nav ul li.nav-small-cap { - font-size: 12px; - margin-bottom: 0; - padding: 14px 14px 14px 20px; - color: #263238; - font-weight: 400; } - .sidebar-nav > ul > li { - margin-bottom: 0px; } - .sidebar-nav > ul > li.active > a { - color: #ffffff; - font-weight: 400; - border-left: 3px solid #911f93; - background: #252833; - padding: 8px 35px 8px 37px; - box-shadow: 0 0 0 rgba(0, 0, 0, 0.2); } - .sidebar-nav > ul > li.active > a i { - color: #ffffff; - font-size: 14px; } - .sidebar-nav > ul > li > a.active i, .sidebar-nav > ul > li > a:hover i { - color: #ffffff; } - .sidebar-nav > ul > li > a i { + background: #3a3f51; + padding: 0; +} + +.sidebar-nav > ul { + padding: 0 0 60px; +} + +.sidebar-nav ul { + margin: 0; +} + +.sidebar-nav ul li { + list-style: none; +} + +.sidebar-nav ul li a { + color: #e1e2e3; + font-weight: 400; + padding: 8px 35px 8px 40px; + display: block; + font-size: 14px; + border-radius: 0; + white-space: nowrap; +} + +.sidebar-nav ul li a i { + color: #e1e2e3; + font-size: 14px; +} + +.sidebar-nav ul li a.active, .sidebar-nav ul li a:hover { + color: #ffffff; + cursor: pointer; + background: #911f93; +} + +.sidebar-nav ul li a.active { + font-weight: 400; + color: #ffffff; + background: #252833; +} + +.sidebar-nav ul li ul { + padding-left: 0px; + padding-top: 0; + transition-delay: inherit; + border-left: 3px solid #911f93; +} + +.sidebar-nav ul li ul li a { + padding-left: 60px; +} + +.sidebar-nav ul li ul ul { + padding-left: 35px; +} + +.sidebar-nav ul li.nav-small-cap { + font-size: 12px; + margin-bottom: 0; + padding: 14px 14px 14px 20px; + color: #263238; + font-weight: 400; +} + +.sidebar-nav > ul > li { + margin-bottom: 0px; +} + +.sidebar-nav > ul > li.active > a { + color: #ffffff; + font-weight: 400; + border-left: 3px solid #911f93; + background: #252833; + padding: 8px 35px 8px 37px; + box-shadow: 0 0 0 rgba(0, 0, 0, 0.2); +} + +.sidebar-nav > ul > li.active > a i { + color: #ffffff; + font-size: 14px; +} + +.sidebar-nav > ul > li > a.active i, .sidebar-nav > ul > li > a:hover i { + color: #ffffff; +} + +.sidebar-nav > ul > li > a i { width: 27px; height: 27px; line-height: 27px; display: inline-block; vertical-align: middle; - color: #e1e2e3; } - .sidebar-nav > ul > li > a .label { + color: #e1e2e3; +} + +.sidebar-nav > ul > li > a .label { float: right; - margin-top: 6px; } - .sidebar-nav > ul > li > a.active { + margin-top: 6px; +} + +.sidebar-nav > ul > li > a.active { font-weight: 400; background: #252833; - color: #ffffff; } + color: #ffffff; +} @media (min-width: 768px) { - .mini-sidebar .sidebar-nav #sidebarnav li { - position: relative; } + .mini-sidebar .sidebar-nav #sidebarnav li { + position: relative; + } - .mini-sidebar .sidebar-nav #sidebarnav > li > ul { - position: absolute; - left: 60px; - top: 45px; - width: 200px; - z-index: 1001; - background: #3a3f51; - display: none; - padding-left: 1px; } + .mini-sidebar .sidebar-nav #sidebarnav > li > ul { + position: absolute; + left: 60px; + top: 45px; + width: 200px; + z-index: 1001; + background: #3a3f51; + display: none; + padding-left: 1px; + } - .mini-sidebar .sidebar-nav { - padding: 0; } + .mini-sidebar .sidebar-nav { + padding: 0; + } - .mini-sidebar.fix-sidebar .left-sidebar { - position: absolute; } + .mini-sidebar.fix-sidebar .left-sidebar { + position: absolute; + } - .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul { - height: auto !important; - overflow: auto; } + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul { + height: auto !important; + overflow: auto; + } - .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul, - .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul.collapse { - display: block; } + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul, + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > ul.collapse { + display: block; + } - .mini-sidebar .sidebar-nav #sidebarnav > li > a.has-arrow:after { - display: none; } + .mini-sidebar .sidebar-nav #sidebarnav > li > a.has-arrow:after { + display: none; + } + + .mini-sidebar .left-sidebar { + width: 60px; + } + + .mini-sidebar .user-profile { + padding-bottom: 15px; + width: 60px; + margin-bottom: 7px; + } - .mini-sidebar .left-sidebar { - width: 60px; } - .mini-sidebar .user-profile { - padding-bottom: 15px; - width: 60px; - margin-bottom: 7px; } .mini-sidebar .user-profile .profile-img { - padding: 15px 0 0 0; - margin: 0px 0 0 6px; } - .mini-sidebar .user-profile .profile-img:before { - top: 15px; } - .mini-sidebar .scroll-sidebar { - padding-bottom: 0px; - position: absolute; } - .mini-sidebar .hide-menu, - .mini-sidebar .nav-small-cap, - .mini-sidebar .sidebar-footer, - .mini-sidebar .user-profile .profile-text { - display: none; } - .mini-sidebar .nav-devider { - width: 50px; } - .mini-sidebar .sidebar-nav { - background: transparent; } - .mini-sidebar .sidebar-nav #sidebarnav > li > a { - padding: 9px 20px; - width: 60px; } - .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a { - width: 260px; - background: #252833; - color: #ffffff; - border-color: #3a3f51; } + padding: 15px 0 0 0; + margin: 0px 0 0 6px; + } + + .mini-sidebar .user-profile .profile-img:before { + top: 15px; + } + + .mini-sidebar .scroll-sidebar { + padding-bottom: 0px; + position: absolute; + } + + .mini-sidebar .hide-menu, + .mini-sidebar .nav-small-cap, + .mini-sidebar .sidebar-footer, + .mini-sidebar .user-profile .profile-text { + display: none; + } + + .mini-sidebar .nav-devider { + width: 50px; + } + + .mini-sidebar .sidebar-nav { + background: transparent; + } + + .mini-sidebar .sidebar-nav #sidebarnav > li > a { + padding: 9px 20px; + width: 60px; + } + + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a { + width: 260px; + background: #252833; + color: #ffffff; + border-color: #3a3f51; + } + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a i { - color: #ffffff; } + color: #ffffff; + } + .mini-sidebar .sidebar-nav #sidebarnav > li:hover > a .hide-menu { - display: inline; } - .mini-sidebar .sidebar-nav #sidebarnav > li.active > a { - border-color: transparent; } + display: inline; + } + + .mini-sidebar .sidebar-nav #sidebarnav > li.active > a { + border-color: transparent; + } + .mini-sidebar .sidebar-nav #sidebarnav > li.active > a.active { - border-color: #911f93; } - .mini-sidebar .sidebar-nav ul li ul li a { - padding-left: 15px; } } + border-color: #911f93; + } + + .mini-sidebar .sidebar-nav ul li ul li a { + padding-left: 15px; + } +} + /******************* /*Buttons *******************/ .btn-themecolor, .btn-themecolor.disabled { - background: #3a3f51; - color: #e1e2e3; - border: 1px solid #3a3f51; } - .btn-themecolor:hover, - .btn-themecolor.disabled:hover { + background: #3a3f51; + color: #e1e2e3; + border: 1px solid #3a3f51; +} + +.btn-themecolor:hover, +.btn-themecolor.disabled:hover { background: #3a3f51; opacity: 0.7; - border: 1px solid #3a3f51; } - .btn-themecolor.active, .btn-themecolor:focus, - .btn-themecolor.disabled.active, - .btn-themecolor.disabled:focus { - background: #252833; } + border: 1px solid #3a3f51; +} + +.btn-themecolor.active, .btn-themecolor:focus, +.btn-themecolor.disabled.active, +.btn-themecolor.disabled:focus { + background: #252833; +} .topbar { - position: relative; - z-index: 50; - box-shadow: 0 0 0 rgba(0, 0, 0, 0.5); } - .topbar .top-navbar { + position: relative; + z-index: 50; + box-shadow: 0 0 0 rgba(0, 0, 0, 0.5); +} + +.topbar .top-navbar { min-height: 60px; height: 60px; - padding: 0 15px 0 0; } - .topbar .top-navbar .dropdown-toggle::after { - display: none; } - .topbar .top-navbar .navbar-header { - line-height: 60px; - text-align: left; } - .topbar .top-navbar .navbar-header .navbar-brand { - margin-right: 0; - padding-bottom: 0; - padding-top: 0; - padding-left: 10px; } - .topbar .top-navbar .navbar-header .navbar-brand .light-logo { - display: none; } - .topbar .top-navbar .navbar-header .navbar-brand b { - line-height: 60px; - display: inline-block; } - .topbar .dropdown-menu { + padding: 0 15px 0 0; +} + +.topbar .top-navbar .dropdown-toggle::after { + display: none; +} + +.topbar .top-navbar .navbar-header { + line-height: 60px; + text-align: left; +} + +.topbar .top-navbar .navbar-header .navbar-brand { + margin-right: 0; + padding-bottom: 0; + padding-top: 0; + padding-left: 10px; +} + +.topbar .top-navbar .navbar-header .navbar-brand .light-logo { + display: none; +} + +.topbar .top-navbar .navbar-header .navbar-brand b { + line-height: 60px; + display: inline-block; +} + +.topbar .dropdown-menu { box-shadow: 0 0 0 rgba(0, 0, 0, 0.05); -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0.05); -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0.05); border-color: rgba(120, 130, 140, 0.13); background: #3a3f51; - padding: 0 0; } - .topbar .dropdown-menu .dropdown-item { - padding: 7px 1.5rem; } - .topbar ul.dropdown-user { + padding: 0 0; +} + +.topbar .dropdown-menu .dropdown-item { + padding: 7px 1.5rem; +} + +.topbar ul.dropdown-user { padding: 0; width: 270px; - background: #3a3f51; } - .topbar ul.dropdown-user li { - list-style: none; - padding: 0; - margin: 0; } - .topbar ul.dropdown-user li a { - padding: 10px 15px; - display: block; - color: #e1e2e3; - background: #3a3f51; } - .topbar ul.dropdown-user li a:hover { - background: #252833; - color: #e1e2e3; - text-decoration: none; } + background: #3a3f51; +} + +.topbar ul.dropdown-user li { + list-style: none; + padding: 0; + margin: 0; +} + +.topbar ul.dropdown-user li a { + padding: 10px 15px; + display: block; + color: #e1e2e3; + background: #3a3f51; +} + +.topbar ul.dropdown-user li a:hover { + background: #252833; + color: #e1e2e3; + text-decoration: none; +} .page-titles { - background: #4f566f; - margin: 0 -30px 5px; - min-height: 60px; - height: 60px; - padding: 0; - box-shadow: 0 0 0 rgba(0, 0, 0, 0.1); } - .page-titles .btn { + background: #4f566f; + margin: 0 -30px 5px; + min-height: 60px; + height: 60px; + padding: 0; + box-shadow: 0 0 0 rgba(0, 0, 0, 0.1); +} + +.page-titles .btn { height: 50px; width: 70px; - padding: 0 0; } + padding: 0 0; +} .card-no-border .sidebar-nav > ul > li > a.active { - background: #252833; } + background: #252833; +} .form-material .form-control::placeholder { - /* Chrome, Firefox, Opera, Safari 10.1+ */ - color: #e1e2e3; - opacity: 1; - /* Firefox */ } + /* Chrome, Firefox, Opera, Safari 10.1+ */ + color: #e1e2e3; + opacity: 1; + /* Firefox */ +} + .form-material .form-control:-ms-input-placeholder { - /* Internet Explorer 10-11 */ - color: #e1e2e3; } + /* Internet Explorer 10-11 */ + color: #e1e2e3; +} + .form-material .form-control::-ms-input-placeholder { - /* Microsoft Edge */ - color: #e1e2e3; } + /* Microsoft Edge */ + color: #e1e2e3; +} .form-material .form-control, .form-material .form-control.focus, .form-material .form-control:focus { - background-image: linear-gradient(#911f93, #911f93), linear-gradient(#e1e2e3, #e1e2e3); - border: 0 none; - border-radius: 0; - box-shadow: none; - float: none; } + background-image: linear-gradient(#911f93, #911f93), linear-gradient(#e1e2e3, #e1e2e3); + border: 0 none; + border-radius: 0; + box-shadow: none; + float: none; +} .form-control:focus::placeholder { - /* Chrome, Firefox, Opera, Safari 10.1+ */ - color: #911f93; - opacity: 1; - /* Firefox */ } + /* Chrome, Firefox, Opera, Safari 10.1+ */ + color: #911f93; + opacity: 1; + /* Firefox */ +} + .form-control:focus:-ms-input-placeholder { - /* Internet Explorer 10-11 */ - color: #911f93; } + /* Internet Explorer 10-11 */ + color: #911f93; +} + .form-control:focus::-ms-input-placeholder { - /* Microsoft Edge */ - color: #911f93; } + /* Microsoft Edge */ + color: #911f93; +} .page-wrapper { - background: #f5f7fa; - padding-bottom: 60px; - padding-top: 60px; } + background: #f5f7fa; + padding-bottom: 60px; + padding-top: 60px; +} .overlay { - display: none; - height: 100%; - width: 100%; - position: fixed; - z-index: 2147483647; - left: 0; - top: 0; - background-color: black; - background-color: rgba(0, 0, 0, 0.8); - backdrop-filter: blur(6px); - overflow-x: hidden; } + display: none; + height: 100%; + width: 100%; + position: fixed; + z-index: 2147483647; + left: 0; + top: 0; + background-color: black; + background-color: rgba(0, 0, 0, 0.8); + backdrop-filter: blur(6px); + overflow-x: hidden; +} .overlay-content { - position: relative; - top: 50%; - width: 100%; - text-align: center; } + position: relative; + top: 50%; + width: 100%; + text-align: center; +} .dataTables_wrapper { - padding-top: 0px; } + padding-top: 0px; +} .dt-buttons { display: inline-block; @@ -385,25 +532,43 @@ a.link:hover, a.link:focus { cursor: default; background: #ffffff; border: 1px solid #727b84 !important; - color: #727b84 !important; } + color: #727b84 !important; +} + .dt-buttons button.disabled:hover { background: #ffffff; opacity: 0.7; color: #727b84 !important; - border: 1px solid #727b84; } + border: 1px solid #727b84; +} + +table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before { + line-height: 1.2em !important; +} + +table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control, table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control { + padding-left: 30px !important; +} .tooltip { - pointer-events: none; } + pointer-events: none; +} table.dataTable tbody td { - vertical-align: middle; } + vertical-align: middle; +} @media (min-width: 1024px) { - #edit_bar { - margin-left: 240px; } } + #edit_bar { + margin-left: 240px; + } +} + @media (max-width: 767px) { - /*Sidebar and wrapper*/ - .mini-sidebar .page-wrapper { - padding-top: 0; } } + /*Sidebar and wrapper*/ + .mini-sidebar .page-wrapper { + padding-top: 0; + } +} /*# sourceMappingURL=bazarr.css.map */