Skip to content

Instantly share code, notes, and snippets.

@jacopocolo
Last active October 31, 2018 14:23
Show Gist options
  • Save jacopocolo/0c597949d893b004ec3b055bff0c1144 to your computer and use it in GitHub Desktop.
Save jacopocolo/0c597949d893b004ec3b055bff0c1144 to your computer and use it in GitHub Desktop.
A userstyle for Asana
#center_pane__contents > div > div > div.loading-boundary.hidden > div > div, .PageHeaderCollapsedStructure, .Topbar, .layerContext {
background: #141d26;
background-color: #141d26
}
#grid_views_select > span > span {
color: #FFFFFF
}
#asana_main > div.full-width-header.full-width-header--expanded.full-width-header-sideElements--medium {
background: #141d26;
color: #FFFFFF
}
#asana_main > div.full-width-header.full-width-header--expanded.full-width-header-sideElements--medium > div.full-width-header-center, .page-topbar, .TopbarPageHeaderGlobalActions, .TopbarSearchTypeahead-background {
background: #141d26;
color: #FFFFFF
}
.TopbarSearchTypeahead-background::before{
background-image: linear-gradient(to left, #141d26, rgba(255,255,255,0));
}
#asana_main > div.full-width-header.full-width-header--expanded.full-width-header-sideElements--medium > div.full-width-header-center > div.center-pane-header-row-view.textarea-title-view {
background: #141d26;
color: #FFFFFF
}
#asana_main > div.full-width-header.full-width-header--expanded.full-width-header-sideElements--medium > div.full-width-header-center > div.tab-nav-div > ul > li > a {
color: #FFFFFF
}
#asana_main > div.remix-topbar,
#asana_main > div.remix-topbar > div {
background: #141d26
}
#asana_main > div.remix-topbar > div.react-mount-node > div > div {
background: #141d26
}
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium {
background: #141d26;
color: #FFFFFF
}
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium > div.full-width-header-left-side-elements > div.center-pane-header-row-view.textarea-title-view {
background: #141d26;
color: #FFFFFF
}
#asana_main > div.asanaView-bodyContainer > div.asanaView-body > div:nth-child(1) {
background: #141d26;
background-image: none
}
#asana_main > div.asanaView-bodyContainer > div.asanaView-body > div:nth-child(4) {
background: #141d26;
background-image: none
}
#asana_main > div.asanaView-bodyContainer > div.asanaView-body {
background: #141d26;
background-image: none
}
#grid > tbody {
background: #121921;
color: #FFFFFF
}
.task-row-overlay {
background: none
}
.task-row-overlay.grid-tags-and-date, .react-mount-node .DeprecatedButtonSelect-menu {
background: none;
background-color: #121921
}
.gridCell-stringContainer, .react-mount-node .dropdownMenuOption-label {
color: #FFFFFF
}
.gridCell-stringContainer > .task-row-overlay.grid-tags-and-date, .known-list--withRowNumberGutter .columnView-leftGutter, .GridScroller-scrollable {
background: #121921;
background-color: #121921
}
.task-row-text-input.override-focus-border.override-hover-border {
color: #FFFFFF
}
.task-row-text-input.override-focus-border {
color: #FFFFFF
}
.task-row-text-input {
color: #FFFFFF
}
#Flags.enable_no_flexbox_in_grid .grid-uncompact .grid-row-selected:not(.focused)>td .grid-tags-and-date,
#Flags.enable_no_flexbox_in_grid .grid-uncompact .grid-row-selected:not(.focused)>td .grid-custom-fields, .PageHeaderStructureLoading--compact, .TaskGroupHeader--showZipper .TaskGroupHeader-content {
background: none;
background-color: transparent
}
#Flags.enable_no_flexbox_in_grid .grid-uncompact .task-row:not(.recently-changed) .grid-tags-and-date,
#Flags.enable_no_flexbox_in_grid .grid-uncompact .grid_pseudorow_no_prioritized:not(.recently-changed) .grid-tags-and-date,
#Flags.enable_no_flexbox_in_grid .grid-uncompact .task-row:not(.recently-changed) .grid-custom-fields,
#Flags.enable_no_flexbox_in_grid .grid-uncompact .grid_pseudorow_no_prioritized:not(.recently-changed) .grid-custom-fields {
background: none;
background-color: transparent
}
#center_pane__contents {
background: #121921
}
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium > div.full-width-header-center > div > ul > li:nth-child(1) > a {
color: #FFFFFF
}
#details_pane_header > div.toolbar.details-pane-top.details-pane-toolbar.toolbar-no-grad {
background: #121921
}
#right_pane__contents > div > div > div:nth-child(6) > div.property.description.taskDetailsView-description {
background: #121921
}
#right_pane__contents > div > div > div.sticky-view-placeholder {
background: #121921
}
#right_pane__contents > div > div > div:nth-child(3) {
background: #121921
}
#details_property_sheet_title {
color: #FFFFFF
}
#details_pane_title_row > div.details-pane-title > span > div {
color: #FFFFFF
}
#property_sheet\3a details_property_sheet_field\3a description {
color: #FFFFFF
}
#right_pane__contents > div > div > div:nth-child(6) {
background: #121921
}
#details_pane_footer > div > div.loading-boundary.hidden > div, .react-mount-node .Button.Button--secondary, .react-mount-node .Button.Button--secondary:not(.Button--disabled), #details_pane_footer > div, #details_pane_footer > div > div:nth-child(2) > div.property.followers_du.details-followers.detailsFollowers-withFacepileLabel {
background: #243242
}
#details_pane_footer {
background: #243242;
margin: 0
}
.detailsFollowersLabel {
color: #FFFFFF
}
#Flags.enable_no_flexbox_in_grid .grid-uncompact .grid-row-selected:not(.focused)>td {
background-color: #243242;
background: #243242
}
#right_pane, .GridHeaderWithCustomProperties {
background: #121921
}
#right_pane_container {
background: #121921
}
#right_pane__contents > div > div > div.sticky-view-placeholder > div {
background: #121921
}
.tokenAreaView {
background: none
}
.empty-filtertext {
background: none
}
#right_pane__contents {
background: #121921
}
.expandable {
color: #FFFFFF
}
.itemListGroupView-zipper {
color: #FFFFFF
}
.drop-indicator {
color: #FFFFFF
}
.group_header .drop-indicator .expandable {
color: #FFFFFF
}
.full-width-header.full-width-header--compact .full-width-header-left-side-elements,
.full-width-header.full-width-header--compact,
.full-width-header.full-width-header--compact .center-pane-header-row-view,
.nothing-selected,
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium > div.full-width-header-left-side-elements > div.center-pane-header-row-view.textarea-title-view,
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium {
background: #121921
}
.full-width-header .header-name {
color: #FFFFFF
}
.tab-nav-div .tab-nav-bar .tab-nav-button.is-selected,
.react-mount-node .topbar-myTasksButton.is-selected,
.react-mount-node .topbar-notificationsButton.is-selected {
color: #FFFFFF
}
.potColor-background--NONE {
color: #141d26
}
.grid-row-selected .gridCell-interiorRowContainer {
background: none;
background-color: transparent
}
.redesign-assigned-to-container .token_name,
.redesign-due-date-container .token_name,
.blockStoryView-body {
color: #FFFFFF
}
.blockStoryView-actorLink {
color: #99EBFF
}
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--medium, .react-mount-node .topbar, .Topbar {
border-bottom: 1px solid #243242
}
#center_pane__contents > div > div > div.loading-boundary.hidden > div > div {
background: #121921;
border-top-left-radius: 5px
}
.tab-nav-div .tab-nav-bar .tab-nav-button:hover, .Tab.Tab--isSelected, .Topbar-myTasksButton.is-selected, .Topbar-notificationsButton.is-selected, .Topbar-myDashboardButton.is-selected {
color: #99EBFF
}
.notification-header .notification-title {
color: #FFFFFF
}
.inboxThreadView.is-selectable:hover,
.inbox .inbox-link-row:hover {
background: #243242
}
.inboxThreadView.is-selectable.has-selectedNotification {
background: #243242
}
.itemListInboxThreadView-listName {
color: #FFFFFF
}
.referenced-task-row-view .referenced-task-row-view-name {
color: #FFFFFF
}
.referenced-task-row-view {
background: #121921
}
.itemListInboxThreadView-notification .selected.story .referenced-task-row-view {
background: #243242
}
.referenced-task-row-view:hover {
background: #326699
}
.team-page .navigationDockItemView-label {
color: #FFFFFF
}
.team-page-projects {
background: none
}
.remix-topbar #nav_search_input {
background: #141d26;
color: #99EBFF
}
.teamFeedView-emptyStateCard,
.conversations .team-feed-conversation-wrapper,
.team-feed-conversation .conversation-reply-message,
.message-composer-form .composer-input-wrap.expanded .menu-bar {
background: #243242
}
.teamFeedView-emptyStateMessage,
.teamFeedView-emailTip,
.message-view .subject-link,
.message-view .comment-text {
color: #FFFFFF
}
.storyCreatorWidget-creatorLink,
.message-composer-form .message-composer-followers,
.dropdown .menu-widget.title,
.search-row .search-row-contents {
color: #99EBFF
}
.message-composer-form:not(.expanded).always-show-post-button .menu-bar {
background: #243242;
color: #FFFFFF
}
#center_pane__contents > div > div > div.team-feed > div > div.conversations > div > div > div.form.message-composer-form.conversation-reply-message.message-composer-small > div.form-row.input-row > div.body > div {
background: #121921;
color: #FFFFFF
}
.message-composer-form .composer-input-wrap .composer-placeholder,
.team-feed-conversation .conversation-reply-message.message-composer-form .composer-input-wrap.expanded .autogrow-textarea .hypertext-input {
color: #FFFFFF
}
.message-composer-form:not(.expanded).always-show-post-button .composer-placeholder,
.team-feed .conversation-message.expanded.message-composer-form .composer-input-wrap.expanded .autogrow-textarea .hypertext-input {
color: #FFFFFF
}
.message-composer-big .composer-input-wrap .conversation-composer,
.message-composer-big .composer-input-wrap .placeholder-content {
background: #243242
}
.message-composer-form:not(.expanded).always-show-post-button .composer-placeholder,
.team-feed .conversation-message.expanded.message-composer-form .composer-input-wrap.expanded .autogrow-textarea .hypertext-input {
background: #121921
}
.buttonView.buttonView--secondary {
background: #243242
}
.dropdown .dropdown-menu {
background: #243242;
color: #FFFFFF
}
.advanced-search-footer-row .advanced-search-footer-text,
.dropdown-menu-item-label,
.selected>.advanced-search-footer-row .customize,
.selected>.advanced-search-footer-row .advanced-search-footer,
.selected>.advanced-search-footer-row .advanced-search-footer-text {
color: #FFFFFF
}
.dropdown,
#nav_search_list_sections_view_footer {
background: #243242
}
.storyCreatorWidget-creatorLink,
.message-composer-form .message-composer-followers,
.dropdown .menu-widget.title,
.search-row .search-row-contents {
color: #FFFFFF
}
.grid_due_date,
.grid-compact .grid_due_date:not(.due_soon):not(.overdue),
.grid-uncompact .grid_due_date:not(.due_soon):not(.overdue) {
color: #FFFFFF
}
.topbar-settingsMenuButton span {
color: #FFFFFF
}
#right_pane_container {
background: black
}
#center_pane__contents,
#right_pane__contents,
#right_pane_container #center_pane,
#right_pane_container #right_pane {
border-top-left-radius: 8px
}
.known-list #center_pane,
.known-list #right_pane {
background: none
}
#right_pane_container #center_pane,
#right_pane_container #right_pane {
background-color: transparent;
background: none
}
.full-width-header.full-width-header--expanded .header-name.read-only,
.full-width-header.full-width-header--compact .header-name.read-only {
color: #FFFFFF
}
#asana_main > div.full-width-header.full-width-header--compact.full-width-header-sideElements--large {
border-bottom: 1px solid #FFFFFF
}
.full-width-header .center-pane-header-row-view,
.full-width-header.full-width-header--expanded .full-width-header-center,
.full-width-header.full-width-header--expanded,
.notifications #center_pane,
.notifications #right_pane {
background: #141d26
}
.taskCheckboxNodeView.circularToggleButtonView--toggledOn .circularToggleButtonView-button, .itemRow.itemRow--highlighted.PotTaskRow.PotTaskRow--highlighted {
background: #486484
}
.grid-uncompact .bar-row .bar_input_span {
border-bottom: 1px dotted #8CA4C0
}
.Tab:hover, .Tab--isSelected {
color: #8CA4C0
}
.asset-thumbnail .asset-thumbnail-image:hover {
border: 1px solid #8CA4C0
}
.grid-row-selected .gridCell-interiorRowContainer,
.grid-uncompact #grid .grid-row-selected:not(.focused)>td .grid-tags-and-date,
.grid-uncompact #grid .grid-row-selected:not(.focused)>td .grid-custom-fields,
.grid-uncompact #grid .grid-row-selected:not(.focused)>td {
background: #243242
}
.details-pane-title .header-name.read-only {
color: #FFFFFF
}
.search-typeahead .item-label {
color: #FFFFFF
}
.action-link {
color: #FFFFFF
}
.detailsModalView {
background: #141d26
}
.grid-cell,
.grid_cell_schedule,
.grid_cell_show_details {
background: #121921
}
.grid_cell_boolean {
background: #121921;
color: #FFFFFF
}
.taskPrivacyHeaderView-togglePrivacyLink,
.privacy-content,
div.taskPrivacyHeaderView.privacy-info {
color: #FFFFFF;
background: #243242
}
.grid-uncompact #grid .grid-row-selected+.task-row:not(:hover):not(.focused) .grid_cell_boolean,
.grid_cell_schedule .schedule-status-dropdown,
.grid-uncompact #grid .task-row:not(.recently-changed) .grid-tags-and-date,
.grid-uncompact #grid .grid_pseudorow_no_prioritized:not(.recently-changed) .grid-tags-and-date,
.grid-uncompact #grid .task-row:not(.recently-changed) .grid-custom-fields,
.grid-uncompact #grid .grid_pseudorow_no_prioritized:not(.recently-changed) .grid-custom-fields {
background: none
}
.details-maximized {
background: #141d26
}
.taskDetailsView-description .autogrow-textarea {
background: none
}
.tab-nav-div .tab-nav-bar .tab-nav-button:not(.disabled).is-selected,
.selfFollowToggleView:hover,
.feed-story-follow:hover {
color: #FFFFFF
}
.tab-nav-div .tab-nav-bar .tab-nav-button:not(.disabled):hover,
.selfFollowToggleView.is-following:hover .selfFollowToggleView-text {
color: #99EBFF
}
.referencedTaskRowView-checkbox.grid_cell_boolean {
background: transparent
}
.itemInboxThreadView-token.potColor-text--NONE,
.inboxThreadView-type,
.selfFollowToggleView.is-following .selfFollowToggleView-text,
.inboxToolbar .inbox-email-settings-menu, .PageHeaderCollapsedStructure-title, .notification-header .notification-title .parent-task-link,
.floatingSelectView-anchor, .PageHeaderStructure-title, .DeprecatedRecurrenceView, .typeaheadItem-title, div.TypeaheadItem-title, .DueDateInput, .TaskGroupHeader-content, .react-mount-node .textInput.textInput--medium, .react-mount-node .CustomPropertyTextValueInput .autogrowTextarea-input, .PotColorPicker-setForEveryone {
color: #F1F1F1
}
.priority.task-row.new_tasks_group.grid-row-selected .grid_cell_boolean.taskRowView-completionCell {
background: #243242
}
.priority.task-row.new_tasks_group.grid-row-selected .grid-cell.grid_cell_boolean.taskRowView-completionCell {
background: #243242
}
.priority.task-row.new_tasks_group.grid-row-selected.in-assigned-to-me-new-task.taskRow--willCollapse {
background: #243242
}
.small-feed-story-group,
.small-feed-story-group a.storyCreatorWidget-creatorLink {
color: #F1F1F1
}
.hotkey-hinted-string span,
.advanced-search-view .search-by-another-field.dropdown-menu-link {
color: #F1F1F1
}
.tab-nav-div .tab-nav-bar .tab-nav-button:not(.disabled), .DueDateInput-inputContainer input {
color: #BCBFC2
}
.react-mount-node .lunaUiDropdown {
background: #121921
}
.react-mount-node svg:not(:root) polygon, .react-mount-node .menuSubmenuItem-disclosureIcon, .DropdownItem-disclosureIcon {
fill: #FFFFFF
}
.react-mount-node .menuItem-selectedIcon {
color: #99EBFF
}
.advanced-search-footer,
.blockStoryView-metadata, .PotTypeaheadItem {
color: #F1F1F1
}
.advanced-search-footer-row .search-row-icon, .menuItem-selectedIcon, .DatePickerCalendar-prevMonthIcon, .DatePickerCalendar-nextMonthIcon {
fill: #F1F1F1
}
.advanced-search-view {
background: #121921
}
.advanced-search-view a,
.advanced-search-view span,
.advanced-search-view li,
.advanced-search-view ul,
.advanced-search-view div {
color: #FFFFFF
}
.buttonView.buttonView--toggle.is-active, .DatePickerCalendar-day:hover .DatePickerCalendar-dayBackground {
background: #8CA4C0;
color: #F1F1F1
}
.grid-compact #grid .task-row div {
background: transparent
}
.label.arrowZipperView-label, .arrow-zipper, .priority.bar-row.no-group.grid-row-selected {
background: transparent
}
div.dropdown-anchor.omnibutton > a > svg > polygon {
fill: #FFFFFF
}
a.NavigationLink.topbar-notificationsButton,
a.NavigationLink.topbar-myTasksButton, .projectOverviewView-headerTitle {
color: #FFFFFF
}
a.NavigationLink.topbar-myTasksButton.is-selected,
a.NavigationLink.topbar-notificationsButton.is-selected, .react-mount-node .topbar-myDashboardButton.is-selected, .DeprecatedDueDateInput, .redesign-due-date-container .property.value-set {
color: #4DDBFF
}
.grid-uncompact #grid .grid-row-selected.focused>td, .DeprecatedDropdownContainer, .DropdownItem.is-highlighted {
background: #364B63
}
.priority.task-row.no-group.grid-row-selected, .priority.task-row.no-group.grid-row-selected.taskRow--willCollapse {
background: #243242
}
.circularToggleButtonView.circularToggleButtonView--toggledOn.circularToggleButtonView--recentlyToggled.taskCheckboxNodeView > div {
background: #364B63
}
.grid-row-selected:not(.focused) .taskCheckboxNodeView.circularToggleButtonView--toggledOn .circularToggleButtonView-button, .detailsTitle-checkmarkButton.circularToggleButtonView--toggledOn .circularToggleButtonView-button, .taskCheckboxNodeView.circularToggleButtonView--toggledOn .circularToggleButtonView-button, .grid-compact #grid .task-row div.circularToggleButtonView.circularToggleButtonView--toggledOn.taskCheckboxNodeView > div {
background: #4DDBFF
}
.taskInboxThreadView-icon.is-completed, .taskCompletedStoryView-avatar, .detailsTitle-checkmarkButton.circularToggleButtonView--toggledOn .circularToggleButtonView-button:hover, .react-mount-node .BoardAddCardButton.Button--primary {
background: #8CA4C0
}
.taskInboxThreadView-icon.is-completed, .taskCompletedStoryView-avatar, .taskCheckboxNodeView.circularToggleButtonView--toggledOn .circularToggleButtonView-button, .detailsTitle-checkmarkButton.circularToggleButtonView--toggledOn .circularToggleButtonView-button {
border-color: #4DDBFF
}
.checkbox-text, .menu a, .menu span, .menu div, .menu li, .menu ul {
color: #FFFFFF
}
.svgIcon.dropdownMenuItem-selectedIcon {
fill: #99EBFF
}
.menu-submenu-expand-arrow {
fill: #99EBFF
}
.label.arrowZipperView-label, .react-mount-node .newProjectDialogContent-label, .react-mount-node .dialog li,.react-mount-node .dialog div {
color: #FFFFFF
}
.react-mount-node .dialog a {
color: #99EBFF
}
.react-mount-node .dialog {
background: #243242;
min-height: 400px
}
.react-mount-node .dialog textarea, .react-mount-node .dialog input {
color: #141d26
}
svg.svgIcon.arrowZipperView-rightIcon, .group_header .drop-indicator .expandable svg {
fill: #FFFFFF
}
.arrow-zipper:hover, .arrow-zipper.arrowZipperView {
border: none;
background: transparent
}
div.property.followers_du.details-followers.detailsFollowers-withFacepileLabel, .itemRow.itemRow--highlighted.sectionRow.sectionRow--highlighted {
background: transparent
}
#Flags:not(.enable_inbox_typography_update) .itemInboxThreadView-token.potColor-text--NONE, .inboxToolbar .inbox-archive-all-button, .projectMembersSummaryView, .projectMembersSummaryView a {
color: #F1F1F1
}
.members-dropdown-member-list li, .members-dropdown-member-list a, .members-dropdown-member-list ul, .members-dropdown-member-list div {
color: #F1F1F1
}
.react-mount-node .Sidebar, #navigation_dock_body, #left_pane, .navigationDockTeamView:first-of-type, .navigationDockTeamView--expanded+.navigationDockTeamView--expanded, .navigationDockTeamBrowserView--expanded, .navigationDockTeamView--expanded+.navigationDockTeamView--collapsed, .navigationDockTeamView--collapsed+.navigationDockTeamView--expanded {
background: #121921;
border-right: 1px solid #243242;
}
#navigation_dock {
background: #243242
}
.react-mount-node .SidebarItemRow.is-selected, .navigationDockItemView:hover, .navigationDockBrowseTeamView:hover, .react-mount-node .SidebarDefaultSearchRow:hover {
background: #486484
}
#navigation_dock div, #navigation_dock a, #navigation_dock li, #navigation_dock ul {
color: #A2B4BC
}
.navigationDockItemView.selected:not(:hover), .react-mount-node .itemRow.itemRow--focused {
background: #364B63
}
.project-overview-section, .details-pane-project-overview .project-overview-section:last-child {
background: #243242
}
.project-description.always-expanded .autogrow-textarea .hypertext-input, .details-pane-project-overview .section-header, .inboxView-empty-header, .inboxView-empty-subheader {
color: #F1F1F1
}
.project-description .more-link.visible {
background: transparent
}
.taskCheckboxNodeView:hover.circularToggleButtonView--toggledOff .circularToggleButtonView-button, .detailsTitle-checkmarkButton.circularToggleButtonView--toggledOff .circularToggleButtonView-button:hover, .react-mount-node .taskRowCompletionStatus-checkbox.taskRowCompletionStatus-checkbox--incomplete:hover, .taskCheckboxNodeView.circularToggleButtonView--toggledOff .circularToggleButtonView-button:hover, .react-mount-node .CompletionCheckbox .CircularToggleButton.CircularToggleButton--toggledOff .CircularButton--enabled:hover, .TaskRowCompletionStatus-checkbox.TaskRowCompletionStatus-checkbox--complete, .TaskRowCompletionStatus-checkbox.TaskRowCompletionStatus-checkbox--incomplete:hover, .TaskRowCompletionStatus-checkbox.TaskRowCompletionStatus-checkbox--incomplete:not(.TaskRowCompletionStatus-checkbox--disabled):hover, .itemListInboxThreadView-notification .selected.story .referenced-task-row-view .referencedTaskRowView-checkButton:hover.circularToggleButtonView--toggledOff .circularToggleButtonView-button {
color: #FFFFFF;
fill: #FFFFFF;
background: #4DDBFF;
box-shadow: 0 0 0 3px #4DDBFF;
border-color: #4DDBFF;
}
.gridCell-stringContainer .task-row-overlay.grid-tags-and-date, .react-mount-node .sectionRow {
background: transparent
}
.hiddenLink, .blockStoryView-actorLink, .taskCompletedStoryView .blockStoryView-actorLink {
color: #99EBFF
}
.taskPrivacyHeaderView.privacy-warning {
background: #243242
}
.userTypeaheadView-nameAndIcon {
color: #F1F1F1
}
.taskName.PotTaskRow-taskName, .react-mount-node svg:not(:root) polygon {
color : #FFFFFF
}
.react-mount-node .sectionRow-sectionName .taskName-input {
color: white
}
.lunaui-grid-center-pane-container #center_pane {
background: transparent
}
.react-mount-node .itemRow:hover, .react-mount-node .itemRow:hover:not(.itemRow--disabled) {
border-color: #99EBFF
}
.react-mount-node .sectionRow-sectionName .taskName-input {
box-shadow: inset 0 -1px #486484
}
.SectionRow-sectionName .TaskName-input {
box-shadow: none;
}
.members-dropdown-notification-checkbox-option .projectMembersDropdown-notificationCheckbox-text, .person-card-view .person-info .name {
color: #F1F1F1
}
.is-hoveringAbove {
border-top: 2px dotted #4DDBFF;
}
.is-hoveringBelow {
border-bottom: 2px dotted #4DDBFF;
}
.react-mount-node .DueDate--future, .react-mount-node .MiniStory-actor {
color: #F1F1F1;
}
.react-mount-node .MiniStory, .react-mount-node .MiniStory-timestamp, .react-mount-node .BlockStory-metadata {
color: #BCBFC2;
}
.grid-uncompact #grid .grid_cell_boolean, .grid-uncompact #grid .grid_cell_string, .grid-uncompact #grid .grid_cell_schedule, .grid-uncompact #grid .grid_cell_assignee {
border-top: 1px dotted #8CA4C0
}
.grid-uncompact .bar-row .bar_input_span, .react-mount-node .TaskRow::after {
border-bottom: 1px solid #8CA4C0
}
.react-mount-node .PotTaskRow::after {
border-bottom: 1px dotted #8CA4C0
}
.grid-uncompact #grid .task-row:hover>td, .grid-uncompact #grid .grid_pseudorow_no_prioritized:hover>td, .grid-uncompact #grid .bar-row:hover>td, .grid-uncompact #grid .task-row:hover .grid_cell_show_details, .grid-uncompact #grid .grid_pseudorow_no_prioritized:hover .grid_cell_show_details, .grid-uncompact #grid .bar-row:hover .grid_cell_show_details {
border-bottom: 1px solid #4DDBFF;
border-top: 1px solid #4DDBFF
}
.grid-uncompact #grid .task-row:hover .grid_cell_drag_handle, .grid-uncompact #grid .bar-row:hover .grid_cell_drag_handle {
border-left: 1px solid #4DDBFF
}
.grid-uncompact #grid .task-row:hover .grid_cell_show_details, .grid-uncompact #grid .bar-row:hover .grid_cell_show_details {
border-right: 1px solid #4DDBFF
}
#right_pane_view_caret::before {
border: none;
background: #99EBFF
}
/*::-webkit-scrollbar {
width: 12px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.2);
-webkit-border-radius: 3px;
border-radius: 3px;
}
::-webkit-scrollbar-thumb {
-webkit-border-radius: 3px;
border-radius: 3px;
background: #486484;
-webkit-box-shadow: inset 0 0 6px rgba(255,255,255,0.2);
}
::-webkit-scrollbar-thumb:window-inactive {
background: #486484;
}*/
.inboxThreadView-archiveButton:hover, .DatePickerCalendar-day.is-today {
background: #4DDBFF;
}
.archive-button-label polygon {
fill: #F1F1F1;
}
#compose_conversation_subject, .teamFeedView-emailLink {
color: #F1F1F1;
}
.message-composer-big .composer-input-wrap .conversation-composer, .message-composer-form:not(.expanded).always-show-post-button .composer-placeholder {
background: #364B63;
}
.calendar-center-pane-container .floatingSelectView-label {
color: #A2B4BC;
}
.project-overview-center-pane-container .person-card-view .person-info .name, .project-overview-center-pane-container .project-due-date.unset .placeholder-text, .react-mount-node .DeprecatedButtonSelect-label{
color: #A2B4BC;
}
.tab-nav-div .tab-nav-bar .tab-nav-button:not(.disabled):hover {
box-shadow: inset 0 -3px #4DDBFF;
-moz-box-shadow: inset 0 -3px #4DDBFF;
-webkit-box-shadow: inset 0 -3px #4DDBFF;
}
.tab-nav-div .tab-nav-bar .tab-nav-button:not(.disabled).is-selected {
box-shadow: inset 0 -3px #4DDBFF;
-moz-box-shadow: inset 0 -3px #4DDBFF;
-webkit-box-shadow: inset 0 -3px #4DDBFF;
}
.react-mount-node .newProjectForm {
background: #243242
}
.react-mount-node .newProjectForm-label, #navigation_dock div {
color: #F1F1F1
}
.react-mount-node .newProjectForm-privacyIcon {
fill: #F1F1F1
}
.navigationDockSectionHeaderView-label {
color: #A2B4BC
}
.grid-compact #grid .task-row.recently-changed .gridCell-singleRowContainer,
.grid-compact #grid .recently-changed.grid_pseudorow_no_prioritized .gridCell-singleRowContainer,
.grid-compact #grid .task-row.recently-changed .gridCell-compactRowContainer,
.grid-compact #grid .recently-changed.grid_pseudorow_no_prioritized .gridCell-compactRowContainer,
.grid-compact #grid .task-row.recently-changed.referencedTaskRowView,
.grid-compact #grid .recently-changed.referencedTaskRowView.grid_pseudorow_no_prioritized,
.grid-compact #grid .task-row.taskRowView--recentlyCompleted.completed.taskRow--willCollapse,
.grid-compact #grid .taskRowView--recentlyCompleted.completed.taskRow--willCollapse.grid_pseudorow_no_prioritized,
.referenced-task-row-view.recently-changed .gridCell-singleRowContainer,
.referenced-task-row-view.recently-changed .gridCell-compactRowContainer,
.referenced-task-row-view.recently-changed.referencedTaskRowView,
.referenced-task-row-view.taskRowView--recentlyCompleted.completed.taskRow--willCollapse {
background-image: linear-gradient(to right, #4DDBFF, #4DDBFF 33%, #4DDBFF 83%, #fff)
}
@-webkit-keyframes background-to-green-completion {
0% {
background-color: #99EBFF
}
33% {
background-color: #4DDBFF
}
100% {
background-color: #4DDBFF
}
}
@-moz-keyframes background-to-green-completion {
0% {
background-color: #99EBFF
}
33% {
background-color: #4DDBFF
}
100% {
background-color: #4DDBFF
}
}
@keyframes background-to-green-completion {
0% {
background-color: #99EBFF
}
33% {
background-color: #4DDBFF
}
100% {
background-color: #4DDBFF
}
}
.task-description-changed-story .diff-delete, .react-mount-node .menuSubmenuItem.is-highlighted {
background: #364B63
}
.react-mount-node .taskName-autogrowTextarea .autogrowTextarea-input {
color: #F1F1F1;
}
.react-mount-node .itemRow.itemRow--highlighted {
background: #6B8AAE;
}
.react-mount-node .sectionRow-sectionName.taskName-autogrowTextarea {
box-shadow: inset 0 -1px #486484;
}
.react-mount-node .sectionRow {
box-shadow: 0px -1px #121921
}
.react-mount-node .itemRow.itemRow--highlighted {
border-bottom: 1px solid #4DDBFF;
box-shadow: 0 -1px #4DDBFF
}
.react-mount-node .itemRow.itemRow--focused {
box-shadow: none;
}
.react-mount-node .itemRow:hover, .react-mount-node .itemRow:hover:not(.itemRow--disabled) {
box-shadow: none;
border-color: #4DDBFF
}
.list-section-items .item-label {
color: #F1F1F1
}
.react-mount-node .taskRowCompletionStatus-checkbox.taskRowCompletionStatus-checkbox--complete, .taskRowCompletionStatus-checkIcon .react-mount-node svg:not(:root) polygon {
color: #F1F1F1;
fill: #F1F1F1;
background: #4DDBFF;
border-color: #4DDBFF
}
.react-mount-node svg:not(:root) polygon, .react-mount-node .BlockStory-storyContent .icon {
color: #F1F1F1;
fill: #F1F1F1;
}
.icon.StarFullIcon.DatePickerCalendar-todayIcon polygon, .icon.XIcon.WaitingOnBanner-removeButton polygon, .react-mount-node .TaskCompletedBlockStory .BlockStory-actorLink, .react-mount-node .dropdownMenuOption-checkIcon {
color: #4DDBFF;
fill: #4DDBFF;
}
.react-mount-node .topbar-myDashboardButton {
color: #FFFFFF;
}
.guest-icon {
fill: #99EBFF;
}
#asana_ui {
background: #141d26;
}
.dropdownMenuOption-button.CustomPropertyTypeDropdown-option {
background: #243242;
}
.react-mount-node .dialog div {
color: #243242;
}
.react-mount-node .dialog-header .CustomPropertyProjectSettingsDialog-title {
color: #F1F1F1;
}
.burnup-settings-section-label, .react-mount-node .TaskDescription-textEditor .ql-editor, .react-mount-node .TaskDescription-textEditor .ql-editor, .react-mount-node .SingleTaskTitleRow-taskName .autogrowTextarea-input, .react-mount-node .truncatedRichText-richText, .react-mount-node .BlockStory-storyContent, .react-mount-node .BoardBody-columnInBoardWithViewMenu .BoardColumnHeader-title, .react-mount-node .Board--hasViewMenu .BoardColumnHeader-title, .AddAttachmentsMenuItem {
color: #F1F1F1;
}
.react-mount-node .sectionRow {
box-shadow: none;
}
.react-mount-node .SingleTaskTitleRow-taskName .autogrowTextarea-input, .react-mount-node .TaskFollowers, .react-mount-node .CircularButton, .react-mount-node .TaskTags-tokenizer, .react-mount-node .TokenizerInput-input, .react-mount-node .TokenButton-icon {
background: transparent;
}
.react-mount-node .TaskCompletedBlockStory .BlockStory-actorLink:hover, .react-mount-node .BlockStory-actorLink {
color: #99EBFF;
}
.react-mount-node .TaskCompletedBlockStory-icon, .react-mount-node .CompletionCheckbox .CircularToggleButton.CircularToggleButton--toggledOn .CircularButton, .react-mount-node .CompletionCheckbox .CircularToggleButton .CircularToggleButton-pulse, .taskIconWidget--complete, .react-mount-node .taskRowCompletionStatus-checkbox.taskRowCompletionStatus-checkbox--complete.taskRowCompletionStatus--taskRowSelected {
background-color: #4DDBFF;
border-color: #4DDBFF;
background: #4DDBFF;
}
.item.selectable.static, .react-mount-node textarea, .react-mount-node .FloatingSelect, .react-mount-node .PotTaskRow--completed .PotTaskRow-dueDate .DueDate, .react-mount-node .PotTaskRow--completed .PotTaskRow-dueDate .DueDate--past, .react-mount-node .PotTaskRow--completed .PotTaskRow-dueDate .DueDate--soon, .react-mount-node .PotTaskRow--completed .PotTaskRow-dueDate .DueDate--future, .react-mount-node .DatePickerCalendar-dayButton, .react-mount-node .lunaui-label, .react-mount-node .dialog div {
color: #F1F1F1;
}
.circularToggleButtonView.circularToggleButtonView--toggledOn.circularToggleButtonView--recentlyToggled.taskCheckboxNodeView > div, .taskInboxThreadView-icon.is-completed, .taskCompletedStoryView-avatar {
background: #4DDBFF;
}
.react-mount-node .CircularButton.CircularButton--enabled:hover, .react-mount-node .TaskProjectsMultihome-project:hover, .detailsPaneProjectTokenizerView-token.detailsPaneProjectTokenizerView-token-multihome:hover {
background: transparent;
}
.react-mount-node .PotTaskRow::before, .react-mount-node .TaskRow::before, .react-mount-node .subtaskTaskRow::before {
background-image: none
}
.react-mount-node .DatePickerCalendar-day.is-adjacentMonth, .react-mount-node .TokenizerInput-input {
background: #243242;
color: #FFFFFF;
}
.react-mount-node .DatePickerCalendar-dayButton:hover {
background: #4DDBFF;
color: #FFFFFF;
}
.react-mount-node .DatePickerCalendar-dayButton.is-selected, .react-mount-node .dropdownMenuItem-button {
background: #8CA4C0;
color: #FFFFFF;
}
.react-mount-node .TimeSelect-menu, .react-mount-node .dropdown-anchoredElement.dropdown--alignLeft, .react-mount-node .DatePicker {
background: #364B63;
}
.react-mount-node .AssigneeToken-userNameLabel, .react-mount-node .DueDateToken-label, .react-mount-node .AssigneeToken-tokenButton, .react-mount-node .CustomPropertyDetailsRowStructure-label {
color: #A2B4BC;
}
.react-mount-node .nativeFloatingSelect, .react-mount-node .RecurrenceView, .react-mount-node .TaskAttachments-fileName {
color: #99EBFF;
}
.react-mount-node .DropdownItem-disclosureIcon {
fill: #99EBFF;
}
.react-mount-node .DueDateToken-repeatIcon {
fill: #99EBFF;
background: transparent;
background-image: none;
}
.react-mount-node .sectionRow, .SectionRow {
background: #243242;
background: -moz-linear-gradient(left, #121921 0%, #243242 3%, #121921 50%);
background: -webkit-linear-gradient(left, #121921 0%, #243242 3%,#121921 50%);
background: linear-gradient(to right, #121921 0%, #243242 3%,#121921 50%);
}
.react-mount-node .StoryFeed-separator, .react-mount-node .SingleTaskPaneToolbar, .react-mount-node .SingleTaskPane-footer, .react-mount-node .TaskFollowers, .inboxThreadView.is-selectable.has-selectedNotification, .inbox .inbox-link-row, .inboxToolbar, .inboxThreadView, .inbox .inbox-link-row:hover, .taskDetailsView-description, .feedView-activitySeparator, .details-pane-toolbar, .details-pane-title-rows-container.sticky-view-stuck, .details-pane-footer, .taskAttachmentsView.has-attachments ~ .property.comments .taskFeedView-feed {
border-color: #486484;
}
.followerDividerLine {
background-color: #486484;
}
.react-mount-node .CustomPropertyDetailsContainer {
border-bottom: 1px solid #486484;
border-top: 1px solid #486484;
}
.TaskRow--completed .taskName.TaskRow-taskName div, .TaskRow--completed .taskName.TaskRow-taskName textarea {
color: #BCBFC2;
}
.itemListInboxThreadView-notifications:before {
-webkit-box-shadow: 0 0 0 1px #486484;
box-shadow: 0 0 0 1px #486484;
}
.referenced-task-row-view:hover .referencedTaskRowView-checkButton:hover.circularToggleButtonView--toggledOff .circularToggleButtonView-button {
background-color: #4DDBFF;
border-color: #4DDBFF;
background: #4DDBFF;
-webkit-box-shadow: 0 0 0 3px #4DDBFF;
box-shadow: 0 0 0 3px #4DDBFF;
color: #F1F1F1;
fill: #F1F1F1;
}
.react-mount-node .CustomPropertyEnumPreviewCell .Pill.Pill--small {
background: #486484;
color: #F1F1F1;
}
.react-mount-node .CustomPropertyGenericPreviewCell .CustomPropertyGenericPreviewCell-value, .react-mount-node .CustomPropertyNumberPreviewCell .CustomPropertyNumberPreviewCell-value, .GridFilterSection-label, .ButtonSelect-label{
color: #F1F1F1;
}
.react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton div, .react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton span, .react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton li, .react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton svg, .react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton path, .react-mount-node .DeprecatedButtonSelect-downIcon {
color: #F1F1F1;
fill: #F1F1F1;
}
.react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton {
background: #364B63;
}
.react-mount-node .CustomPropertyProtoTypeahead-dropdown.CustomPropertyProtoTypeahead-dropdown--withCreateButton .dropdownMenu-item .CustomPropertyProtoTypeaheadHeader, .react-mount-node .BoardAddCardButton.Button--primary:active:not(.Button--disabled), .react-mount-node .BoardAddCardButton.Button--primary:hover:not(.Button--disabled) {
background: #486484;
}
.react-mount-node .SingleTaskPane-body, .react-mount-node .SingleTaskPane-footer, .react-mount-node .menu, .numberedTaskList, .react-mount-node .GridScroller-scrollable--hasGutter{
background: #121921;
}
.PageHeaderStructure {
background: transparent;
background-color: none;
}
.react-mount-node .SidebarItemRow:hover {
background: #364B63;
border-color: #4DDBFF;
box-shadow: inset 1px 0px 0px 1px #4DDBFF;
-moz-box-shadow: inset 1px 0px 0px 1px #4DDBFF;
-webkit-box-shadow: inset 1px 0px 0px 1px #4DDBFF;
}
.DatePickerCalendarDate--today {
color: #F3FF52;
}
.Dropdown, .DatePickerCalendarDate--weekend, .DatePickerCalendarDate--adjacentMonth {
background: #243242;
}
.SingleTaskPane-projects .textInput.textInput--medium, .TaskProjects-projects .TaskProjectsMultihome-projects .textInput.textInput--medium, .TaskProjectsMultihome-typeaheadContainer .textInput.textInput--medium {
color: #8CA4C0;
}
.menuItem--disabled:hover {
color: #F1F1F1;
background: #BCBFC2;
}
.ItemRow--enabled.ItemRow--highlighted, .ItemRow--enabled.ItemRow--focused {
background: #486484;
}
.BoardAddCardForm , .BoardCard {
background: #1b2836!important;
color: #fff!important;
}
.CardButton, .BoardCardWithCustomProperties {
background: #1b2836!important;
color: #fff!important;
}
.SortableItem {
background: #141d26!important;
}
.is-empty::before {
background: #141d26!important;
}
.Topbar-navButton {
border-right: none;
}
.TopbarSearch-input {
border: none;
background-color: #182430;
}
.BoardColumnHeaderTitle {
color: #ffffff
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment