Skip to content

Instantly share code, notes, and snippets.

@sj26

sj26/.gitignore

Forked from guilherme-teodoro/style.css
Last active November 12, 2020 01:30
Show Gist options
  • Save sj26/74a353bc6c52a564ee95edc886dee4c1 to your computer and use it in GitHub Desktop.
Save sj26/74a353bc6c52a564ee95edc886dee4c1 to your computer and use it in GitHub Desktop.
Download ZIP
Basecamp 3 - Dark mode
Raw
.gitignore
*.css
!*.user.css
/node_modules
Raw
README.md

Basecamp Dark Mode

Basecamp doesn't have a native dark mode, and I miss it so much that I've attempted to make something which works.

This downloads the latest styles from Basecamp and then uses postcss to create a dark mode user style. It strip it back to just properties changing colours, preserving all selectors and media queries in order, maps the colours using within a known palette falling back to negating the colour, plus a few special overrides, and wraps it all in a dark mode media query. I use it in Safari with PageExtender, and it mostly works a treat:

image

There's still a bunch of tweaking to do so that the interface works better in dark mode rather than being a straight inversion, but it's not bad for a weekend hack project. I'll improve it as I can over time.

Installation

You'll need userstyles support for your browser. If you use Chrome, I'd recommend installing Stylus:

https://chrome.google.com/webstore/detail/stylus/clngdbkpkpeebahjckkjfobafhncgmne?hl=en

Then open the user style from this gist linked above:

https://gist.githubusercontent.com/sj26/74a353bc6c52a564ee95edc886dee4c1/raw/basecamp-dark.user.css

You should get an "Install style" button:

Click that button and you should have dark mode basecamp, and it should be automatically updated if I push new things.

