Как настроить стиль флажка с реакцией bootstrap? - PullRequest
Новая
       5

Как настроить стиль флажка с реакцией bootstrap?

0 голосов
/ 10 апреля 2020

Я использую react-bootstrap. Я пытаюсь стилизовать пользовательский флажок, так как кажется, что это возможно. То, это не работает. Я делаю то, что говорит документация .

Это мой код. 

import * as React from "react";
import { t as typy } from 'typy';
import _ from 'lodash';
import { Form, FormCheck } from "react-bootstrap";
import { ErrorMessage } from "formik";

export type Props = {
  isChecked: Boolean,
  changeHandler: Function
}

export const Checkbox = ({
  isChecked,
  changeHandler
}: Props) => {


  return (
    <Form>
  {['checkbox', 'radio'].map((type) => (
    <div key={`custom-${type}`} className="mb-3">
      <Form.Check
        custom
        type={type}
        id={`custom-${type}`}
        label={`Check this custom ${type}`}
      />

      <Form.Check
        custom
        disabled
        type={type}
        label={`disabled ${type}`}
        id={`disabled-custom-${type}`}
      />
    </div>
  ))}
</Form>
  );
};

export default Checkbox;

Это мой css. Я просто хочу посмотреть, применяется ли стиль: 

#custom-checkbox {
   background-color: red;
   width: 10rem;
 }
...