mirror of
https://git.vladimir.cc/vladimir/ewsdr.git
synced 2026-08-25 17:27:32 +00:00
Improve mobile web remote layout
This commit is contained in:
+28
-15
@@ -98,34 +98,47 @@ begin
|
||||
'.sbar{flex:0 0 16px;display:flex;align-items:center;padding:0 6px;gap:10px;background:#0e0e0e;border-top:1px solid #222;font-size:10px;color:#555}' +
|
||||
'#latEl{margin-left:auto}' +
|
||||
'@media screen and (max-width:640px){' +
|
||||
// Тулбар 1: горизонтальный скролл вместо переноса
|
||||
'.tbar:not(.row2){overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;}' +
|
||||
'.tbar:not(.row2)::-webkit-scrollbar{display:none;}' +
|
||||
'body{overflow:auto;height:auto;min-height:100vh;}' +
|
||||
'.wrap{height:auto;min-height:100vh;padding:3px;}' +
|
||||
// Тулбар 1: переносим группы по строкам, чтобы не было скрытых контролов
|
||||
'.tbar:not(.row2){height:auto;min-height:32px;flex-wrap:wrap;align-items:center;overflow:visible;padding:4px;gap:4px;}' +
|
||||
'.tbar:not(.row2)>*{flex-shrink:0;}' +
|
||||
'.tbar:not(.row2) .tsep,.tbar:not(.row2) .sl-sep{display:none;}' +
|
||||
'.sl-g{height:30px;}' +
|
||||
'.sl-val{min-width:2.8em;}' +
|
||||
// Крупнее зоны касания
|
||||
'button{height:30px;}select{height:30px;}' +
|
||||
// VFO-строка: стекаем smeter / vfo-mid / right-g каждый на своей строке
|
||||
'.row2{height:auto;flex-wrap:wrap;padding:3px;gap:3px;}' +
|
||||
'.row2{height:auto;flex-wrap:wrap;padding:4px;gap:4px;}' +
|
||||
'#smeter{width:100%;height:40px;}' +
|
||||
'.vfo-mid{width:100%;gap:2px;justify-content:flex-start;}' +
|
||||
'.vfo-ro{font-size:20px;height:34px;padding:0 2px;padding-top:6px;}' +
|
||||
'.vfo-ro .dg,.vfo-ro .sp{font-size:20px;}' +
|
||||
'.vfo-hz .dg{font-size:10px;}' +
|
||||
'.vbtn{width:26px;height:26px;font-size:10px;}' +
|
||||
'.swap-g button{height:22px;padding:0 4px;font-size:9px;}' +
|
||||
'.vfo-mid{width:100%;display:grid;grid-template-columns:24px minmax(0,1fr) auto 24px minmax(0,1fr);gap:3px;align-items:center;}' +
|
||||
'#vBtnA{grid-column:1;grid-row:1;}#vDispA{grid-column:2;grid-row:1;}' +
|
||||
'.swap-g{grid-column:3;grid-row:1;justify-content:center;gap:2px;}' +
|
||||
'#vBtnB{grid-column:4;grid-row:1;}#vDispB{grid-column:5;grid-row:1;}' +
|
||||
'.vfo-ro{width:100%;font-size:16px;height:30px;padding:0 1px;padding-top:6px;justify-content:flex-start;}' +
|
||||
'.vfo-ro .dg,.vfo-ro .sp{font-size:16px;}' +
|
||||
'.vfo-hz .dg{font-size:8px;}' +
|
||||
'.vbtn{width:24px;height:24px;font-size:10px;}' +
|
||||
'.swap-g button{height:22px;padding:0 3px;font-size:8px;min-width:30px;}' +
|
||||
'.vfo-sp{display:none;}' +
|
||||
'.right-g{width:100%;margin-left:0;}' +
|
||||
'.right-g button,.right-g select{height:28px;font-size:11px;}' +
|
||||
'.right-g{width:100%;margin-left:0;display:grid;grid-template-columns:58px minmax(0,1fr) 52px;gap:4px;}' +
|
||||
'.right-g button,.right-g select{height:30px;font-size:11px;width:100%;min-width:0;}' +
|
||||
'#bandSel{min-width:0;}' +
|
||||
'.span-ov{right:4px;overflow-x:auto;scrollbar-width:none;}' +
|
||||
'.span-ov::-webkit-scrollbar{display:none;}' +
|
||||
'.sp-btn{flex:0 0 auto;height:22px;padding:0 6px;}' +
|
||||
'.spec-area{min-height:130px;flex:0 0 30vh;}' +
|
||||
'.ruler-area{flex:0 0 22px;}' +
|
||||
// Водопад короче на телефоне
|
||||
'.wf-area{flex:0 0 180px;}' +
|
||||
'.wf-area{flex:0 0 32vh;min-height:150px;}' +
|
||||
// Слайдеры чуть уже
|
||||
'input[type=range]{width:55px;}' +
|
||||
'input[type=range]{width:64px;}' +
|
||||
// TX+MOX пинним в начало тулбара чтобы были видны без скролла
|
||||
'#toneBtn{order:-3;}' +
|
||||
'.tx-g{order:-2;}' +
|
||||
'#moxBtn{order:-1;min-width:52px;height:30px;font-weight:bold;}' +
|
||||
// iOS Safari: 100vh включает адресную строку — используем реальную высоту
|
||||
'body,.wrap{height:-webkit-fill-available;}' +
|
||||
'body,.wrap{min-height:-webkit-fill-available;}' +
|
||||
'}' +
|
||||
'</style></head>' +
|
||||
|
||||
|
||||
Reference in New Issue
Block a user