How to use the @govuk-react/constants.MEDIA_QUERIES.PRINT function in @govuk-react/constants

To help you get started, we’ve selected a few @govuk-react/constants examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github govuk-react / govuk-react / packages / lib / src / typography / index.js View on Github external
// Tracking:
// https://github.com/alphagov/govuk-frontend/blob/master/src/helpers/_typography.scss

import {
  FONT_STACK,
  FONT_STACK_PRINT,
  FONT_STACK_TABULAR,
  FONT_WEIGHTS,
  MEDIA_QUERIES,
  TYPOGRAPHY_SCALE,
} from '@govuk-react/constants';
import { BLACK } from 'govuk-colours';

export const textColour = {
  color: BLACK,
  [MEDIA_QUERIES.PRINT]: {
    color: '#000',
  },
};

export const textColor = textColour;

export function common(fontFamily = FONT_STACK) {
  return {
    fontFamily,
    WebkitFontSmoothing: 'antialiased',
    MozOsxFontSmoothing: 'grayscale',
    [MEDIA_QUERIES.PRINT]: {
      fontFamily: FONT_STACK_PRINT,
    },
  };
}
github govuk-react / govuk-react / packages / lib / src / link / index.js View on Github external
':visited': {
    color: LINK_COLOUR,
  },
  ':hover': {
    color: LINK_HOVER_COLOUR,
  },
  ':active': {
    color: LINK_ACTIVE_COLOUR,
  },
  ':focus': {
    color: FOCUS_TEXT_COLOUR,
  },
};

export const printFriendly = {
  [MEDIA_QUERIES.PRINT]: {
    '&[href^="/"], &[href^="http://"], &[href^="https://"]': {
      '&::after': {
        content: '" (" attr(href) ")"',
        fontSize: '90%',
        wordWrap: 'break-word',
      },
    },
  },
};