Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Subscribe page front end skeleton #1542

Open
9 tasks done
TylerMatteo opened this issue Oct 1, 2024 · 1 comment · May be fixed by #1563
Open
9 tasks done

Subscribe page front end skeleton #1542

TylerMatteo opened this issue Oct 1, 2024 · 1 comment · May be fixed by #1563
Assignees

Comments

@TylerMatteo
Copy link
Contributor

TylerMatteo commented Oct 1, 2024

Create front end page for ZAP subscriptions

This Issue is for creating the front end for this new page in ZAP Search. Figma designs can be found here.

Acceptance Criteria

  • Create new page for subscriptions at /subscribe
  • Add new "Email Notifications" link in to nav bar
  • Link in "You can find the Community District to any New York City address here" links to https://zola.planning.nyc.gov/
  • this page link under "Definition for ZAP Updates" section links to /statuses page
  • User can enter email address (email validation out of scope for now)
  • Checking "Community Districts (CD) Updates" box enables section for selecting community districts. Borough accordions should be disabled until CD box is checked
  • Once CD Updates box is checked, user can expand accordion and check boxes for each of 59 CDs. Existing CD helper can be found here
  • Checking "Select All" box for a borough checks all CD boxes for that borough. Unchecking it unchecks all CD boxes
  • Because validation isn't being handled here, "Subscribe" button can just be hard coded to disabled

Notes on implementing designs

  1. @jessicashanshanhuang used the new design components in Figma for convenience, but because we're building this into an older app that doesn't have access to this components, we can use existing components in the app where necessary. Text inputs, checkboxes, and buttons can use the existing styling in the app. Look for other instances of those components in the code base for reference.
  2. The designs call for accordions. We don't have those in the app as far as I can tell, but ZAP Search does import the framework Foundation. Trying to use their Accordion component could be a good place to start. Then we can try styling it as close as we can to the designs.
  3. The designs in Figma don't specify behavior for smaller screen sizes. @jessicashanshanhuang is working on annotating them for that but we can get started on building this page now. For an example of how the page content can fit in a responsive "container" see @dhochbaum-dcp's PR the statuses page.
@TylerMatteo
Copy link
Contributor Author

@pratishta we now have mobile designs.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants