pretty_elements.css in Pretty Checkbox Radio 8
/* General styles for all elements. */
.pretty-element {
margin: 5px;
float: left;
}
/* Initial styles for the unselected elements */
.pretty-element label {
display: block;
border: 1px solid #c5c5c5;
background-color: #f6f6f6;
color: #454545;
min-height: 20px;
padding: 2px 13px;
margin: 0;
font-weight: normal;
border-radius: 3px;
}
/* Styles for elements onHover state */
.pretty-element label:hover {
background-color: #ededed;
color: #2b2b2b;
}
/* Styles for elements onChecked state */
.pretty-element input:checked + label {
color: #fff;
background-color: #337ab7;
border-color: #2e6da4;
}
/* Hide default inputs */
.pretty-element input[type="radio"],
.pretty-element input[type="checkbox"] {
display: none;
}
/* Show description below the elements */
.field--widget-options-pretty .description {
clear: both;
}
File
css/pretty_elements.css
View source
- /* General styles for all elements. */
- .pretty-element {
- margin: 5px;
- float: left;
- }
-
- /* Initial styles for the unselected elements */
- .pretty-element label {
- display: block;
- border: 1px solid #c5c5c5;
- background-color: #f6f6f6;
- color: #454545;
- min-height: 20px;
- padding: 2px 13px;
- margin: 0;
- font-weight: normal;
- border-radius: 3px;
- }
-
- /* Styles for elements onHover state */
- .pretty-element label:hover {
- background-color: #ededed;
- color: #2b2b2b;
- }
-
- /* Styles for elements onChecked state */
- .pretty-element input:checked + label {
- color: #fff;
- background-color: #337ab7;
- border-color: #2e6da4;
- }
-
- /* Hide default inputs */
- .pretty-element input[type="radio"],
- .pretty-element input[type="checkbox"] {
- display: none;
- }
-
- /* Show description below the elements */
- .field--widget-options-pretty .description {
- clear: both;
- }