How to override the checkbox predefined classes

[abhicode95]

If I have to provide more space in 'rct-title' class or if I have to change the position of Button having class="rct-collapse rct-collapse-btn" how can we do it.

[Faisal Karim]

@abhicode95 If you're using traditional CSS stylesheets,You might want to use !important in some cases, although it's generally recommended to avoid it if possible.

.rct-title {
    padding-left: 20px !important; /* Provide more space */
}


.rct-collapse.rct-collapse-btn {
    position: relative;
    top: 5px; 
    right: 5px; 
}

If you're using a CSS-in-JS

import styled from 'styled-components';

const CustomCheckboxContainer = styled.div`
  .rct-title {
    padding-left: 20px; /* Provide more space */
  }

  .rct-collapse.rct-collapse-btn {
    position: relative;
    top: 5px;
    right: 5px; 
  }
`;

If you're using a UI library or component that applies these classes, check the library's documentation for recommended ways to customize styles. Some libraries provide props or theming solutions designed to customize the appearance of components without directly overriding class styles.