Reduce checkbox size

This commit is contained in:
Michele Guerini Rocco 2014-06-25 15:14:09 +02:00
parent 26c7e792a4
commit 0452bf329a

View File

@ -105,7 +105,7 @@ nav {
/* Checkbox /* Checkbox
===============================*/ ===============================*/
.check { .check {
.square(40px); .square(30px);
.transition; .transition;
.border-radius(4px); .border-radius(4px);
position: relative; position: relative;
@ -116,12 +116,12 @@ nav {
&:after { &:after {
.transition; .transition;
position: absolute; position: absolute;
top: 9px; top: 4px;
left: 8px; left: 3px;
content:""; content:"";
background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png'); background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
width: 22px; width: 20px;
height: 22px; height: 20px;
} }
&:checked { &:checked {
@ -131,8 +131,8 @@ nav {
&:checked:after { &:checked:after {
.transition; .transition;
position: absolute; position: absolute;
top: 9px; top: 4px;
left: 6px; left: 2px;
content:""; content:"";
background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png'); background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
background-position:-20px; background-position:-20px;
@ -144,7 +144,7 @@ nav {
/* Circle Checkbox /* Circle Checkbox
===============================*/ ===============================*/
.circles { .circles {
.square(40px); .square(30px);
.transition; .transition;
.border-radius(100px); .border-radius(100px);
position: relative; position: relative;
@ -158,8 +158,8 @@ nav {
.square(22px); .square(22px);
.transition; .transition;
position: absolute; position: absolute;
left: 8px; left: 4px;
top: 9px; top: 4px;
content:""; content:"";
background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png'); background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
background-position:-23px; background-position:-23px;
@ -171,8 +171,8 @@ nav {
.square(22px); .square(22px);
.transition; .transition;
position: absolute; position: absolute;
left: 8px; left: 3px;
top: 9px; top: 4px;
content:""; content:"";
background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png'); background:url('http://static.tumblr.com/upanoab/0hOmmcbuh/tick-sprite.png');
} }