Render lang/arch/platform as inline radios instead of ugly list boxes - #173
Merged
Conversation
…#169) The Language, Arch and Platform fields on the crackme upload and edit forms are single-value fields but were rendered as `<select multiple>` list boxes, which show up as an ugly vertical scrolling list. Present them as inline radio buttons laid out like the label checkboxes instead. - Add app/services/crackme_fields.py holding the LANG/ARCH/PLATFORM option lists in one place, exposed to templates via the existing context processor so the upload and edit forms no longer duplicate the choices. - Add templates/partial/choice_radios.html, a reusable inline single-choice radio widget styled to match partial/labels_checkboxes.html. - Use the partial in crackme/create.html and crackme/edit.html; the edit form pre-checks the crackme's current value. The search form keeps its multi-select (filtering by several values at once is intentional there). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Follow-up on the same forms: - Upload form: render Difficulty as radio buttons too, so all four classification fields (difficulty/lang/arch/platform) are consistent. - Wrap each choice group in a bordered ".choice-box" so the fields are clearly separated from one another. - Search form: replace the lang/arch/platform `<select multiple>` list boxes with the same boxed inline layout. These stay multi-select (filtering by several values is backed by `$in`), so they render as checkboxes rather than radios. Search now shares the canonical option lists from app/services/crackme_fields, dropping the stale legacy platform values. Generalise partial/choice_radios.html into partial/choice_inputs.html, which handles both radio (single-select) and checkbox (multi-select) groups and accepts either plain string options or (value, label) pairs (for difficulty). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Wrap the label checkboxes in the same .choice-box as difficulty/lang/arch/ platform so every choice group on the upload form is visually separated. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #169.
Problem
On the crackme upload and edit forms, the Language, Arch and Platform fields are single-value fields but were rendered as
<select multiple>list boxes. Browsers show those as an ugly vertical scrolling list.Change
Present them as inline radio buttons, laid out like the label checkboxes right below them, so all the classification fields read consistently and take up far less vertical space.
app/services/crackme_fields.py(new) — holds theLANG_CHOICES/ARCH_CHOICES/PLATFORM_CHOICESoption lists in one place (they were previously duplicated across the two templates). Exposed to all templates through the existinginject_globalscontext processor.templates/partial/choice_radios.html(new) — reusable inline single-choice radio widget, styled to matchpartial/labels_checkboxes.html(form-radio+form-icon).templates/crackme/create.html/templates/crackme/edit.html— use the partial; the edit form pre-checks the crackme's current value.The field names (
lang,arch,platform) and submitted values are unchanged, so the upload/edit controllers and validation need no changes. Required-field validation still triggers when nothing is chosen on upload (no radio pre-selected).Out of scope
<select multiple>— filtering by several values at once is intentional there.<select multiple>; the issue asked specifically about lang/arch/platform, so it's left for a possible follow-up.Testing
227 passed.🤖 Generated with Claude Code