Jump to content

Search the Community

Showing results for tags 'dark theme'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • General
    • Announcements
    • Emby Premiere Purchase/Subscription Support
    • Feature Requests
    • Tutorials and Guides
  • Emby Server
    • General/Windows
    • Android Server
    • Asustor
    • FreeBSD
    • Linux
    • NetGear ReadyNAS
    • MacOS
    • QNAP
    • Synology
    • TerraMaster NAS
    • Thecus
    • Western Digital
    • DLNA
    • Live TV
  • Emby Apps
    • Amazon Alexa
    • Android
    • Android TV / Fire TV
    • Windows & Xbox
    • Apple iOS / macOS
    • Apple TV
    • Kodi
    • LG Smart TV
    • Linux & Raspberry Pi
    • Roku
    • Samsung Smart TV
    • Sony PlayStation
    • Web App
    • Windows Media Center
    • Plugins
  • Language-specific support
    • Arabic
    • Dutch
    • French
    • German
    • Italian
    • Portuguese
    • Russian
    • Spanish
    • Swedish
  • Community Contributions
    • Ember for Emby
    • Fan Art & Videos
    • Tools and Utilities
    • Web App CSS
  • Testing Area
    • WMC UI (Beta)
  • Other
    • Non-Emby General Discussion
    • Developer API
    • Hardware
    • Media Clubs

Blogs

  • Emby Blog

Find results in...

Find results that contain...


Date Created

  • Start

    End


Last Updated

  • Start

    End


Filter by number of...

