akai-tools/readest
2
0
Fork 0
forked from akai/readest
Code Pull Requests Activity

fix(layout): fixed line clamp for config items on small screens (#2792)

Browse Source
This commit is contained in:
Huang Xin
2025-12-26 12:05:37 +08:00
committed by GitHub
parent 77037c8adb
commit 12d284cd22
2 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/readest-app/src/components/settings/color/ThemeColorSelector.tsx
+4 -4
View File
@@ -42,7 +42,7 @@ const ThemeColorSelector: React.FC<ThemeColorSelectorProps> = ({
}
e.stopPropagation();
}}
className={`relative flex cursor-pointer flex-col items-center justify-center rounded-lg p-4 shadow-md ${
className={`relative flex cursor-pointer flex-col items-center justify-center rounded-lg px-2 py-4 shadow-md ${
themeColor === name ? 'ring-2 ring-indigo-500 ring-offset-2' : ''
}`}
style={{
@@ -64,7 +64,7 @@ const ThemeColorSelector: React.FC<ThemeColorSelectorProps> = ({
) : (
<MdRadioButtonUnchecked size={iconSize24} />
)}
<span>{_(label)}</span>
<span className='max-w-full truncate'>{_(label)}</span>
{isCustomizale && themeColor === name && (
<button onClick={() => onEditTheme(name)}>
<CgColorPicker size={iconSize16} className='absolute right-2 top-2' />
@@ -73,11 +73,11 @@ const ThemeColorSelector: React.FC<ThemeColorSelectorProps> = ({
</button>
))}
<button
className='relative flex cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed p-4 shadow-md'
className='relative flex cursor-pointer flex-col items-center justify-center rounded-lg border border-dashed px-2 py-4 shadow-md'
onClick={onCreateTheme}
>
<PiPlus size={iconSize24} />
<span>{_('Custom')}</span>
<span className='max-w-full truncate'>{_('Custom')}</span>
</button>
</div>
</div>
apps/readest-app/src/styles/globals.css
+4
View File
@@ -251,6 +251,10 @@ foliate-fxl {
@apply hover:bg-base-100/50;
}
.config-item > span {
@apply line-clamp-2;
}
.collapse-arrow > .collapse-title:after {
top: var(--top-override, default-value);
inset-inline-end: var(--end-override, default-value);