vega-frontend-monorepo/libs/tailwindcss-config/src/vega-custom-classes-lite.js
macqbat 6c976a0da3
feat: [console-lite] - trading - order review (#842)
* feat: [console-lite] - trading - order review

* feat: [console-lite] - trading - order review - fix margin calcs

* feat: [console-lite] - add order margin calcs

* feat: [console-lite] - add order margin calcs - improve margin calcs

* feat: [console-lite] - add order margin calcs - add int test

* feat: [console-lite] - add order margin calcs - improve int test

Co-authored-by: maciek <maciek@vegaprotocol.io>
2022-07-27 18:09:27 +02:00

94 lines
2.4 KiB
JavaScript

const plugin = require('tailwindcss/plugin');
const theme = require('./theme-lite');
const vegaCustomClassesLite = plugin(function ({ addUtilities }) {
addUtilities({
'.input-border': {
borderWidth: '0',
},
'.input-border-dark': {
borderWidth: '0',
},
'.shadow-input': {
boxShadow: 'none',
},
'.percent-change-up::before': {
content: ' ',
display: 'block',
borderLeft: '4px solid transparent',
borderRight: '4px solid transparent',
borderBottom: '4px solid',
marginBottom: '11px',
marginRight: '5px',
},
'.percent-change-down::before': {
content: ' ',
display: 'block',
borderLeft: '4px solid transparent',
borderRight: '4px solid transparent',
borderTop: '4px solid',
marginTop: '11px',
marginRight: '5px',
},
'.percent-change-unchanged::before': {
content: ' ',
width: '4px',
height: '4px',
borderRadius: '50%',
backgroundColor: theme.colors.black[10],
marginTop: '10px',
marginRight: '5px',
},
'.buyButton': {
textTransform: 'uppercase',
textDecoration: 'none',
backgroundColor: 'rgba(0, 143, 74, 0.1)',
border: `1px solid ${theme.colors.darkerGreen}`,
color: theme.colors.darkerGreen,
'&:hover': {
backgroundColor: theme.colors.darkerGreen,
color: theme.colors.white.DEFAULT,
},
'&.selected': {
backgroundColor: theme.colors.darkerGreen,
color: theme.colors.white.DEFAULT,
},
},
'.buyButtonDark': {
color: theme.colors.darkerGreen,
'&:hover': {
color: theme.colors.black.DEFAULT,
},
'&.selected': {
color: theme.colors.black.DEFAULT,
},
},
'.sellButton': {
textTransform: 'uppercase',
textDecoration: 'none',
backgroundColor: 'rgba(255, 8, 126, 0.1)',
border: `1px solid ${theme.colors.pink}`,
color: theme.colors.pink,
'&:hover': {
color: theme.colors.white.DEFAULT,
backgroundColor: theme.colors.pink,
},
'&.selected': {
backgroundColor: theme.colors.pink,
color: theme.colors.white.DEFAULT,
},
},
'.sellButtonDark': {
color: theme.colors.pink,
'&:hover': {
color: theme.colors.black.DEFAULT,
},
'&.selected': {
color: theme.colors.black.DEFAULT,
},
},
});
});
module.exports = vegaCustomClassesLite;