"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const view_container_1 = require("view-container");
const Link_1 = require("atoms/Link");
const IconsListWrapper = view_container_1.styled.ul `
  position: relative;
  list-style: none;
  margin: 0;
  padding: $spacing-small 0 0 0;
  display: flex;
  align-items: inherit;
  flex-direction: row;
`;
exports.IconsListWrapper = IconsListWrapper;
const IconListPanel = view_container_1.styled.li.attrs({
    className: 'social-icons',
}) `
  position: relative;
  display: inline-flex;
`;
exports.IconListPanel = IconListPanel;
const IconLink = view_container_1.styled.withComponent(Link_1.Link).attrs({
    'data-qa': 'qa-social-media'
}) `
  position: relative;
  width: rem(48);
  height: rem(48);
  padding: 6px;
  margin-right: $spacing;
  cursor: pointer;

  ${props => props.bgColor !== '' &&
    view_container_1.styled.css `
      background: ${props.bgColor};
    `};

  svg {
    position: relative;
    width: 100%;
    height: 100%;
    fill: ${props => (props.fillColor !== '' ? props.fillColor : 'black')};
  }
`;
exports.IconLink = IconLink;
//# sourceMappingURL=styled.js.map