Add a button here to prevent poll height from jumping

Still quite a hidden feature 🤫
This commit is contained in:
Lim Chee Aun 2023-05-02 20:18:45 +08:00
parent 56022f31f0
commit 1ddcb51af5
2 changed files with 59 additions and 44 deletions

View file

@ -87,6 +87,7 @@ export default function Poll({
}} }}
> >
{(showResults && optionsHaveVoteCounts) || voted || expired ? ( {(showResults && optionsHaveVoteCounts) || voted || expired ? (
<>
<div class="poll-options"> <div class="poll-options">
{options.map((option, i) => { {options.map((option, i) => {
const { title, votesCount: optionVotesCount } = option; const { title, votesCount: optionVotesCount } = option;
@ -135,6 +136,18 @@ export default function Poll({
); );
})} })}
</div> </div>
{!expired && !voted && (
<button
class="poll-vote-button plain2"
disabled={uiState === 'loading'}
onClick={() => {
setShowResults(false);
}}
>
<Icon icon="arrow-left" /> Hide results
</button>
)}
</>
) : ( ) : (
<form <form
onSubmit={async (e) => { onSubmit={async (e) => {

View file

@ -1035,11 +1035,13 @@ a.card:is(:hover, :focus) {
} }
.poll-vote-button { .poll-vote-button {
margin: 8px 8px 0 12px; margin: 8px 8px 0 12px;
padding-inline: 24px; /* padding-inline: 24px; */
min-width: 160px;
} }
.poll-meta { .poll-meta {
margin: 8px 16px; margin: 8px 16px;
font-size: 90%; font-size: 90%;
user-select: none;
} }
.poll-option-title { .poll-option-title {
text-shadow: 0 1px var(--bg-color); text-shadow: 0 1px var(--bg-color);