Found 1 result

  1. Mai Sakurajima

    Custom ccs theme on ios??

    I would like to use my theme which is basically the dark theme with some modified values. It works on the web app but it does not show on ios. Help is greatly appreciated! here is the ccs: /* _________________________________________________________________________ ------------------------- COLOR HEX & RGB CODES ------------------------- RED : #E81123 & (232, 17, 35) DARK COLOR : #94131E ORANGE : #FF8000 & (255, 128, 0) DARK COLOR : #BF6000 ORANGE PLEX : #CC7B19 & (204, 123, 25) DARK COLOR : #B35A00 YELLOW : #BDBD00 & (189, 189, 0) DARK COLOR : #757500 GREEN : #52B54B & (82, 181, 75) DARK COLOR : #3E8437 BLUE : #4285F4 & (66, 133, 244) DARK COLOR : #0C57D6 BLUE DARK : #3367d6 & (51,103,214) BLUE DARK (DARK) : #1f4698 PURPLE : #673AB7 & (103, 58, 183) DARK COLOR : #3F2471 GRAY : #7F7F7F & (127, 127, 127) DARK COLOR : #535353 PINK : #FF65FD & (247, 7, 223) DARK COLOR : #C604B3 */ /* _________________________________________________________________________ ----------------------- EMBY THEME : ACCENT COLORS ---------------------- ---------- Table of Contents ---------- 1. ACCENT COLORS 1.1 Buttons 1.1.1 Checkboxes 1.1.2 Rectangles 1.1.3 Links & Text buttons 1.1.4 Others 1.2 Details 1.2.1 Circles 1.2.2 Indicators 1.2.3 Fonts 1.2.4 Icons 1.2.5 Dialogs & Action Sheets 1.2.6 Others 1.3 Fixes 2. MISCELLANEOUS MODIFICATIONS 2.1 Buttons 2.2 Details 2.2.1 Scrollbars 2.2.2 Logos 2.2.3 Others 2.3 Fixes 2.3.1 Dark Colors */ /* ------------------------ 1. ACCENT COLORS ------------------------- */ /* ----- 1.1 Buttons ----- */ /* 1.1.1 Checkboxes */ .emby-checkbox:checked + span + span + .checkboxOutline > .checkboxOutlineTick { background-color: #FF65FD !important; } .emby-checkbox:checked + span + span + .checkboxOutline, .progressring-spiner { border-color: #FF65FD !important; } .emby-checkbox:focus + span + .emby-checkbox-focushelper { background-color: #FF65FD !important; opacity: 0.26 !important; } /* 1.1.2 Rectangles */ .raised { background: #404040 !important; color: #fff !important; } .button-submit, .button-accent { background: #FF65FD !important; color: #fff; } .raised-mini.emby-button { background: #FF65FD !important; color: #ffffff !important; } /* Restart */ .btnRestartContainer.emby-button { background: #FF65FD !important; color: #fff; } /* Play & Resume */ .btnPlaySimple.emby-button { background: #FF65FD !important; color: #fff; } .btnResume.emby-button { background: #C604B3 !important; color: #fff; } /* 1.1.3 Links & Text buttons */ .button-link, .button-flat-accent, .button-accent-flat, .textlink { color: #FF65FD !important; } .button-link:hover, .button-flat-accent:hover, .button-accent-flat:hover, .textlink:hover { color: #9b9b9b !important; } .button-link:active, .button-flat-accent:active, .button-accent-flat:active, .textlink:active { color: #C604B3 !important; } /* Top Header */ .emby-tab-button-active { color: #FF65FD !important; } /* 1.1.4 Others */ /* Alpha Picker */ .alphaPickerButton-selected, .alphaPickerButton-tv:focus { background-color: #FF65FD !important; color: #fff !important; } /* Radio Buttons */ .mdl-radio__inner-circle { background: #FF65FD !important; } .mdl-radio__button:checked + .mdl-radio__label + .mdl-radio__outer-circle { border: 2px solid #FF65FD !important; } .mdl-radio__button:checked:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle { -webkit-box-shadow: 0 0 0 10px rgba(247, 7, 233, 0.26) !important; box-shadow: 0 0 0 10px rgba(247, 7, 233, 0.26) !important; } /* Control Group Buttons */ div[data-role=controlgroup] a.ui-btn-active[data-role=button] { background: #FF65FD !important; color: #ffffff !important; } /* ----- 1.2 Details ----- */ /* 1.2.1 Circles */ /*.listItemIcon:not(.listItemIcon-transparent) { background-color: $accent-color !important; }*/ .dashboardSection i.listItemIcon.md-icon { background-color: #FF65FD !important; } .scheduledTaskPaperIconItem[data-status=Running] i.listItemIcon.md-icon { background-color: #C604B3 !important; } /* Focus Helper circles */ .paper-icon-button-light:focus { color: #FF65FD !important; } /* 1.2.2 Indicators */ .countIndicator, .playedIndicator { background: #FF65FD !important; } .levelNormal { background-color: #FF65FD !important; } .fullSyncIndicator { background: #FF65FD !important; color: #fff; } .playstatebutton-played i, .ratingbutton-withrating i { color: #FF65FD !important; } p#pUpToDate i.md-icon { background-color: #FF65FD !important; } /* Loading Spinners */ .mdl-spinner__layer-1, .mdl-spinner__layer-2, .mdl-spinner__layer-3, .mdl-spinner__layer-4 { border-color: #FF65FD !important; } .progressring-spiner { border: 0.25em solid #FF65FD !important; } /* 1.2.3 Fonts */ .selectLabelFocused, .textareaLabelFocused, .inputLabelFocused { color: #FF65FD !important; } .secondary.listItemBodyText span, div#divRunningTasks span { color: #FF65FD !important; } /* 1.2.4 Icons */ .starIcon, .mediaInfoTimerIcon { color: #FF65FD !important; } /* Top Header */ .btnActiveCast { color: #FF65FD !important; } /* Now Playing Bar & Now Playing Page */ .repeatActive, button.btnCommand.repeatToggleButton.autoSize.nowPlayingPageRepeatActive { color: #FF65FD !important; } /* 1.2.5 Dialogs & Action Sheets */ /* 1.2.6 Others */ /* General Accent Color Modifications */ :focus { outline: #FF65FD auto 5px; } select:focus { border-color: #FF65FD !important; } ::selection { background-color: #C604B3 !important; } .emby-input:focus, .emby-textarea:focus { border-color: #FF65FD !important; } /* Google Now Playing Bar & Now Playing Page */ .iconOsdProgressInner, .mdl-slider__background-lower, .sliderBubble, .mdl-slider::-webkit-slider-thumb { background: #FF65FD !important; } .mdl-slider:focus::-webkit-slider-thumb { -webkit-box-shadow: 0 0 0 10px rgba(247, 7, 233, 0.26); box-shadow: 0 0 0 10px rgba(247, 7, 233, 0.26) !important; } /* Firefox Now Playing Bar & Now Playing Page */ .mdl-slider::-moz-range-thumb, .mdl-slider::-moz-range-progress { background: #FF65FD !important; } .mdl-slider:focus::-moz-range-thumb { box-shadow: 0 0 0 10px rgba(247, 7, 233, 0.26) !important; } /* Progress Bars */ .itemProgressBarForeground { background-color: #FF65FD !important; } .taskProgressInner { background: #FF65FD !important; } /* Google Progress Bars */ progress::-webkit-progress-value { background: #FF65FD !important; } /* Firefox Progress Bars */ progress::-moz-progress-bar { background: #FF65FD !important; } /* Edge Progress Bars */ progress { background: #FF65FD !important; } /* Main Drawers */ .navMenuDivider { background: #262626 !important; } .adminDrawerLogo { border-bottom: 1px solid #262626 !important; } .mainDrawer { background: #181818 !important; } .sidebarHeader { color: #bbbbbb !important; } .navMenuOption { color: #ffffff !important; } .navMenuOption.navMenuOption-selected { background: #252528 !important; color: #FF65FD !important; } .navMenuOption:hover { background: #252528 !important; color: #9b9b9b !important; } /* Metadata Editor */ div.jstree-wholerow.jstree-wholerow-clicked:hover, div.jstree-wholerow.jstree-wholerow-clicked, div.jstree-wholerow.jstree-wholerow-hovered { background: #252528 !important; } .jstree-anchor.jstree-clicked, .jstree-anchor.jstree-clicked.jstree-hovered { background: #252528 !important; color: #FF65FD !important; } /* Multi-select */ .itemSelectionPanel { border: 1px solid #FF65FD !important; } .selectionCommandsPanel { background: #FF65FD !important; color: #fff; } /* upNextDialog */ .upNextDialog-countdownText { color: #FF65FD !important; } /* Selection Bars */ .emby-select-selectionbar, .emby-textarea-selectionbar, .emby-input-selectionbar { background-color: #FF65FD !important; } /* Media Info Detail Image */ .itemDetailImage.loaded:hover { border: 1px solid #FF65FD !important; } /* 1.3 Fixes */ /* ------------------ 2. MISCELLANEOUS MODIFICATIONS ----------------- */ /* ----- 2.1 Buttons ----- */ /* Circles */ .fab { background-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-transition: none !important; -o-transition: none !important; transition: none !important; } /* ----- 2.2 Details ----- */ /* 2.2.1 Scrollbars */ /* Google Chrome */ ::-webkit-scrollbar-corner { background-color: #3B3B3B; } ::-webkit-scrollbar { width: 10px; height: 10px; background-color: #3B3B3B; } ::-webkit-scrollbar-thumb { -webkit-border-radius: 2px; border-radius: 2px; background: #888888; } /* Google Chrome - Dashboard Drawer */ div.scrollContainer.smoothScrollY::-webkit-scrollbar-corner { background-color: transparent !important; } div.scrollContainer.smoothScrollY::-webkit-scrollbar { width: 2px; height: 2px; background-color: transparent !important; } div.scrollContainer.smoothScrollY::-webkit-scrollbar-thumb { -webkit-border-radius: 2px; border-radius: 2px; background: #888888; } /* Google Chrome - Filter Dialog */ .dynamicFilterDialog::-webkit-scrollbar-corner { background-color: transparent !important; } .dynamicFilterDialog::-webkit-scrollbar { width: 2px; height: 2px; background-color: transparent !important; } .dynamicFilterDialog::-webkit-scrollbar-thumb { -webkit-border-radius: 2px; border-radius: 2px; background: #888888; } /* 2.2.2 Logos */ /* Login Page */ .imgLogoIcon { content: url(https://i.ibb.co/PgwB1wQ/pinkbunny-v2.png) !important; } /* Main Drawer Mobile */ .adminDrawerLogo img { content: url(https://i.ibb.co/PgwB1wQ/pinkbunny-v2.png) !important; } /* Home Page */ .pageTitleWithLogo { background-image: url(https://i.ibb.co/PgwB1wQ/pinkbunny-v2.png) !important; } /* 2.2.3 Others */ /* CSS Box */ #txtCustomCss { height: 300px !important; overflow-y: scroll !important; } /* Select Box */ select option { background-color: #2b2b2b !important; color: #ffffff !important; } /* Dialogs */ .formDialogHeader:not(.formDialogHeader-clear), .formDialogFooter:not(.formDialogFooter-clear) { background-color: #121212 !important; color: #fff; } /* Headers */ .skinHeader { background-color: #080808 !important; color: #fff !important; } .skinHeader-withBackground { background-color: #080808 !important; } @supports (backdrop-filter: blur(1.5em)) or (-webkit-backdrop-filter: blur(1.5em)) { .skinHeader-blurred { background: rgba(20, 20, 20, 0.7) !important; -webkit-backdrop-filter: blur(1.5em) !important; backdrop-filter: blur(1.5em) !important; } } .skinHeader.semiTransparent { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; background-color: rgba(0, 0, 0, 0.4) !important; background-image: -webkit-gradient(linear, left top, left bottom, color-stop(10%, rgba(0, 0, 0, 0.7)), color-stop(10%, transparent)) !important; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important; background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important; background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.7) 10%, transparent) !important; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 10%, transparent) !important; } .appfooter { background: #080808 !important; color: #fff !important; } @supports (backdrop-filter: blur(10px)) or (-webkit-backdrop-filter: blur(10px)) { .appfooter-blurred { background: rgba(24, 24, 24, 0.7) !important; -webkit-backdrop-filter: blur(20px) !important; backdrop-filter: blur(20px) !important; } } /* TV Global Modifications */ .emby-tab-button-active.emby-button-tv { color: #fff !important; } .guide-channelHeaderCell, .guide-channelTimeslotHeader { background: #2e2e2e !important; } .guide-programTextIcon { color: #1e1e1e !important; background: #555 !important; } .guide-headerTimeslots { color: #ccc !important; } /* ----- 2.3 Fixes ----- */ /* 2.3.1 Dark Colors */ .autoorganizetable tbody tr:nth-child(odd) td, .autoorganizetable tbody tr:nth-child(odd) th { background-color: #222326 !important; } .autoorganizetable > .table > tbody > tr { border: 1px solid #222326 !important; } /* _____________________________________________________________________ Emby Dark Themes is maintained by Ben Z (BenZuser) with the contribution of Happy2Play. _____________________________________________________________________ */ /* TEMPORARY FIXES */ /* Links */ .searchSuggestionsList a, .noItemsMessage a, a.lnkPremiere { color: #FF65FD !important; } .searchSuggestionsList a:hover, .noItemsMessage a:hover, a.lnkPremiere:hover { color: #9b9b9b !important; } .searchSuggestionsList a:active, .noItemsMessage a:active, a.lnkPremiere:active { color: #C604B3 !important; }
×
×
  • Create New...