♿ Improving accessibility, fixes #279

assets/css/styles.scss

@@ -71,7 +71,7 @@ a {
 
 header,
 footer {
-  & > div {
+  &>div {
     display: flex;
     padding: 16px;
     width: 100%;
@@ -497,8 +497,9 @@ pre {
   resize: vertical;
   text-overflow: ellipsis;
 
-  &:not([readonly]):hover {
-    background-color: var(--bg-dark-color);
+  &:not([readonly]):active,
+  &:not([readonly]):focus {
+    box-shadow: inset 0 0 0 2px var(--fg-light-color);
   }
 }
 
@@ -528,7 +529,7 @@ input[type="checkbox"] {
   display: none;
 
   &,
-  & + label {
+  &+label {
     vertical-align: middle;
     cursor: pointer;
 
@@ -547,7 +548,7 @@ input[type="checkbox"] {
     }
   }
 
-  &:checked + label:before {
+  &:checked+label:before {
     background-color: var(--ac-color);
     border-color: var(--ac-color);
     color: var(--act-color);
@@ -732,7 +733,7 @@ div.tab {
   display: none;
 }
 
-input[type="radio"] + label {
+input[type="radio"]+label {
   padding: 8px 16px;
   border-bottom: 2px solid transparent;
   cursor: pointer;
@@ -743,11 +744,11 @@ input[type="radio"] + label {
   }
 }
 
-input[type="radio"]:checked + label {
+input[type="radio"]:checked+label {
   border-color: var(--fg-color);
 }
 
-input[type="radio"]:checked + label + div.tab {
+input[type="radio"]:checked+label+div.tab {
   display: block;
 }