Vasanko/cista-storage
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Attempt a better mobile layout, to fix sizing issues with Brave Android.

Browse Source
This commit is contained in:
LeoVasanko
2026-01-22 00:57:30 +00:00
parent e55e11b399
commit fa60c962c4
2 changed files with 10 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/index.html
+1 -1
View File
@@ -2,7 +2,7 @@
<html lang=en> <html lang=en>
<meta charset=UTF-8> <meta charset=UTF-8>
<title>Cista Storage</title> <title>Cista Storage</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content">
<link rel="icon" href="/src/assets/logo.svg"> <link rel="icon" href="/src/assets/logo.svg">
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
frontend/src/assets/main.css
+9 -1
View File
@@ -110,6 +110,7 @@
margin: 0 .5rem 0 1rem !important; margin: 0 .5rem 0 1rem !important;
} }
body#app { body#app {
position: static !important;
height: auto !important; height: auto !important;
} }
main { main {
@@ -165,6 +166,11 @@ body {
font-family: 'Roboto'; font-family: 'Roboto';
color: var(--primary-color); color: var(--primary-color);
margin: 0; margin: 0;
/* Prevent any scrolling on body */
overflow: hidden;
/* Fallback for older browsers */
height: 100vh;
height: 100dvh;
} }
tbody .size, tbody .size,
tbody .modified { tbody .modified {
@@ -214,12 +220,14 @@ table {
gap: 0; gap: 0;
} }
body#app { body#app {
height: 100vh; position: fixed;
inset: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
main { main {
flex: 1 1 auto; flex: 1 1 auto;
min-height: 0; /* Allow flex child to shrink below content size */
padding-bottom: 3em; /* convenience space on the bottom */ padding-bottom: 3em; /* convenience space on the bottom */
overflow-y: scroll; overflow-y: scroll;
text-align: center; text-align: center;