dvkei/Pterodactyl-Panel
1
0
Fork 0
forked from Alex/Pterodactyl-Panel
Code Issues Pull Requests Projects Releases Wiki Activity

Add 'select-none' everywhere in the admin area

Browse Source
This commit is contained in:
Matthew Penner 2020-08-22 17:16:20 -06:00
parent a1115ff096
commit 434d204c49
3 changed files with 28 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
resources/scripts/components/admin/api/ApiKeysContainer.tsx
View File

@ -31,7 +31,7 @@ export default () => {
keys.length < 1 ?
<div css={tw`w-full flex flex-col items-center justify-center pb-6 py-2 sm:py-8 md:py-10 px-8`}>
<div css={tw`h-64 flex`}>
<img src={'/assets/svgs/not_found.svg'} alt={'No Items'} css={tw`h-full`}/>
<img src={'/assets/svgs/not_found.svg'} alt={'No Items'} css={tw`h-full select-none`}/>
</div>
<p css={tw`text-xl text-neutral-400 text-center font-normal sm:mt-8`}>No items could be found, it&apos;s almost like they are hiding.</p>

8
resources/scripts/components/elements/Button.tsx
View File

@ -13,6 +13,10 @@ interface Props {
const ButtonStyle = styled.button<Omit<Props, 'isLoading'>>`
${tw`relative inline-block rounded p-2 uppercase tracking-wide text-sm transition-all duration-150 border`};
& > span {
${tw`select-none`};
}
${props => ((!props.isSecondary && !props.color) || props.color === 'primary') && css<Props>`
${props => !props.isSecondary && tw`bg-primary-500 border-primary-600 border text-primary-50`};
@ -57,8 +61,8 @@ const ButtonStyle = styled.button<Omit<Props, 'isLoading'>>`
`};
`};
${props => props.size === 'xsmall' && tw`px-2 py-1 text-xs`};
${props => (!props.size || props.size === 'small') && tw`px-4 py-2`};
${props => props.size === 'xsmall' && tw`p-2 text-xs`};
${props => (!props.size || props.size === 'small') && tw`p-3`};
${props => props.size === 'large' && tw`p-4 text-sm`};
${props => props.size === 'xlarge' && tw`p-4 w-full`};

15
resources/scripts/routers/AdminRouter.tsx
View File

@ -1,6 +1,5 @@
import React, { useState } from 'react';
import { NavLink, Route, RouteComponentProps, Switch } from 'react-router-dom';
import TransitionRouter from '@/TransitionRouter';
import NotFound from '@/components/screens/NotFound';
import SettingsContainer from '@/components/admin/settings/SettingsContainer';
import OverviewContainer from '@/components/admin/overview/OverviewContainer';
@ -31,7 +30,7 @@ const Sidebar = styled.div<{ collapsed?: boolean }>`
& > span {
height: 18px;
${tw`font-header font-medium text-xs text-neutral-300 whitespace-no-wrap uppercase ml-4 mb-1`};
${tw`font-header font-medium text-xs text-neutral-300 whitespace-no-wrap uppercase ml-4 mb-1 select-none`};
${props => props.collapsed && tw`opacity-0`};
&:not(:first-of-type) {
@ -40,7 +39,7 @@ const Sidebar = styled.div<{ collapsed?: boolean }>`
}
& > a {
${tw`h-10 w-full flex flex-row items-center text-neutral-300 cursor-pointer`};
${tw`h-10 w-full flex flex-row items-center text-neutral-300 cursor-pointer select-none`};
${props => props.collapsed ? tw`justify-center` : tw`px-4`};
& > svg {
@ -86,7 +85,7 @@ export default ({ location, match }: RouteComponentProps) => {
{ !collapsed ?
<h1 css={tw`text-2xl text-neutral-50 whitespace-no-wrap`}>{name}</h1>
:
<img src={'/favicons/android-icon-48x48.png'} />
<img src={'/favicons/android-icon-48x48.png'} alt={'Pterodactyl Icon'} />
}
</div>
@ -150,11 +149,11 @@ export default ({ location, match }: RouteComponentProps) => {
</NavLink>
<div className={'user'}>
<img src={'https://cdn.krygon.app/avatars/52564280420073473/7db9f06013ec39f7fa5c1e79241c43afa1f152d82cbb193ecaab7753b9a3e61e?size=64'} alt="Profile Picture" css={tw`h-10 w-10 rounded-full`} />
<img src={'https://cdn.krygon.app/avatars/52564280420073473/7db9f06013ec39f7fa5c1e79241c43afa1f152d82cbb193ecaab7753b9a3e61e?size=64'} alt="Profile Picture" css={tw`h-10 w-10 rounded-full select-none`} />
<div css={tw`flex flex-col ml-4`}>
<span css={tw`font-header font-medium text-sm text-neutral-50 whitespace-no-wrap leading-tight`}>Matthew Penner</span>
<span css={tw`font-header font-normal text-xs text-neutral-300 whitespace-no-wrap leading-tight`}>Super Administrator</span>
<span css={tw`font-header font-medium text-sm text-neutral-50 whitespace-no-wrap leading-tight select-none`}>Matthew Penner</span>
<span css={tw`font-header font-normal text-xs text-neutral-300 whitespace-no-wrap leading-tight select-none`}>Super Administrator</span>
</div>
<NavLink to={'/auth/logout'} css={tw`h-8 w-8 flex items-center justify-center text-neutral-300 hover:text-neutral-50 ml-auto transition-all duration-100`}>
@ -164,7 +163,7 @@ export default ({ location, match }: RouteComponentProps) => {
</Sidebar>
<div css={tw`h-full w-full flex flex-col items-center`}>
<div css={tw`min-h-screen w-full flex flex-col px-4 py-12 overflow-x-hidden`} style={{ maxWidth: '86rem' }}>
<div css={tw`min-h-screen w-full flex flex-col px-16 py-12 overflow-x-hidden`} style={{ maxWidth: '86rem' }}>
{/* <TransitionRouter> */}
<Switch location={location}>
<Route path={`${match.path}`} component={OverviewContainer} exact/>