@stokr/components-library/dist/components/Radio/Radio.styles.js

STOKR - Components Library

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Wrapper = exports.Label = exports.Input = void 0;
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _Input = require("../Input/Input.styles");
var _theme = _interopRequireDefault(require("../../styles/theme"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
const Wrapper = exports.Wrapper = _styledComponents.default.div.withConfig({
  displayName: "Radiostyles__Wrapper",
  componentId: "sc-bz07fp-0"
})(["position:relative;display:block;"]);
const Label = exports.Label = (0, _styledComponents.default)(_Input.Label).withConfig({
  displayName: "Radiostyles__Label",
  componentId: "sc-bz07fp-1"
})(["position:relative;top:0;transform:none;font-size:10px;margin-bottom:5px;"]);
const Input = exports.Input = _styledComponents.default.div.withConfig({
  displayName: "Radiostyles__Input",
  componentId: "sc-bz07fp-2"
})(["position:relative;& > input{z-index:-1;position:absolute;top:4px;left:4px;display:block;width:1px;height:0;opacity:0;border:0;& + label{position:relative;display:inline-block;max-width:100%;padding-left:28px;font-family:'Open Sans';font-size:13px;line-height:16px;letter-spacing:0.4px;cursor:pointer;&:before,&:after{content:'';display:block;position:absolute;}&:before{top:0;left:0;width:16px;height:16px;border-radius:8px;border:1px solid #9b9b9b;box-shadow:none;transition:border-color 0.2s;}&:after{top:5px;left:5px;width:6px;height:6px;border-radius:3px;background-color:transparent;}}&:focus + label,&:hover + label{&:before{border-color:", ";}}&:checked + label{&:after{background-color:", ";}}}", ""], props => _theme.default.cPrimary, props => _theme.default.cPrimary, props => props.error && "\n    & > input {\n\n      & + label {\n\n        &:before {\n          border-color: ".concat(_theme.default.cWarning, ";\n        }\n      }\n    }\n  "));