Add focus class which mimics built-in focus

qt/aqt/reviewer.py

@@ -575,7 +575,7 @@ time = %(time)d;
     def _showAnswerButton(self) -> None:
         middle = """
 <span class=stattxt>%s</span><br>
-<button title="%s" id=ansbut onclick='pycmd("ans");'>%s</button>""" % (
+<button title="%s" id="ansbut" class="focus" onclick='pycmd("ans");'>%s</button>""" % (
             self._remaining(),
             _("Shortcut key: %s") % _("Space"),
             _("Show Answer"),
@@ -644,7 +644,7 @@ time = %(time)d;
 
         def but(i, label):
             if i == default:
-                extra = "id=defease"
+                extra = """id="defease" class="focus" """
             else:
                 extra = ""
             due = self._buttonTime(i)

qt/ts/scss/reviewer-bottom.scss

@@ -33,7 +33,17 @@ button {
     white-space: nowrap;
 }
 
-#ansbut { margin-bottom: 1em; }
+#ansbut {
+    margin-bottom: 1em;
+}
+
+.focus {
+    outline: 5px auto rgba(0, 103, 244, 0.247);
+
+    &:focus {
+        outline-color: rgba(92, 160, 255, 0.247);
+    }
+}
 
 .nobold {
     font-weight: normal;

qt/ts/src/reviewer-bottom.ts

@@ -36,14 +36,12 @@ let updateTime = function () {
 function showQuestion(txt, maxTime_) {
     // much faster than jquery's .html()
     $("#middle")[0].innerHTML = txt;
-    $("#ansbut").focus();
     time = 0;
     maxTime = maxTime_;
 }
 
 function showAnswer(txt) {
     $("#middle")[0].innerHTML = txt;
-    $("#defease").focus();
 }
 
 function selectedAnswerButton() {