How to use the @crave/farmblocks-theme.colors.BLUE_CORN function in @crave/farmblocks-theme

To help you get started, we’ve selected a few @crave/farmblocks-theme 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 CraveFood / farmblocks / packages / table / src / styledComponents / Table.js View on Github external
import styled, { css } from "styled-components";
import { transparentize } from "polished";
import { colors } from "@crave/farmblocks-theme";

const hoverBgColor = transparentize(0.94, colors.INDIGO_MILK_CAP);
const hoverChildBgColor = transparentize(0.9, colors.BLUE_CORN);

// Equivalent to GREY_16 over white
// Semi-transparent borders don't work well with colSpan
const borderColor = "#d3dadc";

const border = `1px solid ${borderColor}`;
const borderTop = props =>
  props.selectionHeaderVisible &&
  css`
    border-top: none;
  `;

const stickyHeaderCss = ({ stickyHeader, stickyHeaderTopOffset }) =>
  stickyHeader &&
  css`
    caption > span > div {
github CraveFood / farmblocks / packages / link / src / constants / linkColors.js View on Github external
import linkTypes from "./linkTypes";
import { colors as colorConstants, fontTypes } from "@crave/farmblocks-theme";

export default {
  [linkTypes.PRIMARY]: {
    color: fontTypes.FEATURED,
    hoverColor: colorConstants.BLUE_CORN
  },
  [linkTypes.DISABLED]: {
    color: fontTypes.SUBTLE,
    hoverColor: fontTypes.SUBTLE
  },
  [linkTypes.NEUTRAL]: {
    color: fontTypes.NEUTRAL,
    hoverColor: fontTypes.FEATURED
  },
  [linkTypes.ROW_TITLE]: {
    color: fontTypes.NORMAL,
    hoverColor: colorConstants.BLUE_CORN
  },  
  [linkTypes.WHITE]: {
    color: fontTypes.WHITE,
    hoverColor: colorConstants.WHITE_56
github CraveFood / farmblocks / packages / link / src / constants / linkColors.js View on Github external
export default {
  [linkTypes.PRIMARY]: {
    color: fontTypes.FEATURED,
    hoverColor: colorConstants.BLUE_CORN
  },
  [linkTypes.DISABLED]: {
    color: fontTypes.SUBTLE,
    hoverColor: fontTypes.SUBTLE
  },
  [linkTypes.NEUTRAL]: {
    color: fontTypes.NEUTRAL,
    hoverColor: fontTypes.FEATURED
  },
  [linkTypes.ROW_TITLE]: {
    color: fontTypes.NORMAL,
    hoverColor: colorConstants.BLUE_CORN
  },  
  [linkTypes.WHITE]: {
    color: fontTypes.WHITE,
    hoverColor: colorConstants.WHITE_56
  }
};
github CraveFood / farmblocks / packages / tag / src / components / styledComponent / StyledTag.js View on Github external
import styled, { css } from "styled-components";
import { colors as colorConstants } from "@crave/farmblocks-theme";

import tagTypes from "../../constants/tagTypes";

const rightPadding = props => (props.removable ? "1px" : "8px");

const typeStyles = {
  [tagTypes.SECONDARY]: css`
    background-color: ${colorConstants.INDIGO_MILK_CAP};
    color: white;

    &:hover {
      border-color: ${colorConstants.GREY_32};
      background-color: ${colorConstants.BLUE_CORN};
    }

    &:hover .close-icon,
    &:focus .close-icon {
      color: white;
    }
  `,
  [tagTypes.NEUTRAL]: css`
    background-color: ${colorConstants.SUGAR};
    color: ${colorConstants.OYSTER};

    &:hover {
      background-color: ${colorConstants.GREY_16};
    }
  `,
};
github CraveFood / farmblocks / packages / link / src / constants / hoverColors.js View on Github external
import { colors as colorConstants } from "@crave/farmblocks-theme";

import linkTypes from "./linkTypes";

export default {
  [linkTypes.FEATURED]: colorConstants.BLUE_CORN,
  [linkTypes.NEUTRAL]: colorConstants.INDIGO_MILK_CAP,
  [linkTypes.NORMAL]: colorConstants.BLUE_CORN,
  [linkTypes.WHITE]: colorConstants.WHITE_56,
};
github CraveFood / farmblocks / packages / button / src / constants / colorTypes.js View on Github external
} from "./buttonTypes";

export default {
  [PRIMARY]: {
    color: colorConstants.TANGERINE,
    hoverColor: colorConstants.TANGERINE_2,
  },
  [NEUTRAL]: {
    textColor: colorConstants.OYSTER,
    iconColor: colorConstants.GREY_32,
    textHoverColor: colorConstants.INDIGO_MILK_CAP,
    color: "#FFFFFF",
  },
  [SECONDARY]: {
    color: colorConstants.INDIGO_MILK_CAP,
    hoverColor: colorConstants.BLUE_CORN,
  },
  [POSITIVE]: {
    color: colorConstants.LETTUCE,
    hoverColor: colorConstants.AVOCADO,
  },
  [NEGATIVE]: {
    color: colorConstants.STRAWBERRY,
    hoverColor: colorConstants.TOMATO,
  },
  [CLOSED]: {
    color: colorConstants.GRAPE,
    hoverColor: colorConstants.EGGPLANT,
  },
  [OFF_NEUTRAL]: {
    color: colorConstants.GREY_16,
    hoverColor: colorConstants.INDIGO_MILK_CAP,