[OCaml] Mobile-friendly clone of cgit.
feat prevent body scroll and zoom on mobile for app-like feel
- Set viewport meta to maximum-scale=1, user-scalable=no - Add touch-action: pan-y on body to block pinch-zoom - On mobile: html/body get overflow:hidden and fixed height, body becomes a flex column, #main becomes the sole scroll container with overflow-y:auto and -webkit-overflow-scrolling:touch
Changed files
lib/static/styles.css
@@ -13,6 +13,7 @@
13
13
padding: 0;
14
14
background-color: #181818;
15
15
color: white;
16
Added:
touch-action: pan-y;
16
17
}
17
18
18
19
/* --- Harmonized anchor defaults (cgit-inspired) ---
@@ -1000,6 +1001,17 @@
1000
1001
}
1001
1002
1002
1003
@media (max-width: 600px) {
1004
Added:
html, body {
1005
Added:
height: 100%;
1006
Added:
overflow: hidden;
1007
Added:
overscroll-behavior: none;
1008
Added:
}
1009
Added:
1010
Added:
body {
1011
Added:
display: flex;
1012
Added:
flex-direction: column;
1013
Added:
}
1014
Added:
1003
1015
#page-header {
1004
1016
padding: 0.5em 0.5em;
1005
1017
}
@@ -1007,6 +1019,9 @@
1007
1019
#main {
1008
1020
padding: 0 0.5em;
1009
1021
padding-bottom: 60px;
1022
Added:
flex: 1;
1023
Added:
overflow-y: auto;
1024
Added:
-webkit-overflow-scrolling: touch;
1010
1025
}
1011
1026
1012
1027
.commit-author {
lib/views/error.ml
@@ -34,7 +34,10 @@
34
34
HTML.title [] "%s" page_title;
35
35
meta
36
36
[
37
Removed:
name "viewport"; content "width=device-width, initial-scale=1";
37
Added:
name "viewport";
38
Added:
content
39
Added:
"width=device-width, initial-scale=1, maximum-scale=1, \
40
Added:
user-scalable=no";
38
41
];
39
42
link [ rel "stylesheet"; href "/static/styles.css" ];
40
43
];
lib/views/layout.ml
@@ -104,7 +104,13 @@
104
104
head []
105
105
[
106
106
title [] "%s" page_title;
107
Removed:
meta [ name "viewport"; content "width=device-width, initial-scale=1" ];
107
Added:
meta
108
Added:
[
109
Added:
name "viewport";
110
Added:
content
111
Added:
"width=device-width, initial-scale=1, maximum-scale=1, \
112
Added:
user-scalable=no";
113
Added:
];
108
114
link [ rel "stylesheet"; href "/static/styles.css" ];
109
115
link
110
116
[