Editing customer register page for Dawn theme

Technical Q&A
,

Topic summary

Goal: customize the Shopify Dawn customer register page to (1) left‑align a radio button group, (2) add frames (borders) around three dropdowns, and (3) display “First name” and “Last name” side‑by‑side in two columns. Access link requires password.

What was done:

  • A responder provided CSS for (1) and (3):
    • Left align: .register .field-radio { text-align: left; }
    • Two-column layout using width:48% and floats on specific .register .field selectors.
  • Clarified where to place CSS: inside main-register.liquid, wrapped in tags.

Open points / issues:

  • The “frames around dropdowns” request was clarified as adding a box/border around each dropdown, but no code was supplied yet.
  • After adding the provided CSS, the two columns became misaligned. The responder asked the poster to update to a newer code version (not shown), indicating further adjustments are needed.

Status: no confirmed fix yet; dropdown framing remains unanswered. Code snippets and their placement are central to the solution. Discussion ongoing.

Summarized with AI on January 12. AI used: gpt-5.
2

Hi @Minako85

You can add this code to finish your 1st and 3rd requests. I don’t get your 2nd request.

.register .field-radio { text-align: left; }

.register .field:nth-of-type(2),
.register .field.grid__half {
    width: 48%;
    margin-bottom: 20px;
}
.register .field:nth-of-type(2) { 
    float: right; 
}
.register .field.grid__half {
    float: left;
}