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 4 commits into from Sep 8, 2019
Changes from 1 commit
File filter...
Filter file types
Jump to…
Jump to file or symbol
Failed to load files and symbols.


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({
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
mask-image: linear-gradient(red, red);

This comment has been minimized.

Copy link

sohkai Sep 8, 2019


Is this necessary if we do this in EthIdenticon?

This comment has been minimized.

Copy link

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({
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.