diff --git a/src/app.css b/src/app.css index 6b630e7b..de602de2 100644 --- a/src/app.css +++ b/src/app.css @@ -2106,7 +2106,7 @@ body > .szh-menu-container { margin-block: 4px; > &:first-child, - li[role='none']:first-child + & { + li[role='none']:not(.szh-menu__header):first-child + & { display: none; } } diff --git a/src/components/icon.jsx b/src/components/icon.jsx index b7633437..469da972 100644 --- a/src/components/icon.jsx +++ b/src/components/icon.jsx @@ -4,6 +4,7 @@ import { useEffect, useRef, useState } from 'preact/hooks'; import { ICONS } from './ICONS'; const SIZES = { + xs: 8, s: 12, m: 16, l: 20, diff --git a/src/components/list-add-edit.jsx b/src/components/list-add-edit.jsx index c8823a36..1251ff04 100644 --- a/src/components/list-add-edit.jsx +++ b/src/components/list-add-edit.jsx @@ -6,6 +6,7 @@ import { addListStore, deleteListStore, updateListStore } from '../utils/lists'; import supports from '../utils/supports'; import Icon from './icon'; +import ListExclusiveBadge from './list-exclusive-badge'; import MenuConfirm from './menu-confirm'; function ListAddEdit({ list, onClose }) { @@ -141,6 +142,7 @@ function ListAddEdit({ list, onClose }) { name="exclusive" disabled={uiState === 'loading'} />{' '} + {' '} Hide posts on this list from Home/Following diff --git a/src/components/list-exclusive-badge.css b/src/components/list-exclusive-badge.css new file mode 100644 index 00000000..edadd2a8 --- /dev/null +++ b/src/components/list-exclusive-badge.css @@ -0,0 +1,9 @@ +.list-exclusive-badge { + box-sizing: content-box; + border: 1px solid; + padding: 1px; + margin: 0 2px 2px; + border-radius: 3px; + vertical-align: middle; + background-color: var(--bg-blur-color); +} diff --git a/src/components/list-exclusive-badge.jsx b/src/components/list-exclusive-badge.jsx new file mode 100644 index 00000000..328ab405 --- /dev/null +++ b/src/components/list-exclusive-badge.jsx @@ -0,0 +1,19 @@ +import './list-exclusive-badge.css'; + +import { useLingui } from '@lingui/react/macro'; + +import Icon from './icon'; + +function ListExclusiveBadge({ insignificant }) { + const { t } = useLingui(); + return ( +