From b08391867687d89ea47031024d3dcff1a6251ed8 Mon Sep 17 00:00:00 2001
From: CARLOS TRIGO <carlos@kryha.io>
Date: Wed, 13 Dec 2023 13:51:57 +0100
Subject: [PATCH] increase konva size in landing

---
 frontend/src/components/base-route-mobile/styles.ts  | 5 ++---
 frontend/src/pages/landing-mobile/landing-mobile.tsx | 3 ++-
 frontend/src/pages/landing-mobile/styles.ts          | 4 +++-
 3 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/frontend/src/components/base-route-mobile/styles.ts b/frontend/src/components/base-route-mobile/styles.ts
index 21b78b099..92ef682e8 100644
--- a/frontend/src/components/base-route-mobile/styles.ts
+++ b/frontend/src/components/base-route-mobile/styles.ts
@@ -16,9 +16,8 @@ export const TopbarContainer = styled.header<AnimationProps>`
   width: 100vw;
   display: flex;
   flex-direction: row;
-  justify-content: flex-end;
+  justify-content: flex-start;
   margin-top: 12px;
-  margin-bottom: -65px;
   align-items: flex-end;
   z-index: 100;
   top: 0;
@@ -26,7 +25,7 @@ export const TopbarContainer = styled.header<AnimationProps>`
   background: transparent;
 
   @media screen and (max-width: ${breakpoints.tablet}) {
-    padding: ${margins.mini};
+    padding: ${margins.medium};
   }
 `;
 
diff --git a/frontend/src/pages/landing-mobile/landing-mobile.tsx b/frontend/src/pages/landing-mobile/landing-mobile.tsx
index b809d8254..111543093 100644
--- a/frontend/src/pages/landing-mobile/landing-mobile.tsx
+++ b/frontend/src/pages/landing-mobile/landing-mobile.tsx
@@ -96,8 +96,9 @@ export const LandingMobile: FC = () => {
               />
             </NotificationWrapper>
           </FadeInOut>
+          {/* canvas */}
           <Layout width={width} height={height}>
-            <CharacterCanvas width={width} height={height} />
+            <CharacterCanvas width={Math.floor(width*1.6)} height={Math.floor(height*1.6)} />
             {interactionMode === CATEGORY_MODE && <CategoryMode />}
             {interactionMode === ITEM_MODE && <ItemsMode />}
             {interactionMode === CHARACTER_SELECT_MODE && <CharactersMode />}
diff --git a/frontend/src/pages/landing-mobile/styles.ts b/frontend/src/pages/landing-mobile/styles.ts
index b4ec736c9..75f5790b9 100644
--- a/frontend/src/pages/landing-mobile/styles.ts
+++ b/frontend/src/pages/landing-mobile/styles.ts
@@ -41,8 +41,10 @@ export const DetailContainer = styled.div`
   animation-duration: 0.8s, 1s;
   animation-delay: 0s, 0.8s;
   height: fit-content;
-
   background: transparent;
+  max-width: 380px;
+  overflow: hidden;
+  text-overflow: ellipsis;
 
   ${SecondaryButton} {
     background: ${color.white};