-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathflipboard_dark.css
377 lines (309 loc) · 18.5 KB
/
flipboard_dark.css
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
@-moz-document regexp("https?://(www\\.)?flipboard\\.com.*") {
/*
* Name: Flipboard Dark
* Author: Seanharrs
* Version: v1.5
* Repository: https://github.com/Seanharrs/flipboard-dark
* Issues: https://github.com/Seanharrs/flipboard-dark/issues
*/
.navigation-bar .tabs .tab-item, .navigation-bar .search-container, .footer-bar, .nav-items, .page-gap,
.grid-page, .front-door, .fill, .postbox, .toc-franchise, .loading, .loaded, .load-more, .content-loading,
.notifications-list, .add-favorite-view-container .add-favorite-view, .search-passion .text-input,
.search__panel, .search__zero-state, .search__more-results, a.topic-tag, .topic-tag,
.selected a.topic-tag, .selected .topic-tag, .feed-layout-scope, .newspaper-layout-scope .carousel-posts__item,
.layout-view, body, .invite-contributors-view, .create-magazine-view, .create-magazine, .content-share,
.flip-extension-controller, .edit-item-view, .editor-cover-options-view, .editor-cover-set-item-view,
.getapp-view, .share-article-view, #friends-search-bar, .magazine-cover-footer, .topic-tag.compact, #auth-view,
.main-header, .home-feed .home-navigation, .modal-overlay .modal, .modal-overlay .modal .modal__controls, .hint-panel .button {
background-color: #222 !important;
}
.auth-container--modal-view {
background-color: rgba(30, 30, 30, 0.97) !important;
}
.navigation-bar__login-button, .auth-container--modal-view, .button, .sign-up-pagebox, .sign-up-button,
.text-input, .sign-up-form__show-password-button, .bar .linkitem, .front-door-banner__header,
.front-door-banner__subheader, .headline, .topic-title, .top-attribution, .excerpt, .favorites__favorite,
.heading, .subheading, .postbox, .from, .author, .loading, .loaded, .load-more, .content-loading-text,
.notifications-list, .add-favorite-view-container .sub-message,
.add-favorite-view-container .add-favorite-view .favorites .favorite--not-found, .favorite .name,
.section-header-title .header-title, .section-metrics .metric, .follow-button, .show-more-icon .show-more-wrapper,
.meatballs-menu__dropdown-menu, .search__zero-state-featured, .search__input, .search__results li, .forgot-link,
.newspaper-layout-scope, .newspaper-layout-scope h2, .post__title, .newspaper-layout-scope .group-magazine__create-description,
.newspaper-layout-scope .influencer__description, .tile-layout-scope, body, .magazine-tile .tile .inner-rect.revamped,
.dropdown-menu .dropdown-item, .flip-header, .magazine-descriptive-copy, .button--secondary-inverse, .textarea,
.share-flip__input, .editor-item-tile-footer, #item-caption-input, .stats-dashboard, .getapp-view,
.getapp-view .getapp-email-prompt .or, #get-email, .share-article-view .title, .search-for-friends .label,
#friends-search-bar, .share-article-view .share-url-input, .magazine-cover-footer,
.stats-dashboard .top-list-title.top-list-tooltip:hover div[data-tooltip]::after,
.stats-dashboard .chart-title.chart-tooltip:hover div[data-tooltip]::after, .main, .auth-view__title, .auth__auth-link,
.auth__or-message, .auth__text-input, .auth-signup__publisher-button, .auth__policy-text, .auth__password-strength,
.auth__password-visibility-toggle-button, .brand-banner__header, .brand-banner__subheader, .article-text--body,
.social-actions .button--simple, .button--primary, .main-header__buttons .button--simple, .main-header__search-input-wrapper input,
.modal-overlay .modal .button--simple, .modal-overlay .modal .topic-list__item-target, .search__input-wrapper input,
.section-header .ui-text--page-title, .section-header .ui-text--page-title .button--inverse, .modal-overlay .ui-text--title,
div.hint-panel, .hint-panel .button, .light .topic-tag, .topic-tag {
color: #DDD !important;
}
.brand-banner__header div:last-child, .button--primary-inverse, .button--primary {
border-color: #D22 !important;
}
.hint-panel, .getapp-view .send-button:hover, .button--primary, .flip-hint .hint-text-box {
background-color: #D22 !important;
}
.hint-panel .button, .meatballs-menu__dropdown-menu, .auth-signup .button--primary:disabled, .follow-button.hover,
.search__results li.selected:not(.search__result-topic), .dropdown-menu .dropdown-item,
.share-flip .magazine-selection__magazine.selected, .share-flip .ico-mglass {
background-color: #333 !important;
}
.hint-panel .button, .meatballs-menu__dropdown-menu, .auth-signup .button--primary:disabled,
.newspaper-layout-scope .newspaper-column:not(:last-child), .tile-item, .tile-item-wrapper, .featured-magazines-wrapper,
.newspaper-column, .newspaper-column > section:not(:last-child), .newspaper-column .newspaper-section:not(:last-child),
.group-magazine, .profile-headline {
border-color: #2C2C2C !important;
}
.search-icon g, .show-more-icon:hover path, .notification-cell g, .follow-button .check-mark, .toc-content .view-as g > g,
.edit-icon .icon-group-inner, .editor-remove-x-icon path, .editor-tabs:hover g, .social-actions__button .like-icon g {
stroke: #F7F7F7 !important;
}
.compose-icon polygon+polygon, .tab-item--notifications path, .social-actions__list-item:hover path, .social-actions__list-item:hover svg,
.magazine-cover-footer .lock-button > g, .magazine-cover-footer .arrow-button > g > g, .social-actions__button .share-icon g,
.social-actions__button .flip-icon g {
fill: #F7F7F7 !important;
}
.show-more path, .share-menu .icon-button, .editor-tabs g {
stroke: #888 !important;
}
.close-button g, .stats-dashboard .chart-container svg, .main-header__logo .logo--landscape polygon,
.main-header__logo .logo--landscape path:not(:last-child) {
fill: #DDD !important;
}
.navigation-bar .tabs .tab-item .button--primary {
color: #000 !important;
}
.button:not(.facebook-connect), .input-wrapper, .button--secondary-inverse, .create-magazine__content-wrapper .text-input,
.textarea, .share-flip__input, #item-caption-input, #get-email, .share-article-view .search-for-friends, .share-flip .button--secondary,
.auth-login .button--primary, .auth__text-input, .auth-signup .button--primary, .main-header__buttons .button--inverse,
.section-header .ui-text--page-title .button--inverse, .footer-bar .bar, .meatballs-menu-button--open .meatballs-menu-button__meatball,
article.post .social-actions, .hint-panel .button.not-now, .flip-hint .button-box .not-now {
border-color: #AEAEAE !important;
}
.hint-panel .button.undefined, .flip-hint .button-box .next, .flip-hint .button-box .back { /* Doesn't have border by default */
border: 1px solid #AEAEAE !important;
}
.search__result--topic .topic-tag, .magazine-tile .tile .inner-rect, .dropdown-men, .editor-options .edit-text-icon,
.editor-cover-options-view, .magazine-actions .edit-text-icon, .dropdown-menu li:not(:last-child) {
border-color: #7C7C7C !important;
}
.form-error, .add-favorite-view-container .add-favorite-view .recommended .recommended-title,
.add-favorite-view-container .sub-message.filled, .auth__error-message, .button--primary-inverse {
color: #D22 !important;
}
.postbox, .section-header-title.topic, .show-more-menu, .search__panel, .search__zero-state, .share-article-view .share-url-input,
.postbox-listitem + .postbox-listitem, .search__zero-state-footer, .favorites-menu, .content-share .magazine-selection, .editor .secondary-column,
.navigation-bar>.bar, .notifications-list, .notification-cell, .add-favorite-view-container .add-favorite-view .add-favorites .search-passion,
.search__result, .search__results--topics, .main-header, .home-feed .home-navigation, .section-header, .editor-item-tile::after, .notifications-list {
border-color: #444 !important;
}
.text-input, .button:not(.facebook-connect), .input-wrapper, .form-error, div.gridline-x, div.gridline-y, .postbox, .notification-cell:hover,
.show-more-menu, .show-more-menu .loaded, .search__zero-state-featured, .search__result--top li,
.magazine-tile .tile .inner-rect.revamped, .profile-header-content .text[contentEditable="true"], .create-magazine .button--secondary-inverse,
.textarea, .share-flip__input, #item-caption-input, .item-description, .chart-container, #get-email, .share-article-view .share-url-input,
.share-flip .button--secondary, .magazine-actions .edit-text-icon, .auth-login .button--primary, .auth__text-input, .auth-signup .button--primary,
.main-header__buttons .button--inverse, .main-header__search-input-wrapper input, .search__input-wrapper input,
.section-header .ui-text--page-title .button--inverse, .editor-item-tile::after, .flip-hint .button-box .not-now {
background-color: #2C2C2C !important;
}
input::placeholder {
opacity: 1 !important;
color: #DDD !important;
}
.search__input-wrapper {
background-color: #2C2C2C !important;
}
.nav-items, .editor-tabs .tab-title span, .auth-signup .button--primary:disabled {
color: #888 !important;
}
.nav-items {
border-color: #666 !important;
}
.nav-items .selected, .nav-items a:hover, .favorites__favorite.active, .favorites__favorite:active, .favorites__favorite .hover, .hint-panel,
.profile-metrics .selected, .topic-tag:hover, .light .topic-tag:hover {
color: #EEE !important;
}
.meatballs-menu-button:hover .meatballs-menu-button__meatball, .meatballs-menu-button:hover .meatballs-menu-button__meatball--light {
background-color: #FFF !important;
}
.follow-button {
border-color: rgba(255, 255, 255, 0.7) !important;
}
.meatballs-menu-button__meatball, .meatballs-menu-button__meatball--light, .newspaper-layout-scope .newspaper-header hr {
background-color: #DDD !important;
}
.meatballs-menu__dropdown-menu {
box-shadow: 0 2px 2px rgba(0, 0, 0, 0.5) !important;
}
.meatballs-menu__dropdown-menu li:hover, .dropdown-menu .dropdown-item:hover, .editor-options .edit-text-icon:hover, .edit-item-view a.primary,
.stats-dashboard .top-list-title.top-list-tooltip:hover div[data-tooltip]::after, .stats-dashboard .chart-title.chart-tooltip:hover div[data-tooltip]::after {
background-color: #444 !important;
}
.search__zero-state-featured-link {
border-color: #555 !important;
}
.favorites__favorite:not(.active) a:not(.hover) {
opacity: 0.8 !important;
}
.favorites__favorite, .favorites__favorite a {
opacity: 1 !important;
}
.share-flip .ico-mglass {
border-color: #999 !important;
}
.share-flip .ico-mglass::after {
background-color: #999 !important;
}
.stats-dashboard .cols > *:not(:last-child) {
border-color: rgba(255,255,255,0.05) !important;
}
.stats-dashboard-top-list svg > g > * {
fill: #888 !important;
}
.editor-tabs:hover .tab-title span {
color: #F7F7F7 !important;
}
.favorites-menu .pan-control--right::before {
background: linear-gradient(to left, #7C7C7C, rgba(124,124,124,0))
}
.favorites-menu .pan-control--left::after {
background: linear-gradient(to right, #7C7C7C, rgba(124,124,124,0))
}
}
@-moz-document domain("about.flipboard.com") {
/*
* Name: Flipboard Dark
* Author: Seanharrs
* Version: v1.5
* Repository: https://github.com/Seanharrs/flipboard-dark
* Issues: https://github.com/Seanharrs/flipboard-dark/issues
*/
body, #footer-wrapper, .site-header, .site-header.fixed .main-navigation, .site-main-wrapper, #navigation {
background-color: #222 !important;
}
body, .main, .search-input, .black-box-title, .cssgradients .keyline-left #menu-footer-main a, .cssgradients .keyline-left #menu-footer-2nd-column a,
.cssgradients .keyline-left .bottom-link a, .language-selector a, .main-navigation a, .cssgradients .content-padded a, .cssgradients .post-title > a,
.cssgradients .post-author > a, .cssgradients .three-columns-home .news-item > p > a, .cssgradients .widget p a, .three-columns-home p > a,
.cssgradients .publisher-slides .text-col a, .advertisers-stats.resources .stat a, .cssgradients .load-more-wrapper .load-more,
.tutorial-heading .section-heading, .cssgradients .tutorials-sidebar .textwidget a, .cssgradients .question a, .cssgradients .content-padded span[style],
.cssgradients .tools-landing .item .label a, .cssgradients .widget p a.contact-text, .cssgradients .blog-header .small-caps a, .cssgradients .getapp.get-started,
.single-navigation a, .cssgradients .blog-header .entry-title a, .share-tools .widget-container .more-info a, .share-tools .tool-selection.active span,
.share-tools .widget-container .step > .flex-container .url, .share-tools .widget-container .step .code .widget-code,
.share-tools .widget-container .step .size .select #select-size, .cssgradients .owl-item header > h2 > a, .cssgradients .news-item .news-view-link,
.cssgradients .download-link, #sidebar a, .mobile-navigation-toggle a, .secondary-navigation a {
color: #DDD !important;
}
.language-selector .selector ul li:hover a, .cssgradients .keyline-left #menu-footer-main a:hover, .cssgradients .keyline-left #menu-footer-2nd-column a:hover,
.cssgradients .keyline-left .bottom-link a:hover, .language-selector a:hover, .main-navigation a:focus, .main-navigation a:hover,
.cssgradients .content-padded a:hover, .site-navigation .current-menu-item > a, .cssgradients .post-title > a:hover, .cssgradients .post-author > a:hover,
.cssgradients .three-columns-home .news-item > p > a:hover, .cssgradients .widget p a:hover, .site-main .three-columns-home .social-menu a:hover,
.three-columns-home p > a:hover, .cssgradients .publisher-slides .text-col a:not(.btn):hover, .advertisers-stats.resources .stat a:hover,
.cssgradients .load-more-wrapper .load-more:hover, .cssgradients .tutorials-sidebar .textwidget a:hover, .question-column .show-all,
.cssgradients .question a:hover, .cssgradients .content-padded a span[style]:hover, .cssgradients .tools-landing .item .label a:hover,
.cssgradients .widget p a.contact-text:hover, .cssgradients .blog-header .small-caps a:hover, .cssgradients .categories-list a, .single-navigation a:hover,
.cssgradients .blog-header .entry-title a:hover, .share-tools .widget-container .more-info a:hover, .cssgradients .owl-item header > h2 > a:hover,
.cssgradients .news-item .news-view-link:hover, .cssgradients .download-link:hover, #sidebar a:hover, .secondary-navigation a:focus, .secondary-navigation a:hover {
color: #D22 !important;
}
.footer-global, hr.fat, .page-help-center hr.fat, .site-main .site-sidebar .widget, .three-columns-home h2.headline, .site-main .site-sidebar .widget.widget_nav_menu,
.question, .footer-global .keyline-left, .footer-sub .keyline-left, .page-template-careers-story-page-php .keyline-left, .page-help-center #sidebar,
.question-column:not(:last-child), .blog .blog-item.keyline-right, .tutorial-block hr.line, #red-bolt + hr, .share-tools .selections {
border-color: #444 !important;
}
#sidebar a {
background-image: none !important;
}
.cssgradients .keyline-left #menu-footer-main a, .cssgradients .keyline-left #menu-footer-2nd-column a, .cssgradients .keyline-left .bottom-link a,
.cssgradients .content-padded a, .cssgradients .three-columns-home .news-item > p > a, .cssgradients .widget p a, .three-columns-home p > a,
.cssgradients .publisher-slides .text-col a:not(.btn), .cssgradients .tutorials-sidebar .textwidget a, .cssgradients .question a,
.cssgradients .news-item .news-view-link, #sidebar .widget p:last-child a:last-child, #sidebar .widget > a:last-child {
background-image: linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0) 2px,#DDD 2px,#DDD 3px,rgba(0,0,0,0) 3px) !important;
}
.cssgradients .keyline-left #menu-footer-main a:hover, .cssgradients .keyline-left #menu-footer-2nd-column a:hover,
.cssgradients .keyline-left .bottom-link a:hover, .cssgradients .content-padded a:hover, .cssgradients .three-columns-home .news-item > p > a:hover,
.cssgradients .widget p a:hover, .three-columns-home p > a:hover, .cssgradients .publisher-slides .text-col a:not(.btn):hover,
.cssgradients .tutorials-sidebar .textwidget a:hover, .cssgradients .question a:hover, .cssgradients .blog-header .small-caps a:hover, .cssgradients .categories-list a,
.cssgradients .owl-item header > h2 > a:hover, #sidebar .widget p:last-child a:last-child:hover, #sidebar .widget > a:last-child:hover {
background-image: linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0) 2px,#D22 2px,#D22 3px,rgba(0,0,0,0) 3px) !important;
}
.language-selector .selector > a, .cssgradients .widget.contact-us p:last-child a:hover, #fpb_twitter_widget-2 p:not(:last-child) a,
.cssgradients .widget.contact p a, .cssgradients .widget.contact-us p a {
background-image: none !important;
}
.language-selector .selector > a, .language-selector .selector ul, .resource-item img {
border-color: #7C7C7C !important;
}
.language-selector .selector::after {
border-color: #DDD transparent !important;
}
.language-selector:hover .selector::after {
border-color: #7C7C7C transparent !important;
}
.legal-menu a {
color: #222 !important;
}
.legal-menu a:hover { /* inverted */
color: #2DD !important;
background-image: linear-gradient(to top,rgba(0,0,0,0),rgba(0,0,0,0) 2px,#2DD 2px,#2DD 3px,rgba(0,0,0,0) 3px) !important;
}
.legal-menu li {
filter: invert(100%) !important;
}
.language-selector .selector ul, .share-tools .widget-container .step > .flex-container .url, .share-tools .widget-container .step .code .widget-code,
.share-tools .widget-container .step .size .select #select-size{
background-color: #333 !important;
}
.home-main-subcopy img, .logo-module img {
filter: invert(87%) !important; /* approx #DDD */
}
.main-navigation {
border-color: #D22 !important;
}
.news-item.news-rule {
box-shadow: none !important;
border-color: #333 !important;
}
.publisher-slides .slide-one [class*="col-"], .advertisers-largeTitle, .cssgradients .publisher-slides .text-col .btn, .cssgradients .page-header .btn,
.search-input, .cssgradients .tools-landing .btn, .cssgradients .getapp.get-started, .tags-list a, .cssgradients .site-sidebar .btn-black,
.share-tools .widget-container .step .size .select #select-size, .advertisers-stats.resources, .single-navigation .prev {
border-color: #AEAEAE !important;
}
.cssgradients .publisher-slides .text-col .btn, .cssgradients .page-header .btn, .search-input, .cssgradients .tools-landing .btn,
.cssgradients .getapp.get-started, .tags-list a, .cssgradients .site-sidebar .btn-black {
background-color: #2C2C2C !important;
}
.advertisers-largeTitle h2 .strike::after {
background-color: #D22 !important;
}
.three-columns-home .widget.widget_search {
border: none !important;
}
.black-box-title, .module-recentposts .short-overline::before, .dropdowns-mobile, .share-tools .selections .tool-selection .preview {
background-color: #444 !important;
}
.load-more-wrapper .spinner {
border-color: transparent #DDD #DDD;
}
.share-tools .widget-container .more-info a {
text-decoration-color: #DDD !important;
}
.share-tools .widget-container .more-info a:hover {
text-decoration-color: #D22 !important;
}
.share-tools .tool-selection span {
color: #888 !important;
}
.share-tools .selections .tool-selection.active .preview {
box-shadow: inset 0 -15px 0 0 #D22 !important;
}
.mobile-navigation-toggle a::before, .mobile-navigation-toggle a::after {
background-color: #DDD !important;
}
}