|
@@ -46,8 +46,13 @@ body {
|
|
}
|
|
}
|
|
|
|
|
|
.tool {
|
|
.tool {
|
|
|
|
+ position: relative;
|
|
|
|
+
|
|
input[type="radio"] {
|
|
input[type="radio"] {
|
|
- display: none;
|
|
|
|
|
|
+ position: absolute;
|
|
|
|
+ opacity: 0;
|
|
|
|
+ width: 0;
|
|
|
|
+ height: 0;
|
|
}
|
|
}
|
|
|
|
|
|
input[type="radio"] {
|
|
input[type="radio"] {
|
|
@@ -69,6 +74,9 @@ body {
|
|
&:checked + .toolIcon {
|
|
&:checked + .toolIcon {
|
|
background-color: #bdbebc;
|
|
background-color: #bdbebc;
|
|
}
|
|
}
|
|
|
|
+ &:focus + .toolIcon {
|
|
|
|
+ box-shadow: 0 0 0 2px steelblue;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
@@ -89,6 +97,11 @@ input[type="color"] {
|
|
|
|
|
|
input {
|
|
input {
|
|
margin-right: 5px;
|
|
margin-right: 5px;
|
|
|
|
+
|
|
|
|
+ &:focus {
|
|
|
|
+ outline: transparent;
|
|
|
|
+ box-shadow: 0 0 0 2px steelblue;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
button {
|
|
button {
|
|
@@ -97,7 +110,11 @@ button {
|
|
border-radius: 4px;
|
|
border-radius: 4px;
|
|
margin: 2px 0;
|
|
margin: 2px 0;
|
|
padding: 5px;
|
|
padding: 5px;
|
|
- outline: none;
|
|
|
|
|
|
+ outline: transparent;
|
|
|
|
+
|
|
|
|
+ &:focus {
|
|
|
|
+ box-shadow: 0 0 0 2px steelblue;
|
|
|
|
+ }
|
|
|
|
|
|
&:hover {
|
|
&:hover {
|
|
background-color: #e7e5e5;
|
|
background-color: #e7e5e5;
|