v0.1.1 (#66)

* Updated dockerfile to match new standard * added cd for dev branch (#22) Co-authored-by: Mike de Geofroy <[email protected]> * fixed formatting * Moved api url to env Cleaned up useless console log * Added .env info log * fix(env): pushed env lol * Added gitignore * Added .env values * Updated cd pipelines. Added envs into build * added copy .env * Removed copy dev :) * Update cd-dev.yaml * feat(settings): Updated Settings Page (#32) * Added avatars to settings page * Updated settings page * Remove envs * Comment sandwitch * remove secret * blank * fix(lint): Fixed bad lint problem * feat(cards): Updated the card design (#34) * Added basic card components. * adding opacity on like & dislikes * Added likes and dislikes to cards * fix(android): Updated Cards * feat(end-screen): Added an end screen. (#42) * Updated result interface and added basic markup for result page. * Added card bottom icons. * Added time to cards * fix(lint): fixed lint errors * fixed settings error * Removed unused assets * feat(error): Added error pages and websocket error parsing (#45) * Updated dockerfile to match new standard * added cd for dev branch (#22) * fixed formatting * Moved api url to env Cleaned up useless console log * Added .env info log * fix(env): pushed env lol * Added gitignore * Added .env values * Updated cd pipelines. Added envs into build * added copy .env * Removed copy dev :) * Update cd-dev.yaml * feat(settings): Updated Settings Page (#32) * Added avatars to settings page * Updated settings page * Remove envs * Comment sandwitch * remove secret * blank * fix(lint): Fixed bad lint problem * feat(cards): Updated the card design (#34) * Added basic card components. * adding opacity on like & dislikes * Added likes and dislikes to cards * fix(android): Updated Cards * feat(end-screen): Added an end screen. (#42) * Updated result interface and added basic markup for result page. * Added card bottom icons. * Added time to cards * fix(lint): fixed lint errors * fixed settings error * Removed unused assets --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]> * feat(map): Added map to home screen. (#46) * Added a map on home screen. * Cleaned up comments and logs * fixed lint * fixed errors uncaught by lint * moved share to settings * updated share link * feat(lobby-preview): Added a lobby preview page (#50) * feat(end-screen): Updated end screen. (#43) * Updated dockerfile to match new standard * added cd for dev branch (#22) Co-authored-by: Mike de Geofroy <[email protected]> * fixed formatting * Moved api url to env Cleaned up useless console log * Added .env info log * fix(env): pushed env lol * Added gitignore * Added .env values * Updated cd pipelines. Added envs into build * added copy .env * Removed copy dev :) * Update cd-dev.yaml * feat(settings): Updated Settings Page (#32) * Added avatars to settings page * Updated settings page * Remove envs * Comment sandwitch * remove secret * blank * fix(lint): Fixed bad lint problem * feat(cards): Updated the card design (#34) * Added basic card components. * adding opacity on like & dislikes * Added likes and dislikes to cards * fix(android): Updated Cards * feat(end-screen): Added an end screen. (#42) * Updated result interface and added basic markup for result page. * Added card bottom icons. * Added time to cards * fix(lint): fixed lint errors * fixed settings error * Removed unused assets --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]> * feat(map): Added map to home screen. (#47) * Updated dockerfile to match new standard * added cd for dev branch (#22) Co-authored-by: Mike de Geofroy <[email protected]> * fixed formatting * Moved api url to env Cleaned up useless console log * Added .env info log * fix(env): pushed env lol * Added gitignore * Added .env values * Updated cd pipelines. Added envs into build * added copy .env * Removed copy dev :) * Update cd-dev.yaml * feat(settings): Updated Settings Page (#32) * Added avatars to settings page * Updated settings page * Remove envs * Comment sandwitch * remove secret * blank * fix(lint): Fixed bad lint problem * feat(cards): Updated the card design (#34) * Added basic card components. * adding opacity on like & dislikes * Added likes and dislikes to cards * fix(android): Updated Cards * feat(end-screen): Added an end screen. (#42) * Updated result interface and added basic markup for result page. * Added card bottom icons. * Added time to cards * fix(lint): fixed lint errors * fixed settings error * Removed unused assets * feat(error): Added error pages and websocket error parsing (#45) * Updated dockerfile to match new standard * added cd for dev branch (#22) * fixed formatting * Moved api url to env Cleaned up useless console log * Added .env info log * fix(env): pushed env lol * Added gitignore * Added .env values * Updated cd pipelines. Added envs into build * added copy .env * Removed copy dev :) * Update cd-dev.yaml * feat(settings): Updated Settings Page (#32) * Added avatars to settings page * Updated settings page * Remove envs * Comment sandwitch * remove secret * blank * fix(lint): Fixed bad lint problem * feat(cards): Updated the card design (#34) * Added basic card components. * adding opacity on like & dislikes * Added likes and dislikes to cards * fix(android): Updated Cards * feat(end-screen): Added an end screen. (#42) * Updated result interface and added basic markup for result page. * Added card bottom icons. * Added time to cards * fix(lint): fixed lint errors * fixed settings error * Removed unused assets --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]> * feat(map): Added map to home screen. (#46) * Added a map on home screen. * Cleaned up comments and logs * fixed lint * fixed errors uncaught by lint --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]> * Updated ci/cd pipelines (#48) * Updated tests * Updated cd for prod * fixed ci-tests.yaml error (#49) --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]> * Trigger Build * bad merge * Trigger Build * updated workflow * feat(lobby-preview): Added a lobby preview page (#53) * fix(lint): Fixed lint errors * fix(match): Fixed the match cards (#54) * Fixed images in result & match card * fix(result): Fixed scrolling on result screen & button width. (#55) * Updated imports, added return to home button * fixed scrolling on result page * feat(main-screen): Added a beautiful animated button (#56) * Added a map on home screen. * Cleaned up comments and logs * fixed lint * added a button to main * Fixed some light errors * fixed bad loby logic * slight fix to button * feat(main-screen): Added recent lobbies (#57) * Added a map on home screen. * Cleaned up comments and logs * fixed lint * added a button to main * Fixed some light errors * updated like/dislike icons * updated users & added recent lobbies * fixed lint errors * fixed build errors * multiple fixes to lobby logic * feat(main-screen): Added recent lobbies and refactored map element. (#58) * Started adding more stuff to main screen * fixed error with bad users in local storage * Added multiple fixes and new home screen * updated env variables in gh actions * fix(lint): Fixed uncaught lint errors * Added fallbacks for profile images * hotfix for fallback on map * added a hotfix of the main page * fix(wide-avatars): Fixed wide avatars (#61) * fixed wide avatars * slight fixes * fixed inline launch (#62) * Added error page (#63) * fixed lag on bidirectional swipe * fix(match-card): Fixed text color on match cards. * fix(result-cards): Slight fix on times * hotfix tags.api.ts * feat(location): Added user location support. * fix(match-spelling): Fixed match spelling * fix(permissions): Fixed some permissions and lint * fixed routing between pages, added back buttons (#64) * trying to fix location request * fixed images to be able to parse multiple images * added version error * fixed image overflow on some screens * fixed image overflow on some screens fixed overflow on match cards * updated theme and lobby default price * fix build * updated map button * fixed early socket connection --------- Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: Alex Dyakonov <[email protected]> Co-authored-by: vaniog <[email protected]>
shampsdev · Nov 22, 2024 · f8b75fc · f8b75fc
1 parent 66480d8
commit f8b75fc
Show file tree

Hide file tree

Showing 33 changed files with 499 additions and 301 deletions.
diff --git a/package.json b/package.json
@@ -36,7 +36,7 @@
     "react-hot-toast": "^2.4.1",
     "react-leaflet": "^4.2.1",
     "react-router-dom": "^6.23.1",
-    "shamps-tunnel": "^1.0.0",
+    "shamps-tunnel": "1.0.0",
     "socket.io": "1.4.5",
     "socket.io-client": "2.x",
     "tailwind-merge": "^2.3.0",

diff --git a/src/assets/icons/sad-face.png b/src/assets/icons/sad-face.png
diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx
@@ -1,5 +1,6 @@
 import { motion } from "framer-motion";
-import { CSSProperties, ReactElement, useRef, useState } from "react";
+import { CSSProperties, ReactElement } from "react";
+
 
 interface AvatarProps {
     src: string;
@@ -9,31 +10,17 @@ interface AvatarProps {
 }
 
 export const Avatar = ({ src, fallback, style, fallbackElement }: AvatarProps) => {
-    const [imageError, setImageError] = useState(false);
-    const imgRef = useRef<HTMLImageElement | null>(null)
-
-    const handleImgValidity = () => {
-        if (imgRef.current && imgRef.current.naturalHeight < 10) {
-            // setImageError(true);
-        } else {
-            setImageError(false);
-        }
-    }
-
     return (
         <motion.div
             initial={{ opacity: 0 }}
             animate={{ opacity: 1 }}
             style={style}
-            className="max-h-[30px] w-full aspect-square bg-background rounded-full border-[3px] border-secondary overflow-hidden flex items-center justify-center"
+            className="max-h-[30px] max-w-[30px] w-full aspect-square bg-background rounded-full border-[3px] border-secondary overflow-hidden flex items-center justify-center"
         >
-            {!imageError ? (
+            {src !== '' ? (
                 <img
-                    ref={imgRef}
-                    onLoad={handleImgValidity}
                     className="w-full h-full object-cover"
                     src={src}
-                    onError={() => setImageError(true)}
                 />
             ) : (
                 fallbackElement !== undefined ? fallbackElement : <span className="text-primary font-medium text-xs">{fallback}</span>

diff --git a/src/components/ui/game.tsx b/src/components/ui/game.tsx
@@ -2,64 +2,79 @@ import { motion, AnimatePresence, cubicBezier } from 'framer-motion';
 import Loader from '@/components/ui/loader';
 import { useLoadingStore } from '@/shared/stores/loading.store';
 import { Outlet } from 'react-router-dom';
+import { useWebApp } from '@vkruglikov/react-telegram-web-app';
+
+import sadFace from '@/assets/icons/sad-face.png';
+
 
 const gameScreenVariants = {
-  initial: {
-    opacity: 0,
-  },
-  animate: {
-    opacity: 1,
-    transition: { duration: 2, ease: cubicBezier(0.16, 1, 0.3, 1) },
-  },
-  exit: {
-    opacity: 0,
-    transition: { duration: 0.2, ease: cubicBezier(0.7, 0, 0.84, 0) },
-  },
+    initial: {
+        opacity: 0,
+    },
+    animate: {
+        opacity: 1,
+        transition: { duration: 2, ease: cubicBezier(0.16, 1, 0.3, 1) },
+    },
+    exit: {
+        opacity: 0,
+        transition: { duration: 0.2, ease: cubicBezier(0.7, 0, 0.84, 0) },
+    },
 };
 
 const loaderVariants = {
-  initial: {
-    opacity: 0,
-  },
-  animate: {
-    opacity: 1,
-    transition: { duration: 0.5, ease: cubicBezier(0.16, 1, 0.3, 1) },
-  },
-  exit: {
-    opacity: 0,
-    transition: { duration: 0.2, ease: cubicBezier(0.7, 0, 0.84, 0) },
-  },
+    initial: {
+        opacity: 0,
+    },
+    animate: {
+        opacity: 1,
+        transition: { duration: 0.5, ease: cubicBezier(0.16, 1, 0.3, 1) },
+    },
+    exit: {
+        opacity: 0,
+        transition: { duration: 0.2, ease: cubicBezier(0.7, 0, 0.84, 0) },
+    },
 };
 
 export const GameComponent = () => {
-  const { isLoading } = useLoadingStore();
+    const { isLoading } = useLoadingStore();
+    const { isVersionAtLeast } = useWebApp();
 
-  return (
-    <main className="h-screen mx-auto bg-background">
-      <AnimatePresence>
-        {isLoading ? (
-          <motion.div
-            key="loader"
-            variants={loaderVariants}
-            initial="initial"
-            animate="animate"
-            exit="exit"
-          >
-            <Loader />
-          </motion.div>
-        ) : (
-          <motion.div
-            key="gameScreen"
-            id="gameScreen"
-            variants={gameScreenVariants}
-            initial="initial"
-            animate="animate"
-            exit="exit"
-          >
-            <Outlet />
-          </motion.div>
-        )}
-      </AnimatePresence>
-    </main>
-  );
+    return (
+        <main className="h-screen mx-auto bg-background">
+            {!isVersionAtLeast("7.2") ?
+                <div className="flex space-y-3 h-[95vh] items-center justify-center flex-col">
+                    <div className="w-[30%] mx-auto pb-2">
+                        <img src={sadFace} />
+                    </div>
+                    <p className="text-2xl font-medium text-center">У вас слишком старая версия.</p>
+                    <p className="w-[90%] text-center">Попробуйте обновть телеграм</p>
+                </div>
+                :
+                <AnimatePresence>
+                    {isLoading ? (
+                        <motion.div
+                            key="loader"
+                            variants={loaderVariants}
+                            initial="initial"
+                            animate="animate"
+                            exit="exit"
+                        >
+                            <Loader />
+                        </motion.div>
+                    ) : (
+                        <motion.div
+                            key="gameScreen"
+                            id="gameScreen"
+                            variants={gameScreenVariants}
+                            initial="initial"
+                            animate="animate"
+                            exit="exit"
+                        >
+                            <Outlet />
+                        </motion.div>
+                    )}
+                </AnimatePresence>
+            }
+        </main>
+    );
 };
diff --git a/src/components/ui/loader.tsx b/src/components/ui/loader.tsx
@@ -1,33 +1,7 @@
-import { motion } from 'framer-motion';
 
 const Loader = () => {
   return (
     <div className="flex items-end justify-center h-screen">
-      <svg
-        className="w-[50%]"
-        width="1160"
-        height="182"
-        viewBox="0 0 1160 182"
-        fill="none"
-        xmlns="http://www.w3.org/2000/svg"
-      >
-        <motion.path
-          d="M69.4 20.545C96.3467 20.545 117.632 23.8417 133.255 30.435C148.878 36.885 159.772 45.915 165.935 57.525C172.242 68.9917 175.395 83.11 175.395 99.88C175.395 115.79 171.812 129.693 164.645 141.59C157.478 153.487 146.728 162.732 132.395 169.325C118.062 175.775 100.432 179 79.505 179C66.7483 179 53.7767 179 40.59 179C27.4033 179 14.0733 178.928 0.600001 178.785C1.74667 150.548 2.32 124.247 2.32 99.88C2.32 75.2267 1.74667 49.4983 0.600001 22.695C17.6567 21.2617 40.59 20.545 69.4 20.545ZM85.525 136.215C98.855 136.215 107.742 132.99 112.185 126.54C116.628 120.09 118.85 111.203 118.85 99.88C118.85 88.9867 116.485 80.1717 111.755 73.435C107.168 66.6983 98.425 63.33 85.525 63.33C71.6217 63.33 61.23 63.76 54.35 64.62V136.215H85.525ZM214.864 48.925C205.834 48.925 199.098 46.7033 194.654 42.26C190.354 37.8167 188.204 32.0117 188.204 24.845C188.204 17.8217 190.354 12.0167 194.654 7.42999C199.098 2.84332 205.834 0.549991 214.864 0.549991C223.464 0.549991 230.058 2.91499 234.644 7.64499C239.231 12.2317 241.524 17.965 241.524 24.845C241.524 32.0117 239.303 37.8167 234.859 42.26C230.416 46.7033 223.751 48.925 214.864 48.925ZM189.924 179C190.928 155.923 191.429 136.86 191.429 121.81C191.429 103.893 190.856 83.8267 189.709 61.61H241.309C240.163 82.9667 239.589 103.033 239.589 121.81C239.589 137.577 240.091 156.64 241.094 179H189.924ZM323.795 181.15C311.755 181.15 299.5 179.502 287.03 176.205C274.704 172.765 263.094 167.605 252.2 160.725L274.775 129.98C281.369 134.71 289.324 138.437 298.64 141.16C307.957 143.74 315.984 145.03 322.72 145.03C329.17 145.03 334.115 144.17 337.555 142.45C341.139 140.587 342.93 138.222 342.93 135.355C342.93 133.062 342.07 131.27 340.35 129.98C338.63 128.69 336.265 128.045 333.255 128.045C331.392 128.045 329.242 128.117 326.805 128.26C324.512 128.403 322.649 128.547 321.215 128.69C313.762 129.55 306.094 129.98 298.21 129.98C285.454 129.98 275.062 127.615 267.035 122.885C259.152 118.012 255.21 110.128 255.21 99.235C255.21 86.6217 261.159 76.875 273.055 69.995C284.952 62.9717 302.439 59.46 325.515 59.46C336.839 59.46 348.234 61.1083 359.7 64.405C371.31 67.5583 381.559 72.36 390.445 78.81L365.72 103.75C357.55 99.45 349.882 96.44 342.715 94.72C335.692 92.8567 328.597 91.925 321.43 91.925C316.414 91.925 312.114 92.9283 308.53 94.935C304.947 96.9417 303.155 99.235 303.155 101.815C303.155 103.822 303.872 105.398 305.305 106.545C306.882 107.692 308.889 108.265 311.325 108.265C313.762 108.265 317.13 108.05 321.43 107.62C331.894 106.903 339.705 106.545 344.865 106.545C359.772 106.545 371.31 109.053 379.48 114.07C387.65 119.087 391.735 126.755 391.735 137.075C391.735 152.555 385.715 163.807 373.675 170.83C361.635 177.71 345.009 181.15 323.795 181.15ZM484.182 179C485.042 157.93 485.472 138.508 485.472 120.735C485.472 114.428 483.895 109.412 480.742 105.685C477.732 101.958 473.862 100.095 469.132 100.095C464.115 100.095 459.815 102.532 456.232 107.405C452.792 112.278 451.072 118.943 451.072 127.4L450.857 126.97C450.857 150.333 451.144 167.677 451.717 179H400.332C401.479 158.36 402.052 130.41 402.052 95.15C402.052 59.89 401.479 31.94 400.332 11.3H451.502L451.717 77.52L451.502 88.915C454.942 78.8817 460.03 71.5 466.767 66.77C473.647 61.8967 481.387 59.46 489.987 59.46C498.587 59.46 506.04 61.395 512.347 65.265C518.654 68.9917 523.384 74.08 526.537 80.53C529.834 86.98 531.482 94.2183 531.482 102.245V133.205C531.482 152.268 531.84 167.533 532.557 179H484.182ZM612.174 20.545C639.121 20.545 660.406 23.8417 676.029 30.435C691.653 36.885 702.546 45.915 708.709 57.525C715.016 68.9917 718.169 83.11 718.169 99.88C718.169 115.79 714.586 129.693 707.419 141.59C700.253 153.487 689.503 162.732 675.169 169.325C660.836 175.775 643.206 179 622.279 179C609.523 179 596.551 179 583.364 179C570.178 179 556.848 178.928 543.374 178.785C544.521 150.548 545.094 124.247 545.094 99.88C545.094 75.2267 544.521 49.4983 543.374 22.695C560.431 21.2617 583.364 20.545 612.174 20.545ZM628.299 136.215C641.629 136.215 650.516 132.99 654.959 126.54C659.403 120.09 661.624 111.203 661.624 99.88C661.624 88.9867 659.259 80.1717 654.529 73.435C649.943 66.6983 641.199 63.33 628.299 63.33C614.396 63.33 604.004 63.76 597.124 64.62V136.215H628.299ZM866.644 143.31C866.644 148.183 867.217 151.623 868.364 153.63C869.51 155.637 871.804 157.07 875.244 157.93L874.384 178.14C869.797 178.857 865.784 179.358 862.344 179.645C859.047 179.932 854.604 180.075 849.014 180.075C836.687 180.075 828.517 177.352 824.504 171.905C820.49 166.315 818.484 159.22 818.484 150.62V145.245C814.327 156.998 808.235 165.742 800.209 171.475C792.325 177.208 782.22 180.075 769.894 180.075C755.56 180.075 744.739 177.208 737.429 171.475C730.262 165.742 726.679 157.213 726.679 145.89C726.679 136.573 729.76 129.263 735.924 123.96C742.087 118.657 751.619 115.002 764.519 112.995C753.625 105.255 742.732 98.5183 731.839 92.785C740.439 81.8917 750.257 73.65 761.294 68.06C772.33 62.3267 785.732 59.46 801.499 59.46C823.572 59.46 839.912 64.2617 850.519 73.865C861.269 83.325 866.644 97.945 866.644 117.725V143.31ZM806.014 97.3C798.704 97.3 792.254 98.5183 786.664 100.955C781.074 103.392 776.057 107.047 771.614 111.92C780.214 110.917 790.964 110.415 803.864 110.415C809.167 110.415 812.894 109.77 815.044 108.48C817.194 107.19 818.269 105.542 818.269 103.535C818.269 101.815 817.194 100.382 815.044 99.235C812.894 97.945 809.884 97.3 806.014 97.3ZM783.439 145.03C791.465 145.03 798.704 143.525 805.154 140.515C811.604 137.362 816.047 133.277 818.484 128.26V122.67C815.044 124.39 811.245 125.752 807.089 126.755C802.932 127.615 797.915 128.475 792.039 129.335L784.299 130.625C776.272 132.202 772.259 134.925 772.259 138.795C772.259 142.952 775.985 145.03 783.439 145.03ZM951.184 181.15C939.144 181.15 926.889 179.502 914.419 176.205C902.092 172.765 890.482 167.605 879.589 160.725L902.164 129.98C908.757 134.71 916.712 138.437 926.029 141.16C935.346 143.74 943.372 145.03 950.109 145.03C956.559 145.03 961.504 144.17 964.944 142.45C968.527 140.587 970.319 138.222 970.319 135.355C970.319 133.062 969.459 131.27 967.739 129.98C966.019 128.69 963.654 128.045 960.644 128.045C958.781 128.045 956.631 128.117 954.194 128.26C951.901 128.403 950.037 128.547 948.604 128.69C941.151 129.55 933.482 129.98 925.599 129.98C912.842 129.98 902.451 127.615 894.424 122.885C886.541 118.012 882.599 110.128 882.599 99.235C882.599 86.6217 888.547 76.875 900.444 69.995C912.341 62.9717 929.827 59.46 952.904 59.46C964.227 59.46 975.622 61.1083 987.089 64.405C998.699 67.5583 1008.95 72.36 1017.83 78.81L993.109 103.75C984.939 99.45 977.271 96.44 970.104 94.72C963.081 92.8567 955.986 91.925 948.819 91.925C943.802 91.925 939.502 92.9283 935.919 94.935C932.336 96.9417 930.544 99.235 930.544 101.815C930.544 103.822 931.261 105.398 932.694 106.545C934.271 107.692 936.277 108.265 938.714 108.265C941.151 108.265 944.519 108.05 948.819 107.62C959.282 106.903 967.094 106.545 972.254 106.545C987.161 106.545 998.699 109.053 1006.87 114.07C1015.04 119.087 1019.12 126.755 1019.12 137.075C1019.12 152.555 1013.1 163.807 1001.06 170.83C989.024 177.71 972.397 181.15 951.184 181.15ZM1111.57 179C1112.43 157.93 1112.86 138.508 1112.86 120.735C1112.86 114.428 1111.28 109.412 1108.13 105.685C1105.12 101.958 1101.25 100.095 1096.52 100.095C1091.5 100.095 1087.2 102.532 1083.62 107.405C1080.18 112.278 1078.46 118.943 1078.46 127.4L1078.25 126.97C1078.25 150.333 1078.53 167.677 1079.11 179H1027.72C1028.87 158.36 1029.44 130.41 1029.44 95.15C1029.44 59.89 1028.87 31.94 1027.72 11.3H1078.89L1079.11 77.52L1078.89 88.915C1082.33 78.8817 1087.42 71.5 1094.16 66.77C1101.04 61.8967 1108.78 59.46 1117.38 59.46C1125.98 59.46 1133.43 61.395 1139.74 65.265C1146.04 68.9917 1150.77 74.08 1153.93 80.53C1157.22 86.98 1158.87 94.2183 1158.87 102.245V133.205C1158.87 152.268 1159.23 167.533 1159.95 179H1111.57Z"
-          className={'stroke-primary'}
-          strokeWidth="5"
-          initial={{ pathLength: 0 }}
-          animate={{
-            pathLength: [0, 1, 0],
-          }}
-          transition={{
-            duration: 3,
-            ease: 'easeInOut',
-            times: [0, 0.5, 1],
-            repeat: Infinity,
-            repeatDelay: 0,
-          }}
-        />
-      </svg>
     </div>
   );
 };

diff --git a/src/modules/game/card.tsx b/src/modules/game/card.tsx
@@ -37,7 +37,7 @@ export const CardComponent = ({ data, deltaY }: Props) => {
     }, [expanded]);
 
     const handleDrag = (_: any, info: PanInfo) => {
-        if (Math.abs(info.delta.y) > Math.abs(info.delta.x)) {
+        if (Math.abs(info.delta.y) > Math.abs(info.delta.x) && Math.abs(info.offset.y) < 50) {
             if (info.delta.y < 0 && Math.abs(info.offset.x) < 20) {
                 setExpanded(true);
             } else {
@@ -47,13 +47,13 @@ export const CardComponent = ({ data, deltaY }: Props) => {
     };
 
     return (
-        <div className="relative h-full">
+        <div className="relative h-full overflow-hidden rounded-3xl">
             <div className="h-[420px] w-full xs:h-[420px]">
-                <div className="bg-slate-100 h-full w-full rounded-t-3xl overflow-hidden">
+                <div className="bg-slate-100 h-full w-full rounded-t-3xl pb-4 overflow-hidden">
                     <img
                         draggable="false"
                         className="h-full w-auto min-w-full object-cover"
-                        src={data.image}
+                        src={data.images[0]}
                     />
                 </div>
             </div>

diff --git a/src/modules/game/match.card.tsx b/src/modules/game/match.card.tsx
@@ -43,26 +43,26 @@ const MatchCard = () => {
             className="flex h-screen flex-col justify-center items-center overflow-hidden  ${
       isDragging"
         >
-            <div className="text-3xl py-5">Это метч!</div>
+            <div className="text-3xl py-5">Это мэтч!</div>
             <div
                 id="cardsWrapper"
                 className="w-full aspect-[30/35] max-w-[90vw] relative z-10"
             >
-                <div className="relative h-full">
+                <div className="relative h-full rounded-3xl overflow-hidden">
                     <div className="h-[380px] w-full">
-                        <div className="bg-slate-100 h-full w-full rounded-t-3xl overflow-hidden">
+                        <div className="bg-slate-100 h-full w-full rounded-3xl pb-4 overflow-hidden">
                             <img
                                 draggable="false"
                                 className="h-full w-auto min-w-full object-cover"
-                                src={card?.image}
+                                src={card?.images[0]}
                             />
                         </div>
                     </div>
                     <div className="absolute top-0 w-full h-full">
                         <div
                             className="absolute pt-4 bottom-0 w-full rounded-3xl bg-secondary shadow-md overflow-hidden"
                         >
-                            <h1 className="text-white text-lg font-medium mx-4">{card?.title}</h1>
+                            <h1 className="text-foreground text-lg font-medium mx-4">{card?.title}</h1>
                             <div className="h-full">
                                 <p onClick={() => {
                                     const url = `https://yandex.ru/maps/?rtext=${card?.location.lat}%2C${card?.location.lon}`

diff --git a/src/modules/game/result.card.tsx b/src/modules/game/result.card.tsx
@@ -26,11 +26,11 @@ export const ResultCard = (data: { card: Card }) => {
                         ~ {data.card.priceAvg} ₽
                     </div>
                     <div className="flex bg-background font-medium gap-1 justify-center items-center py-1 rounded-xl">
-                        <WalkIcon className="h-[1.2rem] w-[0.9rem] text-primary" /> {getTime(settings.location, data.card.location)}
+                        <WalkIcon className="h-[1.2rem] w-[0.9rem] text-primary" /><p className="line-clamp-1">{getTime(settings.location, data.card.location)}</p>
                     </div>
                 </div>
             </div>
-            <img className="h-full aspect-square rounded-lg object-cover" src={data.card.image} />
+            <img className="h-full aspect-square rounded-lg object-cover" src={data.card.images[0]} />
         </div>
     )
 }
diff --git a/src/modules/game/swipable.card.tsx b/src/modules/game/swipable.card.tsx
@@ -48,7 +48,7 @@ const SwipableCard = ({ id, data }: Props) => {
     };
 
     const onPan = (info: PanInfo) => {
-        if (Math.abs(info.delta.x) > Math.abs(info.delta.y)) x.set(info.offset.x);
+        if (Math.abs(info.delta.x) > Math.abs(info.delta.y) || Math.abs(info.offset.x) > 20) x.set(info.offset.x);
     }
 
     return (