diff --git a/resources/scripts/components/admin/api/ApiKeysContainer.tsx b/resources/scripts/components/admin/api/ApiKeysContainer.tsx index 899296c2..dd8b6616 100644 --- a/resources/scripts/components/admin/api/ApiKeysContainer.tsx +++ b/resources/scripts/components/admin/api/ApiKeysContainer.tsx @@ -31,7 +31,7 @@ export default () => { keys.length < 1 ?
- {'No + {'No

No items could be found, it's almost like they are hiding.

diff --git a/resources/scripts/components/elements/Button.tsx b/resources/scripts/components/elements/Button.tsx index 8577fad7..cdf1a8d9 100644 --- a/resources/scripts/components/elements/Button.tsx +++ b/resources/scripts/components/elements/Button.tsx @@ -12,59 +12,63 @@ interface Props { const ButtonStyle = styled.button>` ${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.isSecondary && tw`bg-primary-500 border-primary-600 border text-primary-50`}; - + &:hover:not(:disabled) { ${tw`bg-primary-600 border-primary-700`}; } `}; - + ${props => props.color === 'grey' && css` ${tw`border-neutral-600 bg-neutral-500 text-neutral-50`}; - + &:hover:not(:disabled) { ${tw`bg-neutral-600 border-neutral-700`}; } `}; - + ${props => props.color === 'green' && css` ${tw`border-green-600 bg-green-500 text-green-50`}; - + &:hover:not(:disabled) { ${tw`bg-green-600 border-green-700`}; } - + ${props => props.isSecondary && css` &:active:not(:disabled) { ${tw`bg-green-600 border-green-700`}; } `}; `}; - + ${props => props.color === 'red' && css` ${tw`border-red-600 bg-red-500 text-red-50`}; - + &:hover:not(:disabled) { ${tw`bg-red-600 border-red-700`}; } - + ${props => props.isSecondary && css` &:active:not(:disabled) { ${tw`bg-red-600 border-red-700`}; } `}; `}; - - ${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`}; - + ${props => props.isSecondary && css` ${tw`border-neutral-600 bg-transparent text-neutral-200`}; - + &:hover:not(:disabled) { ${tw`border-neutral-500 text-neutral-100`}; ${props => props.color === 'red' && tw`bg-red-500 border-red-600 text-red-50`}; @@ -72,7 +76,7 @@ const ButtonStyle = styled.button>` ${props => props.color === 'green' && tw`bg-green-500 border-green-600 text-green-50`}; } `}; - + &:disabled { opacity: 0.55; cursor: default } `; diff --git a/resources/scripts/routers/AdminRouter.tsx b/resources/scripts/routers/AdminRouter.tsx index d2ad6efe..e7610c05 100644 --- a/resources/scripts/routers/AdminRouter.tsx +++ b/resources/scripts/routers/AdminRouter.tsx @@ -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 ?

{name}

: - + {'Pterodactyl }
@@ -150,11 +149,11 @@ export default ({ location, match }: RouteComponentProps) => {
- Profile Picture + Profile Picture
- Matthew Penner - Super Administrator + Matthew Penner + Super Administrator
@@ -164,7 +163,7 @@ export default ({ location, match }: RouteComponentProps) => {
-
+
{/* */}