frontend: prevent menu-bar from wrapping on smaller screens like iphone 5
Massimo Melina committed
May 22, 2022 at 16:35 UTC
a9a65b9d377f30f44bcc309e6e5d619437d3e342
1 file changed
+9
-3
frontend/src/index.scss
+9
-3
@@ -203,14 +203,20 @@ ul.dir {
203
#menu-panel {
204
margin-bottom: 0.2em;
205
206
- & button {
207
- margin: 0.1em;
208
- }
206
}
207
#menu-bar {
208
display: flex;
209
justify-content: space-evenly;
210
flex-wrap: wrap;
211
+ &>* {
212
+ flex: auto;
213
+ margin: 0.1em;
214
+ }
215
+ & button { /* no need for horizontal padding as we are using flex to grow */
216
+ padding-left: 0;
217
+ padding-right: 0;
218
+ }
219
+ &>a>button { width:100% } /* occupy whole available space */
220
}
221
#searched {
222
margin: .2em;