StarMC/Astral-nook
StarMC/Astral-nook
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Get server listing design working mostly correct

Browse source
This commit is contained in:
Dane Everitt 2020-07-03 14:50:37 -07:00
parent 94e3acb9c4
commit d93e804a31
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
9 changed files with 170 additions and 188 deletions
Download patch file Download diff file Expand all files Collapse all files

14
resources/scripts/components/elements/GreyRowBox.tsx Normal file
View file

@ -0,0 +1,14 @@
import styled from 'styled-components/macro';
import tw from 'twin.macro';
export default styled.div`
${tw`flex rounded no-underline text-neutral-200 items-center bg-neutral-700 p-4 border border-transparent transition-colors duration-150`};
&:not(.no-hover):hover {
${tw`border-neutral-500`};
}
& > div.icon {
${tw`rounded-full bg-neutral-500 p-3`};
}
`;

20
resources/scripts/components/elements/PageContentBlock.tsx
View file

@ -1,26 +1,22 @@
import React from 'react';
import ContentContainer from '@/components/elements/ContentContainer';
import { CSSTransition } from 'react-transition-group';
import tw from 'twin.macro';
interface Props {
children: React.ReactNode;
className?: string;
}
export default ({ className, children }: Props) => (
<CSSTransition timeout={250} classNames={'fade'} appear={true} in={true}>
export default ({ children }): React.FC => (
<CSSTransition timeout={250} classNames={'fade'} appear in>
<>
<ContentContainer className={`my-10 ${className}`}>
<ContentContainer css={tw`my-10`}>
{children}
</ContentContainer>
<ContentContainer className={'mb-4'}>
<p className={'text-center text-neutral-500 text-xs'}>
<ContentContainer css={tw`mb-4`}>
<p css={tw`text-center text-neutral-500 text-xs`}>
&copy; 2015 - 2020&nbsp;
<a
rel={'noopener nofollow'}
rel={'noopener nofollow noreferrer'}
href={'https://pterodactyl.io'}
target={'_blank'}
className={'no-underline text-neutral-500 hover:text-neutral-300'}
css={tw`no-underline text-neutral-500 hover:text-neutral-300`}
>
Pterodactyl Software
</a>