1
1
mirror of https://github.com/pterodactyl/panel.git synced 2024-11-25 18:42:31 +01:00

Make sizing across margins/padding/width/height the same

This commit is contained in:
Dane Everitt 2020-03-29 22:04:38 -07:00
parent 5d5a5c2afc
commit 3df134b558
No known key found for this signature in database
GPG Key ID: EEA66103B3D71F53
3 changed files with 57 additions and 156 deletions

View File

@ -43,7 +43,7 @@ export default () => {
}
return (
<div className={'my-10'}>
<div className={'mt-10 mb-6'}>
<FlashMessageRender byKey={'users'} className={'mb-4'}/>
{!subusers.length ?
<p className={'text-center text-sm text-neutral-400'}>

View File

@ -4,7 +4,7 @@
transition: opacity 250ms ease;
& > .modal-container {
@apply .relative .w-full .max-w-md .m-auto .flex-col .flex;
@apply .relative .w-full .max-w-1/2 .m-auto .flex-col .flex;
/*&.top {
margin-top: 10%;

View File

@ -120,6 +120,52 @@ let colors = {
'green-900': 'hsl(125, 97%, 14%)',
};
/*
|-------------------------------------------------------------------------------
| Sizes
|-------------------------------------------------------------------------------
|
| Here you can specify the sizes that should be available to all of the height,
| width, padding, and margin utilities.
|
*/
let sizes = {
'auto': 'auto',
'0': '0',
'px': '1px',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'20': '5rem',
'24': '6rem',
'28': '7rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'96': '24rem',
'1/2': '50%',
'1/3': '33.33333%',
'2/3': '66.66667%',
'1/4': '25%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.66667%',
'5/6': '83.33333%',
'full': '100%',
'screen': '100vw',
};
module.exports = {
/*
@ -452,38 +498,7 @@ module.exports = {
|
*/
width: {
'auto': 'auto',
'px': '1px',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'24': '6rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'96': '24rem',
'1/2': '50%',
'1/3': '33.33333%',
'2/3': '66.66667%',
'1/4': '25%',
'3/4': '75%',
'1/5': '20%',
'2/5': '40%',
'3/5': '60%',
'4/5': '80%',
'1/6': '16.66667%',
'5/6': '83.33333%',
'full': '100%',
'screen': '100vw',
},
width: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -500,26 +515,7 @@ module.exports = {
|
*/
height: {
'auto': 'auto',
'px': '1px',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'24': '6rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'full': '100%',
'screen': '100vh',
},
height: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -535,25 +531,7 @@ module.exports = {
|
*/
minWidth: {
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'24': '6rem',
'32': '8rem',
'48': '12rem',
'64': '16rem',
'96': '24rem',
'full': '100%',
},
minWidth: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -569,11 +547,7 @@ module.exports = {
|
*/
minHeight: {
'0': '0',
'full': '100%',
'screen': '100vh',
},
minHeight: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -590,19 +564,7 @@ module.exports = {
|
*/
maxWidth: {
'xxs': '10rem',
'xs': '20rem',
'sm': '30rem',
'md': '40rem',
'lg': '50rem',
'xl': '60rem',
'2xl': '70rem',
'3xl': '80rem',
'4xl': '90rem',
'5xl': '100rem',
'full': '100%',
},
maxWidth: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -618,10 +580,7 @@ module.exports = {
|
*/
maxHeight: {
'full': '100%',
'screen': '100vh',
},
maxHeight: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -638,23 +597,7 @@ module.exports = {
|
*/
padding: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'20': '5rem',
'24': '6rem',
'32': '8rem',
},
padding: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -671,33 +614,7 @@ module.exports = {
|
*/
margin: {
'n-12': '-3rem',
'n-10': '-2.5rem',
'n-8': '-2rem',
'n-6': '-1.5rem',
'n-4': '-1rem',
'n-3': '-0.75rem',
'n-2': '-0.5rem',
'n-1': '-0.25rem',
'n-px': '-1px',
'auto': 'auto',
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'20': '5rem',
'24': '6rem',
'32': '8rem',
},
margin: { ...sizes },
/*
|-----------------------------------------------------------------------------
@ -714,23 +631,7 @@ module.exports = {
|
*/
negativeMargin: {
'px': '1px',
'0': '0',
'1': '0.25rem',
'2': '0.5rem',
'3': '0.75rem',
'4': '1rem',
'5': '1.25rem',
'6': '1.5rem',
'8': '2rem',
'10': '2.5rem',
'12': '3rem',
'16': '4rem',
'20': '5rem',
'24': '6rem',
'32': '8rem',
},
negativeMargin: { ...sizes },
/*
|-----------------------------------------------------------------------------