@os-design/website/lib/Footer/FooterContainer.js

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const styled_1 = __importDefault(require("@os-design/styled"));
const utils_1 = require("@os-design/utils");
const core_1 = require("@emotion/core");
const paddingHorizontal_1 = __importDefault(require("../utils/paddingHorizontal"));
const FOOTER_PADDING_VERTICAL_EM = 2.5;
const light = (p) => !p.darkMode && core_1.css `
  background-color: #fafafa;
  border-top: 1px solid ${p.theme.colorBorder};
`;
const darkMode = (p) => p.darkMode && core_1.css `
  background-color: #1a1a1a;
  
  & {
    color: #fff;
  }
  
  // Link styles
  a, a:active, a:focus, a:hover {
    color: #fff;
  }
  a {
    opacity: 0.7;
  }
  a::after {
    background-color: #fff;
  }
  @media (hover: hover) {
    a:active, a:focus, a:hover {
      opacity: 1;
    }
  }
`;
const padding = core_1.css `
  padding-top: ${FOOTER_PADDING_VERTICAL_EM}em;
  padding-bottom: ${FOOTER_PADDING_VERTICAL_EM}em;
  ${paddingHorizontal_1.default};
`;
const responsive = (p) => p.hasNavigation && core_1.css `
  ${utils_1.m.min.md} {
    grid-template-columns: auto 15em;
    grid-template-areas:
      '. logo'
      'navigation company-info';
  }
`;
const FooterContainer = styled_1.default('footer', utils_1.omitProps(['darkMode', 'hasNavigation'])) `
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto;
  grid-template-areas:
    'logo'
    'company-info';
    
  font-size: ${p => p.theme.sizing.small}em;
  
  a {
    margin-bottom: 0.3em;
  }
  
  ${light};
  ${darkMode};
  
  ${padding};
  ${responsive};
  ${utils_1.transition('padding')};
`;
exports.default = FooterContainer;
//# sourceMappingURL=FooterContainer.js.map