[OCaml] Mobile-friendly clone of cgit.
style uniform rounded nav buttons with inner margin
Both top and bottom nav links now use 0.5rem border-radius with 0.25em padding and gap inside the black bar, giving tastefully rounded pill-shaped buttons with consistent spacing.
lib/static/styles.css
@@ -167,13 +167,14 @@
167
167
display: flex;
168
168
flex-wrap: wrap;
169
169
list-style-type: none;
170
Removed:
padding: 0;
170
Added:
padding: 0.25em;
171
171
margin: 0;
172
172
margin-left: auto;
173
Added:
gap: 0.25em;
173
174
}
174
175
175
176
nav#top ul li {
176
Removed:
border-radius: 0.25rem;
177
Added:
border-radius: 0.5rem;
177
178
}
178
179
179
180
nav#top ul li a {
@@ -181,7 +182,7 @@
181
182
align-items: center;
182
183
padding: 0.5em 1em;
183
184
min-height: var(--target-size);
184
Removed:
border-radius: 0.25rem;
185
Added:
border-radius: 0.5rem;
185
186
box-sizing: border-box;
186
187
}
187
188
@@ -192,12 +193,12 @@
192
193
}
193
194
194
195
nav#top ul li[aria-current="page"] {
195
Removed:
border-radius: 0.25rem;
196
Added:
border-radius: 0.5rem;
196
197
background-color: rgb(194, 79, 30);
197
198
}
198
199
199
200
nav#top ul li[aria-current="page"] a:hover {
200
Removed:
border-radius: 0.25rem;
201
Added:
border-radius: 0.5rem;
201
202
background-color: rgb(132, 40, 0);
202
203
color: white;
203
204
text-decoration: none;
@@ -1064,12 +1065,14 @@
1064
1065
display: flex;
1065
1066
list-style: none;
1066
1067
margin: 0;
1067
Removed:
padding: 0;
1068
Added:
padding: 0.25em;
1069
Added:
gap: 0.25em;
1068
1070
}
1069
1071
1070
1072
#bottom-nav ul li {
1071
1073
flex: 1;
1072
1074
border: none;
1075
Added:
border-radius: 0.5rem;
1073
1076
}
1074
1077
1075
1078
#bottom-nav ul li a {
@@ -1080,6 +1083,7 @@
1080
1083
padding: 0.5em 0;
1081
1084
font-size: 0.85em;
1082
1085
text-align: center;
1086
Added:
border-radius: 0.5rem;
1083
1087
}
1084
1088
1085
1089
#bottom-nav ul li a:hover {
@@ -1089,6 +1093,7 @@
1089
1093
1090
1094
#bottom-nav ul li[aria-current="page"] {
1091
1095
background-color: rgb(194, 79, 30);
1096
Added:
border-radius: 0.5rem;
1092
1097
}
1093
1098
1094
1099
#bottom-nav ul li[aria-current="page"] a:hover {