Andreas/mtg_python_deckbuilder
1
0
Fork 0
mirror of https://github.com/mwisnowski/mtg_python_deckbuilder.git synced 2025-12-16 07:30:13 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge pull request #38 from mwisnowski/fix/wizard-enhancements

Browse source 
fix: Quick Build UI now uses full-width layout on desktop
This commit is contained in:
mwisnowski 2025-10-14 17:48:46 -07:00 • committed by GitHub
commit 15c11ec3d5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 20 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

5
CHANGELOG.md
View file

@ -9,7 +9,7 @@ This format follows Keep a Changelog principles and aims for Semantic Versioning
## [Unreleased]
### Summary
_No unreleased changes yet._
Minor UI fixes for Quick Build progress and completion display.
### Added
_No unreleased additions yet._
@ -18,7 +18,8 @@ _No unreleased additions yet._
_No unreleased changes yet._
### Fixed
_No unreleased fixes yet._
- Quick Build progress display now uses full desktop width instead of narrow mobile-like layout
- Quick Build completion screen properly transitions to full-width Step 5 layout matching manual build experience_
## [2.7.0] - 2025-10-14
### Summary

5
RELEASE_NOTES_TEMPLATE.md
View file

@ -1,7 +1,7 @@
# MTG Python Deckbuilder ${VERSION}
### Summary
_No unreleased changes yet._
Minor UI fixes for Quick Build progress and completion display.
### Added
_No unreleased additions yet._
@ -10,4 +10,5 @@ _No unreleased additions yet._
_No unreleased changes yet._
### Fixed
_No unreleased fixes yet._
- Quick Build progress display now uses full desktop width instead of narrow mobile-like layout
- Quick Build completion screen properly transitions to full-width Step 5 layout matching manual build experience_

15
code/web/routes/build.py
View file

@ -3760,19 +3760,16 @@ def quick_build_progress(request: Request):
logger.info(f"[Progress Poll] sid={sid}, progress={progress is not None}, running={progress.get('running') if progress else None}")
if not progress or not progress.get("running"):
# Build complete - return Step 5 content + remove the polling div
# Build complete - return Step 5 content that replaces the entire wizard container
res = sess.get("last_result")
if res and res.get("done"):
ctx = step5_ctx_from_result(request, sess, res)
# Render Step 5, then add script to remove polling div
step5_html = templates.get_template("build/_step5.html").render(ctx)
# Return Step 5 content + a script that removes the poller and replaces #wizard
final_html = f'''
{step5_html}
<div id="quick-build-poller" hx-swap-oob="outerHTML"></div>
'''
response = HTMLResponse(final_html)
# Return Step 5 which will replace the whole wizard div
response = templates.TemplateResponse("build/_step5.html", ctx)
response.set_cookie("sid", sid, httponly=True, samesite="lax")
# Tell HTMX to target #wizard and swap outerHTML to replace the container
response.headers["HX-Retarget"] = "#wizard"
response.headers["HX-Reswap"] = "outerHTML"
return response
# Fallback if no result yet
return HTMLResponse('Build complete. Please refresh.')

2
code/web/templates/build/_quick_build_progress.html
View file

@ -1,6 +1,6 @@
{# Quick Build Progress Indicator - Current Stage + Completed List #}
<div id="wizard" class="wizard-container" style="max-width:800px; margin:2rem auto; padding:1rem;">
<div id="wizard" class="wizard-container" style="max-width:1200px; margin:2rem auto; padding:2rem;">
<div id="wizard-content">
{% include "build/_quick_build_progress_content.html" %}
</div>

14
code/web/templates/build/_quick_build_progress_content.html
View file

@ -1,15 +1,15 @@
{# Quick Build Progress Content (inner content only, for HTMX updates) #}
<div class="wizard-header" style="text-align:center; margin-bottom:3rem;">
<h2 style="margin:0 0 .5rem 0;">Automatic Build in Progress</h2>
<p class="muted" style="margin:0;">Building your deck automatically without approval steps...</p>
<div class="wizard-header" style="text-align:center; margin-bottom:4rem;">
<h2 style="margin:0 0 1rem 0; font-size:32px;">Automatic Build in Progress</h2>
<p class="muted" style="margin:0; font-size:16px;">Building your deck automatically without approval steps...</p>
</div>
{# Simplified Phase Indicator #}
<div style="text-align:center; margin:4rem 0; padding:2rem; background:rgba(59,130,246,0.1); border:2px solid rgba(59,130,246,0.3); border-radius:8px;">
<div style="font-size:12px; text-transform:uppercase; letter-spacing:0.05em; color:#94a3b8; margin-bottom:0.75rem;">Current Phase</div>
<div style="font-size:24px; font-weight:600; color:#3b82f6;">{{ current_stage }}</div>
<div style="text-align:center; margin:6rem auto; max-width:700px; padding:3rem 2rem; background:rgba(59,130,246,0.1); border:2px solid rgba(59,130,246,0.3); border-radius:12px;">
<div style="font-size:14px; text-transform:uppercase; letter-spacing:0.05em; color:#94a3b8; margin-bottom:1rem;">Current Phase</div>
<div style="font-size:32px; font-weight:600; color:#3b82f6; line-height:1.3;">{{ current_stage }}</div>
</div>
<div class="muted" style="text-align:center; font-size:12px; margin-top:2rem;">
<div class="muted" style="text-align:center; font-size:14px; margin-top:3rem;">
<p style="margin:0;">This may take 10-30 seconds depending on deck complexity...</p>
</div>