vega-frontend-monorepo/apps/trading/pages/styles.css
m.ray bbdc64582a
feat(#2465): vega-pink across frontend-monorepo (#2476)
* feat(#2465): change red to vega pink

* feat(#2465): change red to vega pink part 2

* fix: update vega.red to vega.pink

* feat: color the charts

* feat: color the charts

* feat: color the charts

* fix: use dark pink and green

* fix: use dark pink and green

* feat(#2467): color long/short toggle and place order button

* fix: colors wick showing within candle

* fix: remove opacity from chart

* fix: use vega dark pink and green for vol cell

* fix: toggle and button colors

* feat(#2465): toggle peer checked text white

* fix: add liquidity supplied gap-2 in tooltip data grid

* fix: add indicator temporarily

* chore: update colors

* chore: update from x-dark to vega-x

* fix: rename symbols

* chore: update sell candles to only use stroke as they are solidly filled

* fix: remove use state

* fix: remove network account types

Co-authored-by: Matthew Russell <mattrussell36@gmail.com>
2023-01-06 16:58:55 +00:00

59 lines
1.8 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
html,
body,
#__next {
@apply h-full;
}
/* Styles for allotment */
html {
--focus-border: theme('colors.vega.pink');
--separator-border: theme('colors.neutral.300');
--pennant-color-danger: theme('colors.vega.pink');
}
html.dark {
--focus-border: theme('colors.vega.yellow');
--separator-border: theme('colors.neutral.600');
}
.border-default {
@apply border-neutral-300 dark:border-neutral-600;
}
/* Styles for charts */
html [data-theme='dark'] {
--pennant-color-danger: theme('colors.vega.pink');
/* candles */
--pennant-color-buy-fill: theme('colors.vega.green-data-dark');
--pennant-color-buy-stroke: theme('colors.vega.green');
/* sell candles only use stroke as the candle is solid (without border) */
--pennant-color-sell-stroke: theme('colors.vega.pink');
/* depth chart */
--pennant-color-depth-buy-fill: theme('colors.vega.green-data-dark');
--pennant-color-depth-buy-stroke: theme('colors.vega.green');
--pennant-color-depth-sell-fill: theme('colors.vega.pink-data-dark');
--pennant-color-depth-sell-stroke: theme('colors.vega.pink');
}
html [data-theme='light'] {
--pennant-color-danger: theme('colors.vega.pink');
/* candles */
--pennant-color-buy-fill: theme('colors.vega.green-data-light');
--pennant-color-buy-stroke: theme('colors.vega.green-dark');
/* sell candles only use stroke as the candle is solid (without border) */
--pennant-color-sell-stroke: theme('colors.vega.pink-data-light');
/* depth chart */
--pennant-color-depth-buy-fill: theme('colors.vega.green-data-light');
--pennant-color-depth-buy-stroke: theme('colors.vega.green-dark');
--pennant-color-depth-sell-fill: theme('colors.vega.pink-data-light');
--pennant-color-depth-sell-stroke: theme('colors.vega.pink-dark');
}