-
-
Save waylaidwanderer/36e96abad981ef18110871aa4abad153 to your computer and use it in GitHub Desktop.
[Stylus] Basecamp 3 - Dark mode
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
body { | |
background: #191919; | |
color: #d2d2d2; | |
} | |
h1 { | |
color: #d2d2d2; | |
} | |
.nav__bar { | |
border-bottom: 1px solid #ffffff1c; | |
} | |
.nav__bar, | |
.nav__main { | |
background: #212121; | |
color: #d2d2d2; | |
} | |
.unread-badge { | |
filter: invert(1); | |
color: black; | |
} | |
.nav__link--me .avatar, | |
.nav__link--accounts { | |
filter: inherit; | |
} | |
.card { | |
background: #101010; | |
color: #d2d2d2; | |
border: 1px solid rgba(0, 0, 0, 0.2); | |
} | |
.date_divider span, | |
.latest-activity span, | |
.latest-activity__project-headline span, | |
.project-index__header span { | |
background: none; | |
color: #d2d2d2; | |
} | |
.panel.filterable-projects { | |
background: none; | |
} | |
.panel--project { | |
background: rgba(255, 255, 255, 0.04); | |
box-shadow: none; | |
color: #d2d2d2; | |
} | |
.chat-line__bubble { | |
background: rgba(255, 255, 255, 0.1); | |
color: #d2d2d2; | |
} | |
time { | |
color: #d2d2d2; | |
} | |
.chat-line--me .chat-line__bubble { | |
background: #0e0e0e; | |
} | |
.btn { | |
background-color: black; | |
color: #d2d2d2; | |
border: black; | |
} | |
.project-avatars__edit:after { | |
box-shadow: none; | |
} | |
.recording-breadcrumbs { | |
background: #272727; | |
box-shadow: none; | |
} | |
.chat, | |
.chat__header, | |
.panel { | |
background: #212121; | |
box-shadow: none; | |
border: 1px solid #383838; | |
} | |
.chat, | |
.chat__header { | |
border: none; | |
} | |
.chat-line--mention .chat-line__bubble { | |
background: #46403d; | |
} | |
.person-title { | |
color: rgb(109, 109, 109); | |
} | |
.panel.flush--ends { | |
background: none; | |
border: none; | |
} | |
.thread__subscriptions { | |
border-top: 1px solid #353535; | |
} | |
.chat__header-block, | |
.decorated { | |
color: #d2d2d2; | |
} | |
.chat a { | |
color: #8aa8cd; | |
} | |
.input { | |
background: #323232; | |
border-color: #1b1b1b; | |
color: #d2d2d2; | |
} | |
.chat__emoji-button, | |
.chat__attach-button { | |
filter: brightness(1000); | |
} | |
.recordable { | |
background: none; | |
color: #d2d2d2; | |
} | |
trix-toolbar { | |
background: none; | |
} | |
trix-toolbar .trix-button { | |
filter: invert(1) | |
} | |
.push_half--bottom { | |
color: #d2d2d2; | |
} | |
.nav-menu__sheet { | |
background: #131313; | |
} | |
.nav-menu.expanded:after { | |
border-bottom-color: #131313; | |
} | |
.thread-entry { | |
background-color: #171717; | |
} | |
.thread-entry__avatar { | |
box-shadow: 0 0 0 5px #222222; | |
} | |
.thread-entry__time { | |
color: #d2d2d2; | |
} | |
.prompt { | |
color: #d2d2d2; | |
display: block; | |
width: 100%; | |
background: #1f1f1f; | |
border: 1px solid #313131; | |
} | |
.trix-contained-input { | |
background: #212121; | |
border-color: #333333; | |
} | |
.sticky-trix-toolbar { | |
border-bottom-color: #3a3a3a; | |
} | |
trix-editor { | |
background: #060606; | |
color: #d2d2d2; | |
} | |
.break > span { | |
background: none; | |
} | |
.break:before { | |
display: none; | |
} | |
.thread__subscriptions .thread-entry { | |
background: none; | |
} | |
.message__date a, | |
.message__date .link_button { | |
color: #d2d2d2; | |
text-decoration: none; | |
} | |
.card--app .card__description { | |
text-shadow: none; | |
} | |
.latest-activity:before { | |
border-left: 1px solid rgba(255, 255, 255, 0.1); | |
} | |
.report-menu__item--selected { | |
background: #4e4e4e; | |
} | |
.help-button__icon { | |
display: none; | |
} | |
.boost { | |
background: #0e0e0e; | |
color: #d2d2d2; | |
border: 1px solid #ffffff1c; | |
} | |
.message .boosts, | |
.document .boosts, | |
.recordable .boosts, | |
.boosts-report .boosts { | |
background: none; | |
} | |
.boost-form.expanded .input--boost { | |
background: none; | |
} | |
.message__attribution { | |
border-color: #3c3c3c; | |
} | |
.chat-line__avatar .avatar { | |
background: none; | |
box-shadow: 0 0 0 4px #1a1a1a; | |
} | |
.card--app .card__header, | |
.messages-table--for-card { | |
border-color: #2d2d2d; | |
} | |
.sheet { | |
background: #151515; | |
} | |
.sheet--shadowed { | |
box-shadow: none; | |
} | |
.panel--profile { | |
background: none; | |
} | |
bc-suggestion-select bc-suggestion-option { | |
background: #252525; | |
} | |
.emoji-picker__modal { | |
background: #131313; | |
} | |
.emoji-picker__toggle:after, | |
.emoji-picker__toggle:before { | |
display: none; | |
} | |
.chat__typing-status { | |
background: none; | |
color: #d2d2d2; | |
} | |
.search__exclude-chat { | |
background: #403c12; | |
} | |
.search-result--selected { | |
background: #2b3661; | |
} | |
.notice--for-recording { | |
background: #171717; | |
} | |
.push_half--top { | |
box-shadow: none; | |
} | |
.options-menu__content { | |
background: #191919; | |
color: #d2d2d2; | |
} | |
.options-menu__expansion-toggle::after { | |
display: none; | |
} | |
.recording-color--white { | |
background: transparent !important; | |
} | |
.todolist-group__header .break::after { | |
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #212121 100%); | |
} | |
.latest-activity__full-width .activity-item { | |
background: #212121; | |
} | |
.expanded .options-menu__expansion-toggle:before { | |
display: none; | |
} | |
.todo.selected { | |
background-color: #151515; | |
} | |
.todo-edit-menu { | |
background: #191919; | |
border: 1px solid #2b2b2b; | |
} | |
.action-menu:before, | |
.action-menu:after { | |
display: none; | |
} | |
.action-list + .action-list { | |
border-top: 1px solid #313131; | |
} | |
pre { | |
background: rgba(255, 255, 255, 0.03); | |
} | |
.schedule-day__mini-date { | |
filter: invert(1); | |
} | |
.miniaturize-cards .card--folder, | |
.card-grid--miniaturized .card--folder { | |
background-color: #191919; | |
} | |
.card__content > footer { | |
background: linear-gradient(rgba(255, 255, 255, 0), #101010 30%); | |
} | |
blockquote { | |
border-left: 3px solid #fff; | |
} | |
.todolist-group__header .break::after { | |
background: none; | |
} | |
.todolist-group__color { | |
color: #313131; | |
} | |
.todo__drag-handle, | |
.todolist__drag-handle { | |
filter: invert(1); | |
} | |
.back-to-top__button { | |
filter: invert(1); | |
color: gray; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment