School Association UI Tweaks

[hannahbergam]

This PR handles several UI updates as detailed below. I did switch back to the form saving the raw ncesId (which might be something like 'clickToAdd') so I added those strings to the cleanup work (thus assigning an empty ncesId) in the finish_sign_up.js file.

• Divider line in dropdown (opt groups)
• US at the top
• Dropdown appears at same time as zip but is disabled
  • In addition, creates disabled states for label and button below
• Fixed width styling on input box (followup: Ben is working on fixing the width to the dropdowns)
• Update the string for add school
• Adds a new button ‘I don’t teach in a school setting' to below the dropdown
• Moves the static options to the bottom of the schools list
• Moves ‘select a school’ option to top of schools list

Screen.Recording.2024-04-12.at.1.52.34.PM.mov

Warning!!

The AP CSP Create Performance Task is in progress. The most critical dates are from April 3 - April 30, 2024. Please consider any risk introduced by this PR that could affect our students taking AP CSP. Code.org students taking AP CSP primarily use App Lab for their Create Task, however a small percent use Game Lab. Carefully consider whether your change has any risk of alterering, changing, or breaking anything in these two labs. Even small changes, such as a different button color, are considered significant during this time period. Reach out to the Student Learning team or Curriculum team for more details.

Links

• spec:
• jira ticket: https://codedotorg.atlassian.net/browse/ACQ-1746

Testing story

Deployment strategy

Follow-up work

Privacy

Security

Caching

PR Checklist:

• Tests provide adequate coverage
• Privacy and Security impacts have been assessed
• Code is well-commented
• New features are translatable or updates will not break translations
• Relevant documentation has been added or updated
• User impact is well-understood and desirable
• Pull Request is labeled appropriately
• Follow-up work items (including potential tech debt) are tracked and linked

[TurnerRiley]

Super stoked about how all this looks! Just had a couple tiny nits/questions

[bethanyaconnor]

Looks good after addressing Turner's comments!

[bethanyaconnor]

🎉