Somewhat get a max-width container working
This commit is contained in:
parent
19176fb1b6
commit
1f850fac61
2 changed files with 24 additions and 7 deletions
|
@ -10,14 +10,14 @@ import styled from 'styled-components/macro';
|
|||
|
||||
const Navigation = styled.div`
|
||||
${tw`w-full bg-neutral-900 shadow-md overflow-x-auto`};
|
||||
|
||||
|
||||
& > div {
|
||||
${tw`mx-auto w-full flex items-center`};
|
||||
}
|
||||
|
||||
|
||||
& #logo {
|
||||
${tw`flex-1`};
|
||||
|
||||
|
||||
& > a {
|
||||
${tw`text-2xl font-header px-4 no-underline text-neutral-200 hover:text-neutral-100 transition-colors duration-150`};
|
||||
}
|
||||
|
@ -26,14 +26,14 @@ const Navigation = styled.div`
|
|||
|
||||
const RightNavigation = styled.div`
|
||||
${tw`flex h-full items-center justify-center`};
|
||||
|
||||
|
||||
& > a, & > .navigation-link {
|
||||
${tw`flex items-center h-full no-underline text-neutral-300 px-6 cursor-pointer transition-all duration-150`};
|
||||
|
||||
|
||||
&:active, &:hover {
|
||||
${tw`text-neutral-100 bg-black`};
|
||||
}
|
||||
|
||||
|
||||
&:active, &:hover, &.active {
|
||||
box-shadow: inset 0 -2px ${theme`colors.cyan.700`.toString()};
|
||||
}
|
||||
|
@ -52,6 +52,7 @@ export default () => {
|
|||
{name}
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<RightNavigation>
|
||||
<SearchContainer/>
|
||||
<NavLink to={'/'} exact>
|
||||
|
@ -60,11 +61,13 @@ export default () => {
|
|||
<NavLink to={'/account'}>
|
||||
<FontAwesomeIcon icon={faUserCircle}/>
|
||||
</NavLink>
|
||||
|
||||
{rootAdmin &&
|
||||
<a href={'/admin'} rel={'noreferrer'}>
|
||||
<a href={'/admin'}>
|
||||
<FontAwesomeIcon icon={faCogs}/>
|
||||
</a>
|
||||
}
|
||||
|
||||
<a href={'/auth/logout'}>
|
||||
<FontAwesomeIcon icon={faSignOutAlt}/>
|
||||
</a>
|
||||
|
|
14
resources/scripts/components/admin/packs/PacksContainer.tsx
Normal file
14
resources/scripts/components/admin/packs/PacksContainer.tsx
Normal file
|
@ -0,0 +1,14 @@
|
|||
import React from 'react';
|
||||
import tw from 'twin.macro';
|
||||
import AdminContentBlock from '@/components/admin/AdminContentBlock';
|
||||
|
||||
export default () => {
|
||||
return (
|
||||
<AdminContentBlock>
|
||||
<div>
|
||||
<h2 css={tw`text-2xl text-neutral-50 font-header font-medium`}>Packs</h2>
|
||||
<p css={tw`text-base text-neutral-400`}>All service packs available on the system.</p>
|
||||
</div>
|
||||
</AdminContentBlock>
|
||||
);
|
||||
};
|
Loading…
Reference in a new issue