wpinsites
wpinsites
/ _toggles.scss
Created
July 2, 2017 11:33
Alternate css3 toggles for Gravity Forms checkboxes
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ================================================================================== | |
| // Gravity Forms checkbox switch | |
| // Based on CSS Switches http://callmenick.com/2014/05/13/css-toggle-switch-examples/ | |
| // Variation of original work by https://gist.github.com/digiltd | |
| // 1. Applies toggle to checkbox instead of label to label can be used | |
| // 2. Puts toggles inline with label | |
| // 3. Provides variable for "on" color to integrate with theme | |
| // 4. Optionally overrides Gravity Forms Product Price color with toggle color | |
| // ================================================================================== |
wpinsites
/ _forms.scss
Last active
July 2, 2017 11:20
— forked from digiltd/_forms.scss
css3 toggle switch for gravityforms checkbox
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // ========================================================================== | |
| // Gravity Forms checkbox switch | |
| // CSS Switches http://callmenick.com/2014/05/13/css-toggle-switch-examples/ | |
| // Modified to support theme branding and put toggles inline with checkbox label | |
| // ========================================================================== | |
| $m-toggle__height: 25px; | |
| $m-toggle__border: 2px; | |
| $m-toggle__radius: 12px; | |
| $m-toggle--on: #d54e21; /* <- Change this to fit with your theme */ |