MrUnknownDE/panel
1
0
Fork 0
mirror of https://github.com/MrUnknownDE/panel.git synced 2026-04-18 14:23:44 +02:00
Code Issues Packages Projects Releases Wiki Activity

admin(ui): fix descriptions overflowing vertically

Browse Source
This commit is contained in:
Matthew Penner
2021-01-10 11:34:14 -07:00
parent 1800800308
commit 52b2463281
28 changed files with 107 additions and 85 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
resources/scripts/components/admin/mounts/MountEditContainer.tsx
View File

@@ -187,7 +187,7 @@ const MountEditContainer = () => {
return (
<AdminContentBlock title={'Mount - ' + mount.name}>
<div css={tw`w-full flex flex-row items-center mb-8`}>
<div css={tw`flex flex-col`}>
<div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
<h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>{mount.name}</h2>
{
(mount.description || '').length < 1 ?
@@ -195,7 +195,7 @@ const MountEditContainer = () => {
<span css={tw`italic`}>No description</span>
</p>
:
<p css={tw`text-base text-neutral-400`}>{mount.description}</p>
<p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{mount.description}</p>
}
</div>
</div>

12
resources/scripts/components/admin/mounts/MountsContainer.tsx
View File

@@ -63,14 +63,16 @@ const MountsContainer = () => {
return (
<AdminContentBlock title={'Mounts'}>
<div css={tw`w-full flex flex-row items-center mb-8`}>
<div css={tw`flex flex-col`}>
<div css={tw`flex flex-col flex-shrink`} style={{ minWidth: '0' }}>
<h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Mounts</h2>
<p css={tw`text-base text-neutral-400`}>Configure and manage additional mount points for servers.</p>
<p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>Configure and manage additional mount points for servers.</p>
</div>
<Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`}>
New Mount
</Button>
<div css={tw`flex ml-auto pl-4`}>
<Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`}>
New Mount
</Button>
</div>
</div>
<FlashMessageRender byKey={'mounts'} css={tw`mb-4`}/>