@redocly/portal-legacy-ui/lib/Checkbox.js

Library of legacy portal UI components

"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Checkbox = void 0;
const styled_components_1 = __importDefault(require("styled-components"));
exports.Checkbox = styled_components_1.default.input `
  position: absolute;
  opacity: 0;

  & + label {
    position: relative;
    cursor: pointer;
    padding: 0;
    display: flex;

    div {
      margin-top: 1px;
    }
    p {
      line-height: 1.2;
    }

    &::before {
      content: '';
      margin-right: 10px;
      display: inline-block;
      vertical-align: top;
      width: 18px;
      height: 18px;
      background: var(--checkbox-bg-color);
      border: 1px solid rgba(0, 0, 0, 0.23);
      border-radius: 2px;
      flex-shrink: 0;
    }
  }

  &:focus + label:before {
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
  }

  &:checked + label {
    &::before {
      background: var(--checkbox-checked-bg-color);
    }
    &::after {
      content: '';
      position: absolute;
      left: 5px;
      top: 10px;
      background: var(--checkbox-bg-color);
      width: 2px;
      height: 2px;
      box-shadow:
        2px 0 0 white,
        4px 0 0 white,
        4px -2px 0 white,
        4px -4px 0 white,
        4px -6px 0 white,
        4px -8px 0 white;
      transform: rotate(45deg);
    }
  }

  &:disabled + label {
    color: #b8b8b8;
    cursor: auto;
    &::before {
      box-shadow: none;
      background: #ddd;
    }
  }
`;
//# sourceMappingURL=Checkbox.js.map