Fix indicator positioning of Reviewer bottom toolbar (#2157)

* Prevent interval indicators from wrapping

* Move indicators inside and relative to their buttons

* Move due indicators into answer buttons
This commit is contained in:
Matthias Metelka 2022-11-02 09:18:21 +01:00 committed by GitHub
parent bf34ac7767
commit 1478801e4a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 16 deletions

View file

@ -31,6 +31,7 @@ button {
min-width: 60px; min-width: 60px;
white-space: nowrap; white-space: nowrap;
margin: 0.5em; margin: 0.5em;
position: relative;
} }
.hitem { .hitem {
@ -50,10 +51,6 @@ button {
font-weight: normal; font-weight: normal;
} }
.stattxt {
white-space: nowrap;
}
#ansbut { #ansbut {
margin-bottom: 1em; margin-bottom: 1em;
} }
@ -65,9 +62,11 @@ button {
.nobold, .nobold,
.stattxt { .stattxt {
position: absolute; position: absolute;
top: -5px; white-space: nowrap;
font-size: medium;
top: -3px;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translate(-50%, -100%);
font-weight: normal; font-weight: normal;
display: inline-block; display: inline-block;
} }

View file

@ -662,13 +662,15 @@ class Reviewer:
<center id=outer> <center id=outer>
<table id=innertable width=100%% cellspacing=0 cellpadding=0> <table id=innertable width=100%% cellspacing=0 cellpadding=0>
<tr> <tr>
<td align=left width=50 valign=top class=stat> <td align=left valign=top class=stat>
<button title="%(editkey)s" onclick="pycmd('edit');">%(edit)s</button></td> <button title="%(editkey)s" onclick="pycmd('edit');">%(edit)s</button></td>
<td align=center valign=top id=middle> <td align=center valign=top id=middle>
</td> </td>
<td width=50 align=right valign=top class=stat><span id=time class=stattxt> <td align=right valign=top class=stat>
</span> <button onclick="pycmd('more');">
<button onclick="pycmd('more');">%(more)s %(downArrow)s</button> %(more)s %(downArrow)s
<span id=time class=stattxt></span>
</button>
</td> </td>
</tr> </tr>
</table> </table>
@ -687,11 +689,10 @@ time = %(time)d;
def _showAnswerButton(self) -> None: def _showAnswerButton(self) -> None:
middle = """ middle = """
<span class=stattxt>{}</span> <button title="{}" id="ansbut" onclick='pycmd("ans");'>{}<span class=stattxt>{}</span></button>""".format(
<button title="{}" id="ansbut" onclick='pycmd("ans");'>{}</button>""".format(
self._remaining(),
tr.actions_shortcut_key(val=tr.studying_space()), tr.actions_shortcut_key(val=tr.studying_space()),
tr.studying_show_answer(), tr.studying_show_answer(),
self._remaining(),
) )
# wrap it in a table so it has the same top margin as the ease buttons # wrap it in a table so it has the same top margin as the ease buttons
middle = ( middle = (
@ -781,14 +782,14 @@ time = %(time)d;
extra = "" extra = ""
due = self._buttonTime(i, v3_labels=labels) due = self._buttonTime(i, v3_labels=labels)
return """ return """
<td align=center>%s<button %s title="%s" data-ease="%s" onclick='pycmd("ease%d");'>\ <td align=center><button %s title="%s" data-ease="%s" onclick='pycmd("ease%d");'>\
%s</button></td>""" % ( %s%s</button></td>""" % (
due,
extra, extra,
tr.actions_shortcut_key(val=i), tr.actions_shortcut_key(val=i),
i, i,
i, i,
label, label,
due,
) )
buf = "<center><table cellpading=0 cellspacing=0><tr>" buf = "<center><table cellpading=0 cellspacing=0><tr>"