diff --git a/CSS/themes/ombi/ombiv4-base.css b/CSS/themes/ombi/ombiv4-base.css new file mode 100644 index 00000000..1270b050 --- /dev/null +++ b/CSS/themes/ombi/ombiv4-base.css @@ -0,0 +1,281 @@ + +/* dP dP dP */ +/* 88 88 88 */ +/* d8888P 88d888b. .d8888b. 88d8b.d8b. .d8888b. 88d888b. .d8888b. 88d888b. 88 .dP */ +/* 88 88' `88 88ooood8 88'`88'`88 88ooood8 88' `88 88' `88 88' `88 88888" */ +/* 88 88 88 88. ... 88 88 88 88. ... 88. .88 88. .88 88 88 `8b. */ +/* dP dP dP `88888P' dP dP dP `88888P' 88 88Y888P' `88888P8 dP dP `YP */ +/* 88 */ +/* dP */ + +/* Made by @gilbN */ +/* https://github.com/gilbN/theme.park */ + + +body { + background: var(--main-bg-color); +} +a,b { + color: var(--accent-color); +} +a:hover, b:hover { + color: var(--accent-color-hover); +} + +.mat-drawer-container, .dark .mat-drawer-container { + background: var(--main-bg-color); + color: var(--text); +} + + +/* HEADER */ + +.mat-toolbar.mat-primary, .dark .mat-toolbar.mat-primary { + background: rgba(0, 0, 0, .25); + color: var(--text); +} +.dark .mat-toolbar, .mat-toolbar,.mat-list-base .mat-list-item, .mat-list-base .mat-list-option { + color: var(--text); +} + + /* SEARCH */ + .dark .mat-autocomplete-panel, .mat-autocomplete-panel { + background: var(--modal-bg-color); + color: var(--text); + } + + /* Scrollbar */ +::-webkit-scrollbar { + width: 7px; + background: hsl(0deg 0% 0% / 0%); +} + @media only screen and (min-width: 768px) { + html { + height: 100%; + width: 100%; + overflow: hidden; + } + body { + overflow-y: auto; + height: 100%; + background: var(--main-bg-color) + } +} + ::-webkit-scrollbar { + width: 14px; + } + ::-webkit-scrollbar-thumb { + min-height: 50px; + border: 3px solid transparent; + border-radius: 8px; + background-color: hsla(0,0%,100%,.2); + background-clip: padding-box; + } + ::-webkit-scrollbar-track { + background-color: transparent; + } + ::-webkit-scrollbar-thumb:hover { + min-height: 50px; + border: 3px solid transparent; + border-radius: 8px; + background-color: hsla(0,0%,100%,.5); + background-clip: padding-box; + } + + +/* SIDEBAR */ +.dark .mat-drawer, .dark .mat-drawer.mat-drawer-push, .mat-drawer, .mat-drawer.mat-drawer-push { + background-color: rgba(0, 0, 0, .25); + color: var(--text) +} +.dark .mat-drawer-side { + border-right: 1px solid transparent; +} +.dark .active-list-item, .active-list-item, .active-list-item { + background: var(--accent-color) !important; + background-color: var(--accent-color) !important; + color: var(--text)!important; + font-weight: 500; +} + +/* CARDS */ +.mat-card, .dark .mat-card { + background: rgb(0 0 0 / 25%); + color: var(--text); +} +.grow:hover { + transform: scale(1.1); + color: var(--text-hover) +} +.notrequested { + border-bottom: 3px solid var(--accent-color) !important; +} + +/* BUTTONS */ +.mat-fab.mat-accent, .mat-flat-button.mat-accent, .mat-mini-fab.mat-accent, .mat-raised-button.mat-accent, +.dark .mat-fab.mat-accent, .dark .mat-flat-button.mat-accent, .dark .mat-mini-fab.mat-accent, .dark .mat-raised-button.mat-accent { + background-color: var(--button-color); + color: var(--text) +} +.mat-raised-button:hover , .dark .mat-raised-button:hover { + background-color: var(--button-color-hover); + color: var(--text) +} + +.dark .mat-fab.mat-primary, .dark .mat-flat-button.mat-primary, .dark .mat-mini-fab.mat-primary, .dark .mat-raised-button.mat-primary, +.mat-fab.mat-primary, .mat-flat-button.mat-primary, .mat-mini-fab.mat-primary, .mat-raised-button.mat-primary { + background: rgba(255, 255, 255, .1); +} + +.btn-group-vertical>.btn.active, .btn-group-vertical>.btn:active, .btn-group-vertical>.btn:focus, .btn-group-vertical>.btn:hover, .btn-group>.btn.active, .btn-group>.btn:active, .btn-group>.btn:focus, .btn-group>.btn:hover { + z-index: 1; + background: var(--button-color-hover) !important; +} +.btn-group>.btn-group:not(:first-child), .btn-group>.btn:not(:first-child) { + margin-left: 0px; +} +.mat-raised-button:not([class*=mat-elevation-z]), .dark .mat-raised-button:not([class*=mat-elevation-z]) { + box-shadow: none; +} +button:focus { + outline: 1px dotted; + outline: none; +} + +.dark .mat-slide-toggle.mat-checked .mat-slide-toggle-bar, .mat-slide-toggle.mat-checked .mat-slide-toggle-bar { + background-color: var(--accent-color); +} +.dark .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb, .mat-slide-toggle.mat-checked .mat-slide-toggle-thumb { + background-color: var(--accent-color); +} +/* MODAL */ +.dark .mat-dialog-container,.mat-dialog-container { + background: var(--modal-bg-color); + color: var(--text); +} + +div.dark .details, .details { + background: transparent !important; +} + +.dark .mat-dialog-container .dark .mat-raised-button.mat-primary,.mat-dialog-container .mat-raised-button.mat-primary { + background: var(--button-color); +} +.dark .mat-dialog-container .dark .mat-raised-button.mat-primary:hover,.mat-dialog-container .mat-raised-button.mat-primary:hover { + background: var(--button-color-hover); +} +.dark .mat-dialog-container .media-icons, .mat-dialog-container .media-icons { + color: var(--text) !important; +} +.mat-slide-toggle-bar, .dark .mat-slide-toggle-bar { + background-color: rgba(0,0,0,.38); +} +.mat-slide-toggle-thumb, .dark .mat-slide-toggle-thumb { + background-color: #fafafa; +} + +/* SETTINGS */ + /* Table */ + .mat-table, .dark .mat-table { + background: #0000002e; + color: var(--text) + } + .mat-cell, .mat-footer-cell,.dark .mat-cell, .dark .mat-footer-cell { + color: var(--text) + } + /* Drop down menu*/ + .dark .mat-menu-panel,.mat-menu-panel { + background: var(--modal-bg-color); + } +.dark .mat-select-panel { + background: var(--modal-bg-color); +} +.mat-tab-label, .mat-tab-link, .dark .mat-tab-label, .dark .mat-tab-link { + color: var(--text); +} +.mat-tab-group.mat-primary .mat-ink-bar, .mat-tab-nav-bar.mat-primary .mat-ink-bar, .dark .mat-tab-group.mat-primary .mat-ink-bar, .dark .mat-tab-nav-bar.mat-primary .mat-ink-bar { + background-color: var(--accent-color); +} +.dark .mat-tab-header, .dark .mat-tab-nav-bar, .mat-tab-header, .mat-tab-nav-bar { + border-bottom: 1px solid hsla(0,0%,100%,.12); +} +.mat-form-field-appearance-outline .mat-form-field-outline-thick { + color: hsla(0,0%,100%,.12); +} +.dark .mat-form-field-appearance-outline .mat-form-field-outline, .mat-form-field-appearance-outline .mat-form-field-outline { + color: hsla(0,0%,100%,.3); +} +.dark .mat-form-field-label, .dark .mat-hint, .mat-form-field-label, .mat-hint { + color: hsla(0,0%,100%,.7); +} + +.dark .mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick { + color: hsla(0,0%,100%,.7); +} +.dark .mat-input-element { + caret-color: var(--text); +} +/* MOVEI TV PAGE*/ + +.dark .mat-chip.mat-standard-chip.mat-chip-selected.mat-accent, .mat-chip.mat-standard-chip.mat-chip-selected.mat-accent { + background-color: var(--accent-color); + color: var(--text); +} +.mat-expansion-panel, .dark .mat-expansion-panel { + background: rgb(0 0 0 / 25%); + color: var(--text) !important; +} +.mat-expansion-panel-header-title { + color: var(--text); +} +#info-wrapper .sidebar .poster { + border: 3px solid rgb(255 255 255 / 10%); + box-shadow: none; +} +.ui-carousel-next, body .ui-carousel .ui-carousel-content .ui-carousel-prev { + background-color: var(--accent-color); + border: 1px solid var(--accent-color); + border-radius: 50%; + margin: .2em; + color: #fff; + transition: color .2s; +} +.ui-carousel-next:hover, body .ui-carousel .ui-carousel-content .ui-carousel-prev:hover { + background: var(--button-color-hover); +} +body .ui-carousel .ui-carousel-dots-container .ui-carousel-dot-item.ui-state-highlight .ui-carousel-dot-icon { + background-color: var(--accent-color); +} +#summary-wrapper .grey-text { + color: var(--text); +} +#info-wrapper .media-icons { + color: var(--text)!important; +} +#info-wrapper .media-icons:hover { + color: var(--text-hover)!important; +} +#info-wrapper .grow-social:hover { + color: var(--text-hover)!important; +} + +#info-wrapper .dark .mat-fab, .dark .mat-flat-button, .dark .mat-mini-fab, .dark .mat-raised-button,#info-wrapper .mat-fab, .mat-flat-button, .mat-mini-fab, .mat-raised-button { + color: #fff; + background-color: var(--button-color); +} +#info-wrapper .dark .mat-mini-fab:hover, #info-wrapper .mat-raised-button:hover { + color: #fff; + background-color: var(--button-color-hover); +} + +/*LOGIN PAGE */ + +.dark .mat-elevation-z8, .mat-elevation-z8 { + box-shadow: 0 5px 5px -3px rgba(0,0,0,.2), 0 8px 10px 1px rgba(0,0,0,.14), 0 3px 14px 2px rgba(0,0,0,.12); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); +} +.dark .mat-checkbox-checked.mat-accent .mat-checkbox-background,.dark .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background, .mat-checkbox-checked.mat-accent .mat-checkbox-background { + background-color: var(--accent-color) +} +