External/5chan
1
0
Fork 0
mirror of https://github.com/bitsocialnet/5chan.git synced 2026-08-03 07:41:04 +02:00
Code Issues Packages Projects Releases Wiki Activity

style(interface settings): add description to each UI setting

Browse Source
This commit is contained in:
Tom (plebeius.eth)
2024-10-31 12:48:01 +01:00
parent 06cbb9639b
commit c6e301af0f
39 changed files with 285 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/settings-modal/interface-settings/interface-settings.module.css
+7 -1
View File
@@ -27,4 +27,10 @@
.setting input[type="checkbox"] {
margin-right: 2px;
}
}
.settingTip {
font-size: 0.85em;
margin: 2px 0 5px 0;
padding-left: 19px;
}
src/components/settings-modal/interface-settings/interface-settings.tsx
+29 -15
View File
@@ -141,21 +141,6 @@ const InterfaceSettings = () => {
<div className={styles.setting}>
{_.capitalize(t('interface_language'))}: <InterfaceLanguage />
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideAvatars} onChange={handleHideAvatarsChange} /> {_.capitalize(t('hide_avatars'))}
</label>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideGoreBoards} onChange={(e) => setHideGoreBoards(e.target.checked)} /> {_.capitalize(t('hide_gore_boards'))}
</label>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideAdultBoards} onChange={(e) => setHideAdultBoards(e.target.checked)} /> {_.capitalize(t('hide_adult_boards'))}
</label>
</div>
<div className={styles.setting}>
<label>
<input
@@ -168,6 +153,35 @@ const InterfaceSettings = () => {
/>
{_.capitalize(t('hide_threads_without_images'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('threads_without_images_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideGoreBoards} onChange={(e) => setHideGoreBoards(e.target.checked)} /> {_.capitalize(t('hide_gore_boards'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('hide_gore_boards_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideAdultBoards} onChange={(e) => setHideAdultBoards(e.target.checked)} /> {_.capitalize(t('hide_adult_boards'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('hide_adult_boards_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input
type='checkbox'
// checked={fitExpandedImagesToScreen} onChange={(e) => setFitExpandedImagesToScreen(e.target.checked)}
/>
{_.capitalize(t('fit_expanded_images_to_screen'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('fit_expanded_images_to_screen_tip'))}</div>
</div>
<div className={styles.setting}>
<label>
<input type='checkbox' checked={hideAvatars} onChange={handleHideAvatarsChange} /> {_.capitalize(t('hide_avatars'))}
</label>
<div className={styles.settingTip}>{_.capitalize(t('hide_avatars_tip'))}</div>
</div>
</div>
);