pseudo.js

const container = {
  maxHeight: 600,
  overflowY: 'auto',
  ':before': {
    background: 'linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, rgba(0,0,0,0.1) 100%)',
    content: '""',
    display: 'block',
    height: 12,
    left: 0,
    marginBottom: '-12px',
    position: 'absolute',
    top: 35,
    top: 'var(--header-height)',
    width: '100%',
  },
  ':after': {
    background: 'linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0,0,0,0.1) 100%)',
    bottom: 0,
    content: '""',
    display: 'block',
    height: 12,
    left: 0,
    marginTop: '-12px',
    position: 'absolute',
    width: '100%',
  },
};