update homepage styles#432
Conversation
mannynotfound
commented
Sep 8, 2022
mannynotfound
commented
- header styles / copy updated
- bg added to homepage splash
- update button styles
- add more top padding to footer
mannynotfound
force-pushed
the
manny/cas-482
branch
2 times, most recently
from
2ca6ac0 to
c1ae2b4
Compare
| $yellow: #FBD84D | ||
| $orange: #F4AF4A | ||
| $light-gray: #DCDCDC | ||
| $light-gray: #F9F9F9 |
There was a problem hiding this comment.
this was only being used for a non-existent selector so I deleted rules and updated this variable for the light gray in latest designs
| line-height: 3rem !important | ||
| .beta-label | ||
| font-size: 10px | ||
| font-weight: 700 |
There was a problem hiding this comment.
deleted this in favor of has-weight-bold-text + a smallest-text class since this was only used once or twice
| <> | ||
| <header | ||
| className={`header ${props.location.pathname} has-background-white is-block navbar is-fixed-top`} | ||
| id="navbar" |
There was a problem hiding this comment.
added this id as the .header class felt too generic for the specific style rule of the 4px yellow border
| export default function Label({ labelText = '', classNames } = {}) { | ||
| const className = classnames( | ||
| 'has-background-black has-text-white rounded-sm px-3 py-2 mr-2', | ||
| 'has-background-black has-text-white rounded-lg px-3 py-2', |
There was a problem hiding this comment.
removed mr-2 from here as it wasn't needed in every instance and should be defined in the layout that includes Label
germanurrus
left a comment
germanurrus
left a comment
There was a problem hiding this comment.
Looks really good! I left some comments
| <span /> | ||
| </span> | ||
| </div> | ||
| <div className="navbar-end"> |
There was a problem hiding this comment.
I know this is not part of the change, but since this PR adds the class navbar-end it makes the wallet connect dropdown to show like this on desktop:
Could you update this line:
to have this code?:
style={!notMobile ? { left: '-160px' } : { left: '-130px' }}
|
|
||
| return ( | ||
| <section className={classNames}> | ||
| <> |
There was a problem hiding this comment.
This is making the tooltip to be next to the navbar:
Maybe adding some margin within the TooltipMessage component would work? This component is only to be shown on safari
There was a problem hiding this comment.
ended up removing message-container from TooltipMessage since it was only controlling margin bottom. Now it takes a className so we just give it my-6 for even top/bottom margin
mannynotfound
force-pushed
the
manny/cas-482
branch
from
0bd0206 to
09fa63f
Compare
2 participants
