Commit 69ecd150 authored by Michael Ochmann's avatar Michael Ochmann
Browse files

added checkbox css toggle

parent 3750e0a6
......@@ -24,4 +24,49 @@ div.subtype-svg\+xml div.filename {
.wp-menu-image img {
width: 20px;
}
.toggleSwitch {
position: relative;
height: 25px;
width: 50px;
display: inline-block;
background: white;
border: solid 1px #ccc;
border-radius: 12px;
}
.toggleSwitch input {
border: none;
background: #005196;
outline: 0 !important;
box-shadow: none !important;
height: 25px;
display: block;
margin: 0 !important;
min-width: 0 !important;
width: 0 !important;
border-radius: 50px;
transition: width 0.2s ease-in-out;
}
.toggleSwitch input:before {
display: none !important;
}
.toggleSwitch input:after {
content: "";
display: block;
width: 25px;
height: 25px;
position: absolute;
top: 0;
left: 0;
background: white;
box-shadow: 0 0 3px rgba(0,0,0,0.6);
border-radius: 50%;
transition: left 0.2s ease-in-out;
}
.toggleSwitch input:checked {
width: 50px !important;
}
.toggleSwitch input:checked:after {
left: 25px;
}
\ No newline at end of file
......@@ -6,6 +6,23 @@
<th>Social Media</th>
<td><input type="text" class="regular-text" /></td>
</tr>
<tr>
<th>Hinweis</th>
<td>
<p class="description">
Der Hinweistext auf der Startseite
</p>
<textarea class="large-text" rows="6"></textarea>
</td>
</tr>
<tr>
<th>Hinweis anzeigen</th>
<td>
<label class="toggleSwitch" for="fsi_notice">
<input type="checkbox" id="fsi_notice" />
</label>
</td>
</tr>
</table>
</form>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment