julien/binome
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: adapt design for phone

Browse Source
This commit is contained in:
Julien Calixte
2026-01-24 22:24:25 +01:00
parent d4a1af72f5
commit 6d7bed5850
5 changed files with 24 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@@ -5,9 +5,13 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta <meta
name="viewport" name="viewport"
content="width=device-width,initial-scale=1.0,user-scalable=no" content="width=device-width,initial-scale=1.0,user-scalable=no,viewport-fit=cover"
/> />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="mobile-web-app-capable" content="yes" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />
<link rel="apple-touch-icon" href="/img/icons/apple-touch-icon.png" />
<title>Binôme</title> <title>Binôme</title>
</head> </head>
<body> <body>

7
src/App.vue
View File

@@ -18,10 +18,13 @@ import SWNewVersion from '@/components/SWNewVersion.vue'
flex-direction: column; flex-direction: column;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
min-height: 100vh; height: 100vh;
height: 100dvh;
overflow: hidden;
} }
img.logo { img.logo {
margin-top: 1rem; margin-top: 0.5rem;
flex-shrink: 0;
} }
</style> </style>

9
src/styles/app.scss
View File

@@ -4,6 +4,15 @@
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Major+Mono+Display&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond&family=Major+Mono+Display&display=swap');
html,
body {
height: 100vh;
height: 100dvh;
overflow: hidden;
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
box-sizing: border-box;
}
body { body {
text-align: center; text-align: center;
font-family: vars.$font-family; font-family: vars.$font-family;

6
src/views/Home.vue
View File

@@ -105,7 +105,9 @@ onMounted(() => {
display: flex; display: flex;
flex: 1; flex: 1;
flex-direction: column; flex-direction: column;
justify-content: space-around; justify-content: space-evenly;
overflow: hidden;
min-height: 0;
} }
.developers { .developers {
@@ -130,7 +132,7 @@ onMounted(() => {
} }
.global-time { .global-time {
font-size: calc(3em + 10vw); font-size: clamp(2.5rem, 8vw + 1rem, 6rem);
} }
.music { .music {

2
vite.config.ts
View File

@@ -27,7 +27,7 @@ export default defineConfig({
background_color: mainColor, background_color: mainColor,
start_url: '/', start_url: '/',
scope: '/', scope: '/',
display: 'standalone', display: 'fullscreen',
shortcuts: [ shortcuts: [
{ {
name: 'Start a session', name: 'Start a session',