feat: redesign join conversation page #15584
Conversation
Codecov Report
@@ Coverage Diff @@
## dev #15584 +/- ##
==========================================
- Coverage 43.56% 43.41% -0.15%
==========================================
Files 652 655 +3
Lines 22238 22303 +65
Branches 5086 5099 +13
==========================================
- Hits 9687 9682 -5
- Misses 11306 11381 +75
+ Partials 1245 1240 -5 |
| style={{ | ||
| display: 'flex', | ||
| alignItems: 'center', | ||
| maxWidth: `${!isMobile ? '4rem' : '100%'}`, | ||
| justifyContent: 'center', | ||
| transform: `rotate(${!isMobile ? '90' : '0'}deg)`, | ||
| marginLeft: `${!isMobile ? '' : '16px'}`, | ||
| }} |
There was a problem hiding this comment.
let's extract that to a style file and put it in the css property (not style)
| style={{ | ||
| flex: 1, | ||
| height: '1px', | ||
| backgroundColor: '#696c6e', | ||
| minWidth: '24rem', | ||
| }} |
There was a problem hiding this comment.
let's extract that to a style file and put it in the css property (not style)
There was a problem hiding this comment.
probably a question i will regret asking:
the rest of the file has all inline styling. it doesnt make sense to just move one style to a separate file.
There was a problem hiding this comment.
shall i leave all of them inline, or change all of them to a separate file 😨
There was a problem hiding this comment.
for some reason css is being parsed differently than style, breaking the page. as such i am leaving it as is for now.
| onClick={checkNameValidity} | ||
| data-uie-name="do-next" | ||
| <AppAlreadyOpen /> | ||
| <div style={{display: 'flex', alignItems: 'center', flexDirection: 'column', marginBottom: '2rem'}}> |
There was a problem hiding this comment.
would probably be beneficial to split that huge jsx part into mutliple smaller components
Task: https://wearezeta.atlassian.net/browse/WPB-3789
Redesign:
Updated: