admin(ui): fix descriptions overflowing vertically
This commit is contained in:
parent
1800800308
commit
52b2463281
28 changed files with 107 additions and 85 deletions
|
@ -262,7 +262,7 @@ const NestEditContainer = () => {
|
|||
return (
|
||||
<AdminContentBlock title={'Nests - ' + nest.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`}>{nest.name}</h2>
|
||||
{
|
||||
(nest.description || '').length < 1 ?
|
||||
|
@ -270,7 +270,7 @@ const NestEditContainer = () => {
|
|||
<span css={tw`italic`}>No description</span>
|
||||
</p>
|
||||
:
|
||||
<p css={tw`text-base text-neutral-400`}>{nest.description}</p>
|
||||
<p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{nest.description}</p>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -63,12 +63,14 @@ const NestsContainer = () => {
|
|||
return (
|
||||
<AdminContentBlock title={'Nests'}>
|
||||
<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`}>Nests</h2>
|
||||
<p css={tw`text-base text-neutral-400`}>All nests currently available on this system.</p>
|
||||
<p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>All nests currently available on this system.</p>
|
||||
</div>
|
||||
|
||||
<NewNestButton/>
|
||||
<div css={tw`flex ml-auto pl-4`}>
|
||||
<NewNestButton/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<FlashMessageRender byKey={'nests'} css={tw`mb-4`}/>
|
||||
|
|
|
@ -103,7 +103,7 @@ export default () => {
|
|||
}
|
||||
</Formik>
|
||||
|
||||
<Button type={'button'} size={'large'} css={tw`h-10 ml-auto px-4 py-0`} onClick={() => setVisible(true)}>
|
||||
<Button type={'button'} size={'large'} css={tw`h-10 px-4 py-0 whitespace-nowrap`} onClick={() => setVisible(true)}>
|
||||
New Nest
|
||||
</Button>
|
||||
</>
|
||||
|
|
|
@ -57,7 +57,7 @@ const EggEditContainer = () => {
|
|||
return (
|
||||
<AdminContentBlock title={'Egg - ' + egg.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`}>{egg.name}</h2>
|
||||
{
|
||||
(egg.description || '').length < 1 ?
|
||||
|
@ -65,7 +65,7 @@ const EggEditContainer = () => {
|
|||
<span css={tw`italic`}>No description</span>
|
||||
</p>
|
||||
:
|
||||
<p css={tw`text-base text-neutral-400`}>{egg.description}</p>
|
||||
<p css={tw`text-base text-neutral-400 whitespace-nowrap overflow-ellipsis overflow-hidden`}>{egg.description}</p>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue