jaywcjlove / Magic Input
CSS3 Styles for Checkbox and Radio Button inputs look prettier. with only one element.
Stars: ✭ 81
Projects that are alternatives of or similar to Magic Input
Multipicker
Form styling plugin for jQuery
Stars: ✭ 90 (+11.11%)
Mutual labels: checkbox, radio-buttons
Pretty Checkbox Vue
Quickly integrate pretty checkbox components with Vue.js
Stars: ✭ 240 (+196.3%)
Mutual labels: checkbox, radio-buttons
Selectionlist
Simple single-selection or multiple-selection checklist, based on UITableView
Stars: ✭ 93 (+14.81%)
Mutual labels: checkbox, radio-buttons
Form Js
Easily create web forms. Supports Meteor, AngularJS, React, Polymer and any CSS library, e.g. Bootstrap.
Stars: ✭ 9 (-88.89%)
Mutual labels: checkbox, radio-buttons
Examples Qt
Shows how to use Qt widgets only by programming code (c++17).
Stars: ✭ 38 (-53.09%)
Mutual labels: checkbox, radio-buttons
Xamarin.forms.inputkit
CheckBox, Radio Button, Labeled Slider, Dropdowns etc.
Stars: ✭ 372 (+359.26%)
Mutual labels: checkbox, radio-buttons
React Menu
React component for building accessible menu, dropdown, submenu, context menu and more.
Stars: ✭ 237 (+192.59%)
Mutual labels: checkbox, radio-buttons
Pretty Checkbox
A pure CSS library to beautify checkbox and radio buttons.
Stars: ✭ 1,708 (+2008.64%)
Mutual labels: checkbox, radio-buttons
pretty-checkbox-react
A tiny react/preact wrapper around pretty-checkbox
Stars: ✭ 35 (-56.79%)
Mutual labels: checkbox, radio-buttons
LC-switch
Superlight vanilla javascript plugin improving forms look and functionality
Stars: ✭ 31 (-61.73%)
Mutual labels: checkbox, radio-buttons
Examples wxWidgets
Shows how to use wxWidgets controls only by programming code (c++17).
Stars: ✭ 116 (+43.21%)
Mutual labels: checkbox, radio-buttons
Examples Win32
Shows how to use Win32 controls by programming code (c++17).
Stars: ✭ 22 (-72.84%)
Mutual labels: checkbox, radio-buttons
Examples Gtkmm
Shows how to use Gtkmm controls by programming code (c++17).
Stars: ✭ 23 (-71.6%)
Mutual labels: checkbox, radio-buttons
Lthradiobutton
A radio button with a pretty animation
Stars: ✭ 303 (+274.07%)
Mutual labels: checkbox, radio-buttons
React Native Radio Buttons
[DEPRECATED] A Radio-button like logic wrapper for React Native
Stars: ✭ 418 (+416.05%)
Mutual labels: radio-buttons
Quicktableviewcontroller
A simple way to create a UITableView for settings in Swift.
Stars: ✭ 417 (+414.81%)
Mutual labels: radio-buttons
Nb Choices
Angular wrapper for choices.js, vanilla, lightweight, configurable select box/text input plugin
Stars: ✭ 32 (-60.49%)
Mutual labels: checkbox
Inquirer Checkbox Plus Prompt
Checkbox with autocomplete and other additions for Inquirer
Stars: ✭ 25 (-69.14%)
Mutual labels: checkbox
Segmentedbutton
Segmented Control with animation for Android API 12+
Stars: ✭ 352 (+334.57%)
Mutual labels: radio-buttons
Togglebuttongroup
A group of flowable toggle buttons, with multiple / single selection support and button customization.
Stars: ✭ 343 (+323.46%)
Mutual labels: radio-buttons
magic-input
CSS3 Styles for Checkbox and Radio Button inputs look prettier. with only one element. Live demo
Usage
$ npm install magic-input
Include dist/magic-input.css or dist/magic-input.min.css in your html. If your use Stylus use magic-input.styl
import 'magic-input/dist/magic-input.min.css';
// or
import 'magic-input/lib/magic-input.styl';
Or manually download and link magic-input in your HTML, It can also be downloaded via UNPKG:
<link rel="stylesheet" type="text/css" href="https://unpkg.com/magic-input/dist/magic-input.min.css">
Checkbox iPhone Style
<input type="checkbox" class="mgc-switch mgc-sm" checked />
<input type="checkbox" class="mgc-switch" />
<input type="checkbox" class="mgc-switch mgc-lg" checked />
Checkbox
<input type="checkbox" class="mgc" checked/> Default
<input type="checkbox" class="mgc mgc-primary" checked /> Primary
<input type="checkbox" class="mgc mgc-success" /> Success
<input type="checkbox" class="mgc mgc-info" checked /> Info
<input type="checkbox" class="mgc mgc-warning" checked /> Warning
<input type="checkbox" class="mgc mgc-danger" checked /> Danger
Radios
<input type="radio" name="radio3" class="mgr mgr-sm"/> Default
<input type="radio" name="radio3" class="mgr mgr-primary" /> Primary
<input type="radio" name="radio3" class="mgr mgr-success mgr-lg" checked/> Success
<input type="radio" name="radio3" class="mgr mgr-info mgr-sm" /> Info
<input type="radio" name="radio3" class="mgr mgr-warning" /> Warning
<input type="radio" name="radio3" class="mgr mgr-danger mgr-lg" /> Danger
Sizing Class
sm for small , lg for large
For Checkbox
mgc-sm mgc-lg
For Radio Button
mgr-sm mgr-lg
Colorize Class
For Checkbox
mgc-primary mgc-info mgc-success mgc-warning mgc-danger
For Radio Button
mgr-primary mgr-info mgr-success mgr-warning mgr-danger
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].