diff --git a/Themes/nightfall/body-background.jpg b/Themes/nightfall/body-background.jpg new file mode 100644 index 000000000..72ac5236b Binary files /dev/null and b/Themes/nightfall/body-background.jpg differ diff --git a/Themes/nightfall/nightfall.css b/Themes/nightfall/nightfall.css new file mode 100644 index 000000000..1597c1bef --- /dev/null +++ b/Themes/nightfall/nightfall.css @@ -0,0 +1,367 @@ +/* NAME Nightfall **/ +/* VERSION 0.9.1 **/ +/* DESCRIPTION A theme for the more photo-sensitive / vampiric of us. **/ +/* DEVELOPER Motackt - https://github.com/motackt **/ + +/*.tab_anchor = buttons in header bar*/ +/*.post_brick = small posts seen on explore and search screens*/ +/*.peepr_body = the side-drawer that opens when a blog is clicked in dash*/ +/*.rapid-recs = the 4 posts that Tumblr recommends when u rb a post*/ +/*.glass = the overlay on the rest of the page when reblogging or otherwise*/ +/*.split-button = reblog button*/ +/*.tab_notice = notification icon*/ +/*.toast = large notification u get in bottom-right that disppears automatically*/ +/*.ui_dialog_pos = when discarding a post*/ +/*.tmblr-truncated = "Keep Reading"*/ +/*.tumblelog_popover = placeholder popover that shows up when u hover over ppl's names*/ +/*.knight-rider-bar = loading tri-bar*/ +/*.icon_search = magnifying glass*/ + +@import "nightfall_popover-general.css"; +@import "nightfall_account.css"; +@import "nightfall_activity.css"; +@import "nightfall_creating-new-blog.css"; +@import "nightfall_creating-new-post.css"; +@import "nightfall_reblogging-post.css"; +@import "nightfall_explore-search.css"; +@import "nightfall_inbox.css"; +@import "nightfall_messaging.css"; +@import "nightfall_notes.css"; +@import "nightfall_peepr.css"; +@import "nightfall_post-types.css"; +@import "nightfall_report.css"; +@import "nightfall_share.css"; +@import "nightfall_follow-pills.css"; +@import "nightfall_xkit-support.css"; + +:root { + --accent-body: #5E312E ; + --accent-grad: repeating-linear-gradient(to bottom, #1F1C27, #5E312E 200vh, #1F1C27 400vh) !important; + --bg-colour: #222; + --post: #111; + --border: #444; + --special-border: #222; + --bubble: #444; + --special-bubble: #444; + --primary: #DDD; + --primary-selected: #111; + --primary-disabled: #444; + --secondary: #888; + --secondary-selected: #666; + --placeholder: #666; + --underline-colour: #888; + --link-bg: #000; + --link-bg-act: #111; + --popup-menu: #111; + --header: transparent; + --menu-header: #000; + --popover: #111; + --note: #111; + --thumb: #BBB; + --thumb-hover: #FFF; + --tag: #222; + --loading: #DDD; + --glass: rgba(50, 53, 60, 0.95); + --accent: hsl(316, 33%, 51%); + --accent-hi: hsl(316, 21%, 90%); + --accent-hi2: hsl(315, 34%, 80%); + --accent-hi-text: hsl(316, 30%, 25%); + --accent-sel: hsl(316, 33%, 49%); + --accent-glass: hsla(316, 62%, 82%, 0.12); + --danger: #ff492f; + --happy: #00cf35; + --input-bg: #000; +} + +body { + background-color: var(--accent-body); + background-image: var(--accent-grad); +} + +@media (pointer: fine) { + body { + background: url("https://gogetfunding.com/wp-content/uploads/2015/11/4967332/img/road-street-blur-blurred.jpg") center repeat fixed !important; + background-size: cover !important; + } +} + +a, +body { + color: var(--primary, #DDD); +} + +input, +textarea { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} + +.l-container.l-container--two-column .l-content, +.l-container.l-container--two-column-dashboard .l-content { + background-color: transparent !important; +} + +#right_column { + background: linear-gradient(to bottom, transparent 0%, rgba(50, 53, 60, 0.47) 50%, transparent 100%); + padding: 0px 10px; + left: 10px; +} + +.controls_section li { + background-color: transparent; +} + +.controls_section li:not(.section_header):not(.selected_blog):hover { + background-color: rgba(50,53,60,0.15); +} + +.controls_section.user_list li .follow_list_item_blog:before, +.controls_section.user_list li:hover .follow_list_item_blog:before { + background-image: unset !important; + border-right: none !important; +} + +.plus-follow-button { + background-color: hsla(0, 0%, 100%, 0.2); + color: #BBB; +} + +.plus-follow-button:hover { + background-color: var(--accent) !important; +} + +.plus-follow-button ~ .dismiss .icon_close:before { + color: var(--primary, #DDD) !important; +} + +.explore_link { + color: var(--accent) !important; + font-weight: 900; +} + +#left_column { + background-color: transparent; +} + +.post_avatar, +.post_avatar .post_avatar_link { + background-color: transparent !important; +} + +/*when scrolled away from post, keep correct colour*/ +#posts.posts > .post_container:empty, +#posts.posts > .post_container:-moz-only-whitespace { + background-color: var(--post, #111) !important; + border-radius: 3px !important; +} + +/*bg of post between footer and header*/ +.post_content { + background: transparent !important; +} + +.rapid-recs-container .rapid-recs { + background-image: linear-gradient(to bottom, rgba(79, 79, 79, 0) 0%, rgba(48, 48, 48, 0.18) 15%, rgba(48, 48, 48, 0.18) 85%, rgba(79, 79, 79, 0) 100%); +} + +.rapid-recs-container .rapid-recs .micro-post-list .post_micro { + background: rgba(255, 255, 255, 0.05); + border-radius: 3px; +} + +.post-forms-glass, +.ui_peepr_glass, +.blue#glass_overlay, +.blue#hello_glass, +.blue.glass, +.ui_dialog_lock { + background-color: var(--glass) !important; +} + +.split-button, +.split-button .button-area, +.split-button .button-area.disabled, +.split-button .dropdown-area, +.split-button:active { + background-color: var(--accent) !important; + border-color: var(--accent) !important; +} + +.split-button .button-area:focus, +.split-button .dropdown-area:focus { + background-color: var(--accent-sel) !important; + border-color: var(--accent-sel) !important; +} + +.split-button .button-area:active, +.split-button .dropdown-area:active { + background-color: var(--accent) !important; + border-color: var(--accent) !important; +} + +.toastr .toast { + background: transparent; +} + +.notification { + border-radius: 3px; +} + +.binary-switch input[type=checkbox]:checked ~ .binary-switch-track, +.binary_switch input[type="checkbox"]:checked ~ .binary_switch_track { + background-color: var(--accent); + border-color: var(--accent); +} + +.ui_dialog_pos .ui_button.blue { + background-color: var(--accent); + border-color: var(--accent); +} + +.ui_dialog_pos .ui_button.blue:active { + background-color: var(--accent); + box-shadow: none; +} + +.blue.tx-button { + background-color: var(--accent); + border-color: var(--accent); +} + +.blue.disabled.active.tx-button, +.blue.disabled.tx-button, +.blue[disabled].tx-button, +.blue[disabled].tx-button:active { + background-color: var(--accent); + border-color: var(--accent); +} + +.blue.tx-button:active { + background-color: var(--accent); + border-color: var(--accent); +} + +/*when clicking on down arrows, adjust colour*/ +.blog-selector-container .selected-blog .caret.is-open { + color: var(--accent) !important; +} + +.post-activity-reply .submit[disabled] { + color: var(--secondary); +} + +.post-activity-reply .submit { + color: var(--accent); +} + +.post-content-text a, +.post .post_body a, +.reblog-content a { + background-image: unset; + text-decoration: underline; + text-decoration-color: var(--underline-colour, #888); +} + +.post-content-text a:hover, +.post .post_body a:hover, +.reblog-content a:hover { + background-image: unset; + text-decoration-color: var(--primary, #DDD); +} + +/*blog names*/ +.post_info_link, +.name { + background-image: unset !important; + text-decoration: unset !important; +} + +.ask-form .ask-question, +.ask-form .ask-anonymously-label { + color: var(--primary, #DDD); +} + +/*when loading tumblelog*/ +.tumblelog_popover .recent_posts { + background-color: var(--post, #111); +} + +.tumblelog_popover .popover_inner { + background: unset; +} + +.tumblelog_popover .navigation:before { + border-radius: 2px 2px 0px 0px; +} + +.knight-rider-bar { + background-color: var(--loading, #DDD); +} + +.tx-scroll .tx-scrollbar-thumb { + background: var(--thumb, #BBB); +} + +.tx-scroll .tx-scrollbar-thumb:hover, +.tx-scroll .tx-scrollbar-thumb:active, +.tx-scroll .tx-scrollbar-track--active .tx-scrollbar-thumb { + background: var(--thumb-hover, #FFF); +} + +.editor-slot { + background: unset; +} + +/*.editor-placeholder, */ +.editor-plaintext, +.editor-richtext { + background: var(--post, #111); + color: var(--primary, #DDD); +} + +.editor-placeholder { + background: unset; + color: var(--secondary, #888) !important; +} + +input[type=text].field { + background: var(--post, #111) !important; + color: var(--primary, #DDD) !important; +} + +.post-content-text pre, +.post .post_body pre, +.reblog-content pre { + padding: 5px; + color: #BBB; + background: #000; + overflow-x: auto; +} + +.tumblelog_popover .recent_posts .post, +.tumblelog_popover .recent_posts .post a { + color: #444; +} + +.external-image-wrapper { + border-color: var(--secondary) !important; + color: var(--secondary) !important; +} + +.chrome.blue { + background-color: var(--accent) !important; + border-color: var(--accent) !important; +} + +.chrome.blue[disabled], +.chrome.blue.disabled, +.chrome.blue[disabled]:active, +.chrome.blue.disabled:active { + background-color: var(--accent) !important; + border-color: var(--accent) !important; +} + +.chrome.blue:active { + background-color: var(--accent) !important; + border-color: var(--accent) !important; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_accessibility_update_temp.css b/Themes/nightfall/nightfall_accessibility_update_temp.css new file mode 100644 index 000000000..522c01ebf --- /dev/null +++ b/Themes/nightfall/nightfall_accessibility_update_temp.css @@ -0,0 +1,93 @@ +.flag--accessibility-design-update a, +body.flag--accessibility-design-update { + color: var(--primary); +} + +.flag--accessibility-design-update .post-container a { + color: var(--primary); +} + +.flag--accessibility-design-update .post_controls .post_control:before, +.flag--accessibility-design-update .post .post-source-footer a.post-source-link, +.flag--accessibility-design-update .post_full .post_footer, +.flag--accessibility-design-update .radar .radar_controls .note_count>a, +.flag--accessibility-design-update .radar .radar_controls .radar_button { + color: var(--secondary); +} + +.flag--accessibility-design-update .reblog_follow_button .follow-text, +.flag--accessibility-design-update .worded-follow-button .follow-text { + color: var(--primary) !important; +} + +.flag--accessibility-design-update .messaging-inbox .inbox-compose-toggle .compose-start, +.messaging-inbox .flag--accessibility-design-update .inbox-compose-toggle .compose-start { + color: var(--primary) !important; +} + +.flag--accessibility-design-update .ui_search.active .search_form_field:before, +.flag--accessibility-design-update .ui_search.selected .search_form_field:before { + color: var(--primary) !important; +} + +.flag--accessibility-design-update .search_popover .search_results_section .search_subheading { + color: var(--primary); +} + +.flag--accessibility-design-update .post .post_info .reblog_icon, +.flag--accessibility-design-update .post_full .post_header, +.flag--accessibility-design-update .post_full .post_header .post_info .post_info_link, +.flag--accessibility-design-update .post_full .post_info .post_info_fence .reblog_source .post_info_link { + color: var(--secondary); +} + +.flag--accessibility-design-update .post-form--header { + color: var(--secondary); +} + +.flag--accessibility-design-update .plus-follow-button { + color: var(--primary); +} + +.flag--accessibility-design-update .radar .radar_footer .radar_avatar::before { + background: unset; +} + +.flag--accessibility-design-update .rapid-recs-container .rapid-recs { + background-image: linear-gradient(to bottom, rgba(79, 79, 79, 0) 0%, rgba(48, 48, 48, 0.18) 15%, rgba(48, 48, 48, 0.18) 85%, rgba(79, 79, 79, 0) 100%); +} + +.flag--accessibility-design-update .post .dockable_video_embed .post_info .post_info_link, +.flag--accessibility-design-update .post .dockable_video_embed .post_header .post_info_tumblelog { + color: var(--secondary); +} + +.flag--accessibility-design-update .post .dockable_video_embed .post_info .post_info_link { + color: var(--primary); +} + +.flag--accessibility-design-update .is-followed .post-activity-note-content .note-text { + color: var(--primary); +} + +.flag--accessibility-design-update .peepr-body .indash_blog a.reblog_info, +.flag--accessibility-design-update .post .post_header .post_info_link { + color: var(--secondary); +} + +.flag--accessibility-design-update .peepr-body .indash_blog .post_notes_label { + color: var(--secondary); +} + +.flag--accessibility-design-update .post-activity-reply .submit[disabled] { + color: var(--secondary); +} + +.flag--accessibility-design-update .post-activity-reply .submit { + color: var(--accent); +} + +.flag--accessibility-design-update .editor-plaintext, +.flag--accessibility-design-update .editor-richtext { + color: var(--primary); +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_account.css b/Themes/nightfall/nightfall_account.css new file mode 100644 index 000000000..925659c10 --- /dev/null +++ b/Themes/nightfall/nightfall_account.css @@ -0,0 +1,217 @@ +/*=====================================page-likes====================================*/ +/*https://www.tumblr.com/likes*/ + +/*===================================page-following==================================*/ +/*https://www.tumblr.com/following*/ +#dashboard_useraction_following .l-content, +#dashboard_useraction_following #tabs { + background-color: var(--post, #111) !important; +} + +#dashboard_useraction_following #tabs .tab.selected { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} + +a.tab.selected { + pointer-events: none; + background-color: unset; + color: var(--primary, #DDD); +} + +#invite_someone { + background-color: var(--menu-header, #000); +} + +.follower { + background-color: unset; +} + +.follower.alt { + background-color: var(--post, #111); +} + +.last_updated { + color: var(--secondary, #888); +} + +.snowman-icon:before { + color: var(--secondary, #888); +} + +.chrome.clear { + background-color: unset; + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +.chrome.clear:active { + background-color: rgba(255, 255, 255, 0.1); + color: var(--primary, #DDD); +} + +#dashboard_useraction_following #right_column { + background: unset; + padding: 0px; +} + +.grey_note { + background-color: rgba(255, 255, 255, 0.05); + color: var(--secondary, #888); +} + +#pagination { + background-color: unset; +} + +/*===================================page-followers==================================*/ +/*https://www.tumblr.com/blog/USERNAME/followers*/ +#left_column.followers, +.white_pane, +.white_pane .pagination { + background-color: var(--post, #111); +} + +.white_pane h1 { + color: var(--primary, #DDD); +} + +.follower.alt { + background-color: var(--menu-header, #000); +} + +input.text_field { + background-color: #000; + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +.user-is-friend-bubble, +.user-is-friend-bubble .popover .popover_inner { + background-color: #000; + color: var(--primary, #DDD); + border-color: var(--special-border, #222); + box-shadow: inset 0 1px 0 var(--border, #444); +} + +/*====================================page-drafts====================================*/ +/*https://www.tumblr.com/blog/USERNAME/drafts*/ + +/*====================================page-queue=====================================*/ +/*https://www.tumblr.com/blog/USERNAME/queue*/ +.dashboard_options_form, +.tag_psa { + border: 1px solid var(--accent-hi-text); + color: var(--accent-hi2); +} + +.dashboard_options_form .dashboard_options_form_disclaimer, +.dashboard_options_form .dashboard_options_form_disclaimer a { + color: var(--accent-hi); +} + +.post_controls .post_control.post-control-icon.sort, +.post_controls .post_control.post-control-icon.move_to_top { + background-color: var(--primary, #DDD); +} + + +/*========================================popup======================================*/ +.popover--account-popover .popover_header { + background-color: var(--menu-header, #000); + border-bottom-color: var(--border, #444); + color: var(--primary, #DDD); +} + +.popover--account-popover .popover_inner, +.popover--account-popover .popover_subsection { + background-color: var(--post, #111); +} + +.popover--account-popover .popover_menu_item .popover_menu_item_anchor, +.popover--account-popover .popover_menu_item .popover_item_suffix { + color: var(--primary, #DDD) !important; +} + +.popover--account-popover .popover_menu_item:hover { + background-color: var(--accent-hi) !important; + border-color: var(--border, #444) !important; +} + +.popover--account-popover .popover_menu_item:active { + background-color: var(--accent-hi2) !important; +} + +.popover--account-popover .popover_menu_item:hover .popover_menu_item_anchor, +.popover--account-popover .popover_menu_item:hover .popover_item_suffix, +.popover--account-popover .popover_menu_item:active .popover_menu_item_anchor, +.popover--account-popover .popover_menu_item:active .popover_item_suffix { + color: var(--accent-hi-text, #111) !important; +} + +.popover--account-popover .popover_menu_item:hover a { + background-color: unset !important; +} + +.popover--account-popover .popover_menu_item:last-child { + border-color: var(--border, #444); +} + +.popover--account-popover .popover_menu_item_blog { + background-color: var(--post, #111); +} + +.popover--account-popover .popover_menu_item_blog.popover_menu_item_blog, +.popover--account-popover .popover_menu_item_blog:hover:not(:first-child) { + border-color: var(--border, #444); +} + +.popover--account-popover .blog-list-item:hover .blog-list-item-button { + color: var(--accent-hi-text) !important; +} + +.popover--account-popover .blog-list-item, +.popover--account-popover .popover_menu_item_blog_details { + background-color: var(--post, #111) !important; +} + +.popover--account-popover .blog-list-item .blog-list-item-info-name { + color: var(--primary, #DDD); +} + +.popover--account-popover .blog-list-item .blog-list-item-info-title { + color: var(--secondary, #888); +} + +.popover--account-popover .blog-sub-nav-item .blog-sub-nav-item-label, +.popover--account-popover .blog-sub-nav-item .blog-sub-nav-item-data { + color: var(--primary, #DDD); +} + +.popover--account-popover .blog-list-item:hover, +.popover--account-popover .blog-sub-nav-item:hover, +.popover--account-popover .blog-sub-nav-item.selected { + background-color: var(--accent-hi) !important; + box-shadow: -4px 0 0 var(--accent-hi), 10px 0 0 var(--accent-hi); +} + +.popover--account-popover .blog-list-item:hover .blog-list-item-info-name, +.popover--account-popover .blog-list-item:hover .blog-list-item-info-title, +.popover--account-popover .blog-sub-nav-item:hover .blog-sub-nav-item-label, +.popover--account-popover .blog-sub-nav-item:hover .blog-sub-nav-item-data, +.popover--account-popover .blog-sub-nav-item.selected .blog-sub-nav-item-label, .popover--account-popover .blog-sub-nav-item.selected .blog-sub-nav-item-data { + color: var(--accent-hi-text); +} + +.popover--account-popover .blog-list-item:active, +.popover--account-popover .blog-sub-nav-item:active { + background-color: var(--accent-hi2) !important; + box-shadow: -4px 0 0 var(--accent-hi2), 10px 0 0 var(--accent-hi2); +} + +.popover--account-popover .blog-list-item:active .blog-list-item-info-name, +.popover--account-popover .blog-list-item:active .blog-list-item-info-title, +.popover--account-popover .blog-sub-nav-item:active .blog-sub-nav-item-label, +.popover--account-popover .blog-sub-nav-item:active .blog-sub-nav-item-data { + color: var(--accent-hi-text) !important; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_activity.css b/Themes/nightfall/nightfall_activity.css new file mode 100644 index 000000000..578cc1e67 --- /dev/null +++ b/Themes/nightfall/nightfall_activity.css @@ -0,0 +1,260 @@ +/*========================================page=======================================*/ +/*https://www.tumblr.com/blog/USERNAME/activity*/ +.notifications_page .section.divider { + background: unset; +} + +.notifications_page .notification_pane { + background-color: unset; +} + +.notifications_page .section.first.divider, +.notifications_page .section.last { + background-color: var(--post, #111); + border-radius: 3px; +} + +.notifications_page .section.first.divider { + border-bottom: 1px solid var(--border, #444); + border-image: linear-gradient(to right, transparent 0%, transparent 5%, var(--border, #444) 5%, var(--border, #444) 95%, transparent 95%, transparent 100%) 1 stretch; + border-bottom-left-radius: 10px; + border-bottom-right-radius: 10px; +} + +.notifications_page .section.last { + border-top-left-radius: 10px; + border-top-right-radius: 10px; + margin-top: unset; +} + +.notifications_page .notification_pane .popover_menu .popover_menu_item a { + color: var(--primary, #DDD); +} + +.notifications_page .notification_pane .popover_menu .popover_menu_item:hover a { + color: var(--seondary, #888); +} + +.notifications_page #range_controls h2.heading.arrow { + color: var(--primary, #DDD); +} + +path { + stroke: var(--secondary, #888); +} + +.highcharts-axis { + opacity: 0; +} + +.highcharts-axis-labels span { + color: var(--primary, #DDD) !important; +} + +.notifications_page .ui_stats .unit.active.new_notes .button, +.notifications_page .ui_stats .unit.active.new_followers .button, +.notifications_page .ui_stats .unit.active.total_followers .button, +.notifications_page .ui_stats .unit .button { + background: linear-gradient(to bottom, #444 0%, #000 100%); + border-top-color: #444; +} + +.notifications_page .ui_stats .unit.active.new_followers .stage, +.notifications_page .ui_stats .unit.active.total_followers .stage, +.notifications_page .ui_stats .unit.active.new_notes .stage { + background: linear-gradient(to bottom, #000 0%, #111 100%); +} + +.notifications_page .ui_stats .unit.active.new_followers .plop:before, +.notifications_page .ui_stats .unit.active.total_followers .plop:before, +.notifications_page .ui_stats .unit.active.new_notes .plop:before { + border-top-color: var(--border, #444); +} + +.notifications_page .ui_stats .unit .stage { + background-color: var(--post, #111); +} + +.notifications_page .ui_stats .unit:hover .button .stage { + background-color: #000; +} + +.notifications_page .ui_stats .plop:after { + border-top-color: var(--post, #111); +} + +.notifications_page .ui_stats .row .unit .brag, +.notifications_page .ui_tops .tops_box .tops_header h1, +.notifications_page .ui_notes_switcher .active { + color: var(--primary, #DDD); +} + +.notifications_page .ui_tops .tops_box.tops_post { + border-left-color: #000; +} + +.notifications_page #user_graphs .axis-label { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} + +.notifications_block { + border-bottom-color: #000 !important; + background-color: unset !important; +} + +.notifications_page .ui_sticky.is_sticky .notifications_block { + display: none !important; +} + +.activity-notification { + border-top-color: var(--border, #444) !important; +} + +.activity-notification .activity-notification__activity_message.conversational { + background-color: var(--note, #444) !important; +} + +.activity-notification .activity-notification__activity_main { + color: var(--primary, #DDD) !important; +} + +.activity-notification .activity-notification__activity_main .activity { + color: var(--primary, #DDD) !important; +} + +.activity-notification .activity-notification__activity_response blockquote { + color: var(--primary, #DDD) !important; +} + +.notifications_page .marker_tooltip { + background-color: var(--post, #111); + color: var(--primary, #DDD) !important; + border-color: var(--border, #444) !important; +} + +.notifications_page .marker_tooltip_header { + background: linear-gradient(to bottom, var(--post, #111) 0%, #000 100%); + color: var(--primary, #DDD); + border-bottom-color: var(--border, #444); +} + +.notifications_page .marker_tooltip td { + color: var(--primary, #DDD); + border-top-color: var(--border, #444); + border-bottom-color: var(--border, #444); +} + +/*========================================popup======================================*/ +.popover--activity-popover .activity-popover-header .selected-blog { + color: var(--primary, #DDD); +} + +.popover--activity-popover .blog-activity .blog-activity-content { + border-top-color: var(--border, #444); +} + +.date_header { + background-color: var(--menu-header, #000) !important; + color: var(--primary, #DDD) !important; +} + +.activity-notification:hover, +.activity-notification:hover.is_friend { + background-color: var(--accent-hi); +} + +.activity-notification:not(:first-child) { + border-top-color: var(--border, #444); +} + +/*=====================================*/ +.activity-notification { + background-color: var(--popover, #111); +} + +.activity-notification .activity a { + color: var(--primary, #DDD); +} + +.activity-notification .activity { + color: var(--secondary, #888) !important; +} + +.activity-notification .conversational { + background-color: var(--bubble, #444) !important; +} + +.activity-notification .conversational .activity a { + color: var(--primary, #DDD); +} + +.activity-notification .conversational .activity, +.activity-notification .conversational .activity .is_part_reblog { + color: var(--secondary, #888); +} + +/*=====================================*/ +.activity-notification:hover { + background-color: var(--accent-hi); +} + +.activity-notification:hover .activity a { + color: var(--primary-selected, #111); +} + +.activity-notification:hover .activity { + color: var(--secondary, #888) !important; +} + +.activity-notification:hover .conversational { + background-color: var(--special-bubble, #222) !important; +} + +.activity-notification:hover .conversational .activity a { + color: var(--primary, #DDD); +} + +.activity-notification:hover .conversational .activity, +.activity-notification:hover .conversational .activity .is_part_reblog { + color: var(--secondary, #888); +} + +/*=====================================*/ +.activity-notification:active { + background-color: var(--accent-hi2); +} + +/*=====================================*/ +.activity-notification.is_friend .activity a { + color: var(--accent) !important; +} + +.activity-notification.is_friend .conversational { + background-color: var(--special-bubble, #222) !important; +} + +/*=====================================*/ +.activity-notification.is_friend:hover .activity a { + color: var(--accent) !important; +} + +.activity-notification.is_friend:hover .conversational { + background-color: var(--special-bubble, #222) !important; +} + +/*=====================================*/ +.activity-notification.is_friend:active { + background-color: var(--accent-hi2); +} + +/*=====================================*/ +.popover--activity-popover .blog-activity .blog-activity-more { + background-color: var(--post, #111); + color: var(--secondary, #888); + border-top-color: var(--border, #444); +} + +.note_follow { + color: var(--accent) !important; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_creating-new-blog.css b/Themes/nightfall/nightfall_creating-new-blog.css new file mode 100644 index 000000000..5a42b809a --- /dev/null +++ b/Themes/nightfall/nightfall_creating-new-blog.css @@ -0,0 +1,48 @@ +/*https://www.tumblr.com/new/blog*/ +.dashboard_account_create_tumblelog .l-content { + background-color: var(--post, #111) !important; +} + +.dashboard_account_create_tumblelog .l-content h1, +.dashboard_account_create_tumblelog .blurb { + color: var(--primary, #DDD) !important; +} + +.dashboard_account_create_tumblelog #create_tumblelog div { + background-color: var(--post, #111) !important; + border-color: var(--border, #444) !important; +} + +.dashboard_account_create_tumblelog #create_tumblelog .inner-left_column { + color: var(--primary, #DDD); +} + +.dashboard_account_create_tumblelog #create_tumblelog .inner-right_column { + color: var(--secondary, #888); +} + +.dashboard_account_create_tumblelog #new_group_title, +.dashboard_account_create_tumblelog #validate_tumblelog_loader, +.dashboard_account_create_tumblelog #new_group_password_protected { + color: var(--primary, #DDD) !important; +} + +.dashboard_account_create_tumblelog #validate_tumblelog_loader .text_field_wrapper, +.dashboard_account_create_tumblelog #validate_tumblelog_loader .text_field_wrapper input, +.dashboard_account_create_tumblelog #validate_tumblelog_loader .text_field_wrapper label { + background-color: var(--input-bg, #000) !important; +} + +.dashboard_account_create_tumblelog .text_field_wrapper label { + color: var(--secondary, #888); +} + +.inner-right_column label { + color: var(--primary, #DDD); +} + +/*make Cancel button get darker when active, not lighter*/ +.dashboard_account_create_tumblelog .chrome:active { + background-color: rgba(255, 255, 255, 0.1); + border-color: rgba(255, 255, 255, 0.1); +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_creating-new-post.css b/Themes/nightfall/nightfall_creating-new-post.css new file mode 100644 index 000000000..ad8a9d521 --- /dev/null +++ b/Themes/nightfall/nightfall_creating-new-post.css @@ -0,0 +1,115 @@ +/*=====================================all posts=====================================*/ +#new_post_buttons { + background: unset; +} + +#new_post_buttons .post.post_full { + background: var(--post, #111); +} + +#new_post_buttons .new_post_label { + color: var(--primary, #DDD) !important; +} + +#new_post_buttons .new_post_label i { + line-height: 62px; + transition-property: transform; +} + +#new_post_buttons .new_post_label:hover i[class^="icon_post_"] { + line-height: 62px; + transform: translateY(-4px); +} + +/*=====================================text posts====================================*/ +#new_post_buttons .new_post_label i.icon_post_text { + color: var(--primary, #DDD); +} + +.post-form--text .editor-slot { + background-color: var(--post, #111); +} + +.post-form--text .editor-slot .editor-plaintext { + background: unset; + color: var(--primary, #DDD); +} + +.post-form--text .post-form--tag-editor .editor-slot .editor-plaintext { + color: var(--secondary, #888); +} + +/*====================================photo posts====================================*/ +/*also works for video posts*/ +.post-form .media-dropzone { + background-color: var(--post, #111); + color: var(--primary, #DDD); + border-top-color: var(--border, #444); + border-bottom-color: var(--border, #444); +} + +.post-form .media-dropzone.split-dropzone .split-cell-inner:after { + background-color: var(--border, #444); +} + +.post-form .media-dropzone.show-input, +.post-form .media-dropzone.show-input .media-url { + background-color: var(--post, #111); +} + +/*icon to add link*/ +.post-form .overlay-button.active .icon { + color: var(--accent); +} + +@keyframes show-input { + 0% { + background-color: #000; + } + + to { + background-color: var(--post, #111); + } +} + +/*====================================quote posts====================================*/ + + +/*=====================================link posts====================================*/ +.post-form--link .media-wrapper .link-editor { + background-color: var(--post, #111); + color: var(--primary, #DDD); + border-top-color: var(--border, #444); + border-bottom-color: var(--border, #444); +} + +.post-form--link .media-wrapper .media-container .editor { + background-color: var(--bubble, #444) !important; + color: var(--primary, #DDD) !important; +} + +.post-form--link .media-wrapper .media-container .link-media-body, +.post-form--link .media-wrapper .media-container .link-media-body .editor{ + background-color: var(--bubble, #444); +} + +.post-form--link .media-wrapper .link-media-body .publisher-container .publisher, +.post-form--link .media-wrapper .title .editor, +.post-form--link .media-wrapper .summary .editor { + color: var(--primary, #DDD) !important; +} + + + +/*=====================================chat posts====================================*/ + + +/*====================================audio posts====================================*/ +.post-form--audio .audio-search-results-field .audio-result-set .result.cycled, +.post-form--audio .audio-search-results-field .audio-result-set .result:hover { + background-color: var(--accent-hi); + color: var(--accent-hi-text); +} + +/*====================================video posts====================================*/ +/*check photo posts*/ \ No newline at end of file diff --git a/Themes/nightfall/nightfall_explore-search.css b/Themes/nightfall/nightfall_explore-search.css new file mode 100644 index 000000000..4162be0dd --- /dev/null +++ b/Themes/nightfall/nightfall_explore-search.css @@ -0,0 +1,102 @@ +/*======================================explore======================================*/ +/*https://www.tumblr.com/explore*/ +.discover-controls-wrapper .types-tabs:before { + content: "\EA3B"; + font-family: tumblr-icons, blank; + margin-left: 6px; + margin-right: 9px; + transform: scale(1.75); +} + +/*same as .discover-controls-wrapper .types-tabs>.content-control*/ +.discover-controls-wrapper .types-tabs:before { + display: block; + float: left; + padding: 10px 7px; + font-size: 14px; + color: hsla(0,0%,100%,.6); + line-height: 1.07em; + text-align: center; +} + +.post_brick { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} + +.post_brick .post_header { + color: var(--primary, #DDD) !important; + border-bottom-color: var(--border, #444) !important; +} + +.post_brick .expand-post-content, +.post_brick.is_photo .post_media+.expand { + background-color: var(--post, #111); + background-color: #444444e6; +} + +.post_brick .post_tags:after { + background-image: linear-gradient(90deg, transparent 0%, var(--post, #111) 80%); +} + +.post_brick .post-brick-source-footer { + color: var(--secondary, #888); + border-top-color: var(--border, #444); +} + +.post-activity-note-content .more-actions, +.post-activity-reply .text-input, +.post-activity-actions-popover .popover-inner>ul button { + color: var(--primary, #DDD); +} + +/*=======================================search======================================*/ +/*https://www.tumblr.com/search/TERM*/ +.search-follow-button .follow-text { + color: var(--accent); +} + +#search_actions_search .l-content, +#search_actions_search .tumblelog_mask_item { + background-color: unset; +} + +.filter_popover .menu_inner { + background-color: var(--popover, #111); +} + +.search_control_items .menu_inner { + color: var(--primary, #DDD); +} + +.search_control_items .item_divider { + border-bottom-color: var(--border, #444); +} + +.search_control_items .menu_item:hover { + background-color: var(--accent-hi); + color: var(--accent-hi-text); +} + +.search_control_items .post_text_filter .icon {color: var(--primary, #DDD) !important;} + +/*keep default colourings*/ +.search_control_items .post_text_filter:hover {background: #8f8f8f !important;} +.search_control_items .post_photo_filter:hover {background: #d95e40 !important;} +.search_control_items .post_quote_filter:hover {background: #f2992e !important;} +.search_control_items .post_link_filter:hover {background: #56bc8a !important;} +.search_control_items .post_chat_filter:hover {background: #529ecc !important;} +.search_control_items .post_audio_filter:hover {background: #a77dc2 !important;} +.search_control_items .post_video_filter:hover {background: #748089 !important;} +.search_control_items .post_ask_filter:hover {background: #444444 !important;} + +.post.post_full .post_tags.fadeable { + max-height: 70px; +} + +.see-all-tags { + padding: 5px; + box-sizing: content-box; + text-align: center; + width: auto; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_follow-pills.css b/Themes/nightfall/nightfall_follow-pills.css new file mode 100644 index 000000000..66a50fe34 --- /dev/null +++ b/Themes/nightfall/nightfall_follow-pills.css @@ -0,0 +1,478 @@ +/*.reblog_follow_button = next to posts in dash and peepr-body, the default; +always with a blogname*/ +/*.worded-follow-button = next to recommended posts in dash, post bricks; +always by themselves*/ +/*.search-follow-button = next to search bar in header on search screen; +always by itself*/ +/*.messaging-inbox .compose-start = New Message in messaging; +always by itself*/ + +/*====================================post headers===================================*/ +.post.post_full, +.peepr-body .post.post_full .post_wrapper { + padding: 0px; +} + +.post_header * { + margin: 0px; + padding: 0px; + line-height: unset; + height: unset; + max-width: unset; +} + +.post.post_full .post_header, +.peepr-body .post.post_full .post_header { + display: flex; + align-items: center; + margin: 0px; + padding: 15px 15px 15px 20px; + line-height: 15px; + height: 55px; + width: 100%; +} + +.post.post_full .post_header .post_info { + display: contents; +} + +.post.post_full .post_info_fence, +.post.post_full .post_action_follow { + display: contents !important; +} + +/*=====================================*/ +.post.post_full .post_header .post_info_fence .reblog_source, +.post.post_full .post_header .post_info_fence.has_follow_button .reblog_source { + vertical-align: middle; +} + +.post.post_full .post_header .reblog_icon:before { + content: "\EA92"; + font-family: tumblr-icons, blank; + display: inline-block; + vertical-align: middle; + font-size: 13px; + top: -1px; + left: 0px; + margin: 0px 10px; + transform: scale(2); +} + +.peepr-body .post.post_full .post_header .reblog_icon:before { + margin-left: 0px; +} + +.post.post_full .post_header .reblog_icon, +.peepr-body .post.post_full .post_header .reblog_icon { + display: contents; +} + +/*=====================================*/ +.post.post_full .post_header .post_info .post_info_link:first-child { + display: inline-block; + vertical-align: middle; +} + +.post.post_full.is_note .post_body { + margin-top: 0px; +} + +.post.post_full .post_info .reblog_icon:before { + justify-self: center; +} + +.post.post_full .post_dismiss:hover .post_dismiss_tooltip { + display: inline-block; +} + +.post.post_full .post_info .post_info_fence .reblog_source, +.post.post_full .post_info .post_info_fence.has_follow_button .reblog_source { + display: flex; + align-items: center; + min-width: 0px; +} + +/*to set min width and also hide overflow on blog names in headers*/ +.post.post_full .post_header .post_info .post_info_link:first-child, +.post.post_full .post_header .post_info .post_info_link { + overflow: hidden; + text-overflow: ellipsis; + max-width: unset; + min-width: 2ch; +} + +.post.post_full .post_header .post_info_fence .reblog_source .post_info_link { + margin: 0px; + vertical-align: middle; + height: unset; + text-overflow: ellipsis; + overflow: hidden; + max-width: unset; + justify-self: flex-end; +} + +.post.post_full .vendor_button { + top: 0px; + margin-left: 3px; +} + +.post.post_full .vendor_button, +.post.post_full .vendor_button .button-area { + height: 25px; +} + +.post.post_full .post_media { + margin: 0px; +} + +.peepr-body .post_header a.reblog_info { + height: 25px; +} + +/*==================================dockable videos==================================*/ +.dockable_video_embed .post_header { + display: flex !important; + align-items: center !important; + max-width: unset !important; + overflow: hidden !important; + line-height: 15px !important; + height: 44px !important; + width: 100% !important; + margin: 0px !important; + padding: 10px !important; +} + +.dockable_video_embed .post_header .tumblelog_avatar { + flex-shrink: 0 !important; + width: 25px; + height: 25px; + margin-right: 8px; +} + +.dockable_video_embed .post_header .post_info_tumblelog { + display: inline-block !important; + vertical-align: middle !important; + max-width: 290px !important; + width: calc(100% - 25px - 8px); + min-width: 2ch !important; + overflow: hidden !important; + text-overflow: ellipsis !important; +} + +.dockable_video_embed .post_header .reblog_source { + display: flex !important; + align-items: center !important; + min-width: 0px !important; +} + +.dockable_video_embed .post_header .post_info_link { + display: inline-block !important; + vertical-align: middle !important; + justify-self: flex-end !important; + height: unset !important; + max-width: unset !important; + min-width: 2ch !important; + margin: 0px !important; + overflow: hidden !important; + text-overflow: ellipsis !important; +} + +/*=================================recommended posts=================================*/ + + +/*====================================follow pill====================================*/ +.reblog_follow_button, +.worded-follow-button, +.search-follow-button { + vertical-align: middle; + margin: 0px; + padding: 0px; +} + +.reblog_follow_button .follow-text:before, +.worded-follow-button .follow-text:before, +.search-follow-button .follow-text:before { + content: "\EA45"; + font-family: tumblr-icons, blank; + text-rendering: optimizeLegibility; + display: inline-block; + vertical-align: middle; + color: var(--primary, #DDD); + margin-top: 0px; + margin-bottom: 2px; + padding-right: 8px; + padding-left: 5px; + font-size: 10.8px; + transform: scale(1.6); +} + +.reblog_follow_button .follow-text, +.worded-follow-button .follow-text, +.search-follow-button .follow-text, +.messaging-inbox .inbox-compose-toggle .compose-start { + display: inline-block; + background-color: var(--accent); + color: var(--primary, #DDD); + border-radius: 0px 300px 300px 0px; + height: 25px; + margin: 0px; + padding: 5px 10px 5px 5px; + font-size: 100% !important; + transition: unset; +} + +.is-following.reblog_follow_button .follow-text:before, +.is-following.worded-follow-button .follow-text:before, +.is-following.reblog_follow_button .follow-text, +.is-following.worded-follow-button .follow-text { + transition: none .45s ease-in-out .15s; +} + +/*after pressing Follow button*/ +.is-following.reblog_follow_button .follow-text:before, +.is-following.worded-follow-button .follow-text:before { + content: "\EA1D"; + margin-top: -1px; + padding-right: 5px; + transform: scale(2); + transition-property: padding; +} + +.dockable_video_embed.is_original .post_header .is-following.reblog_follow_button .follow-text:before { + padding-right: 8px; +} + +.is-following.reblog_follow_button .follow-text, +.is-following.worded-follow-button .follow-text { + opacity: 1 !important; + transform: scale(1) !important; + color: var(--accent); + font-size: 0px !important; + transition-property: font-size; +} + +/* +.worded-follow-button .follow-text, +.search-follow-button .follow-text, +.messaging-inbox .inbox-compose-toggle .compose-start, +.peepr-body .reblog_follow_button .follow-text, +#search_actions_search .reblog_follow_button .follow-text { + border-radius: 300px; +} + +.worded-follow-button .follow-text, +.peepr-body .reblog_follow_button .follow-text, +#search_actions_search .reblog_follow_button .follow-text { + margin-left: 10px; + padding: 5px 10px 5px 10px; +} +*/ + +.worded-follow-button .follow-text, +.search-follow-button .follow-text, +.messaging-inbox .inbox-compose-toggle .compose-start, +.peepr-body .reblog_follow_button .follow-text, +#search_actions_search .reblog_follow_button .follow-text, +.dockable_video_embed.is_original .post_header .reblog_follow_button .follow-text { + border-radius: 300px; +} + +.dockable_video_embed.is_original .post_header .reblog_follow_button .follow-text { + padding: 5px 10px 5px 10px; +} + +.worded-follow-button .follow-text, +.peepr-body .reblog_follow_button .follow-text, +#search_actions_search .reblog_follow_button .follow-text { + margin-left: 10px; + padding: 5px 10px 5px 10px; +} + +.post.post_full .post_header .post_info_fence.has_follow_button .reblog_source .post_info_link, +.dockable_video_embed .post_header .reblog_source .post_info_link { + display: inline-block; + background-color: var(--bubble, #444); + color: var(--primary, #DDD); + padding: 5px 8px 5px 10px; + border-radius: 300px 0px 0px 300px; +} + +.peepr-body .indash_blog a.reblog_info { + padding: 5px 0px; +} + +.peepr-body .reblog_follow_button { + margin: 0px !important; +} + +.dockable_video_embed .post_header .reblog_follow_button .follow-text:before { + font-size: 11px !important; +} + +.dockable_video_embed .post_header .reblog_follow_button .follow-text { + padding-right: 5px !important; + font-size: 0px !important; +} + +/*==================================messaging-inbox==================================*/ +.popover--inbox-popover .inbox-compose-toggle { + display: flex; +} + +.popover--inbox-popover .inbox-compose-toggle .compose-start { + padding: 5px 10px; + border-radius: 300px; + height: 15px; + text-align: center; + font-size: 12px !important; +} + +.popover--inbox-popover .inbox-compose-toggle.active .compose-cancel { + display: inline-block; + background-color: var(--bubble, #444); + color: var(--primary, #DDD); + height: 15px; + padding: 5px 10px 5px 10px; + padding-left: 10px; + border-radius: 300px; +} + +.popover--inbox-popover .inbox-recipients .no-results>p { + border-color: var(--border, #444); +} + +/*======================================explore======================================*/ +.worded-follow-button .follow-text { + line-height: 15px; +} + +.discover-tumblelogs .item a.has_follow_button { + padding-right: 100px !important; +} + +.discover-tumblelogs .item .has_follow_button .hide_overflow { + text-overflow: ellipsis !important; +} + +.discover-tumblelogs .item .follow-button-right { + display: flex; + align-items: center; + color: transparent; +} + +.post_brick.reblog_header .post_header { + height: 55px !important; +} + +.post_brick.reblog_header .post_content { + margin-top: 55px !important; +} + +/*=======================================search======================================*/ +/*==================header==================*/ +#search_actions_search .ui_search.active, +#search_actions_search .ui_search.selected, +#search_actions_search .ui_search .search_form_field{ + display: flex; + align-items: center; +} + +#search_actions_search .ui_search .search_form { + width: 100%; +} + +#search_actions_search .ui_search.active .search_form_field:before, +#search_actions_search .ui_search.selected .search_form_field:before { + position: relative; + width: 17px; + top: 1px; + left: 12px; + margin-right: -17px; +} + +#search_actions_search #search_query { + height: 35px; + padding-right: 110px !important; + margin: 0; +} + +#search_actions_search .search-follow-button { + display: flex; + position: relative; + height: unset; + line-height: unset; + right: 0; + margin-left: -89px; + opacity: 0.6; +} + +.active .search-follow-button { + opacity: 1 !important; +} + +#search_actions_search .search-follow-button .follow-text { + height: 15px; + line-height: 15px; + padding: 5px 10px; + border-radius: 300px; + margin: auto; +} + +#search_actions_search .search-follow-button .unfollow-text { + display: inline-block; + background-color: var(--bubble, #444); + color: var(--primary, #DDD); + height: 15px; + line-height: 15px; + padding: 5px 10px 5px 10px; + padding-left: 10px; + border-radius: 300px; +} + +.post_brick.post .post_header { + display: flex; + align-items: center; + height: 55px; + line-height: unset; +} + +.post_brick .post_header .tumblelog_info { + display: contents; +} + +.post_brick.post .post_header .tumblelog_avatar { + vertical-align: middle; +} + +/*avatar*/ +.post_brick.post .post_header .tumblelog_info>a { + display: flex; + align-items: center; +} + +/*blog name + Follow button*/ +.post_brick.post .post_header .post-info-tumblelogs, +.post_brick.post .post_header .tumblelog_info a { + vertical-align: middle; + height: 25px; + line-height: unset; +} + +.post_brick.post .post_header .post-info-tumblelogs, +.post_brick.post .post_header .post-info-tumblelogs .worded-follow-button { + display: flex; + align-items: center; +} + +.post_brick.post .post_header .post-info-tumblelogs .post-info-post-tumblelog { + display: contents; +} + +.post_brick.post .post_header .post-info-tumblelogs .post-info-tumblelog { + color: var(--secondary, #888); + vertical-align: middle; + display: inline-block; + overflow: hidden; + text-overflow: ellipsis; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_header.css b/Themes/nightfall/nightfall_header.css new file mode 100644 index 000000000..bf98938ce --- /dev/null +++ b/Themes/nightfall/nightfall_header.css @@ -0,0 +1,79 @@ +.l-header-container { + background-color: rgba(50, 53, 60, 0.67) !important; +} + +.search_popover { + background-color: var(--menu-header, #000); +} + +.search_popover .search_results_section .search_subheading { + background-color: var(--menu-header, #000); + color: var(--primary, #DDD); + text-shadow: unset; +} + +/* +.popover .search_results_section:first-child .popover_menu_item:nth-child(2):hover, +.popover .search_results_section:first-child .popover_menu_item:nth-child(2):hover a, +.popover .search_results_section:first-child .popover_menu_item:nth-child(2):active, +.popover .search_results_section:first-child .popover_menu_item:nth-child(2):active a { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +.popover .search_results_section .popover_menu_item:nth-child(n+2):hover, +.popover .search_results_section .popover_menu_item:nth-child(n+2):hover a, +.popover .search_results_section .popover_menu_item:nth-child(n+2):active, +.popover .search_results_section .popover_menu_item:nth-child(n+2):active a { + border-radius: 0; + +} + +.popover .search_results_section:last-child .popover_menu_item:last-child:hover, +.popover .search_results_section:last-child .popover_menu_item:last-child:hover a, +.popover .search_results_section:last-child .popover_menu_item:last-child:active, +.popover .search_results_section:last-child .popover_menu_item:last-child:active a { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} +*/ + +/*magnifying glass*/ +.ui_search.active .search_form_field:before, +.ui_search.selected .search_form_field:before { + color: var(--primary, #DDD); +} + +#search_query { + background-color: rgba(0, 0, 0, 0.15); + color: var(--primary, #DDD); +} + +.active #search_query { + background-color: var(--post, #111); +} + +.tab_notice { + background-color: var(--accent) !important; + background-clip: unset; + border-color: var(--accent) !important; +} + +.tab_notice .tab_notice_value { + color: hsla(0, 0%, 100%, 0.6) !important; +} + + +.tab_bar .tab_anchor { + color: var(--compose, #FFF); + opacity: 0.5; +} + +.compose-button { + fill: var(--compose, #FFF) !importnat; + opacity: 0.6; +} + +.compose-button path { + stroke: unset; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_inbox.css b/Themes/nightfall/nightfall_inbox.css new file mode 100644 index 000000000..08aa2b934 --- /dev/null +++ b/Themes/nightfall/nightfall_inbox.css @@ -0,0 +1,13 @@ +/*https://www.tumblr.com/inbox*/ +#dashboard_messages_inbox .post { + background-color: var(--post, #111); +} + +.ask-form .post-container { + background: var(--post, #111); + color: var(--primary, #DDD); +} + +#xinbox-search-box-input { + background-color: var(--post, #111) !important; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_messaging.css b/Themes/nightfall/nightfall_messaging.css new file mode 100644 index 000000000..396c3bd37 --- /dev/null +++ b/Themes/nightfall/nightfall_messaging.css @@ -0,0 +1,165 @@ +/*========================================inbox======================================*/ +.popover--inbox-popover .inbox-compose-toggle .compose-start { + color: var(--accent); +} + +.popover--inbox-popover .popover-inner { + background-color: var(--popover, #111); +} + +.popover--inbox-popover .inbox-header, +.popover--inbox-popover .inbox-conversation, +.popover--inbox-popover .inbox-recipient, +.popover--inbox-popover .inbox-pagination-loader { + border-color: var(--border, #444) !important; +} + +.popover--inbox-popover .selected-blog { + color: var(--primary, #DDD); +} + +.popover--blog-selector-dropdown .avatar .unread-indicator { + border-color: transparent; +} + +.popover--blog-selector-dropdown .item-option .name { + color: var(--primary, #DDD); +} + +.popover--blog-selector-dropdown .item-option:hover .name { + color: var(--primary-selected, #111); +} + +.popover--blog-selector-dropdown .item-option .title { + color: var(--secondary, #888); +} + +.popover--blog-selector-dropdown .item-option:hover .title { + color: var(--secondary-selected, #666); +} + +/*=====================================*/ +.popover--inbox-popover .inbox-conversation:hover { + background-color: var(--accent-hi) !important; +} + +.popover--inbox-popover .inbox-conversation:active { + background-color: var(--accent-hi2) !important; +} + +/*.name-container = blog name*/ +.popover--inbox-popover .inbox-conversation.is-unread .name-container { + color: var(--accent) !important; +} + +.popover--inbox-popover .inbox-conversation .name-container { + color: var(--primary, #DDD); +} + +.popover--inbox-popover .inbox-conversation:hover .name-container { + color: var(--primary-selected, #111); +} + +/*h4 = tagline*/ +.popover--inbox-popover .inbox-conversation h4 { + color: var(--secondary, #888); +} + +.popover--inbox-popover .inbox-conversation:hover .inbox-row h4 { + color: var(--secondary-selected, #666); +} + +/*=====================================*/ +.popover--inbox-popover .inbox-compose .inbox-compose-input .input { + color: var(--primary, #DDD); +} + +/*h2 = "Recently Followed"*/ +.popover--inbox-popover .inbox-compose h2 { + background-color: var(--menu-header, #000); + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +.popover--inbox-popover .inbox-compose .inbox-recipient:hover { + background-color: var(--accent-hi) !important; +} + +/*h3 = blog name*/ +.popover--inbox-popover .inbox-compose .inbox-recipient h3 { + color: var(--primary, #DDD); +} + +.popover--inbox-popover .inbox-compose .inbox-recipient:hover h3 { + color: var(--primary-selected, #111); +} + +/*h4 = tagline*/ +.popover--inbox-popover .inbox-compose .inbox-recipient h4 { + color: var(--secondary, #888); +} + +.popover--inbox-popover .inbox-compose .inbox-recipient:hover h4 { + color: var(--secondary-selected, #666); +} + +.popover--inbox-popover .inbox-compose .inbox-recipient .send-link { + color: var(--accent) !important; +} + +/*========================================popup======================================*/ +.popover--conversation-popover .conversation-compose, +.popover--conversation-popover .conversation-compose .text-input-container .text-input, +.popover--conversation-popover .conversation-compose .compose-text-input-container, +.popover--conversation-popover .conversation-main { + background-color: var(--popup-menu, #111) !important; + color: var(--primary, #DDD) !important; + border-top-color: var(--border, #444); +} + +.popover--conversation-popover .message-bubble { + background-color: var(--bubble, #444) !important; + color: var(--primary, #BBB) !important; +} + +.popover--conversation-popover .conversation-preview { + background: var(--popup-menu, #111) !important; +} + +/*hide system scroll bar*/ +.popover--conversation-popover .conversation-main .tx-scroll-container--vertical, +.messaging-conversation-popovers .messaging-open-conversations +.popover--conversation-popover .conversation-main .tx-scroll .tx-scroll-container--vertical { + padding-right: 20px !important; +} + +.popover--conversation-popover .conversation-messages .conversation-pill button.themed { + background-color: var(--accent); + border-color: var(--accent); +} + +.popover--conversation-popover .popover--conversation-actions .conversation-actions li:hover > a { + color: var(--accent-hi-text); +} + +.popover--stickers { + background-color: var(--popover, #111); +} + +/*to remove native scrollbar and replace with Tumblr scrollbar*/ +.popover--conversation-popover .conversation-main { + margin-right: -20px; +} + +.popover--conversation-popover .tx-scroll .tx-scrollbar-track { + margin-right: 20px; + opacity: 0; +} + +.popover--conversation-popover .tx-scroll:hover .tx-scrollbar-track { + opacity: 1 !important; +} + +.popover--conversation-popover .tx-scroll .tx-scroll-container > div { + padding-right: calc(15px + 6px + 2px); +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_notes.css b/Themes/nightfall/nightfall_notes.css new file mode 100644 index 000000000..956e2d5d5 --- /dev/null +++ b/Themes/nightfall/nightfall_notes.css @@ -0,0 +1,122 @@ +.post-activity-popover, +.post-activity-popover .post-activity-reply { + border-color: var(--border, #444); +} + +.post-activity-popover .popover_inner { + background: unset; + box-shadow: unset; +} + +.post-activity-popover .post-activity-header { + background: var(--note, #111); + box-shadow: inset 0 1px 0 var(--border, #444); +} + +.post-activity-header .return:before, +.post-activity-header .tags-mode-button:before { + color: var(--primary, #DDD); +} + +.post-activity-header .subscription-status .inner { + fill: var(--note, #111); +} + +.post-activity-header .subscription-status .outer, +.post-activity-header .subscription-status .bolt { + fill: var(--primary, #DDD); +} + +.post-activity-header .subscription-status.is-subscribed .inner { + fill: var(--secondary, #888); +} + +.post-activity-header .subscription-status.is-subscribed .outer, +.post-activity-header .subscription-status.is-subscribed .bolt { + fill: #FFF; +} + +.post-activity-popover .post-activity-rollups { + background: var(--note, #111); + cursor: pointer !important; +} + +.post-activity-popover .post-activity-rollups .rollup-notes-summary { + color: var(--primary, #DDD); +} + +.post-activity-popover .note-text-reblog-parent, +.post-activity-popover .note-text-reblog-parent a { + color: var(--secondary, #888) !important; +} + +.post-activity-popover .post-activity-notes, +.post-activity-popover .post-activity-note, +.post-activity-popover .post-activity-reply .editor-slot { + background-color: var(--note, #111); + color: var(--primary, #DDD); +} + +.post-activity-popover .post-activity .header-container-inner>* { + border-bottom-color: var(--border, #444); +} + +.post-activity-popover .post-activity-note .note-text { + color: var(--primary, #DDD); +} + +.post-activity-popover .post-activity-actions-popover .popover-inner>ul button:hover { + background-color: var(--accent-hi) !important; + color: var(--primary-selected, #111) !important; +} + +.post-activity-popover .post-activity-actions-popover .popover-inner .report:hover, +.post-activity-popover .post-activity-actions-popover .popover-inner .block:hover { + background-color: var(--danger) !important; + color: var(--primary, #DDD) !important; +} + +.post-activity-notes .with-commentary .post-activity-note-content { + background-color: var(--bubble, #444); +} + +.post-activity-notes .is-followed.post-activity-note { + background-color: var(--special-bubble, #444) !important; + border-top-color: var(--special-border, #222) !important; + border-bottom-color: var(--special-border, #222) !important; +} + +.post-activity-notes .is-followed .post-activity-note-content { + background-color: var(--special-bubble, #222) !important; + border-color: var(--special-border, #222) !important; +} + +.post-activity-reply .inline-controls .opener, +.post-activity-reply .inline-controls .opener:hover { + color: var(--note, #111); +} + +.post-activity-header .primary-message { + color: var(--primary, #DDD) !important; +} + +/*.post-activity-reply .editor-slot .editor-placeholder { + color: var(--secondary, #888) !important; +}*/ + +.post-activity-notes .post-activity-note-content .note-added-tags, +.post-activity-notes .post-activity-note-content .note-added-text, +.post-activity-notes .post-activity-note-content .note-text .note-text-link { + color: var(--primary, #DDD) !important; +} + +.post-activity-notes .post-activity-note-content .note-added-tags .tag, +.post-activity-notes .post-activity-note-content .note-added-text .tag { + display: inline-block; + background-color: var(--tag, #222); + color: var(--secondary, #888); + line-height: 15px; + margin: 5px 5px 0 0; + padding: 5px; + border-radius: 3px; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_peepr.css b/Themes/nightfall/nightfall_peepr.css new file mode 100644 index 000000000..52417cf48 --- /dev/null +++ b/Themes/nightfall/nightfall_peepr.css @@ -0,0 +1,42 @@ +.peepr-big-loader, +.peepr-body { + background-image: var(--accent-grad); +} + +.peepr-body .indash_blog .post { + box-shadow: unset; +} + +.peepr-body .indash_blog .post_tags:after { + background: unset; +} + +.peepr-body .indash_blog .posts { + padding: 20px 20px 20px; +} + +.peepr-body .indash_blog .post_content h2 { + color: var(--primary, #DDD); +} + +.see_all_tags { + background: linear-gradient(to right, transparent, var(--post, #111)); + height: unset; + width: unset; + bottom: 6px; + padding: 5px 0px; + padding-left: 10px; +} + +.peepr-body .post[data-tumblelog-name] .post_permalink { + border: unset; + box-shadow: unset; +} + +.navigation .snowman-icon:before { + color: unset; +} + +.empty-state-message-box { + color: var(--secondary); +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_popover-general.css b/Themes/nightfall/nightfall_popover-general.css new file mode 100644 index 000000000..beacb9335 --- /dev/null +++ b/Themes/nightfall/nightfall_popover-general.css @@ -0,0 +1,98 @@ +.popover { + background-color: var(--popover, #111) !important; +} + +.popover > .popover_inner { + background: var(--popover, #111) !important; + color: var(--primary, #DDD) !important; + border-color: #222 !important; + box-shadow: inset 0 1px 0 var(--border, #444) !important; +} + +.pop-menu { + background-color: var(--popover, #111) !important; +} + +.popover > .popover_inner .header, +.pop-menu .header-item { + background-color: var(--menu-header, #000) !important; + color: var(--primary, #DDD) !important; + border-top-color: var(--border, #444) !important; + border-bottom-color: var(--border, #444) !important; +} + +.popover .popover_menu_item, +.popover .popover_menu_item a { + color: var(--primary, #DDD) !important; +} + +.info_popover li, +.info_popover li a, +.popover .popover_menu_item, +.popover .popover_menu_item a, +.pop-menu .item-option { + color: var(--primary, #DDD) !important;; +} + +.info_popover li:hover, +.info_popover li:hover a, +.popover .popover_menu_item:hover, +.popover .popover_menu_item:hover a, +.pop-menu .item-option:hover { + background-color: var(--accent-hi) !important; + color: var(--accent-hi-text, #111) !important; +} + +.info_popover li:active, +.info_popover li:active a, +.popover .popover_menu_item:active, +.popover .popover_menu_item:active a, +.popover .popover_menu_item.keyboard_focus, +.pop-menu .item-option:active { + background-color: var(--accent-hi2) !important; + color: var(--accent-hi-text, #111) !important; +} + +.popover .popover_menu_item:hover, +.popover .popover_menu_item:hover a, +.popover .popover_menu_item:active, +.popover .popover_menu_item:active a, +.popover .popover_menu_item.keyboard_focus { + border-radius: 3px; +} + +.popover_menu_item:hover .delete { + background-color: var(--danger) !important; + color: var(--primary-selected) !important; +} + +/*for account-popover*/ +.popover .popover_menu_item_blog:hover, +.popover .popover_menu_item_blog:hover a { + background-color: unset !important; + color: unset !important; +} + +.popover *:first-child .popover_menu_item:first-child:hover, +.popover *:first-child .popover_menu_item:first-child:hover a, +.popover *:first-child .popover_menu_item:first-child:active, +.popover *:first-child .popover_menu_item:first-child:active a { + border-bottom-left-radius: 0; + border-bottom-right-radius: 0; +} + +.popover * .popover_menu_item:nth-child(n+2):hover, +.popover * .popover_menu_item:nth-child(n+2):hover a, +.popover * .popover_menu_item:nth-child(n+2):active, +.popover * .popover_menu_item:nth-child(n+2):active a { + border-radius: 0; + +} + +.popover *:last-child .popover_menu_item:last-child:hover, +.popover *:last-child .popover_menu_item:last-child:hover a, +.popover *:last-child .popover_menu_item:last-child:active, +.popover *:last-child .popover_menu_item:last-child:active a { + border-bottom-left-radius: 3px; + border-bottom-right-radius: 3px; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_post-types.css b/Themes/nightfall/nightfall_post-types.css new file mode 100644 index 000000000..3e5b0b968 --- /dev/null +++ b/Themes/nightfall/nightfall_post-types.css @@ -0,0 +1,632 @@ +/*=====================================all posts=====================================*/ +.post_header .post_info .post_info_link:first-child { + color: var(--primary, #DDD) !important; +} + +.reblog_icon { + font-size: 0px !important; +} + +.post_header .post_info_fence .reblog_source .reblog_icon, +.post_header .post_info_fence .reblog_source .post_info_link, +.post_header .post_info_fence .reblog_source .post_info_link:hover, +.post_header .post_info .submission_icon, +.peepr-body .post_header .indash_blog .post_info_link, +.peepr-body .post_header .indash_blog .post_info_link:hover { + color: var(--secondary, #888); +} + +.post_header .post_source_app_name { + margin-left: 10px; +} + +.post-transition-background { + background: var(--post, #111); +} + +/*no dog-ears*/ +/* +.post.post_full.is_note { + background: var(--post, #111); +} +*/ + +.post.post_full, +.peepr-body .indash_blog .post { + background: linear-gradient(225deg, transparent 0%, transparent calc((16px / 0.707) / 2), var(--post, #111) calc((16px / 0.707) / 2), var(--post, #111) 100%); +} + +.post.post_full .post_wrapper { + position: relative; +} + +.peepr-body .post .post_wrapper { + z-index: 0; +} + +.post_full .post_permalink { + position: absolute; + z-index: unset !important; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M0 0v1h1z' fill='%23888' shape-rendering='crispEdges'/%3E%3C/svg%3E") -.1px no-repeat; + border: unset; + border-bottom-left-radius: 5px; + opacity: 1; + width: 0px; + height: 0px; + top: 0px; + right: 0px; +} + +.post_full:hover .post_permalink { + width: 16px; + height: 16px; +} + +/*for a rounded corner*/ +@supports (clip-path: polygon(0 0)) { + .post_full .post_permalink:before { + content: ""; + position: absolute; + z-index: -1; + display: inline-block; + background: var(--post, #111); + width: 16px; + height: 16px; + top: 0px; + right: 0px; + border-top-right-radius: 3px; + clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0, 100% 0); + } + + .post_full:hover .post_permalink:before { + clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 100%, 0 0); + } + + .post_full .post_permalink, + .post_full:hover .post_permalink, + .post_full .post_permalink:before, + .post_full:hover .post_permalink:before { + transition: none .15s ease-in; + transition-property: + width, + height, + clip-path; + } +} + +@supports not (clip-path: polygon(0 0)) { + .post_full .post_permalink:before { + content: ""; + position: absolute; + z-index: -1; + display: inline-block; + background: linear-gradient(45deg, var(--post, #111) 50%, transparent 50%); + width: 16px; + height: 16px; + top: -16px; + right: -16px; + padding-top: 16px; + padding-right: 16px; + background-clip: content-box; + } + + .post_full:hover .post_permalink:before { + background: linear-gradient(45deg, var(--post, #111) 49%, transparent 49%); + background-clip: content-box; + top: 0px; + right: 0px; + padding-top: 0px; + padding-right: 0px; + } + + .post_full .post_permalink, + .post_full:hover .post_permalink, + .post_full .post_permalink:before, + .post_full:hover .post_permalink:before { + transition: none .15s ease-in; + transition-property: + width, + height, + top, + right, + padding; + } +} + +.reblog_follow_button .follow-text, +.worded-follow-button .follow-text, +.search-follow-button .follow-text { + color: var(--accent); +} + +.reblog-list, +.reblog-trail--original-post { + border-top: 1px solid #444; + border-top-color: var(--border, #444); +} + +.reblog-list-item { + border-bottom: 1px solid #444; + border-bottom-color: var(--border, #444); +} + +figure>p.tmblr-attribution { + background-color: var(--menu-header, #000) !important; + color: var(--secondary, #888) !important; +} + +.post-content-text blockquote, +.post .post_body blockquote, +.reblog-content blockquote, +.peepr-body .indash_blog .post_content blockquote { + border-left-color: var(--primary, #BBB); + background: #444; + padding: 15px; + border-radius: 0px 3px 3px 0px; +} + +.npf-link-block { + border-color: var(--border, #444); +} + +.npf-link-block a { + padding-bottom: 0px !important; +} + +.npf-link-block .bottom { + background: var(--bubble, #444) !important; + color: var(--primary, #DDD) !important); +} + +/*horizontal line*/ +.post.post_full hr { + border-top-color: var(--primary, #DDD) !important); +} + +/*Keep Reading*/ +.tmblr-truncated { + margin: 15px 0; +} + +.tmblr-truncated .tmblr-truncated-link, +.tmblr-truncated:after { + color: var(--accent) !important; + border-bottom: unset !important; +} + +.post .post-source-footer { + background: unset; +} + +.post .post-source-footer .post-source-name-prefix, +.post .post-source-footer a.post-source-link { + vertical-align: top; +} + +.post .post-source-footer, +.post .post-source-footer a.post-source-link, +.post .post_tags .post_tag, +.post .post_footer { + color: var(--secondary, #888) !important; +} + +.post_controls .post_control:before { + color: var(--secondary, #888); +} + +.post_controls .post_control.reblog.reblogged:after { + background-color: var(--post, #111); +} + +.post_full .post_tags .post_tag, +.post_brick .post_tags .post_tag { + background-color: var(--tag, #222); + margin: 10px 10px 0px 0px; + padding: 5px; + line-height: 15px; + border-radius: 3px; +} + +.post_full .post_tags.fadeable, +.post_full .post_tags.fadeable-source, +.post_brick .post_tags .post_tag { + margin-top: 0px !important; +} + +.post .post_tags_inner { + font-size: 0px; +} + +.post.has_source .post_tags.draggable:before { + background-image: linear-gradient(270deg, transparent, var(--post, #111)) +} + +a.post_tag.ask.post_ask_me_link:before, +.post-source-footer:before { + display: inline-block; + vertical-align: top; + font-family: tumblr-icons, blank; + font-weight: normal; +} + +a.post_tag.ask.post_ask_me_link:before { + content: "\EA5B"; + font-size: 145%; + padding-right: 5px; + margin-left: -2px; + margin-top: -0.5%; +} + +a.post_tag.ask.post_ask_me_link { + background-color: var(--bubble, #444); + color: var(--primary, #DDD); + vertical-align: top; + font-weight: bold; +} + +.post .post-source-footer:before { + content: "\EA70"; + font-size: 170%; + padding-right: 2px; + margin-left: -4px; +} + +.post .post-source-footer { + background-color: var(--tag, #222); + margin: 15px 10px 0px 20px; + padding: 5px; + line-height: 15px; + border-radius: 3px; + font-weight: bold; + white-space: nowrap; +} + +.post_animated_heart.unliked { + color: var(--secondary) !important; +} + +/*=====================================text posts====================================*/ + + +/*====================================photo posts====================================*/ +/*.flipcard = looking at camera information on photos*/ +.flipcard .flipcard_back { + background-color: #000; + color: var(--primary, #DDD); +} + +.flipcard .flipcard_back .photo_exif_row:not(:last-child) { + border-bottom: 2px solid var(--secondary, #888); +} + +.flipcard .flipcard_back .photo_exif_row .label { + color: var(--secondary, #888); + padding-top: 15px; + padding-bottom: 15px; +} + +.flipcard .flipcard_back .photo_exif_row .data { + border: unset; +} + +/*====================================quote posts====================================*/ +.post_full.is_quote .post_title, +.post_brick.is_quote .post_title { + color: var(--primary, #DDD); +} + +/* +.post_brick.is_conversation .conversation_lines .chat_line:nth-child(2n), +.peepr-body .indash_blog .post_chrome.chat .conversation_lines .chat_line:nth-child(2n) { + background-color: unset; + color: var(--primary, #DDD); +} +*/ + +.conversation_lines .chat_line { + background-color: unset !important; + color: var(--primary, #DDD) !important; +} + +/*=====================================link posts====================================*/ +.is_link .link-button { + background-color: var(--bubble, #444) !important; +} + +.is_link .link-button:active { + background-color: var(--link-bg, #000) !important; +} + +.is_link .link-button .title, +.is_link .link-button .excerpt { + color: var(--primary, #DDD) !important; +} + +.is_link .link-button:active .title, +.is_link .link-button:active .excerpt { + color: var(--primary, #DDD) !important; +} + +.is_link .link-button .publisher { + color: var(--primary, #DDD) !important; +} + +.is_link .link-button:active .publisher { + color: var(--primary, #DDD) !important; +} + +/*=====================================chat posts====================================*/ + + +/*====================================audio posts====================================*/ + + +/*====================================video posts====================================*/ +.post .dockable_video_embed.docked_post_underlay { + background-color: var(--post, #111); +} + +.post .dockable_video_placeholder { + color: var(--secondary, #888); + border-color: var(--border, #444); +} + +/*tumblr is setting the wrong height on dockable videos*/ +.dockable_video_embed.docked [id^='embed-'] { + height: unset; +} + +/*=====================================ask posts=====================================*/ +.post_full.is_note .post_body .note_item, +.peepr-body .indash_blog .post_chrome.answer .post_body .note_item { + background: var(--bubble, #444); + border-color: var(--bubble, #444); +} + +.post_full.is_note .nipple, +.peepr-body .indash_blog .post_chrome.answer .nipple, +.post_brick.is_note .nipple { + border-left-color: var(--bubble, #444); +} + +.asker, +.answerer { + color: var(--primary, #DDD); +} + +.post_brick.is_note .note_item { + background-color: var(--bubble, #444); + border-color: var(--bubble, #444); +} + +/*=====================================nsfw posts====================================*/ +/*no dog-ear*/ /*REQUIRES "nightfall_follow-pills.css"*/ +.post .post_content_inner.safemode:before, +.post .post_content_inner.tagfiltering:before { + content: ""; + position: absolute; + display: inline-block; + background: var(--post, #111); + width: 17px; + height: 17px; + top: -55px; + right: 0px; + border-top-right-radius: 3px; +} + +.post .post_content_inner.safemode, +.post .post_content_inner.tagfiltering { + background: var(--link-bg, #000); +} + +.safemode span.message { + color: var(--secondary, #666); +} + +/*change button colours*/ +.post .post_content_inner.safemode .tx-button, +.post .post_content_inner.tagfiltering .tx-button { + background-color: transparent; + border-color: var(--border, #444); + color: var(--secondary, #666); +} + +.safemode .link, +.tagfiltering .link { + color: var(--accent) !important; +} + +.link-tagfiltering-settings.link { + display: inline-block !important; + box-sizing: content-box !important; + background-color: var(--danger, #d95e40) !important; + color: var(--primary, #DDD) !important; + height: 15px !important; + line-height: 15px !important; + padding: 5px !important; + border-radius: 3px !important; + margin-top: 7px !important; +} + +/*====================================radar posts====================================*/ +.radar .radar_controls { + background-color: var(--post, #111); +} + +/*to copy post-source-footer*/ +.radar .radar_controls .note_count>a, +.radar .radar_controls .radar_button { + color: var(--secondary, #666); +} + +.radar .radar_post, +.radar.radar_type_regular .radar_content { + background: var(--post, #111); +} + +.radar.radar_type_regular .header_flag { + background: #000; + border-top-color: var(--border, #444); + border-bottom-color: var(--border, #444); +} + +.radar.radar_type_regular .radar_superglass { + background: unset; +} + +.radar.radar_type_quote .radar_content, +.radar.radar_type_link .radar_content, +.radar.radar_type_converstaion .radar_content, +.radar.radar_type_regular .radar_content { + color: var(--primary, #DDD); + padding-top: 20px; +} + +.radar.radar_type_quote .radar_content:after, +.radar.radar_type_link .radar_content:after, +.radar.radar_type_converstaion .radar_content:after, +.radar.radar_type_regular .radar_content:after { + background: var(--border, #444); +} + +.radar .radar_footer .radar_avatar:before { + background: unset; +} + +#right_column:after { + background: none !important; +} + +/*=================================recommended posts=================================*/ +.post.post_full.is_recommended .post_header { + display: grid; + grid-template-columns: auto 1fr auto auto auto; + align-items: center; +} + +.post.post_full.is_recommended .post_header .post_info_link:first-child, +.dockable_video_embed .post_header .post_info_tumblelog { + overflow: hidden; + text-overflow: ellipsis; +} + +.post_full.is_recommended .post_action_wrapper, +.post_full.is_recommended .post_action_wrapper .post_action_item { + display: contents; +} + + +/*.icon_close:before, */ +.post_full .post_header .post_dismiss .post_dismiss_tooltip { + background: unset; + color: var(--secondary, #666); +} + +.icon_close:before { + background: unset; + color: var(--primary, #888); +} + +.post_full .post_header .post_dismiss, +.post_full .post_header .post_dismiss .post_dismiss_tooltip, +.post_full .post_header .dismiss_icon, +.post_full .post_header .dismiss_icon .icon_close { + margin: 0px; + padding: 0px; + top: 0px; + right: 0px; + left: 0px; + bottom: 0px; + line-height: inherit; +} + +.post_full .post_header .post_dismiss { + display: flex; + align-items: center; + justify-content: flex-end; + display: contents; +} + +.post_full .post_header .post_dismiss .post_dismiss_tooltip { + display: inline-block; + overflow: hidden; + width: 100%; + margin-right: -300px; + padding-left: 10px; + opacity: 1; + transition: margin 0.2s ease-in-out, opacity 0.2s ease-in-out; +} + +.post_full .post_header .post_dismiss:hover .post_dismiss_tooltip { + width: 100%; + margin-right: 0px +} + +.post_full .post_header .dismiss_icon { + padding-left: 10px; +} + +.recommendation-reason-footer { + line-height: 25px; +} + +.recommendation-reason-footer .recommendation-reason-link:before { + content: "#"; + margin-right: -3px; +} + +.recommendation-reason-footer .recommendation-reason-link { + background-color: var(--tag, #222); + background-color: var(--happy, #56bc8a); + color: var(--post, #111) !important; + margin: 10px 10px 0 0; + padding: 5px; + line-height: 15px; + border-radius: 3px; +} + +.recommendation-reason-footer .recommendation-reason-link .icon:before { + color: var(--happy, #56bc8a); +} + + +.recommendation-reason-footer .recommendation-reason-link .icon { + position: relative; + margin: 0 3px 0 0; + top: -1px; +} + +.recommendation-reason-footer .recommendation-reason-link .icon_rounded_play { + top: 4px; +} + +/*=================================submission posts==================================*/ +.post_full .post_header .post_info .post_info_link { + vertical-align: middle; +} + +.post_full .post_info .submission_icon { + display: inline-block; + vertical-align: middle; + font-size: 0px; +} + +.post_full .post_info .submission_icon:before, +.post_full .post_info .submission_icon:after { + font-family: tumblr-icons, blank; + vertical-align: middle; + display: inline-block; + font-size: 13px; + transform-origin: center; + transform: scale(1.5); +} + +.post_full .post_info .submission_icon:before { + content: "\EA56"; + margin-left: 15px; +} + +.post_full .post_info .submission_icon:after { + content: "\EA14"; + margin-right: 10px; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_reblogging-post.css b/Themes/nightfall/nightfall_reblogging-post.css new file mode 100644 index 000000000..204007600 --- /dev/null +++ b/Themes/nightfall/nightfall_reblogging-post.css @@ -0,0 +1,204 @@ +/*https://www.tumblr.com/reblog/POST-ID*/ +.post-form .post-container { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} + +/*wash-out effect when submitting reblog*/ +.post-form .post-form--guard { + background-color: var(--post, #111); +} + +.post-form button:not(.tx-button) { + color: var(--primary, #DDD); +} + +.post-form a { + color: unset; + border-bottom: unset; +} + +.post-form .post-composer_note-post .note_item, +.post-form .post_full.is_note .post-body .note_item { + background-color: var(--bubble, #222); + border-color: var(--bubble, #222); +} + +.post-form .post-composer_note-post .note_item .nipple { + border-left-color: var(--bubble, #444); +} + +/*.post-form .caption-field .editor-placeholder, */ +.post-form .caption-field .editor-plaintext, +.post-form .caption-field .editor-richtext { + background: unset; + color: inherit; +} + +/*.post-form .caption-field .editor-placeholder { + color: var(--secondary, #888) !important; +}*/ + +.post-form .control-reblog-trail .reblog-list .reblog-list-item:last-child { + border-bottom-color: var(--border, #444); +} + +.post-form .control-reblog-trail.removed .btn-show-trail { + color: var(--secondary, #888); + border-top-color: var(--border, #444); + border-bottom-color: var(--border, #444); +} + +.post-form .caption-field .editor-richtext p { + color: var(--primary, #DDD); +} + +.post-form .post-form--tag-editor { + padding: 5px 0px 10px 10px; +} + +.post-form .post-form--tag-editor .tag-label { + background-color: var(--tag, #222); + color: var(--secondary, #888); + margin: 10px 10px 0px 0px; +} + +.post-form .post-form--tag-editor .tag-label.hover-style, +.post-form .post-form--tag-editor .tag-label.selected { + background-color: var(--accent-hi2); + color: var(--accent); +} + +.post-form .post-form--tag-editor .tag-input-wrapper { + margin-top: 10px; +} + +.post-form .post-form--header .tumblelog-select * { + color: unset !important; +} + +.popover--tumblelog-select-dropdown .pop-menu { + background-color: var(--popover, #111); +} + +.popover--tumblelog-select-dropdown .pop-menu .item-option, +.popover--tumblelog-select-dropdown .pop-menu .item-option.select:after, +.popover--tumblelog-select-dropdown .pop-menu .ts-info, +.popover--tumblelog-select-dropdown .pop-menu .ts-name { + color: var(--primary, #DDD); +} + +.popover--tumblelog-select-dropdown .pop-menu .ts-title { + color: var(--secondary, #888); +} + +.popover--tumblelog-select-dropdown .pop-menu .item-option:hover, +.popover--tumblelog-select-dropdown .pop-menu .item-option.select:hover:after, +.popover--tumblelog-select-dropdown .pop-menu .item-option:hover .ts-info, +.popover--tumblelog-select-dropdown .pop-menu .item-option:hover .ts-name { + color: var(--primary-selected, #111); +} + +.popover--post-settings-dropdown .pop-menu .form-group .group-content, +.popover--post-settings-dropdown .pop-menu .form-group .group-label { + border-top-color: var(--border, #444); + color: var(--primary, #DDD); +} + +.popover--post-settings-dropdown .flat_select .icon { + color: var(--primary, #DDD); +} + +.popover--post-settings-dropdown .flat_select select:focus ~ .icon { + color: var(--accent); +} + +.popover--save-post-dropdown .pop-menu input[type=text].field, +.post-form input[type=text].field { + background-color: var(--input, #000); + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +.post-form .post-form--bottom .post-form--controls { + border-top-color: var(--border, #444); +} + +.post-form .post-form--bottom .post-form--error-bar { + background-color: var(--danger); + color: var(--primary, #DDD); + border: unset; + border-radius: 0px 0px 3px 3px; +} + +/*ios' momentum scrolling*/ +.post-form-modal { + overflow-y: scroll; + -webkit-overflow-scrolling: touch; + max-width: 100%; + overflow-x: hidden; +} + +/*========================================tools======================================*/ +.popover--gif-search { + background-color: var(--popover, #111); +} + +.popover--gif-search .gif-search-input { + border-bottom-color: var(--border, #444); +} + +.popover--gif-search .gif-search-message { + background-color: var(--popover, #111); + color: var(--secondary, #888); +} + +.media-holder .tmblr-embed-placeholder .icon_close:before { + color: var(--primary, #DDD); +} + +/*horizontal line*/ +.post-form hr { + border-top-color: var(--primary, #DDD) !important; +} + +/*Keep Reading*/ +.editor .tmblr-truncated:before { + opacity: 1 !important; +} + +.editor .tmblr-truncated .tmblr-truncated-link, +.editor .tmblr-truncated:after { + background-color: var(--post, #111) !important; + color: var(--primary, #DDD) !important; +} + +/*when dragging Keep Reading*/ +.editor .over-bottom:after, +.editor .over-top:before { + background-color: var(--accent); +} + +/*=====================================html mode=====================================*/ +.post-form .html-mode .tab { + color: var(--secondary, #DDD); +} + +.post-form .html-mode .tab.active, +.post-form .html-mode .tab:hover { + color: var(--primary, #DDD); +} + +.post-form .html-mode .src-view { + background-color: #000; + color: var(--primary, #DDD); +} + +.post-form .html-mode .ace_selection { + filter: opacity(0.3); +} + +.dropzone-tooltip-popover { + background-color: var(--post, #111); + color: var(--primary, #DDD); +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_report.css b/Themes/nightfall/nightfall_report.css new file mode 100644 index 000000000..229848864 --- /dev/null +++ b/Themes/nightfall/nightfall_report.css @@ -0,0 +1,66 @@ +/*change tick on report abuse form*/ +.abuse-form .form-row.checkmark-row .option-radio:checked+.option-label:after { + color: var(--accent); +} + +/*bg of sidebar*/ +.drawer, +.abuse-form .content-preview { + background-color: var(--bg-colour, #222); + color: var(--primary, #DDD); +} + +.abuse-form, +.abuse-form .form-header .form-heading, +.abuse-form .form-header .form-description, +.abuse-form .form-subheading, +.abuse-form form .form-row, +.abuse-form .option { + color: var(--primary, #DDD); +} + +.abuse-form .form-subheading-tagline { + color: var(--secondary, #888); + +} + +.abuse-form .form-row.ignore, +.abuse-form .options { + border-bottom-color: var(--border, #444); +} + +.abuse-form .form-row.checkmark-row:hover, +.abuse-form .option:hover { + background-color: var(--primary-selected, #111); +} + +.abuse-form .form-row.checkmark-row, +.abuse-form .form-row.ignore, +.abuse-form .content-preview .content-preview-toggle, +.abuse-form .option { + border-top-color: var(--border, #444); +} + +.abuse-form .content-preview .post { + border-color: var(--border, #444); +} + +.abuse-form .survey-result { + border-color: var(--border, #444); +} + +.abuse-form .survey-result .flat_select.attached, +.abuse-form .survey-result input.text_field, +.abuse-form .survey-result textarea { + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +/*no dog-ears*/ +.abuse-form .post.post_full { + background: var(--post, #111); +} + +.abuse-form .post.post_full .post_permalink:before { + background: unset; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_share.css b/Themes/nightfall/nightfall_share.css new file mode 100644 index 000000000..40eba8d2d --- /dev/null +++ b/Themes/nightfall/nightfall_share.css @@ -0,0 +1,86 @@ +.popover--messaging-share-post .popover-inner { + background-color: var(--popover, #111); +} + +.popover--messaging-share-post .messaging-share-post-search { + border-bottom-color: var(--border, #444); +} + +.popover--messaging-share-post .messaging-share-post-search .search-input { + color: var(--primary, #DDD); +} + +/*name colour before selection*/ +.popover--messaging-share-post .messaging-share-post-result .name { + color: var(--primary, #DDD); +} + +.popover--messaging-share-post .messaging-share-post-message, +.popover--messaging-share-post .messaging-share-post-message +.compose-text-input-container, +.popover--messaging-share-post .messaging-share-post-message +.compose-text-input-container input, +.popover--messaging-share-post .messaging-share-post-message +.compose-text-input-container textarea { + background-color: var(--popover, #111); +} + +.popover--messaging-share-post .messaging-share-post-message +.compose-text-input-container .text-input-container .text-input { + color: var(--primary, #DDD); +} + +/*change default submit aeroplane symbol's colour*/ +.popover--messaging-share-post .messaging-share-post-message +.compose-text-input-container .submit-button .submit { + color: var(--accent); +} + +/*=================================external networks=================================*/ +.popover--messaging-share-post .messaging-share-post-external-networks { + background: var(--menu-header, #000) !important; +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper { + background-color: var(--popover, #111) !important; +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .header { + background-color: var(--menu-header, #000) !important; +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .header .back-button { + color: var(--secondary, #888); +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .header .back-button:hover { + color: var(--primary, #DDD); +} + +.popover--messaging-share-post .messaging-share-post-external-networks +.messaging-share-post-external-network:before { + background: var(--popover, #111) !important; + color: var(--primary, #DDD) !important; +} + +.popover--messaging-share-post .messaging-share-post-external-networks +.messaging-share-post-external-network { + color: var(--secondary, #888); +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .external-network-form-subview .input, +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .external-network-form-subview .textarea { + color: var(--primary, #DDD) !important; +} + + +/*==============================external networks-email==============================*/ +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .external-network-email-subview .input { + border-color: var(--border, #444) !important; +} + +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .external-network-email-subview .reply-option, +.popover--messaging-share-post .messaging-share-post-external-network-subview-wrapper .external-network-email-subview .footer { + background-color: var(--popover, #111) !important; + border-top-color: var(--border, #444) !important; +} \ No newline at end of file diff --git a/Themes/nightfall/nightfall_xkit-support.css b/Themes/nightfall/nightfall_xkit-support.css new file mode 100644 index 000000000..eaa42bed5 --- /dev/null +++ b/Themes/nightfall/nightfall_xkit-support.css @@ -0,0 +1,528 @@ +.xkit-button { + color: var(--primary, #DDD); + background: #444; + border: unset; +} + +.xkit-button:hover { + color: #FFF; + background: #333; + border: unset; +} + +.xkit-button:active { + color: #FFF; + background: #000; + border: unset; +} + +.xkit-button.disabled { + color: var(--primary, #DDD) !important; + background-color: var(--menu-header, #000) !important; + border-color: unset !important; +} + +.xkit-checkbox { + color: var(--primary, #DDD) !important; + border-color: var(--border, #444); +} + +.xkit-checkbox:hover { + color: #FFF !important; + border-color: var(--border, #444); +} + +.xkit-checkbox b, +.xkit-checkbox strong { + border-color: var(--border, #444); +} + +.xkit-checkbox.selected b, +.xkit-checkbox.selected strong { + background-color: var(--accent-hi); + border-color: var(--border, #444); +} + +.xkit-checkbox.selected:hover b, +.xkit-checkbox.selected:hover strong { + background-color: var(--accent-hi2); +} + +.xkit-textbox { + border-color: var(--border, #444) !important; +} + +.nano > .pane > .slider { + background-color: #DDD; +} + +/*error messages*/ +.xkit-window-msg p, +.xkit-window-msg pre { + background-color: black; +} + +.nano > .pane.active > .slider, +.nano > .pane > .slider:hover { + background-color: #FFF; +} + +/*===================================Control Panel===================================*/ +#xkit-control-panel-shadow { + background-color: var(--glass); +} + +#xkit-control-panel-inner, +#xkit-extensions-panel-left, +#xkit-extensions-panel-left-search, +#xkit-extensions-display-type-normal, +#xkit-extensions-display-type-iconic, +#xkit-extensions-panel-right, +#xkit-control-panel-tabs { + background-color: var(--post, #111) !important; + border-color: var(--border) !important; +} + +#xkit-extensions-panel-left .xkit-extension { + background-color: var(--post, #111) !important; + text-shadow: unset !important; +} + +#xkit-extensions-panel-left .xkit-extension.iconic { + background-color: transparent !important; + border: 1px solid var(--bubble, #444); +} + +#xkit-extensions-panel-left .xkit-extension:hover { + background-color: var(--bubble, #444) !important; +} + +#xkit-extensions-panel-left .xkit-extension:active { + background-color: #000 !important; + border-color: #000; +} + +#xkit-extensions-panel-left .xkit-extension.selected { + background-color: var(--bubble, #444) !important; +} + +#xkit-extensions-panel-left .xkit-extension .title { + color: var(--secondary, #888); + text-shadow: unset; +} + +#xkit-extension-panel-slow-extension { + background-color: var(--bubble, #444); +} + +#servant-toolbar { + background-color: #222; + border-bottom-color: var(--border, #444); +} + +#xkit-extensions-panel-left .xkit-extension.text-only { + color: var(--secondary, #888); +} + +#xkit-extensions-panel-left .xkit-extension.text-only.selected, +#xkit-extensions-panel-left .xkit-extension.selected .title { + color: #FFF !important; +} + +#xkit-control-panel-tabs div:first-child { + border-bottom-left-radius: 3px; +} + +#xkit-control-panel-tabs div { + color: var(--primary, #DDD) !important; + text-shadow: unset !important; +} + +.xkit-extensions-display-type-switcher:hover, +#xkit-control-panel-tabs div:hover { + background-color: var(--bubble, #444) !important; +} + +.xkit-extensions-display-type-switcher:active, +#xkit-control-panel-tabs div.selected { + background-color: #000 !important; + color: #FFF !important; +} + +.xkit-extension-setting { + background: unset; +} + +.xkit-extension-setting .title, +.xkit-extension-setting-separator { + color: var(--primary, #DDD); +} + +.xkit-extension-setting-separator { + filter: brightness(0.4); +} + +.xkit-extension-setting.xkit-experimental-option { + background: repeating-linear-gradient(-135deg, #111 0px, #111 5px, #444 5px, #444 10px) +} + +.xkit-extension-setting.xkit-experimental-option .xkit-checkbox b, +.xkit-extension-setting.xkit-experimental-option .xkit-checkbox strong { + background-color: var(--post, #111); +} + +#xkit-gallery-loading { + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M.9.5a.4.4 0 0 1-.247.37.4.4 0 0 1-.436-.087A.4.4 0 0 1 .13.347.4.4 0 0 1 .5.1' fill='none' stroke='%23888' stroke-width='.12' stroke-linecap='round' stroke-linejoin='round'%3E%3CanimateTransform attributeName='transform' attributeType='XML' type='rotate' from='0 .5 .5' to='360 .5 .5' dur='1s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") center calc(50% - 20px)/50px no-repeat !important; +} + +/*=====================================*/ +#xkit-gallery-toolbar { + background-color: var(--border, #444); + border-color: var(--border, #444); +} + +#xkit-gallery-search { + background-color: var(--post, #111); + color: var(--primary, #DDD); + border-color: var(--border, #444); + border-radius: 0; +} + +.xkit-gallery-extension { + background-color: var(--border, #444); + color: var(--primary, #DDD); + border-color: var(--border, #444); +} + +.xkit-gallery-extension:hover { + background-color: #333; + color: #FFF; +} + +.xkit-gallery-extension .xkit-button { + border-color: var(--border, #444) !important; +} + +.xkit-gallery-extension.xkit-installed-extension .xkit-button, +.xkit-gallery-extension.xkit-installed-extension:hover .xkit-button, +.xkit-gallery-extension.xkit-installed-extension .xkit-button:active { + background-color: #000; + color: var(--primary, #DDD); +} + +#xkit-extensions-panel-right .xkit-gallery-not-found-error { + text-shadow: unset; +} + +/*=====================================*/ +#xkit-extensions-panel-right .xkit-others-panel .description { + color: var(--primary, #DDD); +} + +#xkit-extensions-panel-right .xkit-others-panel .bottom-part { + border-color: var(--border, #444); +} + +/*=====================================*/ +#xkit-logo-big { + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 0.264'%3E%3Cpath d='M0 0l.11.132L0 .264h.058L.14.167l.026.031-.055.066h.058L.195.233l.026.031H.28L.058 0zm.11 0l.222.264h.059L.169 0zm.112 0l.221.264h.058L.391.132.5 0H.443L.361.097.335.066.391 0H.332L.306.031.28 0zm.332 0l-.11.132.11.132H1V0zm.047.044H.64V.12L.69.045h.046L.682.117.74.214H.693L.654.144.64.161v.054H.6zm.153 0h.038v.171H.754zm.103 0H.942V.08H.895v.136H.857V.08H.81V.044h.047z' fill='%23DDD'/%3E%3C/svg%3E") center/100% no-repeat; +} + +#xkit-about-window-text .title, +#xkit-about-window-text .thanks { + color: var(--primary, #DDD); +} + +/*===================================Notifications===================================*/ +#xkit-window { + background: var(--post, #111) !important; +} + +.xkit-window-title:before, +.xkit-unable-to-load-extension-gallery:before, +.xkit-unable-to-load-extension-panel:before { + position: absolute; + color: #FFF; + left: 18px; + width: 25px; + height: 25px; + border-radius: 50%; + text-align: center; +} + +.error .xkit-window-title:before, +.xkit-unable-to-load-extension-gallery:before, +.xkit-unable-to-load-extension-panel:before { + content: ""; + display: block; + box-sizing: border-box; + background: + linear-gradient(-45deg, transparent 0%, transparent 40%, #FFF 40%, #FFF 60%,transparent 60%, transparent 100%), + linear-gradient(45deg, transparent 0%, transparent 40%, #FFF 40%, #FFF 60%,transparent 60%, transparent 100%); + background-color: #c31700; + border: 5px solid #c31700; + border-radius: 50%; +} + +/*CHECK: FIND THE RIGHT CLASS FOR WHEN THIS SHOWS*/ +.xkit-unable-to-load-extension-gallery { + display: flex; +} + +.xkit-unable-to-load-extension-gallery, +.xkit-unable-to-load-extension-panel { + justify-content: center; + flex-wrap: wrap; + width: 60%; + margin: auto; + margin-top: 40px; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M.5 0a.5.5 0 0 0-.5.5.5.5 0 0 0 .5.5.5.5 0 0 0 .5-.5.5.5 0 0 0-.5-.5zM.38.266l.12.12.12-.12.114.114-.12.12.12.12L.62.734.5.614l-.12.12L.266.62.386.5.266.38z' fill='%23888'/%3E%3C/svg%3E") 50% 10px/50px no-repeat; +} + +.xkit-unable-to-load-extension-gallery:before, +.xkit-unable-to-load-extension-panel:before { + top: 93px; + transform: scale(2); +} + +.xkit-unable-to-load-extension-panel:before { + top: 63px; +} + +.warning .xkit-window-title:before { + content: "⚠"; + color: #c54e03; + transform: scale(1.5); +} + +.info .xkit-window-title:before { + content: "i"; + background-color: #66a820; + font-family: monospace; +} + +.question .xkit-window-title:before { + content: "?"; + background-color: #2b639d; + font-family: sans-serif; +} + +.xkit-window-title, +.xkit-window-msg { + color: var(--primary, #DDD); +} + +.xkit-window-buttons { + background-color: var(--post, #111); + border-color: var(--border, #444); +} + +/*=================================One-Click Postage=================================*/ +#x1cpostage_box { + background-color: var(--border, #444); +} + +/*replace little down arrow*/ +#x1cpostage_box:before, #x1cpostage_box:after { + content: unset; +} + +#x1cpostage_queue:before, #x1cpostage_queue:after { + top: 100%; + border: solid transparent; + content: " "; + height: 0; + width: 0; + position: absolute; + pointer-events: none; +} + +#x1cpostage_queue:before { + border-color: rgba(0, 0, 0, 0); + border-top-color: #bcbcbc; + border-top-color: var(--border, #444); + border-width: 11px; + left: 50%; + margin-left: -11px; + margin-top: 0px; +} + +#x1cpostage_queue:after { + border-color: rgba(245, 245, 245, 0); + border-top-color: rgb(245,245,245); + border-top-color: var(--popover, #111); + border-width: 10px; + left: 50%; + margin-left: -10px; + margin-top: -1px; +} + +#x1cpostage_queue:hover:after { + border-top-color: var(--border, #444); +} + +#x1cpostage_queue:active:after { + border-top-color: #000; +} + +#x1cpostage_tags, +#x1cpostage_caption, +#x1cpostage_replace, +#x1cpostage_blog, +#x1cpostage_reblog, +#x1cpostage_queue, +#x1cpostage_draft { + background-color: var(--popover, #111); + color: var(--primary, #DDD); +} + +#x1cpostage_caption { + box-shadow: unset; +} + +#x1cpostage_replace div { + border-color: var(--primary, #DDD); +} + +#x1cpostage_remove_caption { + background: linear-gradient(to bottom, #222 0%, #000 100%); + color: var(--secondary, #888); + border-color: var(--border, #444); +} + +#x1cpostage_remove_caption:hover { + background: linear-gradient(to bottom, var(--popover, #111) 0%, #000 100%); + color: var(--secondary, #888); +} + +#x1cpostage_remove_caption:active { + background: linear-gradient(to bottom, #000 0%, var(--popover, #111) 100%); + color: var(--primary, #DDD); +} + +#x1cpostage_reblog, +#x1cpostage_queue, +#x1cpostage_draft { + color: var(--secondary, #888); +} + +#x1cpostage_reblog:hover, +#x1cpostage_queue:hover, +#x1cpostage_draft:hover { + background-color: var(--border, #444); + color: var(--primary, #888); +} + +#x1cpostage_box.xkit_x1cpostage_queue_hover:after { + border-top-color: var(--border, #444); +} + +#x1cpostage_reblog:active, +#x1cpostage_queue:active, +#x1cpostage_draft:active { + background-color: var(--menu-header, #000); + color: var(--primary, #DDD); +} + +#x1cpostage_box.xkit_x1cpostage_queue_press:after { + border-top-color: var(--menu-header, #000); +} + +.xkit-one-click-reblog-working { + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1 1'%3E%3Cpath d='M.9.5a.4.4 0 0 1-.247.37.4.4 0 0 1-.436-.087A.4.4 0 0 1 .13.347.4.4 0 0 1 .5.1' fill='none' stroke='%23888' stroke-width='.12' stroke-linecap='round' stroke-linejoin='round'%3E%3CanimateTransform attributeName='transform' attributeType='XML' type='rotate' from='0 .5 .5' to='360 .5 .5' dur='1s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E") center 4px/18px no-repeat !important; +} + +.xkit-one-click-reblog-working:after { + background-image: unset !important; + top: -1px; +} + +.post_controls .xkit-one-click-reblog-working.post_control.reblog:before { + visibility: hidden; +} + +.xkit-one-click-postage-error-list li b { + color: var(--primary); +} + +.post_controls .post_control.reblog.reblogged:after { + content: ""; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-.5 -.5 2 2'%3E%3Cpath d='M.502.868C.59.645.702.43.83.238.892.145.947.078.95.07.957.055.85.033.787.113.49.52.484.633.38.883.333.812.263.68.164.616.124.617.05.638.05.657c0 .01.056.053.099.101.043.048.106.13.14.18.056.084.055.092.108.088.063-.002.048-.012.105-.158z' fill='%2300cf35' stroke='%23111' stroke-width='0.3' paint-order='stroke fill markers'/%3E%3C/svg%3E") center no-repeat; + height: 32px; + width: 32px; + margin-top: -13px; + margin-left: -9px; +} + +/*=======================================Audio+======================================*/ +.xkit-audio-plus-pseudo-post { + background-color: var(--post); +} + +.native-audio-container .audio-player, +.native-audio-container .audio-player .audio-info .track-artist { + color: #FFF; +} + +.native-audio-container{ + background-color: rgba(167, 125, 194, 0.75); /*audio purple colour*/ +} + +.native-audio-container .audio-player { + padding: 0px 10px 25px 10px; +} + +.native-audio-container .audio-player .audio-info { + margin-left: 10px; + margin-right: 0px; +} + +.native-audio-container .audio-player ~ .xkit-audio-plus-slider-container { + width: 100%; + height: 25px; + left: 0px; + bottom: 0px; + padding: 0px; + border-radius: 0px; +} + +.native-audio-container .audio-player ~ .xkit-audio-plus-slider-container +.xkit-audio-plus-slider { + width: calc(100% - 45px); + margin-left: 35px; +} + +.native-audio-container .audio-image { + width: 85px; +} + +.native-audio-container .audio-player.has-art ~ .xkit-audio-plus-slider-container { + width: calc(100% - 85px); +} + +.icon_play:before, +.icon_pause:before { + font-size: 30px; +} + +/*=====================================Timestamps====================================*/ +.xtimestamp { + color: var(--secondary, #888); + top: unset; + margin-top: -10px; +} + +.xtimestamp.xtimestamp_loading { + height: 5px; + background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 3.5 1.4' fill='%23d0d0d0'%3E %3Crect x='0' width='1' height='1' rx='.2'%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='scale' additive='sum' values='1 1;1 1.4;1 1' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.2s'/%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='translate' additive='sum' values='0 .2;0 0;0 .2' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.2s'/%3E %3Canimate attributeType='CSS' attributeName='opacity' values='.5;1;.5' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.2s'/%3E %3C/rect%3E %3Crect x='1.25' width='1' height='1' rx='.2'%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='scale' additive='sum' values='1 1;1 1.4;1 1' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.1s'/%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='translate' additive='sum' values='0 .2;0 0;0 .2' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.1s'/%3E %3Canimate attributeType='CSS' attributeName='opacity' values='.5;1;.5' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='-.1s'/%3E %3C/rect%3E %3Crect x='2.5' width='1' height='1' rx='.2'%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='scale' additive='sum' values='1 1;1 1.4;1 1' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='0s'/%3E %3CanimateTransform attributeType='XML' attributeName='transform' type='translate' additive='sum' values='0 .2;0 0;0 .2' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='0s'/%3E %3Canimate attributeType='CSS' attributeName='opacity' values='.5;1;.5' keyTimes='0;.5;1' calcMode='spline' keySplines='.4, 0, .6, 1;.4, 0, .6, 1' dur='.6s' repeatCount='indefinite' begin='0s'/%3E %3C/rect%3E %3C/svg%3E") left no-repeat; +} + +/*====================================Theme Editor===================================*/ +#xkit-theme-editor-textarea { + background-color: unset; + color: #111; +} + +#xkit-theme-editor-ul .hide_overflow { + padding: 10px; +} \ No newline at end of file