fix button proportions (#199)

CONTRIBUTING.md

@@ -88,7 +88,7 @@ tilt up
 есть возможность запустить их вручную через консоль.
 
 ```bash
-pnpm test:watch
+pnpm test:e2e
 ```
 
 ## Открытие Pull Request'а

apps/client/src/components/available-sessions.tsx

@@ -33,11 +33,7 @@ const AvailableSessions: React.FC = () => {
 
   return (
     <>
-      <Button
-        variant="outlined"
-        className="w-36 uppercase"
-        onClick={handleOpen}
-      >
+      <Button variant="outlined" className="uppercase" onClick={handleOpen}>
         Комнаты
       </Button>
       <SessionsModal isOpen={isOpen} onClose={handleClose} />

apps/client/src/components/back-button.tsx

@@ -9,7 +9,7 @@ const BackButton: React.FC<{ onClick?: () => void }> = ({ onClick }) => {
     <Button
       variant="outlined"
       onClick={onClick}
-      className="px-4 py-3 text-base uppercase"
+      className="text-base uppercase"
       data-testid="back-button"
       icon={<ArrowLeft />}
     >

apps/client/src/components/button.tsx

@@ -37,7 +37,7 @@ const Button: React.FC<React.PropsWithChildren<ButtonProps>> = ({
   return (
     <button
       className={cn(
-        "flex items-center justify-center",
+        "flex items-center justify-center p-4",
         "rounded-lg text-xl leading-none transition-colors sm:leading-none",
         variantClasses[variant],
         icon && "group gap-2",

apps/client/src/components/player-list.tsx

@@ -249,7 +249,7 @@ const KickModal: React.FC<{
       <div className="mt-4 flex w-full gap-2">
         <Button
           variant="outlined"
-          className="flex-1 py-3 uppercase"
+          className="flex-1 uppercase"
           onClick={onClose}
         >
           Нет

apps/client/src/screens/entry.tsx

@@ -47,7 +47,7 @@ const Entry: React.FC = () => {
           <Button
             variant="filled"
             onClick={() => createOrJoinSession(sessionId ?? undefined)}
-            className="h-12 w-32 uppercase"
+            className="w-32 uppercase"
             disabled={disabled}
             data-testid="connect-session"
           >

apps/client/src/screens/game.tsx

@@ -398,7 +398,7 @@ const Discard: React.FC<{ score: number; onDiscard?: () => void }> = ({
         <div className="mt-4 flex w-full gap-2">
           <Button
             variant="outlined"
-            className="flex-1 py-3 uppercase"
+            className="flex-1 uppercase"
             onClick={() => setOpen(false)}
             data-testid="abort-discard-hand"
           >

apps/client/src/screens/waiting.tsx

@@ -311,7 +311,7 @@ const Waiting: React.FC = () => {
                   </>
                 )}
               </div>
-              <div className="flex w-full justify-center gap-2">
+              <div className="mx-auto flex gap-2 ">
                 <InviteButton id={id} />
                 <StartButton
                   onClick={onStart}
@@ -365,7 +365,7 @@ const StartButton: React.FC<{
     <Button
       variant="filled"
       onClick={onClick}
-      className={cn("w-28 uppercase sm:w-32", disabled && "opacity-50")}
+      className={cn("uppercase", disabled && "opacity-50")}
       disabled={disabled}
       data-testid="start-game"
     >
@@ -388,10 +388,10 @@ const InviteButton: React.FC<{ id: string }> = ({ id }) => {
   }, [copied, toggleCopied])
 
   return (
-    <div className="relative">
+    <div className="relative flex">
       <Button
         variant="outlined"
-        className="px-4 py-4 uppercase sm:px-5"
+        className="uppercase"
         onClick={async () => {
           const url = `${window.location.origin}?s=${id}`
 

package.json

@@ -4,7 +4,7 @@
   "scripts": {
     "ts-check": "turbo ts-check",
     "test:e2e:slow": "pnpm --filter=e2e test:slow",
-    "test:e2e:update-snapshots": "pnpm --filter=e2e test:update",
+    "test:e2e:update-snapshots": "pnpm --filter=e2e test:update-snapshots",
     "test:e2e": "pnpm --filter=e2e test",
     "dev:client": "turbo dev --filter=client",
     "dev:server": "turbo dev --filter=server",