CooperandGoodman/Inlander-Restaurant-Week-Picker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Mde the site more mobile friendly

Browse Source
This commit is contained in:
Derek Cooper
2026-02-24 00:01:11 -08:00
parent 7a90c4d5af
commit 035c64a97d
1 changed files with 29 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
restaurant-picker.html
View File

@@ -87,6 +87,31 @@ header p{font-size:0.85rem;color:#f0cca0;margin-top:3px}
.course-dish-name{font-weight:600;color:#f0e6d3;font-size:0.9rem}
.course-dish-restaurant{font-size:0.78rem;color:#a0785a;margin-top:2px}
.course-modal-close{margin-top:14px;flex-shrink:0;text-align:right}
.back-btn{display:none;align-items:center;gap:6px;background:#3a1a00;border:1px solid #7a4a00;color:#f5c842;padding:9px 16px;border-radius:6px;cursor:pointer;font-size:0.88rem;font-weight:600;margin-bottom:16px;width:100%}
@media(max-width:640px){
header{padding:12px 16px;gap:10px}
header h1{font-size:1.15rem}
header p{font-size:0.78rem}
.toolbar{padding:10px 12px;gap:8px}
.toolbar input{width:100%}
.toolbar select{flex:1;min-width:0}
.spacer{display:none}
.tag-counts{width:100%;order:10;text-align:center}
.course-browse-bar{padding:8px 12px}
.btn-course{flex:1;padding:7px 6px;text-align:center}
.main{height:auto;min-height:calc(100svh - 98px);flex-direction:column}
.list-panel{width:100%;min-width:0;border-right:none;min-height:calc(100svh - 98px)}
.detail-panel{display:none;width:100%;padding:16px 14px}
.main.show-detail .list-panel{display:none}
.main.show-detail .detail-panel{display:block}
.back-btn{display:flex}
.detail-header h2{font-size:1.3rem}
.detail-header .meta{font-size:0.82rem}
.detail-actions{gap:8px}
.detail-actions .check-label{font-size:0.82rem;padding:6px 10px}
.menu-item-name{font-size:0.88rem}
.menu-item-desc{font-size:0.8rem}
}
</style>
</head>
<body>
@@ -256,6 +281,7 @@ function showDetail(slug){
});
}
document.getElementById('detailPanel').innerHTML = `
<button class="back-btn" onclick="backToList()">&#8592; Back to List</button>
<div class="detail-header">
<h2>${r.name}</h2>
<div class="meta"><span class="price-badge price-${r.price}">$${r.price} per person</span>${r.cuisine} · ${r.areas.join(', ')}${m.phone?' · '+m.phone:''}</div>
@@ -270,8 +296,11 @@ function showDetail(slug){
<div style="margin-top:28px;padding-top:18px;border-top:1px solid #3a1a00">
<a href="${r.url}" target="_blank" style="color:#f5c842;font-size:0.88rem">View full menu on Inlander Restaurant Week ↗</a>
</div>`;
document.getElementById('detailPanel').scrollTop=0;
document.querySelector('.main').classList.add('show-detail');
}
function backToList(){ activeSlug=null; document.querySelector(".main").classList.remove("show-detail"); renderList();}
function getPool(){
const both = RESTAURANTS.filter(r=>{ const ri=interests[r.slug]||{}; return ri.you&&ri.wife; });
if(both.length) return both;