🔧 chore: create project create repo buttonSize to be responsive
This commit is contained in:
parent
3737550f7f
commit
f23c757de9
@ -20,7 +20,7 @@ export const buttonTheme = tv(
|
|||||||
variants: {
|
variants: {
|
||||||
size: {
|
size: {
|
||||||
lg: ['gap-2', 'py-3.5', 'px-5', 'text-base', 'tracking-[-0.011em]'],
|
lg: ['gap-2', 'py-3.5', 'px-5', 'text-base', 'tracking-[-0.011em]'],
|
||||||
md: ['gap-2', 'py-3.25', 'px-5', 'text-sm', 'tracking-[-0.006em]'],
|
md: ['gap-2', 'py-3', 'px-5', 'text-sm', 'tracking-[-0.006em]'],
|
||||||
sm: ['gap-1', 'py-2', 'px-3', 'text-xs'],
|
sm: ['gap-1', 'py-2', 'px-3', 'text-xs'],
|
||||||
xs: ['gap-1', 'py-1', 'px-2', 'text-xs'],
|
xs: ['gap-1', 'py-1', 'px-2', 'text-xs'],
|
||||||
},
|
},
|
||||||
|
@ -3,6 +3,7 @@ import { useForm, SubmitHandler, Controller } from 'react-hook-form';
|
|||||||
import { useNavigate, useOutletContext, useParams } from 'react-router-dom';
|
import { useNavigate, useOutletContext, useParams } from 'react-router-dom';
|
||||||
import toast from 'react-hot-toast';
|
import toast from 'react-hot-toast';
|
||||||
import assert from 'assert';
|
import assert from 'assert';
|
||||||
|
import { useMediaQuery } from 'usehooks-ts';
|
||||||
|
|
||||||
import { useOctokit } from '../../../../../context/OctokitContext';
|
import { useOctokit } from '../../../../../context/OctokitContext';
|
||||||
import { useGQLClient } from '../../../../../context/GQLClientContext';
|
import { useGQLClient } from '../../../../../context/GQLClientContext';
|
||||||
@ -28,6 +29,9 @@ const CreateRepo = () => {
|
|||||||
|
|
||||||
const { orgSlug } = useParams();
|
const { orgSlug } = useParams();
|
||||||
|
|
||||||
|
const isDesktopView = useMediaQuery('(min-width: 720px)'); // md:
|
||||||
|
const buttonSize = isDesktopView ? { size: 'lg' as const } : {};
|
||||||
|
|
||||||
const navigate = useNavigate();
|
const navigate = useNavigate();
|
||||||
|
|
||||||
const [gitAccounts, setGitAccounts] = useState<string[]>([]);
|
const [gitAccounts, setGitAccounts] = useState<string[]>([]);
|
||||||
@ -166,8 +170,8 @@ const CreateRepo = () => {
|
|||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<Button
|
<Button
|
||||||
|
{...buttonSize}
|
||||||
type="submit"
|
type="submit"
|
||||||
size="lg"
|
|
||||||
disabled={!Boolean(template.repoFullName) || isLoading}
|
disabled={!Boolean(template.repoFullName) || isLoading}
|
||||||
rightIcon={<ArrowRightCircleFilledIcon />}
|
rightIcon={<ArrowRightCircleFilledIcon />}
|
||||||
>
|
>
|
||||||
|
Loading…
Reference in New Issue
Block a user