A dark theme for the Trade Republic Webapp
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
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...