Skip to content

Trade Republic Dark by programie

Details

Authorprogramie

LicenseNo License

CategoryTrade Republic

Created

Updated

Size13 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

A dark theme for the Trade Republic Webapp

Notes

Userstyle doesn't have notes.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name         Trade Republic Dark
@version      20211007.19.27
@namespace    userstyles.world/user/programie
@description  A dark theme for the Trade Republic Webapp
@author       programie
@license      No License
==/UserStyle== */

@-moz-document domain("app.traderepublic.com") {
:root {
    --color-background: #101010;
    --color-foreground: #f3f6f8;
    --color-text-primary: white;
    --color-text-secondary: #ccc;
    --color-banner-nav-active: white;
    --color-page-banner-divider: #333;
    --color-overlay: rgba(0, 0, 0, 0.5);
    --color-overlay-shadow: rgba(0, 0, 0, 0.2);
    --color-content-overlay: rgba(0, 0, 0, 0.7);
    --color-content-overlay-mobile: rgba(0, 0, 0, 0.7);
    --color-warning-indicator: #ffb018;
    --color-search-background: #222;
    --color-search-foreground: #95a0a6;
    --color-search-hover-background: #333;
    --color-search-focused-background: #222;
    --color-search-drawer-background: #101010;
    --color-search-drawer-focused-background: #222;
    --color-search-drawer-border: #333;
    --color-search-drawer-section-divider: #333;
    --color-search-result-more-focused: #95a0a6;
    --color-search-result-tags: #95a0a6;
    --color-search-result-none-icon: #c8d1d5;
    --color-search-result-placeholder: #eff4f6;
    --color-search-placeholder: #c8d1d5;
    --color-search-clear: #c8d1d5;
    --color-instrument-icon-background: #222;
    --color-chart-text: white;
    --color-chart-text-active: #000;
    --color-chart-text-active-background: black;
    --color-chart-plot-line: #555;
    --color-chart-positive-performance-foreground: #36df77;
    --color-chart-positive-performance-background: #101010;
    --color-chart-negative-performance-foreground: #ff5e4c;
    --color-chart-negative-performance-background: #101010;
    --color-chart-reference-label-background: #eff4f6;
    --color-chart-reference-label-text: #000;
    --color-chart-label-positive-background: #101010;
    --color-chart-label-negative-background: #101010;
    --color-chart-hover-label-background: white;
    --color-chart-label-border: #333;
    --color-chart-dot-stroke: #fff;
    --color-button-link-color: #009dff;
    --color-button-link-color-active: #0389e0;
    --color-button-link-color-disabled: #80ceff;
    --color-button-primary-background: #009dff;
    --color-button-primary-background-disabled: #80ceff;
    --color-button-primary-background-active: #3c87d9;
    --color-button-primary-text: #000;
    --color-button-primary-shadow: rgba(0, 0, 0, 0.1);
    --color-button-secondary-background: #ccc;
    --color-button-secondary-background-hover: #aaa;
    --color-button-secondary-background-active: #888;
    --color-button-secondary-text: #000;
    --color-button-secondary-text-disabled: rgba(0, 0, 0, 0.16);
    --color-button-secondary-loading: #9c9ea3;
    --color-button-primary-positive-background: #36df77;
    --color-button-primary-positive-background-disabled: #007d2f;
    --color-button-primary-positive-background-active: #1cb155;
    --color-button-primary-negative-background: #ff5e4c;
    --color-button-primary-negative-background-disabled: #660a00;
    --color-button-primary-negative-background-active: #c53e2e;
    --color-button-secondary-positive: #22d466;
    --color-button-secondary-positive-disabled: #90e9b2;
    --color-button-secondary-positive-background: #222;
    --color-button-secondary-positive-background-hover: #333;
    --color-button-secondary-positive-background-active: #444;
    --color-button-secondary-negative: #ff5e4c;
    --color-button-secondary-negative-disabled: #f5a49b;
    --color-button-secondary-negative-background: #fce8e6;
    --color-button-secondary-negative-background-hover: #fbdad7;
    --color-button-secondary-negative-background-active: #f9ccc7;
    --color-button-destructive-background: #fce8e6;
    --color-button-destructive-background-hover: #fbdad7;
    --color-button-destructive-background-active: #f9ccc7;
    --color-button-destructive-text: #eb4a38;
    --color-button-destructive-text-disabled: #f5a49b;
    --color-accent-button-background: #000;
    --color-accent-button-background-disabled: #c8d1d5;
    --color-accent-button-text: #fff;
    --color-switch-button-text: #95a0a6;
    --color-switch-button-text-active: #000;
    --color-switch-button-background-active: #eff4f6;
    --color-tag-text: white;
    --color-tag-background: #333;
    --color-section-divider: #333;
    --color-section-disclaimer: #8090a0;
    --color-description-title: #95a0a6;
    --color-range-slider-background: #333;
    --color-table-column-header: white;
    --color-table-column-header-background: #333;
    --color-table-border: #333;
    --color-table-row-hover: #444;
    --color-outline: #000;
    --color-positive-performance: #36df77;
    --color-negative-performance: #ff5e4c;
    --color-list-item-background: #fff;
    --color-list-item-background-hover: #333;
    --color-list-item-background-active: #444;
    --color-list-item-selected-background: #222;
    --color-list-item-selected-background-hover: #333;
    --color-list-item-selected-background-active: #444;
    --color-list-item-disabled-text: #b8bdc0;
    --color-tab-active: #fff;
    --color-tab-default: #95a0a6;
    --color-tab-disabled: #444;
    --color-tab-hover: #c8d1d5;
    --color-tab-focus: #c8d1d5;
    --color-tab-item-count: #95a0a6;
    --color-button-hover: #95a0a6;
    --color-stock-isin-number: #95a0a6;
    --color-side-modal-background: #222;
    --color-side-modal-shadow: rgba(255, 255, 255, 0.05);
    --color-side-modal-heading: white;
    --color-side-modal-subheading: #ddd;
    --color-side-modal-header-separator: #333;
    --color-side-modal-footer: #b8bdc0;
    --color-side-modal-secondary-footer: #83909e;
    --color-side-modal-secondary-footer-background: #333;
    --color-close-icon: white;
    --color-close-button-background: transparent;
    --color-close-button-icon: white;
    --color-filter-area-divider: #333;
    --color-filter-background: #101010;
    --color-filter-count: white;
    --color-filter-count-selected: white;
    --color-filter-scrolled-divider: #f5f8fa;
    --color-filter-show-button-background: #009dff;
    --color-filter-show-button-text: #fff;
    --color-filter-show-button-shadow: #8090a0;
    --color-filter-clear-button-text: #ff5e4c;
    --color-filter-clear-button-background: #444;
    --color-filter-subtitle: #95a0a6;
    --color-filter-toggle-text: #fff;
    --color-filter-toggle-shadow: rgba(0, 0, 0, 0.2);
    --color-filter-toggle-background: #000;
    --color-filter-toggle-selected-background: #009dff;
    --color-filter-selected-indicator-background: #333;
    --color-filter-selected-indicator-text: #009dff;
    --color-filter-modal-header-divider: #333;
    --color-content-section-border: #333;
    --color-content-section-shadow: rgba(255, 255, 255, 0.1);
    --color-dropdown-border: #333;
    --color-dropdown-shadow: rgba(184, 189, 192, 0.2);
    --color-dropdown-button-text: #009dff;
    --color-dropdown-button-primary-background: #333;
    --color-dropdown-list-text: #95a0a6;
    --color-dropdown-list-text-disabled: #c8cdd0;
    --color-dropdown-list-subtitle: #8b8e8f;
    --color-dropdown-list-background: #222;
    --color-dropdown-list-background-hover: #444;
    --color-loading-placeholder: #444;
    --color-alert-info-background-bg: #333;
    --color-alert-info-text: white;
    --color-alert-warning-background-bg: #333;
    --color-alert-warning-icon: #feb800;
    --color-alert-info-icon: #000;
    --color-alert-icon-foreground: white;
    --color-market-executed-exchange: #e5ecef;
    --color-market-executed-checkmark: #36df77;
    --color-market-executed-checkmark-background: #333;
    --color-market-executed-checkmark-border: #333;
    --color-orders-empty-border: #d9dfe4;
    --color-order-background-hover: #333;
    --color-order-background-active: #444;
    --color-order-mode-selector: #009dff;
    --color-order-mode-selector-background: #e8f5fc;
    --color-order-overview-empty-state-input: #333;
    --color-order-overview-empty-state-label: white;
    --color-savings-plan-overview-hint: #8090a0;
    --color-savings-plan-interval-text: #8a9bab;
    --color-savings-plan-interval-background: #f4f4f4;
    --color-savings-plan-button-hover-background: #eef3f5;
    --color-savings-plan-button-active-background: #e6eef1;
    --color-savings-plan-indicator-foreground: #029dfe;
    --color-savings-plan-indicator-warning-foreground: #ffb211;
    --color-savings-plan-indicator-background: #e7ecee;
    --color-savings-plan-indicator-day-number: #000;
    --color-savings-plan-indicator-day-label: #8090a0;
    --color-savings-plan-flow-button-positive-background: #e8fcf0;
    --color-savings-plan-flow-button-positive-icon: #22d466;
    --color-order-details-delete-message: #919699;
    --color-side-modal-message-text: #919699;
    --color-payout-available-amount-text: #95a0a6;
    --color-payout-hint-text: #95a0a6;
    --color-payout-amount-placeholder: #c8d1d5;
    --color-payout-amount-focus-background: #444;
    --color-payout-bank-icon-background: transparent;
    --color-payout-withheld-funds-icon: #c8d1d5;
    --color-payout-divider: #333;
    --color-success-icon: #c8d1d5;
    --color-success-icon-checkmark-background: #333;
    --color-success-icon-checkmark: #22d466;
    --color-success-icon-checkmark-border: #fff;
    --color-prev-step-button-arrow: #8b8e8f;
    --color-tr-account-logo: #fff;
    --color-tr-account-logo-background: transparent;
    --color-checkmark-large: #36df77;
    --color-deposit-text: #95a0a6;
    --color-securities-text: #95a0a6;
    --color-securities-background-icon: #eff4f6;
    --color-download-app-description: #95a0a6;
    --color-input-error: #ff5e4c;
    --color-input-error-background: #333;
    --color-input-success: #36df77;
    --color-input-success-background: #333;
    --color-input-caret: #009dff;
    --color-input-uneditable-text: #222;
    --color-radio-border: #333;
    --color-radio...

Reviews

No reviews yet.