Skip to content

Overhaul browser extension styling

Warren Gifford requested to merge bext-styling-overhaul into master

Created by: felixfbecker

Overhauls the code-host-specific browser extension styling to not rely on style overrides, but use CSS classes the code host defines. Fixes #3071 (closed). To accomplish this, a couple of shared components had to be changed (e.g. ActionItem) to receive more className props, not apply default class names from Bootstrap, support ARIA and change the DOM structure a bit. The webapp wraps the shared components and applies Bootstrap classnames. The additional class props are settable through the CodeHost interface. I also removed inline styles from the browser extension code. The command palette now always matches the styling of the code host.

I also noticed GitHub Enterprise was not detected properly, fixed. Furthermore there were other inconsistencies in code host detection in inject.tsx caused by code duplication. I also noticed that GitHub command palette was broken, fixes #3238 (closed). I also fixed the weird styling of the "configure sourcegraph" button by removing the inline styles #3067 (closed).

Test plan: I tested the looks of command palette, hovers, toolbar buttons (normal, pressed, loading states), "view repo" button work and look good in

  • Bitbucket
  • Gitlab
  • GitHub
  • GHE
  • Phabricator
  • Sourcegraph

Merge request reports