How to use the @govuk-react/lib.link.styleText function in @govuk-react/lib

To help you get started, we’ve selected a few @govuk-react/lib 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 / components / back-link / src / index.js View on Github external
import React from 'react';
import PropTypes from 'prop-types';
import styled from 'styled-components';
import { BLACK } from 'govuk-colours';
import { SPACING_POINTS } from '@govuk-react/constants';
import { link, shape, spacing, typography } from '@govuk-react/lib';

const Anchor = styled('a')(
  typography.font({ size: 16 }),
  link.common(),
  link.styleText,
  {
    display: 'inline-block',
    position: 'relative',
    // margins here are not responsive, hence why they're not specified using withWhiteSpace
    marginTop: SPACING_POINTS[3],
    marginBottom: SPACING_POINTS[3],
    paddingLeft: '14px',
    borderBottom: `1px solid ${BLACK}`,
    textDecoration: 'none',
    '::before': {
      ...shape.arrow({ direction: 'left', base: 10, height: 6 }),

      content: "''",
      position: 'absolute',
      top: '-1px',
      bottom: '1px',
github govuk-react / govuk-react / components / breadcrumbs / src / atoms / link / index.js View on Github external
import styled from 'styled-components';
import { link } from '@govuk-react/lib';

const Link = styled('a')(link.common(), link.styleText);

export default Link;
github govuk-react / govuk-react / components / breadcrumb / src / atoms / link / index.js View on Github external
import styled from 'styled-components';
import { link } from '@govuk-react/lib';
import { deprecate } from '@govuk-react/hoc';

const Link = styled('a')(link.common(), link.styleText);

Link.name = 'Breadcrumb.Link';

export default deprecate(Link, 'please use the Breadcrumbs.Link component instead');
github govuk-react / govuk-react / components / link / src / index.js View on Github external
  ({ textColour }) => (textColour ? link.styleText : undefined),
  ({ noVisitedState }) => (noVisitedState ? link.styleNoVisitedState : undefined)