discourse/app/assets/stylesheets/wcag.scss

// Overrides for WCAG color schemes only

// Global

::placeholder {
  color: var(--primary-medium);
  opacity: 1;
}

:root {
  --bronze: #d38f42 !important;
}

html.discourse-no-touch {
  .btn-default:not(.btn-flat, .btn-danger, .btn-primary),
  .btn-icon:not(.btn-flat, .btn-danger, .btn-primary) {
    &.btn-default {
      .d-icon {
        color: var(--primary-medium);
      }
    }
    &:hover,
    &.btn-hover,
    &:focus {
      .d-icon {
        color: var(--secondary);
      }
    }
  }
  .btn-primary .d-icon {
    color: var(--secondary);
  }
  .btn-icon.ok,
  .btn-icon.cancel,
  .btn-danger:not(.btn-flat) {
    .d-icon {
      color: var(--secondary);
    }
  }
  .btn-flat.delete.d-hover {
    background: var(--danger);
  }

  .select-kit.single-select .select-kit-header:focus {
    border-color: var(--primary-medium);
  }
}

html {
  // html parent adds some additional specificity to override core styles
  .nav-pills > li > a:not(.active):hover {
    background: var(--tertiary-low);
    color: var(--primary);
  }

  // Composer
  #reply-control .reply-to .reply-details .d-icon {
    opacity: 1;
    color: var(--primary-low-mid);
  }

  .d-editor-button-bar {
    .btn-icon.btn-default .d-icon {
      color: var(--primary-low-mid);
      .discourse-no-touch & {
        &:hover {
          color: var(--secondary);
        }
      }
    }
    .btn-icon:not(.btn-flat, .btn-danger, .btn-primary):focus {
      .d-icon {
        color: currentColor;
      }
    }
  }

  // Site header

  .menu-panel li a.widget-link:hover,
  .menu-panel li a.widget-link:focus,
  .menu-panel li.heading a.widget-link:hover,
  .menu-panel li.heading a.widget-link:focus {
    color: var(--primary);
    background-color: var(--highlight-medium);
    .d-icon {
      color: var(--primary);
    }
  }

  .menu-panel .panel-body-bottom .btn:hover,
  .menu-panel .panel-body-bottom .btn:focus {
    .d-icon {
      color: var(--primary);
    }
  }

  .d-header-icons .d-icon,
  .header-sidebar-toggle button .d-icon {
    color: var(--primary-low-mid);
  }

  .d-header-icons .unread-notifications {
    background: var(--tertiary);
  }

  .extra-info-wrapper {
    --header_primary-high: var(--header_primary);
  }

  // Topic list

  table th {
    color: var(--primary-high);
  }

  .heatmap-high,
  .heatmap-high a,
  .heatmap-med,
  .heatmap-med a,
  .heatmap-low,
  .heatmap-low a {
    color: var(--primary-medium) !important;
  }

  .badge-notification {
    background: var(--primary-medium);
  }

  .badge-notification.unread-posts {
    background: var(--tertiary);
  }
  .select-kit.dropdown-select-box.period-chooser
    .period-chooser-header
    h2.selected-name
    .top-date-string,
  .select-kit.dropdown-select-box.period-chooser
    .period-chooser-row
    .top-date-string {
    color: var(--primary-high);
  }

  .topic-list .posters a:first-child .avatar.latest:not(.single) {
    box-shadow: 0 0 0 2px var(--tertiary);
  }

  .topic-list .topic-list-item-separator .topic-list-data span {
    color: var(--danger);
  }

  .discourse-tag.box {
    background: var(--primary-very-low);
  }

  // Posts

  .discourse-no-touch .topic-body .actions .fade-out {
    opacity: 1;
  }

  .topic-body .reply-to-tab {
    color: var(--primary-medium);
    .d-icon {
      color: var(--primary-low-mid);
    }
  }

  .timeline-container .topic-timeline {
    .timeline-scrollarea {
      border-color: var(--primary-low-mid);
    }
    .timeline-handle {
      background: var(--primary-low-mid);
    }
  }

  .topic-map h4 {
    color: var(--primary);
  }

  .quote-controls,
  .quote-controls .d-icon {
    color: var(--primary-medium);
  }

  blockquote {
    a,
    a:visited {
      color: var(--tertiary);
    }
  }
  .meta .d-icon + .filename,
  .meta .informations {
    color: var(--secondary);
  }

  #topic-footer-buttons .bookmark.bookmarked:hover .d-icon-bookmark {
    color: var(--secondary);
  }

  .gap {
    color: var(--primary-medium);
  }

  .badge-notification.clicks {
    color: var(--primary-high);
  }

  .topic-map {
    background: transparent;
  }

  // Post controls

  .topic-admin-menu-button-container,
  .timeline-controls {
    .btn .d-icon {
      // admin wrenches
      color: var(--primary-medium);
    }
  }

  nav.post-controls {
    .actions {
      button.create,
      button.create .d-icon {
        color: var(--primary-high-or-secondary-low);
      }
      button {
        &.d-hover,
        &:focus,
        &:active {
          background: var(--primary-medium);
          color: var(--secondary);
          .d-icon {
            color: var(--secondary);
          }
        }

        &.delete.d-hover,
        &.delete:hover,
        &.delete:focus {
          background: var(--danger);
          color: var(--secondary);
          .d-icon {
            color: var(--secondary);
          }
        }
        &.bookmark {
          &.bookmarked {
            .d-icon {
              color: var(--tertiary);
            }
            &.d-hover {
              .d-icon {
                color: var(--tertiary-medium);
              }
            }
          }
        }
      }
      .double-button .button-count {
        color: var(--primary-medium);
      }
      .double-button:hover {
        button,
        .d-icon,
        button.has-like .d-icon {
          color: var(--love);
        }
      }
    }

    .show-replies {
      color: var(--primary-medium);
      &:hover,
      &:focus {
        color: var(--secondary);
        background: var(--primary-medium);
        .d-icon {
          color: var(--secondary);
        }
      }
    }
  }

  // Categories

  .list-cell,
  .table-heading,
  .category-list td,
  .category-list th {
    color: var(--primary-medium);
  }

  .alert.alert-success a {
    color: var(--primary);
    text-decoration: underline;
  }

  .latest-topic-list .table-heading,
  .top-topic-list .table-heading {
    color: var(--primary-medium);
  }

  .latest-topic-list-item .topic-last-activity a,
  .category-list .featured-topic a.last-posted-at,
  .category-list .featured-topic a.last-posted-at:visited {
    color: var(--primary-high-or-secondary-low);
  }

  .category-boxes .description {
    color: var(--primary-med-or-secondary-med);
  }

  // User Preferences
  .user-menu.revamped .quick-access-panel li.unread,
  .user-menu.revamped .quick-access-panel li.pending {
    background-color: var(--tertiary-very-low);
  }

  .user-main .deleted-posts {
    color: var(--primary);
  }

  .user-main .flagged-posts {
    color: dark-light-choose($primary, $secondary);
  }

  .uploaded-image-preview
    .image-upload-controls
    .image-uploader-lightbox-btn
    .d-icon {
    color: var(--primary);
  }

  .settings .setting .setting-value .uploaded-image-preview {
    background-color: var(--primary-very-low);
  }

  // Notifications

  .user-menu.revamped .tabs-list .btn .badge-notification {
    background-color: dark-light-choose($tertiary-high, $tertiary);
  }

  .user-stream .notification.unread {
    background-color: var(--tertiary-very-low);
  }

  .user-stream .time {
    color: var(--primary-very-high);
  }

  // Admin Settings

  .admin-controls {
    .nav-pills > li > a:not(.active):hover {
      background: var(--primary-medium);
      color: var(--secondary);
    }
  }

  .cooked mark,
  .d-editor-preview mark {
    background-color: yellow; // resets to browser default
  }

  .settings .setting.overridden h3:before {
    background-color: var(--tertiary);
  }

  .admin-controls .controls {
    background: var(--primary-very-low);
  }

  // Dashboard

  .user-metrics .table-cell.user-basic .label,
  .user-metrics .table-cell.user-member .label,
  .user-metrics .table-cell.user-leader .label {
    color: dark-light-choose($primary, $secondary);
  }

  .admin-contents.admin-plugins td.version .commit-hash {
    color: var(--primary-medium);
  }

  // Search

  .search-container
    .search-filters
    details.search-advanced-additional-options
    > summary {
    color: var(--highlight-high);
  }

  .chat-notices__notice,
  .chat-notices .chat-retention-reminder {
    background-color: var(--tertiary-very-low);
  }

  // Review

  .reviewable-item .reviewable-meta-data .created-at a {
    color: var(--primary-medium);
  }

  .reviewable-item {
    background: dark-light-choose($primary-very-low, $secondary-very-high);
  }

  .reviewable .status span.approved {
    color: var(--success-hover);
  }
}

// chat

.no-touch
  .chat-messages-container
  .chat-message:hover
  .chat-message-react-btn:hover {
  .d-icon {
    color: var(--primary) !important;
  }
}

// sidebar

.sidebar-wrapper
  .sidebar-sections
  .sidebar-section-link-suffix.icon.unread
  svg {
  color: var(--tertiary);
}