2017-02-07-twitter-dark-tweaks

2017-02-07-twitter-dark-tweaks.css

/* Twitter Dark Mode Override */
  body:first-of-type,
  .AppContent,
  .ProfileHeading-content {
    background-color: #131920;
  }
  .TwitterCardsGrid-col--12 .PollXChoice-pollWrapper {
    background-color: #212c3a;
    border-radius: 0;
    box-shadow: 0 5px 0 0 #212c3a;
  }
  .PermalinkOverlay-content .TwitterCardsGrid-col--12 .PollXChoice-pollWrapper {
    background-color: #0e131a;
    box-shadow: 0 5px 0 0 #0e131a;
  }
  .TwitterCard .PollXChoice-optionContainer .PollXChoice-choice--chart {
    background: #1da1f2;
  }
  .TwitterCard .PollXChoice-optionContainer {
    color: #fff;
  }
  .PollingCardComposer {
    background-color: #1c2531;
    box-shadow: inset 0 1px 0 #2f3d51;
  }
  input, textarea, div[contenteditable], .t1-select {
    background-color: rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.25);
  }
  .PollingCardComposer .PollingCardComposer-pollDuration {
    border-top: solid 1px #2f3d51;
  }
  .RichEditor, .TweetBoxAttachments {
    border-color: #2f3d51;
  }
  .Gallery-content {
    background-color: transparent;
  }
  .global-nav-inner,
  .module,
  .stream-item:not(.no-header-background-module),
  .MoveableModule,
  .ProfileCanopy-navBar,
  .ProfileNav-item--userActions,
  .ProfileAvatar,
  .ProfileSidebar .TweetImpressionsModule, .ProfileSidebar .ProfileLifelineInfo, .ProfileSidebar .RelatedUsers,
  .WhoToFollow,
  .module .flex-module,
  .ProfileCard,
  .DMActivity-body,
  .GalleryTweet .tweet,
  .DMDivider,
  .EmojiBar-icon,
  .EmojiBar-suggestions,
  .tweet-form .thumbnail-container,
  .MomentMakerHomeModule {
    background-color: #212c3b !important;
  }
  #global-tweet-dialog .modal-tweet .tweet:hover, #global-tweet-dialog .modal-tweet .tweet {
    background: transparent;
  }
  .module,
  .stream-item:not(.no-header-background-module),
  .tweet,
  .ProfileCanopy-navBar,
  .ProfileHeading-content,
  .ProfileAvatar,
  .ProfileSidebar .TweetImpressionsModule, .ProfileSidebar .ProfileLifelineInfo, .ProfileSidebar .RelatedUsers,
  .WhoToFollow,
  .module .flex-module,
  .TwitterCard-container,
  .ProfileCard,
  .content-header, .content-no-header,
  .stream-item + .stream-item.separated-module:not(.no-header-background-module), .stream-item.separated-module + .stream-item:not(.no-header-background-module), .PromptbirdPrompt-streamItem.separated-module + .stream-item:not(.no-header-background-module),
  .DMInboxItem,
  .tweet-form .thumbnail-container,
  .ComposerThumbnail,
  .MomentMakerHomeModule {
    border-color: #2f3d51 !important;
  }
  .ComposerThumbnail {
    background: transparent;
    box-shadow: none;
    border-color: transparent !important;
  }
  .tweet-form .thumbnail-container {
    box-shadow: none;
  }
  .DirectMessage--received .Caret:before {
    border-color: #1c2531 !important;
  }
  .tweet:hover,
  .conversation-module .conversation-tweet-item .tweet:hover,
  .DirectMessage--received .DirectMessage-message,
  .DMInboxItem:hover {
    background-color: #1c2531 !important;
  }
  .DMInboxItem.is-unread,
  .FollowStatus {
    background-color: #142f52 !important;
  }
  .global-nav .search-input,
  .modal-header,
  .DMActivity-header,
  .u-bgUserColorLightest,
  .DMComposer-container {
    background-color: #131920 !important;
    border-color: #2f3d51 !important;
  }
  .DashboardProfileCard,
  .DashboardProfileCard-bg,
  .tweet-box,
  .top-timeline-tweetbox .timeline-tweet-box,
  .ProfileCard-bg,
  .ListCreationModule {
    background-color: #253141 !important;
    border-color: #2f3d51 !important;
  }
  body .new-tweets-bar,
  body .RichEditor div[contenteditable], body .RichEditor div[contenteditable]:focus, body .RichEditor div[contenteditable].fake-focus, body .RichEditor div[contenteditable], body .RichEditor div[contenteditable]:focus, body .RichEditor div[contenteditable].fake-focus,
  body .RichEditor.is-fakeFocus, body .RichEditor,
  body .NotificationsHeadingContent,
  body .stream-item-activity-notification,
  body .permalink .in-reply-to #ancestors:not(.ThreadedConversation) .stream-item, body .permalink .in-reply-to #ancestors:not(.ThreadedConversation) .stream-item .tweet:hover,
  body .modal .modal-tweet,
  body .modal-body p,
  body .ProfileHeading-content,
  body .SignupCallOut {
    background-color: #1c2531 !important;
    border-color: #2f3d51 !important;
    color: white !important;
  }
  body .hovercard .profile-social-proof {
    background: transparent !important;
    border-color: transparent !important;
    color: white !important;
  }
  body .stream-item-activity-notification .stream-item-activity-header .pretty-link b {
    color: #3dabf5;
  }
  body .tweet-text,
  body .fullname,
  body .SummaryCard-content h2,
  body .SummaryCard-content h3,
  body .SummaryCard-content h1,
  body .QuoteTweet-fullname,
  body .ProfileHeaderCard,
  body .ProfileNav-item.is-active span.ProfileNav-value,
  body .TweetImpressionsModule,
  body .WhoToFollow-users .fullname,
  body .ProfileNameTruncated,
  body .bio-container,
  body .ProfileHeading-toggleItem.is-active, body .ProfileHeading-toggleItem.is-active:hover, body .ProfileHeading-toggleItem.is-active:focus,
  body .stream-item-activity-notification,
  body .stream-item-activity-line.js-actionable-user.stream-item-activity-line-notification .fullname,
  body .DashboardProfileCard-name {
    color: rgba(255, 255, 255, 0.85);
  }
  body .ProfileHeaderCard-location span,
  body .ProfileHeaderCard-joinDate span {
    color: rgba(255, 255, 255, 0.5);
  }
  body .SummaryCard-content p {
    color: rgba(255, 255, 255, 0.65);
  }
  body .btn,
  body .DashboardProfileCard-avatarImage {
    background-color: #121921 !important;
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.35)) !important;
    border-color: #090c10 !important;
    color: #fff !important;
  }
  body .not-following .follow-button .follow-text, body .following .follow-button .following-text, body .following .follow-button:hover .unfollow-text, body .following .follow-button.cancel-hover-style:hover .following-text, body .blocked .follow-button .blocked-text, body .blocked .follow-button:hover .unblock-text, body .pending .follow-button .pending-text, body .pending .follow-button:hover .cancel-text, body .pending .follow-button.cancel-hover-style:hover .pending-text {
    color: #fff !important;
  }
  body a:not(.js-nav):not(.global-dm-nav),
  body .btn-link, body .btn-link:focus, body .icon-btn, body .pretty-link b, body .pretty-link:hover s, body .pretty-link:hover b, body .pretty-link:focus s, body .pretty-link:focus b, body .metadata a:hover, body .metadata a:focus, body .account-group:hover .fullname, body .account-group:focus .fullname, body .account-summary:focus .fullname, body .message .message-text a, body .stats a strong, body .plain-btn:hover, body .plain-btn:focus, body .dropdown.open .user-dropdown.plain-btn, body .open > .plain-btn, body #global-actions .new:before, body .module .list-link:hover, body .module .list-link:focus, body .stats a:hover, body .stats a:hover strong, body .stats a:focus, body .stats a:focus strong, body .find-friends-sources li:hover .source, body .stream-item a:hover .fullname, body .stream-item a:focus .fullname, body .stream-item .view-all-supplements:hover, body .stream-item .view-all-supplements:focus, body .tweet .time a:hover, body .tweet .time a:focus, body .tweet .details.with-icn b, body .tweet .details.with-icn .Icon, body .stream-item:hover .original-tweet .details b, body .stream-item .original-tweet.focus .details b, body .stream-item.open .original-tweet .details b, body .client-and-actions a:hover, body .client-and-actions a:focus, body .dismiss-btn:hover b, body .tweet .context .pretty-link:hover s, body .tweet .context .pretty-link:hover b, body .tweet .context .pretty-link:focus s, body .tweet .context .pretty-link:focus b, body .list .username a:hover, body .list .username a:focus, body .list-membership-container .create-a-list, body .list-membership-container .create-a-list:hover, body .card .list-details a:hover, body .card .list-details a:focus, body .card .card-body:hover .attribution, body .card .card-body .attribution:focus, body .new-tweets-bar, body .remove-background-btn, body .stream-item-activity-notification .latest-tweet .tweet-row a:hover, body .stream-item-activity-notification .latest-tweet .tweet-row a:focus, body .stream-item-activity-notification .latest-tweet .tweet-row a:hover b, body .stream-item-activity-notification .latest-tweet .tweet-row a:focus b,
  body .Trends .context-trend-item .trend-name,
  body a[role="button"]:not(.global-dm-nav):not(.js-moments-tab), body li.active,
  body s, body .pretty-link:hover s, body .pretty-link:focus s, body .stream-item-activity-notification .latest-tweet .tweet-row a:hover s,
  body .stream-item-activity-notification .latest-tweet .tweet-row a:focus s {
    color: #1da1f2 !important;
  }
  body .hovercard.profile-card .ProfileCard-content .FollowStatus,
  body .u-textUserColor,
  body .u-textUserColorHover:active,
  body .u-textUserColorHover:hover,
  body .u-textUserColorHover:hover .ProfileTweet-actionCount,
  body .u-textUserColorHover:focus {
    color: #1c9dec !important;
  }
  body #global-actions > li > a {
    border-bottom-color: #1c9dec !important;
  }
  body #global-actions > li:hover > a, body #global-actions > li > a:focus, body .nav.right-actions > li > a:hover, body .nav.right-actions > li > button:hover, body .nav.right-actions > li > a:focus, body .nav.right-actions > li > button:focus {
    border-bottom-color: #1c9dec !important;
    color: #1c9dec !important;
  }
  body a, body .btn-link, body .btn-link:focus, body .icon-btn, body .pretty-link b, body .pretty-link:hover s, body .pretty-link:hover b, body .pretty-link:focus s, body .pretty-link:focus b, body .metadata a:hover, body .metadata a:focus, body .account-group:hover .fullname, body .account-group:focus .fullname, body .account-summary:focus .fullname, body .message .message-text a, body .stats a strong, body .plain-btn:hover, body .plain-btn:focus, body .dropdown.open .user-dropdown.plain-btn, body .open > .plain-btn, body #global-actions .new:before, body .module .list-link:hover, body .module .list-link:focus, body .stats a:hover, body .stats a:hover strong, body .stats a:focus, body .stats a:focus strong, body .find-friends-sources li:hover .source, body .stream-item a:hover .fullname, body .stream-item a:focus .fullname, body .stream-item .view-all-supplements:hover, body .stream-item .view-all-supplements:focus, body .tweet .time a:hover, body .tweet .time a:focus, body .tweet .details.with-icn b, body .tweet .details.with-icn .Icon, body .stream-item:hover .original-tweet .details b, body .stream-item .original-tweet.focus .details b, body .stream-item.open .original-tweet .details b, body .client-and-actions a:hover, body .client-and-actions a:focus, body .dismiss-btn:hover b, body .tweet .context .pretty-link:hover s, body .tweet .context .pretty-link:hover b, body .tweet .context .pretty-link:focus s, body .tweet .context .pretty-link:focus b, body .list .username a:hover, body .list .username a:focus, body .list-membership-container .create-a-list, body .list-membership-container .create-a-list:hover, body .card .list-details a:hover, body .card .list-details a:focus, body .card .card-body:hover .attribution, body .card .card-body .attribution:focus, body .new-tweets-bar, body .remove-background-btn, body .stream-item-activity-notification .latest-tweet .tweet-row a:hover, body .stream-item-activity-notification .latest-tweet .tweet-row a:focus, body .stream-item-activity-notification .latest-tweet .tweet-row a:hover b, body .stream-item-activity-notification .latest-tweet .tweet-row a:focus b {
    color: #1c9dec;
  }
  .MomentCapsuleItemTweet--withText {
    background-color: #090c10;
    border-radius: 4px;
  }
  .new-tweets-bar:hover {
    background-color: rgba(61, 171, 245, 0.3);
  }
  .tweet .context .pretty-link s, .tweet .context .pretty-link b {
    color: #8899a6 !important;
  }
  .QuoteTweet--unavailable {
    background: #161d27;
  }
  .EmojiPicker-query {
    background-color: #212c3a;
    background-image: none;
    border-bottom: 1px solid #1c2531;
  }
  .EmojiPicker-content.Caret:before {
    border-color: #090c10;
  }
  .EmojiPicker-content.Caret:after {
    border-color: #090c10;
  }
  .EmojiPicker-categoryHeader {
    border-bottom: 1px solid #212c3a;
  }
  .EmojiPicker-categoryColumn {
    border-right: 1px solid #212c3a;
  }
  .EmojiPicker-diversityRow {
    border-top: 1px solid #212c3a;
  }
  .EmojiPicker-query input[type=text].EmojiPicker-queryInput {
    color: #fff;
  }
  .global-nav .search-input {
    color: #8899a6;
  }
  .global-nav .search-input:focus, .global-nav .search-input.focus {
    color: #abb8c2;
  }
  .vellip, .vellip:before, .vellip:after, .conversation-module > li:after, .conversation-module > li:before, .ThreadedConversation-tweet:not(.is-hiddenAncestor) ~ .ThreadedConversation-tweet:before, .ThreadedConversation-tweet:after, .ThreadedConversation-viewOther:before, .ThreadedConversation-unavailableTweet:before, .ThreadedConversation-unavailableTweet:after, .ThreadedConversation--permalinkTweetWithAncestors:before {
    background-color: #085a91;
  }
  .SummaryCard-content,
  .modal-tweet-form-container,
  .modal-content,
  .modal-tweet-form-container,
  #global-tweet-dialog .modal-tweet-form-container,
  .permalink .inline-reply-tweetbox,
  .ThreadedConversation-viewOther,
  .home-tweet-box, .LiveVideo-tweetBox, .RetweetDialog-commentBox, .WebToast-box--altColor {
    background: #161d27;
  }
  .modal-header,
  .permalink,
  .permalink-tweet, .permalink-tweet:hover,
  .PermalinkOverlay-spinnerContainer,
  .stream-end-inner,
  .dropdown-menu {
    background: #0f141a;
  }
  [class^="TwitterCardsGrid"],
  .QuoteTweet,
  .permalink-tweet, .permalink-tweet:hover,
  .permalink .inline-reply-tweetbox,
  .stream-end-inner,
  .stream-end-item, .stream-end, .stream-loading, .stream-placeholder,
  .tweet .stats,
  .permalink .stats .avatar-row a:first-child,
  .permalink .in-reply-to .tweet, .permalink .replies-to .tweet,
  .ThreadedConversation, .ThreadedConversation-showMore:after, .ThreadedConversation-viewOther .view-other-link,
  .ThreadedConversation, .ThreadedConversation-showMore, .ThreadedConversation-showMore:after, .ThreadedConversation + .ThreadedConversation--loneTweet, :not(.ThreadedConversation--ownReply) + .ThreadedConversation--ownReply, .ThreadedConversation--ownReply + .ThreadedConversation--loneTweet:not(.ThreadedConversation--ownReply), .ThreadedConversation--loneTweet:first-child,
  .permalink.has-replies .inline-reply-tweetbox,
  .dropdown-menu,
  .dropdown-divider {
    border-color: rgba(255, 255, 255, 0.18) !important;
  }
  .dropdown-caret .caret-inner {
    border-bottom-color: #090c10 !important;
  }
  .QuoteTweet-container,
  .permalink-tweet:hover, .permalink-tweet.focus,
  .ThreadedConversation-showMore,
  .ThreadedConversation, .ThreadedConversation--loneTweet,
  .DashboardProfileCard-avatarLink {
    background-color: #161d27 !important;
  }
  .TwitterCard-container--clickable:hover {
    background: transparent;
  }
  .username s, .account-group-inner s,
  input:focus, textarea:focus, div[contenteditable="true"]:focus, div[contenteditable="true"].fake-focus {
    color: #b1bbc3 !important;
  }
  .username, .time, .time a, .metadata, .metadata button.btn-link, .metadata a {
    color: #8899a6 !important;
  }
  .permalink-container {
    box-shadow: 0 0 150px 20px black;
    border-radius: 5px;
  }
  .global-nav .people .count .count-inner {
    border-color: #002b33;
  }
  .ProfilePage.is-editing .ProfilePage-editingOverlay {
    background: #000;
  }
  .u-borderUserColorLight, .u-borderUserColorLightFocus:focus, .u-borderUserColorLightHover:hover, .u-borderUserColorLightHover:focus {
    border-color: #2f3d51 !important;
  }
  .u-bgUserColorLighter {
    background-color: #2f3d51 !important;
  }
  .tweet.focus {
    z-index: 999999 !important;
  }
  #profile-hover-container {
    z-index: 99999999 !important;
  }
  .ProfileTweet-action .dropdown .dropdown-menu {
    margin: 8px -10px 0;
    border: 1px solid rgba(255, 255, 255, 0.05);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.55);
  }
  .DMNotice {
    background: #161d27;
  }
  .DMConversation-composer {
    box-shadow: none;
  }
  .ProfileClusterFollow {
    background: transparent;
    border: transparent;
  }
  .MomentCapsuleVTwoItemTweet--withText {
    background: #161d27;
  }
  .TwitterCard .MomentCard-description p {
    color: #fff;
  }
  .TwitterCard .MomentCard {
    background-color: #161d27;
    color: #fff !important;
  }
  .DirectMessage.DirectMessage--sent .js-display-url {
    color: #161d27;
    text-decoration: underline;
  }
  .pushstate-spinner,
  .spinner {
    filter: invert(100%) hue-rotate(180deg);
  }
  .content-header .header-inner,
  .content-no-header .no-header-inner,
  .content-inner,
  .content-inner.no-stream-end,
  hr,
  .find-friends-top-subheader,
  .find-friends-bottom-subheader,
  .find-friends-sources,
  .MutedKeywordsAddItemForm,
  .MutedKeywordsFooter {
    background-color: #212c3a;
    border-color: #2f3d51;
    color: #fff;
  }
  .find-friends-list li {
    border-color: #2f3d51;
  }
  .find-friends-list li:hover {
    background-color: #2f3d51;
  }
  #notifications-optout-all-top,
  .notifications-prompt-container {
    background-color: #2f3d51;
    border-color: #2f3d51;
    color: #fff;
  }
  body .js-nav-links .list-link {
    background-color: #212c3a;
    border-color: #2f3d51;
    color: #aab8c2;
  }
  body .js-nav-links .list-link:hover {
    background-color: #2f3d51;
  }
  body .js-nav-links .active .list-link.js-nav {
    background-color: #1da1f2;
    color: #fff;
  }
  body .js-nav-links .active .list-link.js-nav:hover {
    color: rgba(255, 255, 255, 0.75);
  }
  .module li:first-child .list-link {
    border-top: none;
  }
  .t1-label,
  .t1-legend,
  .settings-header,
  #content-main-heading,
  .find-friends-list .source,
  .MutedKeyword-text,
  .app .content strong {
    color: #fff;
  }
  .alert,
  .welcome-banner-outer .pane-close,
  .banner-outer .pane-close {
    color: #161d27;
  }
  .t1-select[disabled] {
    background-color: rgba(0, 0, 0, 0.15);
    border: 1px solid rgba(0, 0, 0, 0.25);
    opacity: .35;
  }
  .radio input[type=radio],
  .checkbox input[type=checkbox] {
    box-shadow: inset 0 0 0 10px #aab8c2;
  }
  .radio input[type=radio]:checked,
  .checkbox input[type=checkbox]:checked {
    box-shadow: none;
  }
  .stream .js-actionable-user.account,
  .stream .app {
    border-color: #2f3d51;
  }
  .ep-Header .ep-Title,
  .ep-TweetPerformance.ep-Section .ep-Metric .ep-MetricTopContainer,
  .ep-TweetPerformance.ep-Section .ep-EngagementsTable .ep-EngagementsTableHeader,
  .ep-EngagementsTableName,
  .ep-MetricAnimation,
  .ProfileTweet-fullname.u-linkComplex-target {
    color: rgba(255, 255, 255, 0.85);
  }
  .recap-header {
    border-bottom: 1px solid #2f3d51;
    color: #f5f8fa;
  }
  .ProfileHeaderCard-birthdateText,
  .ProfileHeaderCard-joinDateText,
  .ProfileHeaderCard-locationText,
  .ProfileHeaderCard-onlineHoursText,
  .ProfileHeaderCard-responsivenessLevelText,
  .ProfileHeaderCard-vineProfileText,
  .ProfileHeaderCard-periscopeProfileText {
    color: #8899a6;
  }
  .typeahead a, .typeahead .fullname {
    color: #f3f3f3;
  }
  .typeahead-items li > a {
    color: #f3f3f3;
  }
  .typeahead strong {
    color: #b3b3b3;
  }
  .MomentGuideNavigation {
    background-color: #131920;
    border-bottom: 1px solid #2f3d51;
  }
  .ProfileUserMomentsTimeline .MomentCapsuleSummary {
    background-color: #131920;
    border-bottom: 1px solid #2f3d51;
  }
  .MomentMakerRecommendations {
    background-color: #131920;
    border-top: 2px solid #2f3d51;
  }
  .MomentMakerRecommendations-module {
    background-color: #131920;
    border: 1px solid #131920;
  }
  .u-borderUserColor, .u-borderUserColorHover:hover, .u-borderUserColorHover:focus {
    border-color: #f3f3f3 !important;
  }
  .ProfileUserMomentsTimeline .GridTimeline-items.has-items {
    border: 1px solid #2f3d51;
  }
  .MomentMakerRecommendations-more {
    background-color: #2f3d51;
    border-top: 1px solid #2f3d51;
    color: #f3f3f3;
  }
  .MomentMakerRecommendations-scrollTopButton {
    background-color: #2f3d51;
    border: 1px solid #2f3d51;
  }
  .MomentButton--gray, .MomentButton--gray:focus {
    color: #f3f3f3;
  }
  .MomentMakerPage-content {
    background-color: #131920;
    margin: 0 auto;
  }
  .u-bgUserColor, .u-bgUserColorHover:hover, .u-bgUserColorHover:focus {
    background-color: #212c3b !important;
  }
  .MomentButton--white {
    background: #212c3b;
    border: 1px solid #fff;
  }
  .MomentUserByline-fullname {
    color: #f3f3f3;
  }
  .MomentCapsuleItemTweet--withText {
    background-color: #212c3b;
    border: 1px solid #2f3d51;
  }
  .MomentCapsuleSummary-title {
    color: #fff;
  }
  .MomentCapsuleCover-title {
    color: #1da1f2;
  }
  .MomentFloatingMenu {
    background-color: #090c10;
    border: 1px solid #212c3b;
  }
  .AdaptiveNewsLargeImageHeadline-body {
    background-color: #161d27;
    border: 1px solid #2f3d51;
  }
  .SidebarFilterModule,
  .AdaptiveRelatedSearches {
    background-color: #212c3b;
    border: 1px solid #2f3d51;
  }
  .SidebarFilterModule-filters .SidebarFilterModule-select {
    color: #fff;
  }
  .follow-card .follow-bar {
    background-color: #2f3d51;
    background-image: none;
    border-top: 1px solid #161d27;
    box-shadow: inset 0 1px 0 #090c10;
  }
  .dashboard .stats {
    background-color: transparent;
  }
  .follow-card .flex-module-header h1 {
    color: #f5f8fa;
  }
  .metadata a {
    color: #0ab5fa;
  }

.PlayableMedia-title, .PlayableMedia-description {
    color: #8999A5
}
.account, .tweet, .app {
	padding: 20px 12px;
}