custom-checkbox-radio-scss
Advanced tools
SCSS based custom checkboxes and radios; a CSS-only solution.
npm i --save custom-checkbox-radio-scss
Depending on your current directory and frontend stack, you'll want something along the lines of one of:
@import "custom-checkbox-radio-scss";
Note, your labels must proceed the inputs and all have suitable name/id/for attributes.
<fieldset>
<legend>Checkboxes</legend>
<p class="checkbox">
<input type="checkbox" name="lorem-1" id="lorem-1" />
<label for="lorem-1">Lorem</label>
</p>
<p class="checkbox">
<input type="checkbox" name="lorem-2" id="lorem-2" />
<label for="lorem-2">Ipsum</label>
</p>
</fieldset>
<fieldset>
<legend>Radios</legend>
<p class="radio">
<input type="radio" name="ipsum" id="ipsum-1" checked />
<label for="ipsum-1">Lorem</label>
</p>
<p class="radio">
<input type="radio" name="ipsum" id="ipsum-2" />
<label for="ipsum-2">Ipsum</label>
</p>
</fieldset>
Written in a non-invasive kinda way, so you can add your own styles to, say, input[type="radio"] + label::after, or simply override the various variables set in the SCSS file.
IE9 +
FAQs
SCSS based custom checkboxes and radios; a no-JS solution.
We found that custom-checkbox-radio-scss demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 0 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Product
Socket's Rubygems ecosystem support is moving from beta to GA, featuring enhanced security scanning to detect supply chain threats beyond traditional CVEs in your Ruby dependencies.
Research
The Socket Research Team investigates a malicious npm package that appears to be an Advcash integration but triggers a reverse shell during payment success, targeting servers handling transactions.
Security Fundamentals
The Socket Threat Research Team uncovers how threat actors weaponize shell techniques across npm, PyPI, and Go ecosystems to maintain persistence and exfiltrate data.