vega-frontend-monorepo/libs/tailwindcss-config/src/theme-lite.js
Matthew Russell c259622848
feat(#927) design update (#1201)
* feat: create new buttons

* feat: update anchor and button link styles

* feat: add icon support

* feat: fix full width with icon

* feat: convert invalid button props to use new props

* feat: tidy up explorer

* feat: more tidy up for token and trading

* feat: move styles to css file using @apply

* chore: remove css with @apply as its not working in apps

* fix: deposit form button

* feat: use default tailwind config, start on forms

* feat: fixup trade grid styles

* feat: form styles

* feat: styles for order book and tables

* feat: make key management use dropdown

* feat: update various components

* feat: tidy up wallet section

* feat: token tidy up

* feat: token governance styles

* Feat/927: Dialog styling

* feat: token styles

* feat: add font familys

* feat: change token borders to be softer

* feat: console-lite changes to support new theme

* Feat/927: Centered key-value-table.tsx spacing

* Feat/927: Tweak to Explorer site border colours to be inline with trading

* Feat/927: Tweak to Explorer header

* Feat/927: Theme switcher icon colours

* Feat/927: Fix for Explorer block data styling

* feat: fix tests, add status footer and change logos

* feat: render both theme icons to avoid hydration error

* chore: run migrations for project

* fix: tailwindconfig build to work with new next version

* feat: use document page for next as per documentation

* chore: update build targets to use development mode when serving

* fix: console-lite default text colors

* chore: fix tooltip text break, change submit button

* feat: adjust console-lite styles to work with tabs

* feat: add bespoke dialog for console-lite market-selector

* Feat/927: Theme switcher now has prop for fixed bg colour

* Feat/927: Font size and border radius tweak for toggles

* Feat/927: Cleaned up trade-grid.tsx spacing

* feat: responsive styles for market header and nav

* feat: update designs for market popover

* fix: nav active state

* chore: allow classname to be passed to button

* Feat/927: Fix Token width on desktop (was overflowing)

* Feat/927: Fix token header h1 from wrapping

* Feat/927: Tweak for claim-flow.tsx

* fix: connect button test

* Feat/927: Proposals list styling polish

* Feat/927: key-value-table.tsx spacing tweak

* feat: add copy button to kp dropdown

* Feat/927: Removing old theme params and uses

* Feat/927: Removing old theme params and uses, documenting the now used otb sizes

* feat: use key val table in asset dialog

* feat: align tooltip styles

* fix: orderbook grid alignment

* chore: linting

* fix: dialog sizing in medium mode, node switcher styles

* chore: remove unused color classes

* feat: update radio and checkbox designs

* feat: updates to storybook

* feat: update design system stories

* chore: stories update

* chore: rename resize panels and tidy

* feat: fix checkbox tick

* fix: add poyfills for jest in trading test setup

* chore: fix checkbox tests

* chore: fix tests

* chore: fix tests again

* chore: revert token wallet name test

* fix: tooltip tests on console-lite

* fix: wallet dropdown test

Co-authored-by: sam-keen <samuel.kleinmann@gmail.com>
2022-08-30 21:35:46 -07:00

56 lines
1.3 KiB
JavaScript

const defaultTheme = require('tailwindcss/defaultTheme');
const colors = require('tailwindcss/colors');
const theme = require('./theme');
module.exports = {
...theme,
colors: {
...theme.colors,
...colors,
deemphasise: '#8A9BA8',
offBlack: '#252525',
midGrey: '#828282',
borderGrey: '#4f4f4f',
lightGrey: '#F2F2F2',
lightGreen: '#00f780',
darkerGreen: '#008f4A',
yellow: '#DFFF0B',
mint: '#00F780',
pink: '#FF077F',
blue: '#2E6DE5',
'white-normal': '#F5F8FA',
vega: {
...theme.colors.vega,
'highlight-item': '#000',
'highlight-item-dark': '#fff',
},
'dropdown-bg-dark': colors.neutral[100],
lite: {
black: '#080808',
},
},
fontSize: {
...defaultTheme.fontSize,
capMenu: ['15px', { lineHeight: '24px', letterSpacing: '-0.01em' }],
market: ['15px', { lineHeight: '24px' }],
'ui-small': ['12px', { lineHeight: '14px' }],
'ui-tiny': ['10px', { lineHeight: '18px' }],
},
boxShadow: {
'inset-black': '',
'inset-white': '',
input: 'none',
'input-focus': 'none',
'input-dark': 'none',
'input-focus-dark': 'none',
'input-focus-error': 'none',
'input-focus-error-dark': 'none',
},
extend: {
transitionProperty: {
height: 'height',
'max-height': 'max-height',
},
},
};