Prevent text blocks from wrapping

This commit is contained in:
Lim Chee Aun 2024-08-14 22:03:53 +08:00
parent b16907dc24
commit f9b676856e
2 changed files with 13 additions and 8 deletions

View file

@ -34,6 +34,11 @@
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
border-bottom: var(--hairline-width) solid var(--outline-color); border-bottom: var(--hairline-width) solid var(--outline-color);
&.block {
flex-direction: column;
align-items: flex-start;
}
} }
#settings-container section > ul > li > div:last-child { #settings-container section > ul > li > div:last-child {
text-align: end; text-align: end;

View file

@ -317,7 +317,7 @@ function Settings({ onClose }) {
</h3> </h3>
<section> <section>
<ul> <ul>
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -329,7 +329,7 @@ function Settings({ onClose }) {
<Trans>Auto refresh timeline posts</Trans> <Trans>Auto refresh timeline posts</Trans>
</label> </label>
</li> </li>
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -341,7 +341,7 @@ function Settings({ onClose }) {
<Trans>Boosts carousel</Trans> <Trans>Boosts carousel</Trans>
</label> </label>
</li> </li>
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -497,7 +497,7 @@ function Settings({ onClose }) {
</div> </div>
</li> </li>
{!!GIPHY_API_KEY && authenticated && ( {!!GIPHY_API_KEY && authenticated && (
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -530,7 +530,7 @@ function Settings({ onClose }) {
</li> </li>
)} )}
{!!IMG_ALT_API_URL && authenticated && ( {!!IMG_ALT_API_URL && authenticated && (
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -567,7 +567,7 @@ function Settings({ onClose }) {
</li> </li>
)} )}
{authenticated && supports('@mastodon/grouped-notifications') && ( {authenticated && supports('@mastodon/grouped-notifications') && (
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -590,7 +590,7 @@ function Settings({ onClose }) {
</li> </li>
)} )}
{authenticated && ( {authenticated && (
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"
@ -626,7 +626,7 @@ function Settings({ onClose }) {
</div> </div>
</li> </li>
)} )}
<li> <li class="block">
<label> <label>
<input <input
type="checkbox" type="checkbox"