New UI #1890
New UI #1890
Conversation
| import { InputHTMLAttributes, Ref } from "react"; | ||
| import styled from "styled-components"; | ||
|
|
||
| export const BigInput = styled.input` |
There was a problem hiding this comment.
for reimplementations of existing components, i would prefer their names to not overlap with the existing components, so as to not hinder development on existing UIs. Something like BigInput2 would work for me
| inputProps: EmailCodeInputProps | ||
| ): JSX.Element => { | ||
| return ( | ||
| <BigInput |
There was a problem hiding this comment.
curious whether this opens up the digit input UI on mobile
| import React from "react"; | ||
| import styled from "styled-components"; | ||
|
|
||
| const TypographyText = styled.span` |
There was a problem hiding this comment.
slightly unclear what this is for - typography is very vague as a name. are you just trying out the font here? if so that's fine but leave a comment
There was a problem hiding this comment.
not only, but also define a set of sizes and styles for our texts,
Head branch was pushed to by a user without write access
There was a problem hiding this comment.
this will probably need to be copied into the CardBody component of both EdDSATicketPCD and PODTicketPCD. I suggest creating a boolean prop for both of those components that lets the caller of those components to switch between the old and new implementations of the UIs.
packages/ui/eddsa-ticket-pcd-ui/src/CardBody.tsxpackages/ui/pod-ticket-pcd-ui/src/CardBody.tsx
we can do that in a follow-up PR - it's not blocking. but I would definitely like to get it done before the end of phase 3.
that might mean some of the UI components that you've implemented in passport-client might need to be moved to passport-ui
There was a problem hiding this comment.
Got it, we will follow this up
There was a problem hiding this comment.
What is the reason for this though? So we will reuse the component logic?
| {appConfig.devMode && ( | ||
| <Route path="components" element={<ComponentsScreen />} /> | ||
| )} |
There was a problem hiding this comment.
| {appConfig.devMode && ( | |
| <Route path="components" element={<ComponentsScreen />} /> | |
| )} | |
| <Route path="components" element={<ComponentsScreen />} /> |
|
please run |
|
this PR will not be able to merged without 
looks like there are a few problems - mostly formatting related. please make sure to set up your vs-code to use the prettier configuration included in the repo, so that the code is always auto-formatted consistently with the rest of the project. |
|
Closed in favor of #1894 |
copied from #1890 --------- Co-authored-by: or orsatti <[email protected]> Co-authored-by: Amir Angel <[email protected]> Co-authored-by: GuySerfaty <[email protected]>
copied from #1890 --------- Co-authored-by: or orsatti <[email protected]> Co-authored-by: Amir Angel <[email protected]> Co-authored-by: GuySerfaty <[email protected]>
This PR implement all the new UI components, and the new background.
We made sure to not touch the existing app.
Showcase:
Inputs:
Screen.Recording.2024-09-22.at.21.47.52.mov
Buttons:
List:
Accordion:
Screen.Recording.2024-09-22.at.21.49.08.mov
POD Card:
Ticket:
Modal:
Screen.Recording.2024-09-22.at.21.52.22.mov