From 99c40b645ada1234a55a33d4b8c1b7b88fb89b41 Mon Sep 17 00:00:00 2001
From: Astra <me@astrra.space>
Date: Sat, 10 May 2025 17:25:56 +0900
Subject: [PATCH] Fix names overflowing on mobile
---
src/App.svelte | 2 +-
src/app.css | 5 +++++
src/lib/AccountComponent.svelte | 1 -
3 files changed, 6 insertions(+), 2 deletions(-)
diff --git a/src/App.svelte b/src/App.svelte
index 733320e..45a4b10 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -129,7 +129,7 @@
margin-top: 5%;
}
#Account {
- width: auto;
+ width: 85%;
padding-left: 5%;
padding-right: 5%;
margin-bottom: 20px;
diff --git a/src/app.css b/src/app.css
index 4c343e2..50da734 100644
--- a/src/app.css
+++ b/src/app.css
@@ -66,6 +66,10 @@ body {
font-size: 24px;
color: var(--text-color);
border-color: var(--border-color);
+ overflow-wrap: break-word;
+ word-wrap: normal;
+ word-break: break-word;
+ hyphens: none;
}
h1 {
@@ -75,6 +79,7 @@ h1 {
#app {
max-width: 1400px;
+ width: 100%;
margin: 0;
padding: 0;
margin-left: auto;
diff --git a/src/lib/AccountComponent.svelte b/src/lib/AccountComponent.svelte
index e324393..b455100 100644
--- a/src/lib/AccountComponent.svelte
+++ b/src/lib/AccountComponent.svelte
@@ -37,7 +37,6 @@
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
- max-width: 80%;
}
#avatar {
width: 50px;