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

EthIdenticon + BadgeBase fixes #583

Merged
merged 4 commits into from Sep 8, 2019
Merged
Changes from 1 commit
Commits
File filter...
Filter file types
Jump to…
Jump to file or symbol
Failed to load files and symbols.

Always

Just for now

AddressField: fix EthIdenticon radius on Chrome

  • Loading branch information...
bpierre committed Sep 6, 2019
commit fbe11815cb6ca0027f0100ccdd074229b639a0a6
@@ -61,8 +61,13 @@ const AddressFieldBase = React.memo(function AddressFieldBase({
css={`
position: relative;
width: ${HEIGHT}px;
height: ${HEIGHT}px;
overflow: hidden;
border-radius: ${RADIUS}px 0 0 ${RADIUS}px;
// Fix an issue where the border-radius wasn’t visible on Blink browsers.
// See https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b
mask-image: linear-gradient(red, red);

This comment has been minimized.

Copy link
@sohkai

sohkai Sep 8, 2019

Member

Is this necessary if we do this in EthIdenticon?

This comment has been minimized.

Copy link
@bpierre

bpierre Sep 8, 2019

Author Member

Yes, because the border-radius is applied at the container level in that case (only on one side + can be replaced by another component).

`}
>
{icon || (
@@ -72,6 +77,9 @@ const AddressFieldBase = React.memo(function AddressFieldBase({
css={`
transform: scale(calc(${HEIGHT} / 48));
transform-origin: 0 0;
position: absolute;
left: 0;
top: 0;
`}
/>
)}
ProTip! Use n and p to navigate between commits in a pull request.
You can’t perform that action at this time.