Move file manager buttons beside the breadcrumb, other tweaks
This commit is contained in:
parent
77abfd01ec
commit
de1f7ea906
3 changed files with 31 additions and 27 deletions
|
@ -5,23 +5,24 @@ import config from '../../../../tailwind.config';
|
|||
|
||||
const SubNavigation = styled.div`
|
||||
${tw`w-full bg-neutral-700 shadow overflow-x-auto`};
|
||||
|
||||
|
||||
& > div {
|
||||
${tw`flex items-center text-sm mx-auto px-2`};
|
||||
max-width: 1200px;
|
||||
|
||||
|
||||
& > a, & > div {
|
||||
${tw`inline-block py-3 px-4 text-neutral-300 no-underline whitespace-no-wrap transition-all duration-150`};
|
||||
|
||||
|
||||
&:not(:first-of-type) {
|
||||
${tw`ml-2`};
|
||||
}
|
||||
|
||||
&:active, &:hover {
|
||||
|
||||
&:hover {
|
||||
${tw`text-neutral-100`};
|
||||
}
|
||||
|
||||
&:active, &:hover, &.active {
|
||||
|
||||
&:active, &.active {
|
||||
${tw`text-neutral-100`};
|
||||
box-shadow: inset 0 -2px ${config.theme.colors.cyan['500']};
|
||||
}
|
||||
}
|
||||
|
|
|
@ -44,7 +44,7 @@ export default ({ withinFileEditor, isNewFile }: Props) => {
|
|||
};
|
||||
|
||||
return (
|
||||
<div css={tw`flex items-center text-sm mb-4 text-neutral-500`}>
|
||||
<div css={tw`flex flex-grow-0 items-center text-sm text-neutral-500 overflow-x-hidden`}>
|
||||
{(files && files.length > 0 && !params?.action) ?
|
||||
<FileActionCheckbox
|
||||
type={'checkbox'}
|
||||
|
|
|
@ -51,9 +51,28 @@ export default () => {
|
|||
|
||||
return (
|
||||
<ServerContentBlock title={'File Manager'} showFlashKey={'files'}>
|
||||
<ErrorBoundary>
|
||||
<FileManagerBreadcrumbs/>
|
||||
</ErrorBoundary>
|
||||
<div css={tw`flex flex-wrap-reverse md:flex-no-wrap justify-center mb-4`}>
|
||||
<ErrorBoundary>
|
||||
<FileManagerBreadcrumbs/>
|
||||
</ErrorBoundary>
|
||||
|
||||
<Can action={'file.create'}>
|
||||
<ErrorBoundary>
|
||||
<div css={tw`flex flex-shrink-0 flex-wrap-reverse md:flex-no-wrap justify-end mb-4 md:mb-0 ml-0 md:ml-auto`}>
|
||||
<NewDirectoryButton css={tw`w-full flex-none mt-4 sm:mt-0 sm:w-auto sm:mr-4`}/>
|
||||
<UploadButton css={tw`flex-1 mr-4 sm:flex-none sm:mt-0`}/>
|
||||
<NavLink
|
||||
to={`/server/${id}/files/new${window.location.hash}`}
|
||||
css={tw`flex-1 sm:flex-none sm:mt-0`}
|
||||
>
|
||||
<Button css={tw`w-full`}>
|
||||
New File
|
||||
</Button>
|
||||
</NavLink>
|
||||
</div>
|
||||
</ErrorBoundary>
|
||||
</Can>
|
||||
</div>
|
||||
{
|
||||
!files ?
|
||||
<Spinner size={'large'} centered/>
|
||||
|
@ -83,22 +102,6 @@ export default () => {
|
|||
</div>
|
||||
</CSSTransition>
|
||||
}
|
||||
<Can action={'file.create'}>
|
||||
<ErrorBoundary>
|
||||
<div css={tw`flex flex-wrap-reverse justify-end mt-4`}>
|
||||
<NewDirectoryButton css={tw`w-full flex-none mt-4 sm:mt-0 sm:w-auto sm:mr-4`}/>
|
||||
<UploadButton css={tw`flex-1 mr-4 sm:flex-none sm:mt-0`}/>
|
||||
<NavLink
|
||||
to={`/server/${id}/files/new${window.location.hash}`}
|
||||
css={tw`flex-1 sm:flex-none sm:mt-0`}
|
||||
>
|
||||
<Button css={tw`w-full`}>
|
||||
New File
|
||||
</Button>
|
||||
</NavLink>
|
||||
</div>
|
||||
</ErrorBoundary>
|
||||
</Can>
|
||||
</>
|
||||
}
|
||||
</ServerContentBlock>
|
||||
|
|
Loading…
Reference in a new issue