TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-25 03:44:29 +03:00
Code Issues Projects Releases Wiki Activity

Admin X Settings minor refinements

Browse Source 
refs. https://github.com/TryGhost/Team/issues/3150

Spacing between setting values, input fields and headings were a bit too loose.
This commit is contained in:
Peter Zimon 2023-05-22 09:13:25 +02:00
parent 950b59d81e
commit 28aa5c0cdc
5 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
ghost/admin-x-settings/src/admin-x-ds/global/Dropdown.tsx
View File

@ -36,7 +36,7 @@ const Dropdown: React.FC<DropdownProps> = ({title, prompt, options, onSelect, er
return (
<div className='flex flex-col'>
{title && <Heading useLabelTag={true}>{title}</Heading>}
<select className={`-m-1 h-10 border-b ${error ? `border-red` : `border-grey-300 hover:border-grey-500 focus:border-grey-900`} py-2 ${title && `mt-0`}`} value={selectedOption} onChange={handleOptionChange}>
<select className={`-mx-1 -mt-1 h-10 border-b ${error ? `border-red` : `border-grey-500 hover:border-grey-600 focus:border-grey-900`} py-2 ${title && `mt-0`}`} value={selectedOption} onChange={handleOptionChange}>
{prompt && <option value="">{prompt}</option>}
{options.map(option => (
<option

2
ghost/admin-x-settings/src/admin-x-ds/global/TextField.tsx
View File

@ -19,7 +19,7 @@ const TextField: React.FC<ITextField> = ({inputRef, title, value, error, placeho
{title && <Heading useLabelTag={true}>{title}</Heading>}
<input
ref={inputRef}
className={`-mx-1 h-10 border-b ${error ? `border-red` : `border-grey-500 hover:border-grey-600 focus:border-grey-900`} px-1 py-2 ${title && `mt-0`}`}
className={`-mx-1 -mt-1 h-10 border-b ${error ? `border-red` : `border-grey-500 hover:border-grey-600 focus:border-grey-900`} px-1 py-2 ${title && `mt-0`}`}
defaultValue={value}
placeholder={placeholder}
type='text'

2
ghost/admin-x-settings/src/admin-x-ds/settings/SettingGroupContent.tsx
View File

@ -14,7 +14,7 @@ interface ISettingGroupContent {
}
const SettingGroupContent: React.FC<ISettingGroupContent> = ({columns, values, children}) => {
let styles = 'flex flex-col gap-6';
let styles = 'flex flex-col gap-x-6 gap-y-8';
if (columns === 2) {
styles = 'grid grid-cols-2 gap-6';
}

2
ghost/admin-x-settings/src/admin-x-ds/settings/SettingValue.tsx
View File

@ -13,7 +13,7 @@ const SettingValue: React.FC<ISettingValue> = ({heading, value, hint, ...props})
return (
<div className='flex flex-col' {...props}>
{heading && <Heading grey={true} level={6}>{heading}</Heading>}
<div className={`flex items-center ${heading && `min-h-[40px]`}`}>{value}</div>
<div className={`-mt-1 flex items-center ${heading && `min-h-[40px]`}`}>{value}</div>
{hint && <p className='mt-0.5 text-xs'>{hint}</p>}
</div>
);

4
ghost/admin-x-settings/src/components/settings/email/Mailgun.tsx
View File

@ -28,7 +28,7 @@ const MailGun: React.FC = () => {
const inputs = (
<SettingGroupContent>
<div className='grid grid-cols-2 gap-6'>
<div className='grid grid-cols-[0.25fr_0.75fr] gap-6'>
<Dropdown
defaultSelectedOption='option-1'
options={[
@ -43,7 +43,7 @@ const MailGun: React.FC = () => {
/>
<div className='col-span-2'>
<TextField
hint={<>Find your Mailgun API keys<Link href="https://app.mailgun.com/app/account/security/api_keys" target="_blank">here</Link></>}
hint={<>Find your Mailgun API keys <Link href="https://app.mailgun.com/app/account/security/api_keys" rel="noopener noreferrer" target="_blank">here</Link></>}
title='Mailgun private API key'
/>
</div>