Upwork Dark Theme CSS

upwork-dark.css

:root {
    --body-bg: #1e1e1e !important;
    --nav-tooltip-text: white !important;
    --nav-text: white !important;
    --up-black: white !important;
    --tab-active-bg-color: white !important;
    --bg-inverse: #1e1e1e !important;
    --skill-bg: #1e1e1e !important;
    --skill-color: white !important;
    --nav-dropdown-link-text: black;
    --main-background-color: #1e1e1e !important;
    --semi-transparent-inverse: unset !important;
}

.room-list-body,
.desktop-room,
.desktop-room-layout,
.up-d-room,
.rooms-container,
.up-d-empty-state,
.filter-row,
.up-d-rooms-section,
.room-body,
.nav-btn-status,
.up-d-story-item,
.up-d-sidebar, 
.up-d-sidebar > ul, 
.up-d-sidebar > div, 
.up-d-resizer,
.sidebar-layout,
.sidebar-layout > div,
.up-d-sidebar-header,
.room-list-item-body,
.up-d-sidebar,
.up-input-group,
.search-input-group, 
.up-d-room-header,
.up-d-room-actions,
.nav-search-switch-btn,
.story-day-header,
.story-day-header > span,
.nav-search-autosuggest-input,
.up-btn,
.up-alert {
    background-color: #1e1e1e !important;
}

.person-avatar, .up-d-skeleton, .message-skeleton > p, .story-details > p {
    background-color: #1e1e1e !important;
    background-image: unset !important;
    --border-base-color: #1e1e1e !important;
}

.up-icon {
    fill: green !important;
}

.composer-dropdown-button {
    color: red
}

.up-d-room-header {
    background-color: #1e1e1e !important;
}

.nav-v2 .nav-notifications-list li:hover, 
.nav-v2 .nav-notifications-list li .nav-notification-text:hover, 
.nav-v2 :where(.nav-dropdown-menu) li .nav-menu-item:hover,
.up-card-section.up-card-hover:hover,
.up-tab-btn:hover,
.up-btn:hover,
.up-menu-list .up-menu-item:hover{
    background-color: #2e2e2e !important;
    color: white;
}

.up-loader-overlay {
    background-color: #1e1e1e;
}

.nav-v2 {
    --nav-bg: unset;
}

.nav-dropdown-menu {
    background-color: #1e1e1e;
}


.up-footer {
    background-color: #1e1e1e;    
}

.up-input, .up-card-footer, .up-card-header  {
    background-color: var(--body-bg);
}

.up-skill-badge {
    background-color: #1e1e1e
}

.up-card-section {
    background-color: #1e1e1e;
}

.up-card {
    background-color: var(--body-bg)
}

body {
    color: white;   
}

.nav-v2 .nav-container {
    background-color: var(--body-bg);
}

.nav-v2 .nav-right > li .nav-item {
    color: unset;
}