Sha256: e0312e2f4732a5482c9f04990401625d49a86808d4ce36574f9f95a75b89be1f
Contents?: true
Size: 1.21 KB
Versions: 9
Compression:
Stored size: 1.21 KB
Contents
// Large hit area
// Radio buttons & checkboxes
// By default, block labels stack vertically
.block-label {
display: block;
float: none;
clear: left;
position: relative;
background: $panel-colour;
border: 1px solid $panel-colour;
padding: (18px $gutter $gutter-half $gutter*1.5);
margin-top: 10px;
margin-bottom: 10px;
cursor: pointer; // Encourage clicking on block labels
@include media(tablet) {
float: left;
margin-top: 5px;
margin-bottom: 5px;
// width: 25%; - Test : check that text within labels will wrap
}
}
.block-label:hover {
border-color: $black;
}
// Position checkbox within label, to allow text to wrap
.block-label input {
position: absolute;
top: 18px;
left: $gutter-half;
cursor: pointer;
}
// Use inline, to sit block labels next to each other
.inline .block-label {
clear: none;
margin-right: $gutter-half;
}
// Only if JavaScript is enabled
// Add focus styles to block labels
.js-enabled .add-focus {
outline: 3px solid $yellow;
}
// Remove focus styles from radio and checkbox inputs
.js-enabled .block-label input:focus {
outline: none;
}
// Add selected state to block labels
.js-enabled .selected {
background: $white;
border-color: $black;
}
Version data entries
9 entries across 9 versions & 1 rubygems