Raw
basecamp-dark.user.css
/* ==UserStyle==
@name Basecamp Dark Mode
@namespace gist.github.com/sj26/74a353bc6c52a564ee95edc886dee4c1
@version 1.0.0
@description The missing dark mode for Basecamp
@author Samuel Cochran <[email protected]>
@homepage https://gist.github.com/sj26/74a353bc6c52a564ee95edc886dee4c1
@updateURL https://gist.githubusercontent.com/sj26/74a353bc6c52a564ee95edc886dee4c1/raw/basecamp-dark.user.css
==/UserStyle== */
@-moz-document domain("3.basecamp.com") {
@media (prefers-color-scheme: dark) {
mark {
background-color: #0000FF;
color: #FFFFFF;
}
fieldset {
border-top-color: #3F3F3F;
border-right-color: #3F3F3F;
border-bottom-color: #3F3F3F;
border-left-color: #3F3F3F;
}
.superpowers__action--owner::before {
background-color: #006666 !important;
}
.superpowers__action--staff::before {
background-color: #2BBBD1 !important;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.move-fields {
border-bottom-color: #333333;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.move-fields__from,.move-fields__to {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.move-fields__from {
border-bottom-color: #333333;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.move-fields__divider {
border-left-color: #333333;
}
}
@media (prefers-color-scheme: dark) {
.move-fields__arrow {
background-color: #222222;
}
.global-trash .date_divider h3 {
color: #929292;
}
.migration-animation:before {
border-bottom-color: #333333;
}
.migration-animation__start,.migration-animation__end {
background-color: #222222;
border-right-color: #333333;
}
.migration-animation__end {
border-left-color: #333333;
}
.action-menu {
background-color: #222222;
}
.action-menu {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.action-menu:before,.action-menu:after {
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
border-top-color: #404040;
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
}
@media screen and (min-width: 992px) and (prefers-color-scheme: dark) {
.action-menu:before,.action-menu:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: #404040;
}
}
@media (prefers-color-scheme: dark) {
.action-menu:after {
border-top-color: #222222;
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
}
@media screen and (min-width: 992px) and (prefers-color-scheme: dark) {
.action-menu:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: #222222;
}
}
@media (prefers-color-scheme: dark) {
.action-list+.action-list {
border-top-color: #1A1A1A;
}
.action-list__action:hover {
background-color: #444444;
}
.action-sheet__close {
background-color: rgba(34, 34, 34, 0) !important;
}
.action-sheet__content {
background-color: #8AA8CD;
color: #222222;
}
.action-sheet__action:hover {
background-color: rgba(255, 255, 255, 0.25);
}
.action-sheet__action+.action-sheet__action {
border-top-color: rgba(255, 255, 255, 0.1);
}
.removal-warning {
color: #2BBBD1;
}
@-webkit-keyframes yellow-fade {
0% {
background-color: #00051A;
}
}
@-moz-keyframes yellow-fade {
0% {
background-color: #00051A;
}
}
@keyframes yellow-fade {
0% {
background-color: #00051A;
}
}
.attachment__progress {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
color: #004040;
}
.attachment__progress::-webkit-progress-bar {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
}
.attachment__progress::-webkit-progress-value {
background-color: #004040;
}
.attachment__progress::-moz-progress-bar {
background-color: #004040;
}
.attachment__caption-editor {
background-color: rgba(34, 34, 34, 0);
}
.attachment__caption-editor:focus {
box-shadow: none !important;
}
.attachment__frame {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.attachment__frame--placeholder {
background-color: #0D0D0D;
color: rgba(34, 34, 34, 0);
}
.attachment:not(.attachment--preview) .attachment__caption>.attachment__size,.attachment:not(.attachment--preview) .attachment__caption .attachment__attributes {
color: #929292;
}
.attachment--preview .attachment__caption {
color: #929292;
}
.autosaved__notice-container:after {
color: #DDDDDD;
}
.avatar--overflow {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.avatar-group__overflow {
background-color: #222222;
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
}
.client-avatar-group .avatar:not(.u-display-n) ~ .client-avatar-group__marker {
border-top-color: #0024B2;
border-right-color: #0024B2;
border-bottom-color: #0024B2;
border-left-color: #0024B2;
}
.back-to-top__button {
background-color: rgba(34, 34, 34, 0.8) !important;
}
.badge {
background-color: #133ABD;
color: #222222;
}
.badge--uncolor {
background-color: #DDDDDD;
}
.badge--grey {
background-color: #404040;
}
.badge--darkgrey {
background-color: rgba(255, 255, 255, 0.35);
}
.badge--green {
background-color: #004040;
}
.app-banner {
box-shadow: 0 0 1px rgba(255, 255, 255, 0.25), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.app-banner--announcement {
background-color: #00051A;
}
.app-banner--expired-trial {
background-color: #341105;
}
.app-banner--expiring-trial {
background-color: #8DA152;
color: #222222;
}
.discount-banner {
background-color: #333333;
border-top-color: rgba(255, 255, 255, 0.05);
}
.discount-banner--education {
color: #222222;
}
.binary-toggle__inner {
background-color: rgba(255, 255, 255, 0.1);
}
.binary-toggle__inner:after,.binary-toggle__inner:before {
color: #222222;
}
.binary-toggle__inner:before {
color: #222222;
}
.binary-toggle__inner:after {
color: #929292;
}
.binary-toggle__switch {
background-color: #222222;
box-shadow: 0 0 3px #404040;
}
.binary-toggle__checkbox:checked+.binary-toggle__inner {
background-color: #004040;
}
.binary-toggle__checkbox:focus+.binary-toggle__inner {
box-shadow: inset 0 0 15px rgba(255, 255, 255, 0.35);
}
.blank-slate__prompt {
color: #009999;
}
.blank-slate__scenarios {
background-color: #00051A;
box-shadow: 0 1px 3px 0 #404040;
}
.blank-slate--client-access .blank-slate__screenshot {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.blank-slate--client-access .blank-slate__caption {
color: #929292;
}
.message .boosts,.document .boosts,.recordable .boosts,.boosts-report .boosts {
background-color: #333333;
}
.boost {
background-color: #222222;
color: #FFFFFF;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.boost-form.expanded {
box-shadow: 0 0 30px rgba(255, 255, 255, 0.15);
}
}
@media (prefers-color-scheme: dark) {
.boost-form__intro {
background-color: #8DA152;
color: #222222;
box-shadow: 0 0 6px rgba(255, 255, 255, 0.05);
}
.boost-form__intro:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-top-color: #8DA152;
}
.boost-form__label:focus {
box-shadow: 0 0 2px 2px #2E76A2;
}
.boost-form__label:active {
box-shadow: none;
}
.input--boost {
color: #FFFFFF;
}
.boosts-report__date>span {
background-color: #222222;
color: #006666;
}
.boosts-report__card {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
box-shadow: 0 0 6px rgba(255, 255, 255, 0.03);
}
.recording-breadcrumbs {
background-color: #222222;
border-bottom-color: rgba(255, 255, 255, 0.03);
box-shadow: 0 1px 4px rgba(255, 255, 255, 0.1), 0 10px 30px #0C1317;
}
.recording-breadcrumb__jump {
background-color: rgba(34, 34, 34, 0);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.recording-breadcrumb__jump-action {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
}
@media (prefers-color-scheme: dark) {
.recording-breadcrumbs--adminland {
background-color: #0C0300;
}
.calendar-grids {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.calendar-grids:after {
border-right-color: rgba(255, 255, 255, 0.15);
}
}
@media (prefers-color-scheme: dark) {
.calendar-grids__loader {
background-color: rgba(34, 34, 34, 0.5);
}
.calendar-grids__header {
background-color: #FFFFFF;
}
.calendar-grids__jump-to-today {
color: #222222;
}
.calendar-grid__month,.calendar-grid__weekday {
color: #222222;
}
.calendar-grid__weekday {
color: rgba(34, 34, 34, 0.8);
}
.calendar-grid__cell {
border-top-color: #0D0D0D;
border-right-color: #0D0D0D;
border-bottom-color: #0D0D0D;
border-left-color: #0D0D0D;
}
.calendar-grid__cell--selected .calendar-grid__day {
background-color: #FFFFFF;
color: #222222;
}
.calendar-grid__cell--today .calendar-grid__day {
color: #8AA8CD;
}
.calendar-grid__cell--today.calendar-grid__cell--selected .calendar-grid__day {
color: #222222 !important;
}
.calendar-grid__items {
color: #8AA8CD;
}
.calendar-grid__cell--selected .calendar-grid__items {
color: #222222;
}
.camper-helper__bubble {
background-color: #8DA152;
color: #222222;
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.25);
}
.camper-helper__video-thumb {
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.5);
}
.camper-helper__toggle {
background-color: #8DA152;
color: #222222;
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.25);
}
.camper-helper__video {
background-color: #111111;
}
.camper-helper--zoomed .camper-helper__video--fade-in {
background-color: rgba(17, 17, 17, 0);
}
.card-colorpicker__menu {
background-color: #222222;
}
.card-colorpicker__menu {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.card {
box-shadow: 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
background-color: #222222;
}
.card__content>section span.placeholder_text_for_draft {
color: #565656;
}
.card__content>section article.comment time {
color: #DDDDDD;
}
.card__content>footer {
color: #929292;
}
.card__metadata {
color: #DDDDDD;
}
.card--placeholder {
box-shadow: none;
background-color: #404040;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.card--torn {
box-shadow: 0 2px 10px #404040;
}
.card--project {
box-shadow: 0 0 1px rgba(255, 255, 255, 0.25), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.card--project .card__progress {
color: #DDDDDD;
}
.card--project .card__progress:before {
background-color: rgba(34, 34, 34, 0);
}
.card--project.content-filter__selected {
box-shadow: 0 0 8px rgba(138, 168, 205, 0.5), 0 0 0 2px rgba(46, 118, 162, 0.5);
}
.card__people--overflow-count {
border-top-color: rgba(255, 255, 255, 0.25);
border-right-color: rgba(255, 255, 255, 0.25);
border-bottom-color: rgba(255, 255, 255, 0.25);
border-left-color: rgba(255, 255, 255, 0.25);
background-color: #222222;
color: #54585F;
}
.card--project-template {
background-color: #444444;
border-top-color: rgba(138, 168, 205, 0.5);
border-right-color: rgba(138, 168, 205, 0.5);
border-bottom-color: rgba(138, 168, 205, 0.5);
border-left-color: rgba(138, 168, 205, 0.5);
}
.card--project-template .card__content,.card--project-template .card__metadata,.card--project-template .card__description,.card--project-template .card__title--settings {
color: #8AA8CD;
}
.card__people-pill {
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
color: #54585F;
}
.card--project-logo,.card--project-me {
box-shadow: none;
}
.card--project-me .menav__badge {
color: rgba(255, 255, 255, 0.5);
}
.card--add-project {
color: #CCCCCC;
background-color: rgba(34, 34, 34, 0.5);
}
.card--add-project:hover {
background-color: #222222;
}
.card--add-project-or-template {
color: #CCCCCC;
background-color: rgba(34, 34, 34, 0.5);
}
.card--add-project-or-template:hover {
background-color: rgba(34, 34, 34, 0.5);
}
.card--add-project-or-template .card__link--internal:first-of-type {
border-bottom-color: rgba(255, 255, 255, 0.05);
}
.card--add-project-or-template .card__link--internal:hover {
background-color: #222222;
}
.card-settings__menu--template .card-settings__action:hover {
background-color: rgba(255, 255, 255, 0.05) !important;
}
.card--folder {
background-color: #191919;
}
.miniaturize-cards .card--folder,.card-grid--miniaturized .card--folder {
background-color: #1A1A1A;
}
.miniaturize-cards .card--placeholder,.card-grid--miniaturized .card--placeholder {
box-shadow: none;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.card--app .card__header {
border-bottom-color: #333333;
}
.chat-gap__text>span {
background-color: #222222;
}
.chat-gap__text:before {
border-bottom-color: rgba(255, 255, 255, 0.1);
}
.chat__header {
background-color: #222222;
}
.chat__header--profile {
border-bottom-color: #1A1A1A;
}
.chat__date-divider {
color: #929292;
}
.chat__attach-button {
background-color: rgba(34, 34, 34, 0);
}
.chat__mic:focus {
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
}
.chat__typing-status {
background-color: rgba(34, 34, 34, 0.9);
color: #929292;
}
.chat-line__avatar .avatar {
background-color: #222222;
box-shadow: 0 0 0 1px #333333, 0 0 0 4px #222222;
}
.chat-line__bubble {
background-color: #333333;
}
.chat-line__bubble pre {
background-color: rgba(34, 34, 34, 0);
}
.chat-line__timestamp {
color: #929292;
}
.chat-line--mention .chat-line__bubble {
background-color: #004040;
}
.chat-line--me .chat-line__bubble {
background-color: #444444;
}
.chat-line--delivered .chat-line__bubble:after {
color: #929292;
}
.chat-line--undelivered .chat-line__bubble {
background-color: #001A1A;
}
.chat-line--integration table {
background-color: #222222;
box-shadow: 0 1px 2px rgba(255, 255, 255, 0.25);
}
.chat-line--integration th,.chat-line--integration td {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.chat-line--integration th {
border-bottom-color: #FFFFFF;
}
.chat-gap {
background-color: #00051A;
border-top-color: #333333;
border-bottom-color: #333333;
}
.chat-gap__text>span {
background-color: #00051A;
}
.chat-gap__text:before {
border-bottom-color: #929292;
}
.chat--disconnected .chat__mic {
background-color: #00051A;
border-top-color: #133ABD;
border-right-color: #133ABD;
border-bottom-color: #133ABD;
border-left-color: #133ABD;
}
.chat--disconnected .chat__notice--disconnected {
background-color: rgba(34, 34, 34, 0.9);
}
.client-visibility-flag--for-index {
background-color: #0024B2;
}
.client-visibility-flag--for-people {
background-color: #0024B2;
color: #FFFFFF;
}
.client-board-edit__link {
color: rgba(255, 255, 255, 0.5) !important;
}
.client-approval-pill .client-approval-pill__text {
color: #222222;
}
.client-subscribers__row {
border-bottom-color: rgba(255, 255, 255, 0.05);
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.client-subscribers__label {
color: #DDDDDD;
}
}
@media (prefers-color-scheme: dark) {
.client-admittance-secret {
background-color: #00051A;
border-top-color: #133ABD;
border-right-color: #133ABD;
border-bottom-color: #133ABD;
border-left-color: #133ABD;
}
.client-admittance-secret__field input[type=text] {
background-color: rgba(34, 34, 34, 0);
}
.client-thread-entry__recipients-more {
color: rgba(255, 255, 255, 0.5) !important;
}
.client-reply__new-content {
background-color: #222222;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.client-reply__new-content trix-toolbar,.client-reply__new-content .trix-button-group--block-tools {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.client-stamp,.client-stamp--on-card {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
color: #8AA8CD;
}
.client-stamp--from {
border-top-color: #009999;
border-right-color: #009999;
border-bottom-color: #009999;
border-left-color: #009999;
color: #009999 !important;
}
.document-style-editor.recordable .send-to-client__field {
border-bottom-color: #1A1A1A;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.document-style-editor.recordable .send-to-client__field {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
}
@media (prefers-color-scheme: dark) {
.client-help__screenshot {
border-top-color: #929292;
border-right-color: #929292;
border-bottom-color: #929292;
border-left-color: #929292;
box-shadow: 6px 6px 0 #404040;
}
.client-approval-status {
color: #222222;
}
.client-approval-status .decorated {
color: #222222;
}
.client-approval-status--pending {
background-color: #006666 !important;
}
.client-approval-status--approved {
background-color: #004040 !important;
}
.client-approval-status--not-approved {
background-color: #2BBBD1 !important;
}
.client-approval-status--canceled {
background-color: #929292 !important;
}
.comments-balloon {
background-color: #8AA8CD;
color: #222222;
}
.content-type-icon {
background-color: #929292;
}
.content-type-icon--todo,.content-type-icon--todolist,.content-type-icon--todoset,.content-type-icon--to-do,.content-type-icon--to-dos,.content-type-icon--completion,.content-type-icon--hill_version {
background-color: #004040;
}
.content-type-icon--todo-added {
background-color: #004040;
}
.content-type-icon--message,.content-type-icon--comment,.content-type-icon--message_board {
background-color: #8AA8CD;
}
.content-type-icon--answer,.content-type-icon--question_answer {
background-color: #A7A929;
}
.content-type-icon--question,.content-type-icon--questionnaire {
background-color: #A7A929;
}
.content-type-icon--reminder,.content-type-icon--reports {
background-color: #A7A929;
}
.content-type-icon--event,.content-type-icon--schedule,.content-type-icon--schedule_entry,.content-type-icon--schedule_entry_occurrence,.content-type-icon--participation {
background-color: #00D2AA;
}
.content-type-icon--journal {
background-color: #2E76A2;
}
.content-type-icon--client,.content-type-icon--client_correspondence,.content-type-icon--client {
background-color: #4C37CC;
}
.content-type-icon--cloudfile,.content-type-icon--googledocument,.content-type-icon--google_document {
background-color: #2BBBD1;
}
.content-type-icon--folder,.content-type-icon--vault {
background-color: #DDDDDD;
}
.content-type-icon--upload,.content-type-icon--document,.content-type-icon--attachment {
background-color: #0024B2;
}
.content-type-icon--upload,.content-type-icon--attachment {
background-color: #929292;
}
.content-type-icon--mention {
background-color: #2BBBD1;
}
.content-type-icon--boostreport {
background-color: #006666;
}
.content-type-icon--inbox,.content-type-icon--inbox_forward {
background-color: #74A661;
}
.content-type-icon--chat {
background-color: #CB5523;
}
.content-type-icon--ping {
background-color: #2BBBD1;
}
.content-type-icon--activity-report {
background-color: #0024B2;
}
.content-type-icon--person-report {
background-color: #009999;
}
.content-type-icon--assignment {
background-color: #CB5523;
}
.date {
color: #0D0D0D;
}
.date__header {
color: #222222;
}
.date__day {
background-color: #222222;
color: #FFFFFF;
}
.date__weekday {
background-color: #222222;
color: #FFFFFF;
}
.mini-date:before {
background-color: #222222;
}
.date-coloring--january {
color: #FC560B;
}
.date-coloring--february {
color: #FF432B;
}
.date-coloring--march {
color: #FF6977;
}
.date-coloring--april {
color: #B350AF;
}
.date-coloring--may {
color: #743CB5;
}
.date-coloring--june {
color: #504BD4;
}
.date-coloring--july {
color: #003EF8;
}
.date-coloring--august {
color: #0067FF;
}
.date-coloring--september {
color: #008FBC;
}
.date-coloring--october {
color: #2E90AF;
}
.date-coloring--november {
color: #72919C;
}
.date-coloring--december {
color: #DE690C;
}
.date-coloring--expired {
background-color: #0D0D0D;
}
.ui-datepicker {
background-color: #222222;
box-shadow: 0 0.3rem 1rem #404040;
}
.ui-datepicker-header {
background-color: #FFFFFF;
color: #222222;
}
.ui-datepicker-calendar a.ui-state-active {
background-color: #FFFFFF;
color: #222222;
}
.ui-datepicker-today a {
color: #2BBBD1;
}
.ui-state-disabled {
color: #404040;
}
.device {
border-top-color: #1A1A1A;
}
.device:last-of-type {
border-bottom-color: #1A1A1A;
}
bc-modal {
background-color: rgba(255, 255, 255, 0.4);
}
.color-picker__input:checked ~ .color-picker__swatch {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.color-picker__input:checked ~ .color-picker__swatch::before {
color: #FFFFFF;
}
.color-picker--for-text-foreground .color-picker__swatch {
background-color: rgba(34, 34, 34, 0) !important;
}
.color-picker--for-text-background .color-picker__swatch {
color: #FFFFFF !important;
}
bc-suggestion-select {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
bc-suggestion-select bc-suggestion-option {
background-color: #222222;
}
bc-suggestion-select bc-suggestion-option[selected]:not(.flashing-off) {
background-color: #8AA8CD;
color: #222222;
}
bc-suggestion-select bc-suggestion-option:not([selected]) .autocompletable__email_address {
color: #929292;
}
bc-time-picker .time-picker__options-wrapper {
background-color: #222222;
}
bc-time-picker .time-picker__options-wrapper {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
bc-time-picker .time-picker__item+.time-picker__item {
border-top-color: #333333;
}
.formatted_content blockquote.twitter-tweet {
border-top-color: #111111;
border-right-color: #222222;
border-bottom-color: #444444;
border-left-color: #222222;
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.15);
}
.formatted_content blockquote.twitter-tweet {
background-color: #222222;
box-shadow: none;
border-top-color: #1E1712;
border-right-color: #1E1712;
border-bottom-color: #1E1712;
border-left-color: #1E1712;
}
.formatted_content blockquote.twitter-tweet:before {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
color: #333333;
}
.formatted_content blockquote.twitter-tweet:after {
background-color: #111111;
}
.formatted_content blockquote.twitter-tweet a {
box-shadow: none;
color: #D48446;
}
.formatted_content blockquote.twitter-tweet>a {
color: #777777;
}
article.card .formatted_content blockquote.twitter-tweet>span.disabled_link {
color: #777777;
}
.emoji-picker__modal {
background-color: #222222;
}
.emoji-picker__modal {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.emoji-picker--expanded .emoji-picker__toggle:after,.emoji-picker--expanded .emoji-picker__toggle:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.emoji-picker--expanded .emoji-picker__toggle:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-top-color: #222222;
}
.emoji-picker--expanded .emoji-picker__toggle:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-top-color: #404040;
}
.input--required-text,.oops-shake-it {
background-color: #00051A !important;
}
.event-form {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.event-form__field {
border-top-color: rgba(255, 255, 255, 0.05);
}
.event-form__prompt {
color: #565656 !important;
}
.event-form__title::-webkit-input-placeholder,.event-form__people input::-webkit-input-placeholder {
color: #565656;
}
.event-form__title::-moz-placeholder,.event-form__people input::-moz-placeholder {
color: #565656;
}
.event-form__title:-ms-input-placeholder,.event-form__people input:-ms-input-placeholder {
color: #565656;
}
.event-form__title::placeholder,.event-form__people input::placeholder {
color: #565656;
}
.event-form__placeholder {
color: #565656;
}
.event-form__repeat-until {
background-color: #333333;
}
.flash-notice__content {
background-color: rgba(255, 255, 255, 0.75);
color: #222222;
}
.flash-notice__link {
color: #222222;
}
ins.diffins,ins.diffmod {
background-color: #17000A;
border-top-color: #960041;
border-right-color: #960041;
border-bottom-color: #960041;
border-left-color: #960041;
}
del.diffdel,del.diffmod {
background-color: #001A1A;
border-top-color: #004D4D;
border-right-color: #004D4D;
border-bottom-color: #004D4D;
border-left-color: #004D4D;
}
bc-autocomplete.focused:not(.input--borderless) {
box-shadow: 0 0 6px rgba(138, 168, 205, 0.5);
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
}
bc-autocomplete:not([multiple]) .autocompletable {
background-color: rgba(34, 34, 34, 0);
color: #FFFFFF;
}
bc-autocomplete .autocompletable {
background-color: #333333;
color: #FFFFFF;
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
bc-autocomplete .autocompletable__unselect {
color: #FFFFFF;
}
bc-autocomplete .autocompletable__unselect:hover {
color: #FFFFFF;
}
bc-autocomplete input {
background-color: rgba(34, 34, 34, 0);
border-left-color: #222222;
}
bc-autocomplete input:focus {
box-shadow: none;
}
.btn {
background-color: #222222;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.btn:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #333333;
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.15);
}
.btn--primary {
background-color: #004040;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
color: #222222;
}
.btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #DD82B5;
border-top-color: #DD82B5;
border-right-color: #DD82B5;
border-bottom-color: #DD82B5;
border-left-color: #DD82B5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--secondary {
background-color: #222222;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
color: #004040;
}
.btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #DD82B5;
border-right-color: #DD82B5;
border-bottom-color: #DD82B5;
border-left-color: #DD82B5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--delete {
background-color: #030D0E;
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
color: #2BBBD1;
}
.btn--delete:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #0C3339;
border-top-color: #53CADC;
border-right-color: #53CADC;
border-bottom-color: #53CADC;
border-left-color: #53CADC;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--reversed {
background-color: #222222;
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
color: #FFFFFF;
}
.btn--reversed:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: rgba(25, 25, 25, 0);
border-right-color: rgba(25, 25, 25, 0);
border-bottom-color: rgba(25, 25, 25, 0);
border-left-color: rgba(25, 25, 25, 0);
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--reversed-transparent {
background-color: rgba(34, 34, 34, 0);
border-top-color: #222222;
border-right-color: #222222;
border-bottom-color: #222222;
border-left-color: #222222;
color: #222222;
}
.btn--reversed-transparent:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: rgba(25, 25, 25, 0);
border-top-color: #191919;
border-right-color: #191919;
border-bottom-color: #191919;
border-left-color: #191919;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--semi-transparent {
background-color: rgba(255, 255, 255, 0.15);
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.btn--semi-transparent:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: rgba(255, 255, 255, 0.15);
border-top-color: rgba(25, 25, 25, 0);
border-right-color: rgba(25, 25, 25, 0);
border-bottom-color: rgba(25, 25, 25, 0);
border-left-color: rgba(25, 25, 25, 0);
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--google {
background-color: #BD7A0B;
border-top-color: #BD7A0B;
border-right-color: #BD7A0B;
border-bottom-color: #BD7A0B;
border-left-color: #BD7A0B;
color: #222222;
}
.btn--google:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #ED990E;
border-top-color: #ED990E;
border-right-color: #ED990E;
border-bottom-color: #ED990E;
border-left-color: #ED990E;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--client-show {
background-color: #0024B2;
border-top-color: #0024B2;
border-right-color: #0024B2;
border-bottom-color: #0024B2;
border-left-color: #0024B2;
color: #FFFFFF;
}
.btn--client-show:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #002EE5;
border-top-color: #002EE5;
border-right-color: #002EE5;
border-bottom-color: #002EE5;
border-left-color: #002EE5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--client-hide {
background-color: #341105;
border-top-color: #341105;
border-right-color: #341105;
border-bottom-color: #341105;
border-left-color: #341105;
color: #FFFFFF;
}
.btn--client-hide:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #632009;
border-top-color: #632009;
border-right-color: #632009;
border-bottom-color: #632009;
border-left-color: #632009;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.btn--borderless {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
background-color: rgba(34, 34, 34, 0) !important;
}
.btn--dark-bordered {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.btn--placeholder {
color: #222222 !important;
}
.btn--subscribed-icon {
color: #009999;
}
.btn__keyboard-shortcut {
background-color: #1A1A1A;
}
.copy-to-clipboard__success-toast:after {
color: #222222;
background-color: rgba(255, 255, 255, 0.75);
}
.copy-to-clipboard--for-search-result .copy-to-clipboard__button {
background-color: rgba(34, 34, 34, 0) !important;
box-shadow: none !important;
color: #929292 !important;
}
.field__input {
background-color: #222222;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.field__input:focus:not(.u-hide-focus) {
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
box-shadow: 0 0 6px rgba(138, 168, 205, 0.5);
}
.field__input:-ms-input-placeholder {
color: #565656;
}
.field__input-option {
border-top-color: #1A1A1A;
}
.checkbox__label.checked .checkbox__button,.checkbox__input:checked+.checkbox__button,.checkbox__button.checkbox__button--disabled-checked {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
background-color: #004040;
box-shadow: none;
}
.checkbox__label.checked .checkbox__button:active,.checkbox__input:checked+.checkbox__button:active,.checkbox__button.checkbox__button--disabled-checked:active {
background-color: #DD82B5;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.checkbox__input:focus+.checkbox__button {
box-shadow: 0 0 6px #8AA8CD;
border-top-color: rgba(255, 255, 255, 0.35);
border-right-color: rgba(255, 255, 255, 0.35);
border-bottom-color: rgba(255, 255, 255, 0.35);
border-left-color: rgba(255, 255, 255, 0.35);
}
.checkbox__label.checked .checkbox__button,.checkbox__input:checked+.checkbox__button,.checkbox__button.checkbox__button--disabled-checked {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
background-color: #004040;
box-shadow: none;
}
.checkbox__label.checked .checkbox__button:active,.checkbox__input:checked+.checkbox__button:active,.checkbox__button.checkbox__button--disabled-checked:active {
background-color: #DD82B5;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.checkbox__input:focus+.checkbox__button {
box-shadow: 0 0 6px #8AA8CD;
border-top-color: rgba(255, 255, 255, 0.35);
border-right-color: rgba(255, 255, 255, 0.35);
border-bottom-color: rgba(255, 255, 255, 0.35);
border-left-color: rgba(255, 255, 255, 0.35);
}
.input,.prompt {
background-color: #222222;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.input:focus:not(.u-hide-focus),.prompt:focus:not(.u-hide-focus) {
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
box-shadow: 0 0 6px rgba(138, 168, 205, 0.5);
}
.input:-ms-input-placeholder,.prompt:-ms-input-placeholder {
color: #565656;
}
.input--heavy {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.input--borderless {
background-color: rgba(34, 34, 34, 0);
box-shadow: none !important;
}
.input--pilled {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.prompt {
color: #565656;
}
.prompt:hover,.prompt:visited:hover {
color: #565656;
}
input.reveal-validation:invalid {
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
box-shadow: 0 0 1px #2BBBD1 !important;
}
.custom-radio__button {
border-top-color: #929292;
border-right-color: #929292;
border-bottom-color: #929292;
border-left-color: #929292;
background-color: #222222;
}
.custom-radio__input:checked+.custom-radio__button {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.custom-radio__input:focus+.custom-radio__button {
box-shadow: 0 0 1px rgba(255, 255, 255, 0.75), 0 0 6px #FFFFFF;
}
.floating-placeholder__label {
color: #929292;
}
.checkbox__input:not(:disabled):active+.checkbox__button {
background-color: #1F1F1F;
border-top-color: rgba(255, 255, 255, 0.25);
border-right-color: rgba(255, 255, 255, 0.25);
border-bottom-color: rgba(255, 255, 255, 0.25);
border-left-color: rgba(255, 255, 255, 0.25);
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
.checkbox__button {
border-top-color: rgba(255, 255, 255, 0.25);
border-right-color: rgba(255, 255, 255, 0.25);
border-bottom-color: rgba(255, 255, 255, 0.25);
border-left-color: rgba(255, 255, 255, 0.25);
background-color: #222222;
}
.yesno-toggle__button {
color: #FFFFFF;
background-color: #222222;
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.15);
}
.yesno-toggle__button:hover,.yesno-toggle__radio:checked+.yesno-toggle__button {
color: #222222 !important;
background-color: #8DA152;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: none;
}
.yesno-toggle__radio:focus+.yesno-toggle__button {
box-shadow: 0 0 8px #8AA8CD;
}
.yesno--answered .yesno-toggle__radio:not(:checked)+.yesno-toggle__button {
color: #333333;
}
.trix-contained-input {
background-color: #222222;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.trix-contained-input:focus:not(.u-hide-focus) {
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
box-shadow: 0 0 6px rgba(138, 168, 205, 0.5);
}
.trix-contained-input:-ms-input-placeholder {
color: #565656;
}
trix-editor .attachment[data-trix-mutable][data-trix-content-type~='application/vnd.basecamp.horizontal-rule.html'],trix-editor .attachment[data-trix-mutable].attachment--file .attachment__caption,trix-editor .attachment[data-trix-mutable].attachment--content .twitter-tweet,trix-editor .attachment[data-trix-mutable] img {
box-shadow: 0 0 0 2px #8AA8CD !important;
}
trix-editor .attachment--preview img {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
trix-editor .attachment__toolbar {
background-color: #8AA8CD;
color: #222222;
}
trix-editor .attachment__toolbar:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-top-color: #8AA8CD;
}
trix-editor .attachment__toolbar .trix-button {
background-color: rgba(34, 34, 34, 0);
}
trix-editor .attachment__toolbar .trix-button.trix-active {
background-color: #222222 !important;
}
.trix-watchdog-player body {
background-color: #222222;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=url],trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=button] {
background-color: #222222;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input:focus:not(.u-hide-focus)[type=url] {
border-top-color: #2E76A2;
border-right-color: #2E76A2;
border-bottom-color: #2E76A2;
border-left-color: #2E76A2;
box-shadow: 0 0 6px rgba(138, 168, 205, 0.5);
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input:-ms-input-placeholder[type=url] {
color: #565656;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style)[type=button] {
background-color: #333333;
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.15);
}
trix-toolbar {
background-color: #222222;
}
trix-toolbar .paste-hint {
background-color: #222222;
color: #929292;
}
trix-toolbar .trix-button.trix-button--icon.trix-active {
background-color: #341105;
}
trix-toolbar .trix-dialog.trix-active {
background-color: #222222;
box-shadow: 0 0.3rem 1rem #404040;
border-top-color: #341105;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=button] {
background-color: #004040;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
color: #222222;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=button]:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #DD82B5;
border-top-color: #DD82B5;
border-right-color: #DD82B5;
border-bottom-color: #DD82B5;
border-left-color: #DD82B5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=button]:last-of-type {
background-color: #595959;
border-top-color: #595959;
border-right-color: #595959;
border-bottom-color: #595959;
border-left-color: #595959;
color: #222222;
}
trix-toolbar .trix-dialog.trix-active.trix-dialog--link .trix-dialog__link-fields input[type=button]:last-of-type:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #727272;
border-top-color: #727272;
border-right-color: #727272;
border-bottom-color: #727272;
border-left-color: #727272;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
trix-toolbar .trix-dialog .trix-validate:invalid {
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
}
trix-toolbar .trix-dialog .trix-validate:invalid:focus {
box-shadow: 0 0 6px rgba(43, 187, 209, 0.5) !important;
}
.sticky-trix-toolbar {
border-bottom-color: #1A1A1A;
}
.break>span {
background-color: #222222;
}
.break:before {
border-bottom-color: rgba(255, 255, 255, 0.1);
}
body {
background-color: #111111;
}
.caps-subheading--orange {
color: #009999;
}
.preheader {
color: #DDDDDD;
}
.break--on-background>span {
background-color: #111111;
}
.break--on-comment>span {
background-color: #333333;
}
.break--dark:before {
border-bottom-color: #929292;
}
.break--thick:before {
border-bottom-color: #FFFFFF;
}
.timestamp {
color: #DDDDDD;
}
blockquote {
border-left-color: #FFFFFF;
}
pre {
background-color: rgba(255, 255, 255, 0.03);
}
img.img--bordered {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.img--bordered {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
hr {
border-bottom-color: #1A1A1A;
}
iframe {
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
}
.help-button__icon {
background-color: #8DA152;
}
.hill-chart__instructions span {
background-color: #001565;
box-shadow: 0.2em 0 0 #001565, -0.2em 0 0 #001565;
}
.hill-chart__timestamp {
color: #929292;
}
.hill-chart-version {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.hill-chart-version__annotation {
border-top-color: #333333;
background-color: #333333;
}
.hill-dot--blue {
background-color: #8AA8CD;
}
.hill-dot--orange {
background-color: #006666;
}
.hill-dot--red {
background-color: #2BBBD1;
}
.hill-dot--aqua {
background-color: #CB5523;
}
.hill-dot--green {
background-color: #004040;
}
.hill-dot--yellow {
background-color: #133ABD;
}
.hill-dot--purple {
background-color: #8DA152;
}
.hill-dot--pink {
background-color: #089B7F;
}
.hill-dot--brown {
background-color: #DDDDDD;
}
.hill-dot--gray {
background-color: #595959;
}
.project-index__header,.project-index__description {
color: #DDDDDD;
}
.project-index__templates-link,.project-index__display-settings {
background-color: #111111;
}
.project-index__templates-callout {
color: #DDDDDD;
}
.project-index__toolbar {
color: #FFFFFF;
}
.home-edit__switch .binary-toggle__inner {
background-color: #1A1A1A;
}
.inbox-settings {
background-color: #444444;
border-top-color: #341105;
border-bottom-color: #341105;
}
.forward-email-steps__content:before {
background-color: #004040;
color: #222222;
}
.card-inbox__forward {
border-bottom-color: #0D0D0D;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.reply-or-comment__column {
border-right-color: rgba(255, 255, 255, 0.15);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.reply-or-comment__column--reply {
border-left-color: rgba(255, 255, 255, 0.15);
}
}
@media (prefers-color-scheme: dark) {
.git-commit__author {
color: #929292;
}
.github-status--failure,.github-status--error {
color: #2BBBD1;
}
.integrations-table td {
border-bottom-color: rgba(255, 255, 255, 0.05);
}
.integrations-table__status-badge {
background-color: rgba(34, 34, 34, 0);
}
.integrations-delivery__kind {
color: #929292;
}
.invite-preview--loading {
background-color: rgba(34, 34, 34, 0) !important;
box-shadow: none !important;
}
.invite-preview__header {
border-bottom-color: #333333;
}
.invite-preview__dismiss {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.invite-preview__note {
background-color: #000333;
border-top-color: #133ABD;
border-right-color: #133ABD;
border-bottom-color: #133ABD;
border-left-color: #133ABD;
}
.jump-menu__input-field {
background-color: rgba(255, 255, 255, 0.1);
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
color: #222222;
}
.jump-menu__input-field::-webkit-input-placeholder {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__input-field::-moz-placeholder {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__input-field:-ms-input-placeholder {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__input-field::placeholder {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__results::-webkit-scrollbar-thumb:vertical {
background-color: rgba(255, 255, 255, 0.25);
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
}
.jump-menu__group-title {
color: rgba(34, 34, 34, 0.4);
}
.jump-menu__result {
color: #222222;
}
.jump-menu__result:hover {
background-color: rgba(34, 34, 34, 0.15);
}
.jump-menu__result.content-filter__selected {
background-color: rgba(34, 34, 34, 0.25);
}
.jump-menu__subtitle {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__no-result {
color: rgba(34, 34, 34, 0.5);
}
.jump-menu__no-result:hover {
background-color: rgba(34, 34, 34, 0);
}
.jump-menu__icon {
background-color: rgba(34, 34, 34, 0.8);
}
.jump-menu__icon--to-do,.jump-menu__icon--to-dos,.jump-menu__icon--to-do-list {
background-color: #004040;
}
.jump-menu__icon--campfire {
background-color: #CB5523;
}
.jump-menu__icon--message,.jump-menu__icon--comment,.jump-menu__icon--message-board {
background-color: #8AA8CD;
}
.jump-menu__icon--answer,.jump-menu__icon--question-answer {
background-color: #A7A929;
}
.jump-menu__icon--check-in,.jump-menu__icon--automatic-check-ins {
background-color: #A7A929;
}
.jump-menu__icon--event,.jump-menu__icon--schedule {
background-color: #00D2AA;
}
.jump-menu__icon--journal,.jump-menu__icon--journal-entry {
background-color: #2E76A2;
}
.jump-menu__icon--email-forwards,.jump-menu__icon--forwarded-email {
background-color: #74A661;
}
.jump-menu__icon--the-clientside,.jump-menu__icon--client-approval-request,.jump-menu__icon--client-email {
background-color: #4C37CC;
}
.jump-menu__icon--google-doc {
background-color: #2BBBD1;
}
.jump-menu__icon--file,.jump-menu__icon--upload,.jump-menu__icon--document {
background-color: #0027C1;
}
.jump-menu__icon--folder,.jump-menu__icon--vault {
background-color: #0027C1;
}
.jump-menu__icon--circle {
background-color: #2BBBD1;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.latest-activity:before {
border-left-color: rgba(255, 255, 255, 0.1);
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.latest-activity .break>span {
color: #FFFFFF;
}
}
@media (prefers-color-scheme: dark) {
.latest-activity--standalone .break>span {
background-color: #111111;
}
.latest-activity__project {
color: #DDDDDD;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.latest-activity__project {
border-bottom-color: #495971;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.latest-activity__project {
border-bottom-color: rgba(255, 255, 255, 0.1);
}
}
@media (prefers-color-scheme: dark) {
.latest-activity__project .break>span {
background-color: #111111;
}
.latest-activity__full-width .activity-item {
border-top-color: rgba(255, 255, 255, 0.1);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.latest-activity__full-width .activity-item {
background-color: #222222;
}
}
@media (prefers-color-scheme: dark) {
.decorated,.autolinked,.chat-line--integration .chat-line__body a,.formatted_content a:not(.unstyled):not(.attachment__toolbar):not([contenteditable=false]):not([data-trix-attachment]),.formatted_content a .mentionable-person,.recordable--todoset .todolist__permalink {
color: #8AA8CD;
}
.decorated:active,.autolinked:active,.chat-line--integration .chat-line__body a:active,.formatted_content a:active:not(.unstyled):not(.attachment__toolbar):not([contenteditable=false]):not([data-trix-attachment]),.formatted_content a .mentionable-person:active,.recordable--todoset .todolist__permalink:active {
color: #4E7BB3;
}
.decorated--subtle {
color: #929292 !important;
}
.decorated--subtle:active {
color: #B3B3B3 !important;
}
.decorated--delete {
color: #2BBBD1 !important;
}
div.list_controls select.list_toggle {
border-right-color: rgba(34, 34, 34, 0);
}
.list-actionable__avatar,.list-actionable__details,.list-actionable__actions,.list-actionable__placeholder {
border-bottom-color: #1A1A1A;
}
.list-actionable__row-group--editing {
background-color: #333333;
}
.list-picker-item__input:focus+.list-picker-item__button {
box-shadow: 0 0 6px #8AA8CD;
border-top-color: rgba(255, 255, 255, 0.35);
border-right-color: rgba(255, 255, 255, 0.35);
border-bottom-color: rgba(255, 255, 255, 0.35);
border-left-color: rgba(255, 255, 255, 0.35);
}
.list-picker__client-group {
border-top-color: #0024B2;
border-right-color: #0024B2;
border-bottom-color: #0024B2;
border-left-color: #0024B2;
}
.list-picker--borders .list-picker-item:first-of-type {
border-top-color: #1A1A1A;
}
.list-picker--borders .list-picker-item:last-of-type {
border-bottom-color: #1A1A1A;
}
.list-picker--bordered-top .list-picker-item:first-of-type {
border-top-color: #1A1A1A;
}
.list-picker-item+.list-picker-item {
border-top-color: #1A1A1A;
}
.list-picker-item__label {
color: #929292;
}
.step-list__step:before {
background-color: #009999;
color: #222222;
}
.step-list__step--small:before {
background-color: #8AA8CD;
}
.step-list__step--done:before {
background-color: #004040;
}
.list--ruled>li {
border-top-color: rgba(255, 255, 255, 0.1);
}
.list--ruled-top {
border-top-color: rgba(255, 255, 255, 0.1);
}
.list--ruled-actions>li+li {
border-top-color: rgba(255, 255, 255, 0.1);
}
.list--tableview li {
background-color: #222222;
}
.list--tableview .list__action {
border-bottom-color: #1A1A1A;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.list--tableview .list__action.decorated {
color: #FFFFFF !important;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.list--tableview--inactive .list__action {
background-color: #222222;
}
}
@media (prefers-color-scheme: dark) {
.list--tableview-with-icons .list__action::before {
background-color: #8AA8CD;
}
.logo-uploader__progress {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
color: #004040;
}
.logo-uploader__progress::-webkit-progress-bar {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
}
.logo-uploader__progress::-webkit-progress-value {
background-color: #004040;
}
.logo-uploader__progress::-moz-progress-bar {
background-color: #004040;
}
.logo-uploader__dropzone {
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
}
.media_embed[data-media-embed-type=video] {
background-color: #333333;
}
.media_embed--failed::before {
background-color: #FFFFFF;
border-top-color: #222222;
border-right-color: #222222;
border-bottom-color: #222222;
border-left-color: #222222;
}
.messages-table td {
border-top-color: #0D0D0D;
}
.messages-table--for-card {
border-top-color: #0D0D0D;
}
.message__attribution {
border-top-color: #1A1A1A;
border-bottom-color: #1A1A1A;
}
.message__date a,.message__date .link_button {
color: #FFFFFF;
}
.message__byline {
color: #929292;
}
.message-composition__footer {
border-top-color: #1A1A1A;
}
.metadata .decorated,.metadata .link_button {
box-shadow: none;
}
.metadata-color {
color: #929292;
}
.modal-sheet {
background-color: #222222;
box-shadow: 0 5px 20px rgba(255, 255, 255, 0.35);
}
.modal-sheet--themed {
background-color: #8DA152;
color: #222222;
}
.modal-sheet--with-scroller .modal-sheet__footer {
border-top-color: #1A1A1A;
}
.todolist--assignments__header--overdue {
color: #2BBBD1;
}
.profile-avatar__avatar {
background-color: #222222;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.profile-avatar__avatar {
box-shadow: 0 -1px 1px #333333;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.profile-avatar__placeholder {
background-color: rgba(255, 255, 255, 0.05);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.profile-avatar__callout {
background-color: rgba(34, 34, 34, 0);
}
}
@media (prefers-color-scheme: dark) {
.nav-menu__sheet {
background-color: #222222;
}
.nav-menu__sheet {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.nav-menu.expanded:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #222222;
}
.nav-menu__sheet {
background-color: #222222;
box-shadow: 0 0 4px rgba(255, 255, 255, 0.15), 0 5px 10px rgba(255, 255, 255, 0.05);
}
.nav-menu__section--receded {
background-color: rgba(255, 255, 255, 0.02);
border-top-color: rgba(255, 255, 255, 0.05);
}
.nav__main {
background-color: rgba(17, 17, 17, 0.9);
}
.nav__main--scrolled {
border-bottom-color: rgba(255, 255, 255, 0.1);
}
.nav__recent.list__action--selected,.nav__my-stuff.list__action--selected {
background-color: rgba(255, 255, 255, 0.1);
}
.nav__recent:hover,.nav__my-stuff:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.nav__my-stuff {
background-color: rgba(34, 34, 34, 0);
}
.nav__my-stuff:before {
background-color: #FFFFFF;
}
.noscript-message__content {
color: #009999;
}
.noscript-message__content .decorated {
color: #009999;
}
.notice-balloon:after,.notice-balloon:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.notice-balloon:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #222222;
}
.notice-balloon:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #404040;
}
.notice {
background-color: #333333;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.notice__close {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.notice--yellow {
background-color: #00051A;
border-top-color: #000F4D;
border-right-color: #000F4D;
border-bottom-color: #000F4D;
border-left-color: #000F4D;
}
.notice--yellow .break>span {
background-color: #00051A;
}
.notice--red {
background-color: #001A1A;
border-top-color: #003939;
border-right-color: #003939;
border-bottom-color: #003939;
border-left-color: #003939;
}
.notice--blue {
background-color: #444444;
border-top-color: #2F0F05;
border-right-color: #2F0F05;
border-bottom-color: #2F0F05;
border-left-color: #2F0F05;
}
.notice--for-public-todo {
border-bottom-color: rgba(255, 255, 255, 0.15);
color: rgba(255, 255, 255, 0.5);
}
.notice-balloon {
background-color: #00051A;
border-top-color: #133ABD;
border-right-color: #133ABD;
border-bottom-color: #133ABD;
border-left-color: #133ABD;
color: rgba(255, 255, 255, 0.85);
}
.notice-balloon:before,.notice-balloon:after {
border-bottom-color: rgba(34, 34, 34, 0);
}
.notice-balloon:before {
border-top-color: #133ABD;
}
.notice-balloon:after {
border-top-color: #00051A;
}
.notice-balloon--trashed {
background-color: #001A1A;
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
}
.notice-balloon--trashed:before {
border-top-color: #2BBBD1;
}
.notice-balloon--trashed:after {
border-top-color: #001A1A;
}
.notification-status__label {
color: #222222;
}
.notification-settings__device-notice {
background-color: #444444;
}
.notification-settings__example--on,.notification-settings__example--off {
background-color: #222222;
}
.flash-explanation {
background-color: #00051A;
border-top-color: #133ABD;
border-bottom-color: #133ABD;
}
.onboarding-video__thumbnail {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.options-menu__content {
background-color: #222222;
}
.expanded .options-menu__expansion-toggle:after,.expanded .options-menu__expansion-toggle:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.expanded .options-menu__expansion-toggle:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #222222;
}
.expanded .options-menu__expansion-toggle:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #404040;
}
.options-menu__content {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.options-menu__action+.options-menu__title {
border-top-color: #0D0D0D;
}
.options-menu__action:hover {
background-color: #444444;
}
.options-menu__expansion-toggle--attachment {
background-color: rgba(34, 34, 34, 0);
border-top-color: rgba(255, 255, 255, 0.25);
border-right-color: rgba(255, 255, 255, 0.25);
border-bottom-color: rgba(255, 255, 255, 0.25);
border-left-color: rgba(255, 255, 255, 0.25);
}
.options-menu__expansion-toggle--attachment:before {
border-bottom-color: rgba(34, 34, 34, 0) !important;
border-top-color: rgba(255, 255, 255, 0.8) !important;
}
.options-menu__content--attachment {
background-color: rgba(255, 255, 255, 0.8);
color: #222222;
}
.attachment-options__close {
background-color: rgba(34, 34, 34, 0);
}
.attachment-options__close:active {
background-color: rgba(34, 34, 34, 0.1) !important;
}
.credit-notice {
background-color: #17000A;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.payment-form__error {
color: #2BBBD1;
}
.credit-card-form {
background-color: #333333;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1);
}
.credit-card-form--upgrade {
background-color: #00051A;
}
.credit-card-form__field {
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
background-color: #222222;
}
.credit-card-form__field.braintree-hosted-fields-focused,.credit-card-form__field.input--select:focus,.credit-card-form__field:focus {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
box-shadow: 0 0 6px rgba(46, 118, 162, 0.8);
}
.credit-card-form__field.braintree-hosted-fields-focused.braintree-hosted-fields-invalid,.credit-card-form__field.input--select:focus.braintree-hosted-fields-invalid,.credit-card-form__field:focus.braintree-hosted-fields-invalid {
box-shadow: 0 0 6px rgba(43, 187, 209, 0.5);
}
.credit-card-form__field.braintree-hosted-fields-invalid {
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
background-color: #001A1A;
}
.credit-card-form__fieldset {
border-top-color: rgba(255, 255, 255, 0.1);
}
.people-form__invite-close {
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.people-form__person {
background-color: #222222;
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.people-form__person .input.reveal-validation:invalid {
box-shadow: none !important;
color: #2BBBD1;
}
.people-form__row {
border-bottom-color: #333333;
}
.people-form__label {
color: #929292;
}
.people-form__label-meta {
color: #DDDDDD;
}
.people-form__add-bubble {
background-color: #333333;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.people-form__add-bubble {
border-top-color: rgba(255, 255, 255, 0.05);
border-bottom-color: rgba(255, 255, 255, 0.05);
}
}
@media (prefers-color-scheme: dark) {
.people-form__add-bubble--for-clients {
background-color: #00051A;
border-top-color: #0024B2;
border-right-color: #0024B2;
border-bottom-color: #0024B2;
border-left-color: #0024B2;
}
.people-form__add-bubble--error {
background-color: #001A1A;
}
.people-roster--for-clients {
border-top-color: #0024B2;
border-right-color: #0024B2;
border-bottom-color: #0024B2;
border-left-color: #0024B2;
}
.people-roster__person.content-filter__selected {
background-color: #444444;
}
.new-person-container {
background-color: #222222;
box-shadow: 0 1px 3px 0 #404040;
}
.person-form__required {
color: #DDDDDD;
}
input.reveal-validation:invalid {
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
box-shadow: 0 0 1px #2BBBD1 !important;
}
.dumb-company-picker-link {
border-top-color: #1A1A1A;
}
.panel--perma,.panel--project {
background-color: #222222;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.panel--perma,.panel--project {
box-shadow: 0 -1px 10px rgba(255, 255, 255, 0.05), 0 1px 4px rgba(255, 255, 255, 0.1), 0 10px 30px #0C1317;
}
}
@media (prefers-color-scheme: dark) {
.panel--perma .recordable {
box-shadow: none !important;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.perma__header {
border-bottom-color: #FFFFFF;
}
}
@media (prefers-color-scheme: dark) {
.trial-upgrade__quote-highlight {
border-bottom-color: #001565;
box-shadow: inset 0 -3px 0 #001565;
}
.plan-picker__card {
background-color: #222222;
}
.plan-picker__card--highlighted {
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
}
.plan-picker__card--highlighted:hover {
box-shadow: 0 0 4px #8DA152;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.plan-picker__card--annual {
background-color: #060606;
}
}
@media (prefers-color-scheme: dark) {
.plan-picker__card--monthly {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.plan-picker__card--monthly:hover {
box-shadow: 0 0 4px rgba(255, 255, 255, 0.25);
}
}
@media (prefers-color-scheme: dark) {
.plan-attribute:before {
background-color: #8DA152;
}
.plan-picker-small-teams {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.unlimited-upgrade__list-item {
background-color: #444444;
}
.unlimited-upgrade__list-item:before {
background-color: #8DA152;
}
}
@media print and (prefers-color-scheme: dark) {
html,body {
color: #FFFFFF !important;
}
a,.report-metadata {
color: #FFFFFF !important;
}
.document a,.message a {
color: #8AA8CD !important;
}
.latest-activity__account-name,.project-header__name,.project-header__name--overview {
border-bottom-color: #FFFFFF;
}
.latest-activity__project {
border-bottom-color: #333333;
}
.break>span:not(.todolist-group__color) {
background-color: #222222;
}
.recording-breadcrumbs,.recordable {
box-shadow: none !important;
}
.card {
box-shadow: none !important;
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.client-thread-entry {
border-bottom-color: #333333;
box-shadow: none !important;
}
.todos.completed .checkbox__button,.checkbox__input:checked+.checkbox__button {
box-shadow: none !important;
}
}
@media (prefers-color-scheme: dark) {
.progress-step {
color: #404040;
}
.progress-step--completed {
color: #004040;
}
.progress-step--completed .progress-bubble {
background-color: #004040;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
}
.progress-step--completed:after {
background-color: #004040 !important;
}
.progress-bubble {
background-color: #1A1A1A;
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
}
.progress-step:after {
background-color: #404040;
}
.project__welcome {
background-color: #8DA152;
color: #222222;
}
.project__welcome .txt--subtle {
color: rgba(34, 34, 34, 0.5);
}
.project-avatars__edit:after {
box-shadow: -4px 0 6px 6px #222222;
}
.explain-emptying-trash {
background-color: #001A1A;
}
.explain-bucket-unsubscribing {
background-color: #00051A;
border-top-color: #133ABD;
border-bottom-color: #133ABD;
}
.project-list__group-header {
color: #DDDDDD;
}
.project-list__group-header:before {
border-top-color: rgba(221, 221, 221, 0.15);
border-right-color: rgba(221, 221, 221, 0.15);
border-bottom-color: rgba(221, 221, 221, 0.15);
border-left-color: rgba(221, 221, 221, 0.15);
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.project-list__project+.project-list__project {
border-top-color: rgba(221, 221, 221, 0.15);
}
}
@media (prefers-color-scheme: dark) {
.project-list__project.content-filter__selected {
box-shadow: 0 0 8px rgba(138, 168, 205, 0.5), 0 0 0 2px rgba(46, 118, 162, 0.5);
background-color: rgba(34, 34, 34, 0.5);
}
.project-list__playground-badge {
background-color: #009999;
color: #222222;
}
.project-group-item--active {
background-color: rgba(255, 255, 255, 0.05);
}
.options-menu--add-project .card--project,.options-menu--edit-project .card--project {
box-shadow: none;
}
.project-list__progress {
color: #DDDDDD;
}
.card__people--placeholder .avatar {
background-color: #FFFFFF;
}
.canned-question {
box-shadow: 0 1px 3px 0 #404040;
background-color: #222222;
}
.questionnaire__question {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
}
.questionnaire__answers .break:before {
border-top-color: #0D0D0D;
border-right-color: #0D0D0D;
border-bottom-color: #0D0D0D;
border-left-color: #0D0D0D;
}
.question__status.question__status--paused {
background-color: #000333;
}
.question__status.question__status--active {
background-color: #17000A;
}
.readings__heading--unread {
color: #009999;
}
.reading:hover {
background-color: rgba(186, 70, 21, 0.1);
}
.reading__metadata {
color: #929292;
}
.reading__metadata--subtle {
color: #DDDDDD;
}
.reading__description--chat {
background-color: rgba(255, 255, 255, 0.05);
}
.reading__actions {
background-color: #1A1A1A;
}
.reading--show-actions {
background-color: #1A1A1A !important;
}
.recordable--balloon:after,.recordable--balloon:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.recordable--balloon:after {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #222222;
}
.recordable--balloon:before {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
border-bottom-color: #404040;
}
.recordable {
background-color: #222222;
}
.recordable {
box-shadow: 0 -1px 10px rgba(255, 255, 255, 0.05), 0 1px 4px rgba(255, 255, 255, 0.1), 0 10px 30px #0C1317;
}
.document-style-editor.recordable .sticky-trix-toolbar {
border-top-color: #1A1A1A;
}
.recordable__archived-children {
border-top-color: #333333;
}
.recordable__legend {
border-bottom-color: #1A1A1A;
}
.recordable--balloon:before {
border-bottom-color: rgba(255, 255, 255, 0.05);
}
.act-on-card__overflow-label {
color: #DDDDDD;
}
[data-recording-color-picker-color="white"] {
background-color: #222222 !important;
}
[data-recording-color-picker-color="white"].card--folder {
background-color: #0F0F0F !important;
box-shadow: inset 0 0 0 1px #0F0F0F, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--white {
background-color: #222222 !important;
}
[data-recording-color-picker-color="yellow"] {
background-color: #020331 !important;
}
[data-recording-color-picker-color="yellow"].card--folder {
background-color: #060A97 !important;
box-shadow: inset 0 0 0 1px #060A97, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--yellow {
background-color: #05087A !important;
}
[data-recording-color-picker-color="orange"] {
background-color: #000F24 !important;
}
[data-recording-color-picker-color="orange"].card--folder {
background-color: #001C43 !important;
box-shadow: inset 0 0 0 1px #001C43, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--orange {
background-color: #000F24 !important;
}
[data-recording-color-picker-color="red"] {
background-color: #001A1A !important;
}
[data-recording-color-picker-color="red"].card--folder {
background-color: #003939 !important;
box-shadow: inset 0 0 0 1px #003939, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--red {
background-color: #001A1A !important;
}
[data-recording-color-picker-color="pink"] {
background-color: #001B08 !important;
}
[data-recording-color-picker-color="pink"].card--folder {
background-color: #003A11 !important;
box-shadow: inset 0 0 0 1px #003A11, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--pink {
background-color: #001B08 !important;
}
[data-recording-color-picker-color="purple"] {
background-color: #0D1200 !important;
}
[data-recording-color-picker-color="purple"].card--folder {
background-color: #233100 !important;
box-shadow: inset 0 0 0 1px #233100, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--purple {
background-color: #0D1200 !important;
}
[data-recording-color-picker-color="blue"] {
background-color: #1E1003 !important;
}
[data-recording-color-picker-color="blue"].card--folder {
background-color: #3A1F06 !important;
box-shadow: inset 0 0 0 1px #3A1F06, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--blue {
background-color: #1E1003 !important;
}
[data-recording-color-picker-color="green"] {
background-color: #1B071D !important;
}
[data-recording-color-picker-color="green"].card--folder {
background-color: #320D36 !important;
box-shadow: inset 0 0 0 1px #320D36, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--green {
background-color: #1B071D !important;
}
[data-recording-color-picker-color="brown"] {
background-color: #111D28 !important;
}
[data-recording-color-picker-color="brown"].card--folder {
background-color: #1A2D3D !important;
box-shadow: inset 0 0 0 1px #1A2D3D, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--brown {
background-color: #111D28 !important;
}
[data-recording-color-picker-color="gray"] {
background-color: #0D0D0D !important;
}
[data-recording-color-picker-color="gray"].card--folder {
background-color: #1C1C1C !important;
box-shadow: inset 0 0 0 1px #1C1C1C, 0 0 2px rgba(255, 255, 255, 0.35), 0 1px 3px rgba(255, 255, 255, 0.1);
}
.recording-color--gray {
background-color: #0D0D0D !important;
}
.color-picker--for-recording .color-picker__swatch {
border-top-color: #404040;
border-right-color: #404040;
border-bottom-color: #404040;
border-left-color: #404040;
}
.recording-history__event {
border-left-color: #DDDDDD;
}
.recording-history__event:before {
background-color: #DDDDDD;
}
.referral-link__input {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
background-color: #444444;
}
.referral-link__pill {
background-color: #8AA8CD;
color: #222222;
}
.report-menu__item:hover:not(.report-menu__item--selected) {
background-color: rgba(34, 34, 34, 0.5);
box-shadow: 0 1px 5px 0 rgba(255, 255, 255, 0.1);
}
.report-menu__item--selected {
background-color: #222222;
box-shadow: 0 1px 5px 0 rgba(255, 255, 255, 0.1);
}
.report-card:before {
background-color: #8DA152;
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
}
.report-card:active {
background-color: rgba(255, 255, 255, 0.05);
}
.report-metadata {
color: #929292;
}
.overdue-report__header {
color: #2BBBD1;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.todo-ledger__column {
border-right-color: #404040;
}
}
@media (prefers-color-scheme: dark) {
.todo-ledger__header {
border-top-color: #404040;
border-bottom-color: #404040;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.todo-ledger__column--completed {
border-left-color: #404040;
}
}
@media (prefers-color-scheme: dark) {
.rich-avatar__info:before {
background-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(255, 255, 255, 0.15);
}
.rich-avatar__time {
color: rgba(34, 34, 34, 0.8);
}
.rich-avatar__action:hover {
background-color: rgba(34, 34, 34, 0.15);
}
.rich-avatar__action--selected,.rich-avatar__action--selected:hover {
background-color: rgba(34, 34, 34, 0.25);
}
.rich-avatar-flag__client {
background-color: #0024B2;
color: #FFFFFF;
}
.rich-avatar-flag__admin {
background-color: #CB5523;
color: #222222;
}
.rich-avatar-flag__owner {
background-color: #00D2AA;
color: #222222;
}
.schedule__load-more {
border-top-color: #1A1A1A;
}
.loading-calendar-grid .schedule__load-more:before {
background-color: #222222;
}
.schedule-month {
border-bottom-color: #404040;
}
.schedule-day {
border-top-color: #1A1A1A;
}
.scheduled-event__title--overdue {
color: #2BBBD1;
}
.scheduled-event__metadata {
color: #929292;
}
.scheduled-event__metadata .scheduled-event__participant {
color: #DDDDDD;
}
.scheduled-event--repeated:after {
color: #333333;
}
}
@media screen and (max-width: 767px) and (prefers-color-scheme: dark) {
.scheduled-event--repeated .scheduled-event__title {
color: #929292;
}
}
@media (prefers-color-scheme: dark) {
.scheduled-event--expired {
color: #929292;
}
.schedule-month--placeholder,.scheduled-event__title--placeholder,.scheduled-event__time--placeholder,.schedule-day__date--placeholder {
background-color: #333333;
}
.schedule-card__agenda-view .schedule-month {
border-bottom-color: #1A1A1A;
}
.calendar-exports__warning {
border-top-color: #133ABD;
background-color: #00051A;
}
.search-result--selected {
background-color: #444444;
}
.search__reset {
background-color: rgba(34, 34, 34, 0);
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
color: #929292;
}
.search__reset:focus {
box-shadow: 0 0 6px rgba(34, 34, 34, 0.8);
}
.search__exclude-chat {
background-color: #00051A;
border-top-color: rgba(255, 255, 255, 0.05);
border-right-color: rgba(255, 255, 255, 0.05);
border-bottom-color: rgba(255, 255, 255, 0.05);
border-left-color: rgba(255, 255, 255, 0.05);
}
.file-search__attachment .attachment__frame {
box-shadow: 0 1px 2px rgba(255, 255, 255, 0.25);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.browsers__download:not(.browsers__download--explorer) {
border-left-color: #333333;
}
}
@media (prefers-color-scheme: dark) {
.per_line_settings .line_settings {
border-bottom-color: #333333;
}
.indented-settings-option__description {
color: #929292;
}
.sheet {
background-color: #222222;
}
.sheet--shadowed {
box-shadow: 0 -1px 10px rgba(255, 255, 255, 0.05), 0 1px 4px rgba(255, 255, 255, 0.1), 0 10px 30px #0C1317;
}
.sheet--flat {
box-shadow: none;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
background-color: #060606;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.sheet--unfreeze {
box-shadow: 0 0 20px rgba(255, 255, 255, 0.1) !important;
}
}
@media (prefers-color-scheme: dark) {
.bulk-select-subscribers {
color: #DDDDDD;
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.thread__subscriptions {
border-top-color: #1A1A1A;
}
}
@media (prefers-color-scheme: dark) {
.system-degradations-banner {
box-shadow: 0 0 1px rgba(255, 255, 255, 0.25), 0 1px 3px rgba(255, 255, 255, 0.1);
background-color: #00051A;
}
.tabs {
border-bottom-color: #333333;
}
.tabs__tab {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.tabs__tab:hover:not(.tabs__tab--active) {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
border-bottom-color: rgba(34, 34, 34, 0);
}
.tabs__tab--active {
border-top-color: #333333;
border-right-color: #333333;
border-bottom-color: #333333;
border-left-color: #333333;
border-bottom-color: #222222;
box-shadow: inset 0 2px 2px 0 #222222;
background-color: rgba(34, 34, 34, 0);
}
.text-toggle {
color: #929292;
}
.text-toggle__link:not(:last-of-type):after {
border-right-color: #333333;
}
.relative-datepicker {
background-color: #222222;
}
.relative-datepicker {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
body.project-template .panel--project-template {
background-color: #0C0300;
border-top-color: #341105;
border-right-color: #341105;
border-bottom-color: #341105;
border-left-color: #341105;
}
body.project-template .recording-breadcrumbs {
background-color: #0C0300;
}
body.project-template .break--on-background>span {
background-color: rgba(34, 34, 34, 0);
}
.template-static-datepicker__calendar tbody td {
border-bottom-color: rgba(255, 255, 255, 0.05);
}
}
@media screen and (min-width: 768px) and (prefers-color-scheme: dark) {
.template-static-datepicker__calendar .ui-datepicker {
box-shadow: none;
}
}
@media (prefers-color-scheme: dark) {
.template-static-datepicker__calendar .ui-datepicker-header,.template-static-datepicker__calendar .ui-state-active {
background-color: #8AA8CD;
}
.template-static-datepicker__calendar .ui-state-active {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
}
.template-static-datepicker__calendar .ui-datepicker-today {
background-color: rgba(34, 34, 34, 0);
}
.template-static-datepicker__calendar .ui-datepicker-today a {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
}
.template-static-datepicker__calendar .ui-datepicker-week-col {
color: rgba(255, 255, 255, 0.5);
}
.relative-datepicker__day {
color: #929292;
}
.relative-datepicker__day:hover {
background-color: #444444;
}
.relative-datepicker__day+.relative-datepicker__day {
border-top-color: #333333;
}
.relative-datepicker__day--active {
background-color: #17000A;
color: #FFFFFF;
}
.theme-picker__swatch {
background-color: rgba(2, 2, 3, 0.98);
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
}
.theme-picker__swatch--selected {
border-top-color: rgba(255, 255, 255, 0.75);
border-right-color: rgba(255, 255, 255, 0.75);
border-bottom-color: rgba(255, 255, 255, 0.75);
border-left-color: rgba(255, 255, 255, 0.75);
}
.theme-picker__swatch--blue {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover {
background-color: rgba(138, 168, 205, 0.1);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day {
color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary {
background-color: #8AA8CD;
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
color: #222222;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #EAAD63;
border-top-color: #EAAD63;
border-right-color: #EAAD63;
border-bottom-color: #EAAD63;
border-left-color: #EAAD63;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary {
background-color: #222222;
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #EAAD63;
border-right-color: #EAAD63;
border-bottom-color: #EAAD63;
border-left-color: #EAAD63;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link {
color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon {
background-color: #8AA8CD;
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical {
border-top-color: #8AA8CD;
border-right-color: #8AA8CD;
border-bottom-color: #8AA8CD;
border-left-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status {
background-color: rgba(138, 168, 205, 0.9);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover {
background-color: rgba(138, 168, 205, 0.1);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected {
background-color: rgba(138, 168, 205, 0.1);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover {
background-color: rgba(138, 168, 205, 0.1);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected {
background-color: rgba(138, 168, 205, 0.1);
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected {
background-color: #170F05;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before {
background-color: #8AA8CD;
}
html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='blue']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='blue-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected {
background-color: rgba(138, 168, 205, 0.1);
}
.theme-picker__swatch--green {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover {
background-color: rgba(0, 64, 64, 0.1);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day {
color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary {
background-color: #004040;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
color: #222222;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #DD82B5;
border-top-color: #DD82B5;
border-right-color: #DD82B5;
border-bottom-color: #DD82B5;
border-left-color: #DD82B5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary {
background-color: #222222;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #DD82B5;
border-right-color: #DD82B5;
border-bottom-color: #DD82B5;
border-left-color: #DD82B5;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link {
color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon {
background-color: #004040;
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical {
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status {
background-color: rgba(0, 64, 64, 0.9);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover {
background-color: rgba(0, 64, 64, 0.1);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected {
background-color: rgba(0, 64, 64, 0.1);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover {
background-color: rgba(0, 64, 64, 0.1);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected {
background-color: rgba(0, 64, 64, 0.1);
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected {
background-color: #150910;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before {
background-color: #004040;
}
html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='green']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='green-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected {
background-color: rgba(0, 64, 64, 0.1);
}
.theme-picker__swatch--orange {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover {
background-color: rgba(43, 187, 209, 0.1);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day {
color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary {
background-color: #2BBBD1;
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
color: #222222;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #53CADC;
border-top-color: #53CADC;
border-right-color: #53CADC;
border-bottom-color: #53CADC;
border-left-color: #53CADC;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary {
background-color: #222222;
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #53CADC;
border-right-color: #53CADC;
border-bottom-color: #53CADC;
border-left-color: #53CADC;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link {
color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon {
background-color: #2BBBD1;
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical {
border-top-color: #2BBBD1;
border-right-color: #2BBBD1;
border-bottom-color: #2BBBD1;
border-left-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status {
background-color: rgba(43, 187, 209, 0.9);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover {
background-color: rgba(43, 187, 209, 0.1);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected {
background-color: rgba(43, 187, 209, 0.1);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover {
background-color: rgba(43, 187, 209, 0.1);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected {
background-color: rgba(43, 187, 209, 0.1);
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected {
background-color: #041315;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before {
background-color: #2BBBD1;
}
html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='orange']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='orange-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected {
background-color: rgba(43, 187, 209, 0.1);
}
.theme-picker__swatch--purple {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover {
background-color: rgba(141, 161, 82, 0.1);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day {
color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary {
background-color: #8DA152;
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
color: #222222;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #A4B670;
border-top-color: #A4B670;
border-right-color: #A4B670;
border-bottom-color: #A4B670;
border-left-color: #A4B670;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary {
background-color: #222222;
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #A4B670;
border-right-color: #A4B670;
border-bottom-color: #A4B670;
border-left-color: #A4B670;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link {
color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon {
background-color: #8DA152;
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical {
border-top-color: #8DA152;
border-right-color: #8DA152;
border-bottom-color: #8DA152;
border-left-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status {
background-color: rgba(141, 161, 82, 0.9);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover {
background-color: rgba(141, 161, 82, 0.1);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected {
background-color: rgba(141, 161, 82, 0.1);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover {
background-color: rgba(141, 161, 82, 0.1);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected {
background-color: rgba(141, 161, 82, 0.1);
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected {
background-color: #0E1008;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before {
background-color: #8DA152;
}
html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='purple']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='purple-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected {
background-color: rgba(141, 161, 82, 0.1);
}
.theme-picker__swatch--charcoal {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-list__action:hover {
background-color: rgba(166, 154, 151, 0.1);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .action-sheet__content {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grids__header {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--selected .calendar-grid__day {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .calendar-grid__cell--today .calendar-grid__day {
color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .comments-balloon {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .app-banner--expiring-trial {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary {
background-color: #A69A97;
border-top-color: #A69A97;
border-right-color: #A69A97;
border-bottom-color: #A69A97;
border-left-color: #A69A97;
color: #222222;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--primary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #BEB5B2;
border-top-color: #BEB5B2;
border-right-color: #BEB5B2;
border-bottom-color: #BEB5B2;
border-left-color: #BEB5B2;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary {
background-color: #222222;
border-top-color: #A69A97;
border-right-color: #A69A97;
border-bottom-color: #A69A97;
border-left-color: #A69A97;
color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style),html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .btn--secondary:active:not(:disabled):not(.btn--borderless):not(.btn--without-active-style) {
background-color: #191919;
border-top-color: #BEB5B2;
border-right-color: #BEB5B2;
border-bottom-color: #BEB5B2;
border-left-color: #BEB5B2;
box-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__link {
color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .help-button__icon {
background-color: #A69A97;
border-top-color: #A69A97;
border-right-color: #A69A97;
border-bottom-color: #A69A97;
border-left-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .jump-menu__results::-webkit-scrollbar-thumb:vertical {
border-top-color: #A69A97;
border-right-color: #A69A97;
border-bottom-color: #A69A97;
border-left-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .modal-sheet--themed {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .notification-status {
background-color: rgba(166, 154, 151, 0.9);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .options-menu__action:hover {
background-color: rgba(166, 154, 151, 0.1);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .people-roster__person.content-filter__selected {
background-color: rgba(166, 154, 151, 0.1);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .reading:hover {
background-color: rgba(166, 154, 151, 0.1);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .search-result--selected {
background-color: rgba(166, 154, 151, 0.1);
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .todo.selected {
background-color: #110F0F;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) html.turbolinks-progress-bar::before,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) div.turbolinks-progress-bar {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:before {
background-color: #A69A97;
}
html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='charcoal']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent:hover,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__recent.list__action--selected,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff:hover,html[data-theme='charcoal-alt']:not([data-bridge-configuration~=ios]):not([data-bridge-configuration~=android]) .nav__my-stuff.list__action--selected {
background-color: rgba(166, 154, 151, 0.1);
}
.thread-entry {
background-color: #333333;
}
.thread-entry--no-background {
background-color: #222222;
}
.thread-entry__avatar {
background-color: #222222;
box-shadow: 0 0 0 1px #333333, 0 0 0 5px #222222;
}
.thread-entry__time {
color: rgba(255, 255, 255, 0.5);
}
.thread-entry__metadata {
color: rgba(255, 255, 255, 0.5);
}
.thread-entry__metadata__noreply {
color: rgba(255, 255, 255, 0.35);
}
.thread-entry__email-metadata {
color: #929292;
border-bottom-color: rgba(255, 255, 255, 0.1);
}
.thread-entry--email {
background-color: #444444;
}
.thread-entry--email-from-them {
background-color: #00051A;
}
.todo-progress__ratio {
color: #929292;
}
.todolist-group__header .break:after {
background-color: rgba(34, 34, 34, 0);
}
.todolist-group__link-to-archived-children {
color: #929292;
}
.todolist--dragging {
background-color: #222222;
box-shadow: 0 1px 3px 0 #404040;
}
.todolist--dragging:before {
background-color: #FFFFFF;
color: #222222;
}
.todolist--placeholder {
background-color: #333333;
border-top-color: #FFFFFF;
border-right-color: #FFFFFF;
border-bottom-color: #FFFFFF;
border-left-color: #FFFFFF;
}
.todos-form {
border-top-color: #1A1A1A;
border-right-color: #1A1A1A;
border-bottom-color: #1A1A1A;
border-left-color: #1A1A1A;
}
.todos-form__field {
border-top-color: rgba(255, 255, 255, 0.05);
}
.todos-form__prompt {
color: #565656;
}
.todos-form__title::-webkit-input-placeholder,.todos-form__assignees input::-webkit-input-placeholder,.todos-form__completion-subscribers input::-webkit-input-placeholder,.todos-form__date::-webkit-input-placeholder {
color: #565656;
}
.todos-form__title::-moz-placeholder,.todos-form__assignees input::-moz-placeholder,.todos-form__completion-subscribers input::-moz-placeholder,.todos-form__date::-moz-placeholder {
color: #565656;
}
.todos-form__title:-ms-input-placeholder,.todos-form__assignees input:-ms-input-placeholder,.todos-form__completion-subscribers input:-ms-input-placeholder,.todos-form__date:-ms-input-placeholder {
color: #565656;
}
.todos-form__title::placeholder,.todos-form__assignees input::placeholder,.todos-form__completion-subscribers input::placeholder,.todos-form__date::placeholder {
color: #565656;
}
.todos-form__date {
border-bottom-color: #FFFFFF;
}
.todos-form__expanded-dates label {
color: #565656;
}
.todolist-group-form {
background-color: #222222;
}
.todolist-group-colorpicker {
border-top-color: rgba(255, 255, 255, 0.1);
}
ul.todos.completed .checkbox__button,.todo.completed .checkbox__button {
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
background-color: #004040;
box-shadow: none;
}
ul.todos.completed .checkbox__button:active,.todo.completed .checkbox__button:active {
background-color: #DD82B5;
border-top-color: rgba(255, 255, 255, 0.1);
border-right-color: rgba(255, 255, 255, 0.1);
border-bottom-color: rgba(255, 255, 255, 0.1);
border-left-color: rgba(255, 255, 255, 0.1);
}
.recordable--todo .todo__header .checkbox__input:focus+.checkbox__button {
box-shadow: 0 0 6px #8AA8CD;
border-top-color: rgba(255, 255, 255, 0.35);
border-right-color: rgba(255, 255, 255, 0.35);
border-bottom-color: rgba(255, 255, 255, 0.35);
border-left-color: rgba(255, 255, 255, 0.35);
}
.todo.selected {
background-color: #444444;
}
.todo__note,.todo__assignee,.todo__date {
color: #DDDDDD;
}
.printed-todo__checkbox {
color: #404040;
}
.printed-todo--completed .printed-todo__checkbox {
color: #004040;
}
.printed-todo__metadata {
color: #929292;
}
.recordable--todo .todo__header .checkbox__button {
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
box-shadow: inset 0 3px 5px rgba(255, 255, 255, 0.05);
}
.recordable--todo .todo__header .checkbox__text {
color: #929292;
}
.recordable--todo .todos-form__field-placeholder {
color: #565656;
}
html.turbolinks-progress-bar::before {
background-color: #8DA152;
}
div.turbolinks-progress-bar {
background-color: #8DA152;
}
.unread-badge {
background-color: #009999;
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
color: #222222;
}
.unread-badge--for-nav {
border-top-color: #111111;
border-right-color: #111111;
border-bottom-color: #111111;
border-left-color: #111111;
}
.upload__progress {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
color: #004040;
}
.upload__progress::-webkit-progress-bar {
background-color: rgba(34, 34, 34, 0.8);
box-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.15) inset;
}
.upload__progress::-webkit-progress-value {
background-color: #004040;
}
.upload__progress::-moz-progress-bar {
background-color: #004040;
}
.uploader__dropzone {
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
}
.uploader__staged-file {
background-color: #222222;
box-shadow: 0 0 4px rgba(255, 255, 255, 0.1), 0 5px 20px rgba(255, 255, 255, 0.05);
}
.uploader--inline .uploader__staging-pen {
background-color: #222222;
border-top-color: rgba(255, 255, 255, 0.15);
border-right-color: rgba(255, 255, 255, 0.15);
border-bottom-color: rgba(255, 255, 255, 0.15);
border-left-color: rgba(255, 255, 255, 0.15);
}
.upload__size {
color: #929292;
}
.upload__metadata {
color: #929292;
}
.upload__cancel-upload {
background-color: #2BBBD1;
color: #222222;
}
.upload__error {
color: #2BBBD1;
}
.txt--highlight {
background-color: #001565;
box-shadow: 0.2em 0 0 #001565, -0.2em 0 0 #001565;
}
.txt--subtle {
color: #929292;
}
.txt--very-subtle {
color: rgba(146, 146, 146, 0.5);
}
.txt--uncolor {
color: #DDDDDD;
}
.txt--warning {
color: #009999;
}
.txt--price {
color: #004040;
}
.txt--error,.txt--danger,.txt--delete {
color: #2BBBD1;
}
.txt--ink {
color: #FFFFFF;
}
.txt--highlight-bottom {
border-bottom-color: #001565;
box-shadow: inset 0 -6px 0 #001565;
}
.table-cell--bordered {
border-top-color: #1A1A1A;
}
.vault-sort__select:focus {
background-color: #1B2831;
}
.viewing-as-client .project-avatars:after {
background-color: #222222;
}
.viewing-as-client .list-picker__client-group {
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.visibility-selector__pill {
background-color: #341105;
border-top-color: #341105;
border-right-color: #341105;
border-bottom-color: #341105;
border-left-color: #341105;
}
.visibility-selector__pill--visible {
background-color: rgba(34, 34, 34, 0);
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.visibility-selector--visible .visibility-selector__pill--invisible {
background-color: rgba(34, 34, 34, 0);
border-top-color: rgba(34, 34, 34, 0);
border-right-color: rgba(34, 34, 34, 0);
border-bottom-color: rgba(34, 34, 34, 0);
border-left-color: rgba(34, 34, 34, 0);
}
.visibility-selector--visible .visibility-selector__pill--visible {
background-color: #0024B2;
}
.welcome-step__progress-pill {
color: #222222;
background-color: #8DA152;
}
.welcome-survey-job-description {
border-left-color: #333333;
}
.hljs {
color: #CCCCCC;
}
.hljs-comment,.hljs-template_comment,.diff .hljs-header,.hljs-javadoc {
color: #666677;
}
.hljs-keyword,.css .rule .hljs-keyword,.hljs-winutils,.javascript .hljs-title,.nginx .hljs-title,.hljs-subst,.hljs-request,.hljs-status {
color: #CCCCCC;
}
.hljs-number,.hljs-hexcolor,.ruby .hljs-constant {
color: #FF7F7F;
}
.hljs-string,.hljs-tag .hljs-value,.hljs-phpdoc,.hljs-dartdoc,.tex .hljs-formula {
color: #22EEBB;
}
.hljs-title,.hljs-id,.scss .hljs-preprocessor {
color: #66FFFF;
}
.hljs-class .hljs-title,.hljs-type,.vhdl .hljs-literal,.tex .hljs-command {
color: #BBAA77;
}
.hljs-tag,.hljs-tag .hljs-title,.hljs-rules .hljs-property,.django .hljs-tag .hljs-keyword {
color: #FFFF7F;
}
.hljs-attribute,.hljs-variable,.lisp .hljs-body {
color: #FF7F7F;
}
.hljs-regexp {
color: #FF66D9;
}
.hljs-symbol,.ruby .hljs-symbol .hljs-string,.lisp .hljs-keyword,.clojure .hljs-keyword,.scheme .hljs-keyword,.tex .hljs-special,.hljs-prompt {
color: #66FF8C;
}
.hljs-built_in {
color: #FF794C;
}
.hljs-preprocessor,.hljs-pragma,.hljs-pi,.hljs-doctype,.hljs-shebang,.hljs-cdata {
color: #666666;
}
.hljs-deletion {
background-color: #002222;
}
.hljs-addition {
background-color: #220022;
}
.diff .hljs-change {
background-color: #FF794C;
}
.hljs-chunk {
color: #555555;
}
.desktop-apps__download:before {
background-color: #CCCCCC;
}
.drop-zone-indicator {
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
}
.drop-zone-indicator__balloon {
background-color: #004040;
color: #222222;
box-shadow: 0 1px 6px rgba(255, 255, 255, 0.25);
}
.drop-zone-indicator--local {
border-top-color: #004040;
border-right-color: #004040;
border-bottom-color: #004040;
border-left-color: #004040;
background-color: rgba(0, 64, 64, 0.15);
}
trix-editor [data-trix-content-type~='application/vnd.basecamp.horizontal-rule.html']:hover,trix-editor [data-trix-attachment]:hover .attachment--file .attachment__caption,trix-editor [data-trix-attachment]:hover .twitter-tweet,trix-editor [data-trix-attachment]:hover img {
box-shadow: 0 0 0 2px #643D0D;
}
body {
color: #FFFFFF;
}
.lightbox {
background-color: #222222;
}
.lightbox__caption {
color: #929292;
}
.todo .todo__unassigned-unscheduled {
color: #DDDDDD;
}
.nav__link--accounts {
filter: invert(1);
}
hr {
border-color: #FFFFFF19;
}
.recording-breadcrumbs {
background-color: #181818;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1),
0 10px 30px #000000;
}
.panel--perma,
.panel--project {
box-shadow: 0 -1px 10px rgba(0, 0, 0, 0.05),
0 1px 4px rgba(0, 0, 0, 0.1),
0 10px 30px #000000;
}
.card {
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.2);
}
.card--docked {
background-color: #181818;
}
.todolist-group__header .break:after {
background: linear-gradient(to right, #22222200 0%, #222222 100%);
}
trix-editor:empty:not(:focus)::before {
color: #555555;
}
}
}
Raw
download
#!/usr/bin/env ruby -r bundler/setup
require "http"
require "nokogiri"
require "uri"
puts "Downloading 404 page..."
url = "https://3.basecamp.com/404"
html = HTTP.get(url).body.to_s
doc = Nokogiri::HTML.parse(html)
doc.xpath(%{//head/link[@rel="stylesheet"]}).each do |node|
stylesheet_url = URI.join(url, node["href"])
name = File.basename(stylesheet_url.path)
puts "Downloading stylesheet #{name}..."
system "wget", "-c", stylesheet_url.to_s
if /(?<basename>.+)-[0-9a-f]{16,}\.css/ =~ name
shortname = "#{basename}.css"
puts "Linking as #{shortname}..."
system "ln", "-vfs", name, shortname
end
end
puts "Done."
Raw
Gemfile
source "https://rubygems.org"
gem "http"
gem "nokogiri"
Raw
Gemfile.lock
GEM
remote: https://rubygems.org/
specs:
addressable (2.7.0)
public_suffix (>= 2.0.2, < 5.0)
domain_name (0.5.20190701)
unf (>= 0.0.5, < 1.0.0)
ffi (1.13.1)
ffi-compiler (1.0.1)
ffi (>= 1.0.0)
rake
http (4.4.1)
addressable (~> 2.3)
http-cookie (~> 1.0)
http-form_data (~> 2.2)
http-parser (~> 1.2.0)
http-cookie (1.0.3)
domain_name (~> 0.5)
http-form_data (2.3.0)
http-parser (1.2.1)
ffi-compiler (>= 1.0, < 2.0)
mini_portile2 (2.4.0)
nokogiri (1.10.10)
mini_portile2 (~> 2.4.0)
public_suffix (4.0.5)
rake (13.0.1)
unf (0.1.4)
unf_ext
unf_ext (0.0.7.6)
PLATFORMS
ruby
DEPENDENCIES
http
nokogiri
BUNDLED WITH
2.1.4
Raw
generate.js
import fs from "fs"
import Color from "color"
import postcss from "postcss"
import shorthandExpand from "postcss-shorthand-expand"
import discardComments from "postcss-discard-comments"
import discardEmpty from "postcss-discard-empty"
import nesting from "postcss-nesting"
import prettify from "postcss-prettify"
const colorProperties = [
"color",
"background-color",
"border-color",
"border-top-color",
"border-right-color",
"border-bottom-color",
"border-left-color",
"outline-color",
"text-decoration-color",
"box-shadow",
]
const ignoredColorValues = [
"currentColor",
"inherit",
"transparent",
]
// Colors should be specified as six hex uppercase characters so they can be found
const colorMap = {
// body text color
"#283C46": "#FFFFFF",
// body background color
"#F6F2EF": "#111111",
// link color
"#1B6AC9": "#8AA8CD",
// link active color
"#134B8F": new Color("#8AA8CD").darken(0.25).hex(),
// input borders etc
"#D9D9D9": "#333",
// break text
"#877457": "#DDDDDD",
// thread entry bubbles, chat bubbles
// .chat-line .chat-line__bubble background
"#FAF8F7": "#333",
// chat bubbles with mentions
// .chat-line--mention .chat-line__bubble background
"#FDF3E6": "#004040",
// Feature 'green'
// primary button outline
// todo completed checkboxes
// etc
"#2DA562": "#004040",
// "Boosted Today" etc
"#FFA235": "#006666",
// Feature 'orange'
// Notification badges
// .unread-badge, .btn--subscribed-icon
"#FF5400": "#009999",
// chat bubbles by authenticated user
// .chat-line--me .chat-line__bubble background
"#ECF9FD": "#444",
// focus color
// (new value picked from Apple's default dark mode focus color)
"#A4D2FF": "#2E76A2",
// White is the default background colour everywhere, but black is *too* dark
// for this, so substitute #222 everywhere that is #fff and make exceptions later
"#FFFFFF": "#222222",
}
const extraRules = `
.nav__link--accounts {
filter: invert(1);
}
/* hr is #E5E5E5 in original, make it slightly transparent for ease */
hr {
border-color: #FFFFFF19;
}
/* the sheet-behind-a-sheet - give it depth between panel and body */
.recording-breadcrumbs {
background-color: #181818;
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1),
0 10px 30px #000000;
}
/* the sheet, on top of body */
/* purely inverted shadow looks like a glow, which isn't right */
.panel--perma, .panel--project {
box-shadow: 0 -1px 10px rgba(0, 0, 0, 0.05),
0 1px 4px rgba(0, 0, 0, 0.1),
0 10px 30px #000000;
}
/* */
.card {
box-shadow: 0 0 2px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.2);
}
/* give docked cards a little more contrast */
.card--docked {
background-color: #181818;
}
/* Fix todolist header line fade out */
.todolist-group__header .break:after {
background: linear-gradient(to right, #22222200 0%, #222222 100%);
}
trix-editor:empty:not(:focus)::before {
/* default graytext is too dark */
color: #555555;
}
`
fs.promises.readFile("desktop.css")
.then(contents => postcss([
/* Expand `border` into `border-left-color` etc */
shorthandExpand(),
/* Remove all but color properties */
(root, result) => {
root.walkDecls((decl) => {
let {prop} = decl
if (colorProperties.indexOf(prop) === -1) {
decl.remove()
}
})
},
/* Remove color properties with `inherit` etc values which we want to keep */
(root, result) => {
root.walkDecls((decl) => {
let {prop, value} = decl
if (colorProperties.indexOf(prop) !== -1 && ignoredColorValues.indexOf(value) !== -1) {
decl.remove()
}
})
},
/* Map colors from light to dark */
(root, result) => {
root.walkRules(rule =>
rule.walkDecls(decl => {
let {prop, value} = decl
decl.value = postcss.list.comma(value).map(tokens =>
postcss.list.space(tokens).map(token => {
let color
try {
color = new Color(token)
} catch {
return token
}
let normalizedToken = color.alpha(1).hex()
if (colorMap.hasOwnProperty(normalizedToken)) {
let newColor = new Color(colorMap[normalizedToken]).alpha(color.alpha())
let newToken = (newColor.alpha() == 1) ? newColor.hex() : newColor.rgb()
return newToken
} else {
let newColor = color.negate()
let newToken = (newColor.alpha() == 1) ? newColor.hex() : newColor.rgb()
// console.log("Color missing from map, using negative:", rule.selector, prop, token, newToken)
return newToken
}
}).join(" ")
).join(", ")
})
)
},
/* Remove now-empty rules */
discardEmpty(),
/* Add extra rules */
(root, result) => {
root.append(postcss.parse(extraRules))
},
/* Wrap in dark media selector */
/* XXX: I couldn't find a nice function or plugin to "wrap" the contents of a node, so this is based on reading postcss internals */
(root, result) => {
// @media (prefers-color-scheme: dark) { ... }
const media = postcss.atRule({ name: "media", params: "(prefers-color-scheme: dark)", nodes: root.nodes })
media.parent = root
media.nodes.forEach(node => node.parent = media)
root.nodes = [media]
delete root.indexes
},
/* Bubble up media queries we may have just nested */
/* XXX: I couldn't find a nice plugin for this which actually works. The
* following is close, but deprecated, and breaks when mixing bare media
* selection and attributes */
/* https://github.com/jonathantneal/postcss-nesting/blob/6.0.0/lib/atrule-within-atrule.js */
(root, result) => {
root.walkAtRules("media", (node) => {
if (node.parent && node.parent.type === "atrule" && node.parent.name === "media") {
const parent = node.parent
const index = parent.index(node)
// conditionally move previous siblings into a clone of the parent
if (index) {
parent.cloneBefore().removeAll().append(
parent.nodes.slice(0, index)
)
}
// move the current node before the parent (and after the conditional clone)
parent.before(node)
// update the params of the node to be merged with the parent
node.params = `${node.params} and ${parent.params}`
// conditionally cleanup an empty parent rule
if (!parent.nodes.length) {
parent.remove()
}
}
})
},
/* Wrap it all in a userstyle domain rule */
(root, result) => {
const domainRule = postcss.atRule({name: "-moz-document", params: `domain("3.basecamp.com")`})
root.each((node) => domainRule.append(root.remove(node)))
root.append(domainRule)
},
/* Remove all comments */
discardComments({removeAll: true}),
/* Now re-add a userstyle header comment */
(root, result) => {
const comment = `/* ==UserStyle==
@name Basecamp Dark Mode
@namespace gist.github.com/sj26/74a353bc6c52a564ee95edc886dee4c1
@version 1.0.0
@description The missing dark mode for Basecamp
@author Samuel Cochran <[email protected]>
==/UserStyle== */`
root.prepend(comment)
},
/* Make the results a bit easier to debug */
prettify(),
]).process(contents, {from: "desktop.css", to: "basecamp-dark.user.css"}))
.then(result => fs.promises.writeFile("basecamp-dark.user.css", result.css))
.catch(err => console.error(err.stack))
Raw
package.json
{
"type": "module",
"dependencies": {
"color": "^3.1.2",
"postcss": "^7.0.32",
"postcss-discard-comments": "^4.0.2",
"postcss-discard-empty": "^4.0.1",
"postcss-nesting": "6.0.0",
"postcss-prettify": "^0.3.4",
"postcss-shorthand-expand": "^1.0.1"
}
}
Raw
yarn.lock
# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
ansi-regex@^2.0.0:
version "2.1.1"
resolved "https://registry.yarnpkg.com/ansi-regex/-/ansi-regex-2.1.1.tgz#c3b33ab5ee360d86e0e628f0468ae7ef27d654df"
integrity sha1-w7M6te42DYbg5ijwRorn7yfWVN8=
ansi-styles@^2.2.1:
version "2.2.1"
resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-2.2.1.tgz#b432dd3358b634cf75e1e4664368240533c1ddbe"
integrity sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=
ansi-styles@^3.2.1:
version "3.2.1"
resolved "https://registry.yarnpkg.com/ansi-styles/-/ansi-styles-3.2.1.tgz#41fbb20243e50b12be0f04b8dedbf07520ce841d"
integrity sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==
dependencies:
color-convert "^1.9.0"
chalk@^1.1.3:
version "1.1.3"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-1.1.3.tgz#a8115c55e4a702fe4d150abd3872822a7e09fc98"
integrity sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=
dependencies:
ansi-styles "^2.2.1"
escape-string-regexp "^1.0.2"
has-ansi "^2.0.0"
strip-ansi "^3.0.0"
supports-color "^2.0.0"
chalk@^2.4.1, chalk@^2.4.2:
version "2.4.2"
resolved "https://registry.yarnpkg.com/chalk/-/chalk-2.4.2.tgz#cd42541677a54333cf541a49108c1432b44c9424"
integrity sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==
dependencies:
ansi-styles "^3.2.1"
escape-string-regexp "^1.0.5"
supports-color "^5.3.0"
color-convert@^1.9.0, color-convert@^1.9.1:
version "1.9.3"
resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8"
integrity sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
dependencies:
color-name "1.1.3"
[email protected]:
version "1.1.3"
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.3.tgz#a7d0558bd89c42f795dd42328f740831ca53bc25"
integrity sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
color-name@^1.0.0:
version "1.1.4"
resolved "https://registry.yarnpkg.com/color-name/-/color-name-1.1.4.tgz#c2a09a87acbde69543de6f63fa3995c826c536a2"
integrity sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
color-string@^1.5.2:
version "1.5.3"
resolved "https://registry.yarnpkg.com/color-string/-/color-string-1.5.3.tgz#c9bbc5f01b58b5492f3d6857459cb6590ce204cc"
integrity sha512-dC2C5qeWoYkxki5UAXapdjqO672AM4vZuPGRQfO8b5HKuKGBbKWpITyDYN7TOFKvRW7kOgAn3746clDBMDJyQw==
dependencies:
color-name "^1.0.0"
simple-swizzle "^0.2.2"
color@^3.1.2:
version "3.1.2"
resolved "https://registry.yarnpkg.com/color/-/color-3.1.2.tgz#68148e7f85d41ad7649c5fa8c8106f098d229e10"
integrity sha512-vXTJhHebByxZn3lDvDJYw4lR5+uB3vuoHsuYA5AKuxRVn5wzzIfQKGLBmgdVRHKTJYeK5rvJcHnrd0Li49CFpg==
dependencies:
color-convert "^1.9.1"
color-string "^1.5.2"
[email protected]:
version "0.0.1"
resolved "https://registry.yarnpkg.com/css-color-names/-/css-color-names-0.0.1.tgz#5d0548fa256456ede4a9a0c2ac7ab19d3eb1ad81"
integrity sha1-XQVI+iVkVu3kqaDCrHqxnT6xrYE=
css-shorthand-expand@^1.0.1:
version "1.2.0"
resolved "https://registry.yarnpkg.com/css-shorthand-expand/-/css-shorthand-expand-1.2.0.tgz#bd6ac8d79f99928581eaca9fe05a03d316d17fe5"
integrity sha512-L3RS1VNYuXgMOfVGX4WzP9AFK6KL0JuioSoO8661egEac2eHX9/s4yFO8mgK6QEtm8UmU8IvuKzPgdQpU0DhpQ==
dependencies:
css-color-names "0.0.1"
css-url-regex "0.0.1"
hex-color-regex "^1.0.1"
hsl-regex "^1.0.0"
hsla-regex "^1.0.0"
map-obj "^1.0.0"
repeat-element "^1.1.0"
rgb-regex "^1.0.1"
rgba-regex "^1.0.0"
xtend "^4.0.0"
css-shorthand-properties@^1.0.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/css-shorthand-properties/-/css-shorthand-properties-1.1.1.tgz#1c808e63553c283f289f2dd56fcee8f3337bd935"
integrity sha512-Md+Juc7M3uOdbAFwOYlTrccIZ7oCFuzrhKYQjdeUEW/sE1hv17Jp/Bws+ReOPpGVBTYCBoYo+G17V5Qo8QQ75A==
[email protected]:
version "0.0.1"
resolved "https://registry.yarnpkg.com/css-url-regex/-/css-url-regex-0.0.1.tgz#e05af8c6c290d451ef1632b455ea5c81b4b1395c"
integrity sha1-4Fr4xsKQ1FHvFjK0VepcgbSxOVw=
[email protected]:
version "1.0.0"
resolved "https://registry.yarnpkg.com/defined/-/defined-1.0.0.tgz#c98d9bcef75674188e110969151199e39b1fa693"
integrity sha1-yY2bzvdWdBiOEQlpFRGZ45sfppM=
escape-string-regexp@^1.0.2, escape-string-regexp@^1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-1.0.5.tgz#1b61c0562190a8dff6ae3bb2cf0200ca130b86d4"
integrity sha1-G2HAViGQqN/2rjuyzwIAyhMLhtQ=
has-ansi@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/has-ansi/-/has-ansi-2.0.0.tgz#34f5049ce1ecdf2b0649af3ef24e45ed35416d91"
integrity sha1-NPUEnOHs3ysGSa8+8k5F7TVBbZE=
dependencies:
ansi-regex "^2.0.0"
has-flag@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-1.0.0.tgz#9d9e793165ce017a00f00418c43f942a7b1d11fa"
integrity sha1-nZ55MWXOAXoA8AQYxD+UKnsdEfo=
has-flag@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/has-flag/-/has-flag-3.0.0.tgz#b5d454dc2199ae225699f3467e5a07f3b955bafd"
integrity sha1-tdRU3CGZriJWmfNGfloH87lVuv0=
hex-color-regex@^1.0.1:
version "1.1.0"
resolved "https://registry.yarnpkg.com/hex-color-regex/-/hex-color-regex-1.1.0.tgz#4c06fccb4602fe2602b3c93df82d7e7dbf1a8a8e"
integrity sha512-l9sfDFsuqtOqKDsQdqrMRk0U85RZc0RtOR9yPI7mRVOa4FsR/BVnZ0shmQRM96Ji99kYZP/7hn1cedc1+ApsTQ==
hsl-regex@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/hsl-regex/-/hsl-regex-1.0.0.tgz#d49330c789ed819e276a4c0d272dffa30b18fe6e"
integrity sha1-1JMwx4ntgZ4nakwNJy3/owsY/m4=
hsla-regex@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/hsla-regex/-/hsla-regex-1.0.0.tgz#c1ce7a3168c8c6614033a4b5f7877f3b225f9c38"
integrity sha1-wc56MWjIxmFAM6S194d/OyJfnDg=
is-arrayish@^0.3.1:
version "0.3.2"
resolved "https://registry.yarnpkg.com/is-arrayish/-/is-arrayish-0.3.2.tgz#4574a2ae56f7ab206896fb431eaeed066fdf8f03"
integrity sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==
is-css-shorthand@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/is-css-shorthand/-/is-css-shorthand-1.0.1.tgz#30f95d03210605fedfdd128e53dac4a4437a933c"
integrity sha1-MPldAyEGBf7f3RKOU9rEpEN6kzw=
dependencies:
css-shorthand-properties "^1.0.0"
js-base64@^2.1.9:
version "2.6.4"
resolved "https://registry.yarnpkg.com/js-base64/-/js-base64-2.6.4.tgz#f4e686c5de1ea1f867dbcad3d46d969428df98c4"
integrity sha512-pZe//GGmwJndub7ZghVHz7vjb2LgC1m8B07Au3eYqeqv9emhESByMXxaEgkUkEqJe87oBbSniGYoQNIBklc7IQ==
map-obj@^1.0.0:
version "1.0.1"
resolved "https://registry.yarnpkg.com/map-obj/-/map-obj-1.0.1.tgz#d933ceb9205d82bdcf4886f6742bdc2b4dea146d"
integrity sha1-2TPOuSBdgr3PSIb2dCvcK03qFG0=
postcss-discard-comments@^4.0.2:
version "4.0.2"
resolved "https://registry.yarnpkg.com/postcss-discard-comments/-/postcss-discard-comments-4.0.2.tgz#1fbabd2c246bff6aaad7997b2b0918f4d7af4033"
integrity sha512-RJutN259iuRf3IW7GZyLM5Sw4GLTOH8FmsXBnv8Ab/Tc2k4SR4qbV4DNbyyY4+Sjo362SyDmW2DQ7lBSChrpkg==
dependencies:
postcss "^7.0.0"
postcss-discard-empty@^4.0.1:
version "4.0.1"
resolved "https://registry.yarnpkg.com/postcss-discard-empty/-/postcss-discard-empty-4.0.1.tgz#c8c951e9f73ed9428019458444a02ad90bb9f765"
integrity sha512-B9miTzbznhDjTfjvipfHoqbWKwd0Mj+/fL5s1QOz06wufguil+Xheo4XpOnc4NqKYBCNqqEzgPv2aPBIJLox0w==
dependencies:
postcss "^7.0.0"
[email protected]:
version "6.0.0"
resolved "https://registry.yarnpkg.com/postcss-nesting/-/postcss-nesting-6.0.0.tgz#4c45276a065765ec063efe1e4daf75c131518991"
integrity sha512-Yoglsy6eZbDCbRIXoYSmnIt9ao4xyg07iFwVBd7WyIkDzMSeRxIqUk8xEAdkeJQ7eGfWo6RufrTU7FSUjZ22fg==
dependencies:
postcss "^6.0.22"
postcss-prettify@^0.3.4:
version "0.3.4"
resolved "https://registry.yarnpkg.com/postcss-prettify/-/postcss-prettify-0.3.4.tgz#1ab97899bea34777e4fc18d8ca61f85807651843"
integrity sha1-Grl4mb6jR3fk/BjYymH4WAdlGEM=
dependencies:
defined "1.0.0"
postcss "5.0.19"
postcss-shorthand-expand@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/postcss-shorthand-expand/-/postcss-shorthand-expand-1.0.1.tgz#f8309b58120de4676d1208620ba2d880830f8978"
integrity sha1-+DCbWBIN5GdtEghiC6LYgIMPiXg=
dependencies:
css-shorthand-expand "^1.0.1"
is-css-shorthand "^1.0.0"
postcss "^5.0.8"
[email protected]:
version "5.0.19"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.0.19.tgz#b6342a01dc75b8cab7e968afda96aefc67f888af"
integrity sha1-tjQqAdx1uMq36Wiv2pau/Gf4iK8=
dependencies:
js-base64 "^2.1.9"
source-map "^0.5.1"
supports-color "^3.1.2"
postcss@^5.0.8:
version "5.2.18"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-5.2.18.tgz#badfa1497d46244f6390f58b319830d9107853c5"
integrity sha512-zrUjRRe1bpXKsX1qAJNJjqZViErVuyEkMTRrwu4ud4sbTtIBRmtaYDrHmcGgmrbsW3MHfmtIf+vJumgQn+PrXg==
dependencies:
chalk "^1.1.3"
js-base64 "^2.1.9"
source-map "^0.5.6"
supports-color "^3.2.3"
postcss@^6.0.22:
version "6.0.23"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-6.0.23.tgz#61c82cc328ac60e677645f979054eb98bc0e3324"
integrity sha512-soOk1h6J3VMTZtVeVpv15/Hpdl2cBLX3CAw4TAbkpTJiNPk9YP/zWcD1ND+xEtvyuuvKzbxliTOIyvkSeSJ6ag==
dependencies:
chalk "^2.4.1"
source-map "^0.6.1"
supports-color "^5.4.0"
postcss@^7.0.0, postcss@^7.0.32:
version "7.0.32"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.32.tgz#4310d6ee347053da3433db2be492883d62cec59d"
integrity sha512-03eXong5NLnNCD05xscnGKGDZ98CyzoqPSMjOe6SuoQY7Z2hIj0Ld1g/O/UQRuOle2aRtiIRDg9tDcTGAkLfKw==
dependencies:
chalk "^2.4.2"
source-map "^0.6.1"
supports-color "^6.1.0"
repeat-element@^1.1.0:
version "1.1.3"
resolved "https://registry.yarnpkg.com/repeat-element/-/repeat-element-1.1.3.tgz#782e0d825c0c5a3bb39731f84efee6b742e6b1ce"
integrity sha512-ahGq0ZnV5m5XtZLMb+vP76kcAM5nkLqk0lpqAuojSKGgQtn4eRi4ZZGm2olo2zKFH+sMsWaqOCW1dqAnOru72g==
rgb-regex@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/rgb-regex/-/rgb-regex-1.0.1.tgz#c0e0d6882df0e23be254a475e8edd41915feaeb1"
integrity sha1-wODWiC3w4jviVKR16O3UGRX+rrE=
rgba-regex@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/rgba-regex/-/rgba-regex-1.0.0.tgz#43374e2e2ca0968b0ef1523460b7d730ff22eeb3"
integrity sha1-QzdOLiyglosO8VI0YLfXMP8i7rM=
simple-swizzle@^0.2.2:
version "0.2.2"
resolved "https://registry.yarnpkg.com/simple-swizzle/-/simple-swizzle-0.2.2.tgz#a4da6b635ffcccca33f70d17cb92592de95e557a"
integrity sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=
dependencies:
is-arrayish "^0.3.1"
source-map@^0.5.1, source-map@^0.5.6:
version "0.5.7"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
integrity sha1-igOdLRAh0i0eoUyA2OpGi6LvP8w=
source-map@^0.6.1:
version "0.6.1"
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
strip-ansi@^3.0.0:
version "3.0.1"
resolved "https://registry.yarnpkg.com/strip-ansi/-/strip-ansi-3.0.1.tgz#6a385fb8853d952d5ff05d0e8aaf94278dc63dcf"
integrity sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=
dependencies:
ansi-regex "^2.0.0"
supports-color@^2.0.0:
version "2.0.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-2.0.0.tgz#535d045ce6b6363fa40117084629995e9df324c7"
integrity sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=
supports-color@^3.1.2, supports-color@^3.2.3:
version "3.2.3"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-3.2.3.tgz#65ac0504b3954171d8a64946b2ae3cbb8a5f54f6"
integrity sha1-ZawFBLOVQXHYpklGsq48u4pfVPY=
dependencies:
has-flag "^1.0.0"
supports-color@^5.3.0, supports-color@^5.4.0:
version "5.5.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
integrity sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==
dependencies:
has-flag "^3.0.0"
supports-color@^6.1.0:
version "6.1.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-6.1.0.tgz#0764abc69c63d5ac842dd4867e8d025e880df8f3"
integrity sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==
dependencies:
has-flag "^3.0.0"
xtend@^4.0.0:
version "4.0.2"
resolved "https://registry.yarnpkg.com/xtend/-/xtend-4.0.2.tgz#bb72779f5fa465186b1f438f674fa347fdb5db54"
integrity sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==
@claytonschase
Copy link

How do you set up the Basecamp 3 dark mode?

@sj26
Copy link
Author

sj26 commented Nov 12, 2020

@claytonschase It's a userstyle, so it's up to you how you'd like to use it. I've just added a README, hope it helps!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment