// ─────────────────────────────────────────────────────────────────────────────
// import
// ─────────────────────────────────────────────────────────────────────────────

import styled from 'styled-components';

import { Text } from '../primitives';

// ─────────────────────────────────────────────────────────────────────────────
// component
// ─────────────────────────────────────────────────────────────────────────────

export const Label = styled(Text)`
  animation: ${({ animation }) => animation};
`;
Label.defaultProps = {
  as:            'label',
  display:       'block',
  color:         'hsla(var(--hsl-text), 0.75)',
  fontSize:      '1.25rem',
  lineHeight:    '3rem',
  textTransform: 'uppercase',
};

@@ -506,16 +506,17 @@
 on%7D;%0A%60;%0A
+%0A
 Label.de
@@ -578,13 +578,39 @@
    '
-block
+flex',%0A  alignItems:    'center
 ',%0A 
@@ -656,16 +656,16 @@
 0.75)',%0A
+
   fontSi
@@ -688,33 +688,8 @@
 m',%0A
-  lineHeight:    '3rem',%0A
   te

update label styles