Usercard Redesign Experiment

Given the error… maybe it is this one…

4 Likes

That’s the one, thanks Sam.

Not sure why my badge labels are showing now.

Personally, I would set the opacity of the .d-user-card__main-content to 90% or so since the image gets cut off and the user has no control of displaying anything but the top sliver of their photo.

Beyond that, I still believe there needs to be a button or a link to view the users full profile. I constantly have to explain to users that they have to click the avatar twice, it’s not intuitive at all.

9 Likes

This is a great observation!

5 Likes

Sorry still in the unsupported Android 9 Kiwi browser.

I forgot the problem of it being positioned outside the screen top, now:

  • always offscreen, positioned too high outside screen, wherever is the clicked user icon
  • opacity problem: it looks dark
  • z-index problem: is behind several thing (including all user icons) and nothing on it is clickable

This time I think I mentioned all stylesheet problems of the new user card on Kiwi.
Previous user card, no problems.

1 Like

Hey @jesus2099, I tried to reproduce your issue on Kiwi browser so I just installed and check it. I think found what cause it for you. If I enable the Hide annoying ads option than I experience the same :arrow_down_small:




If I turn this off than the user cards works fine for me.


Do you have this option enable? If yes, can you try to disable it and check how it works? :slightly_smiling_face:


Actually I think this is blocking to load the theme component javascript etc. As I see it loads the old user card and I think it mixes with the new user card component unblocked things such as CSS etc…which cause it.

From the new theme component the first few lines activate which is affect the old user card.

It is just for resetting the old user card style as long as the new user card is in theme component status and not merged to the core. So I think this will not be an issue when it will be merged. :slightly_smiling_face:

6 Likes

Oh @Don you’re right!

This anti-ad feature is blocking all JavaScript from cloudfront.net!

Do you think that when the new user card will be the official one, it will not be blocked any more, like the old user card is not blocked today?

PS. This anti-ad feature is on by default for everywhere, and we can deactivate, site by site.

4 Likes

This is correct because it will load in core, rather than external to core inside of a component.

5 Likes

Seems like it’s been updated. I 100% liked the boxed stats better this right now:


Before for reference (what I think looks better)

Also, the loading animation still seems to have a few issues.


One more issue, it seems like the new changes have made incompatibilities with my theme.

3 Likes

Also, where did the bio go?

1 Like

Im seeing it…

3 Likes

Maybe try mobile view?

2 Likes

I see the bio in both desktop and mobile. :slight_smile:

Then it’s more likely to be fixed on your side, right?

3 Likes

Android or iPhone, and Web or DiscourseHub?
iOS DiscourseHub doesn’t have it

3 Likes

Ah, yes, the bio doesn’t appear on my iPad indeed! :+1:

The thing that bothers me the most is that I can’t manage to have my :sparkles: splendid :sparkles: cat to be always fully visible regardless of the device used :smile_cat:

4 Likes

This component doesn’t work well with this other theme component: GitHub - discourse/discourse-user-card-directory: Theme component which replaces the user directory with a grid of user cards

The user cards don’t display a background.

3 Likes

The screenshot includes @Canapin bio here. The bio for that profile is only a rocket.

3 Likes

I like it! It addresses several things we’d noticed:

  1. Bigger real name — while still having room for a bigger name that is also long.
  2. Featured Badges more prominent — this will go nicely with Fedora’s custom badges.

One thing I’m not sure about: “moved user-status to an avatar icon, instead of the full on description”. This is the :thought_balloon: on the bottom right? Does that replace “avatar flair” from groups?

I think it might be nice to have an option to have status text expanded somewhere. The icons seem less obvious.

Other thoughts:

  • We disable “cakeday” because it exposes personally-identifiable information that our compliance people asked us to do complicated things about until I said “what if we just don’t?”. I’d actually prefer that whole space to be used for status, maybe even leaving out website URL.
  • Likewise, if one isn’t using Cheers or Solved, what goes in that space? It looks nice all filled, but maybe strange with only half of the boxes?
  • I actually kind of like how the old card has the avatar break the box
  • where will custom user fields go? We provide a pronouns option and want that to be easily discoverable.
  • what about “featured topic”? I like the idea, but on the current card it can be a mess of text
4 Likes

Oooh, more thoughts, based on my own usercard:

image


  • The background generated from my avatar is… kinda hideous, yeah?
  • Yeah, I miss the breaking-the-box avatar :slight_smile:
    • Maybe actually a larger image would be nice? Maybe that’s my fault for making it not just my face. :slight_smile:
  • Oooh, I need to update my location
  • I think the Fedora badges (see Fedora Badges) are going to look great here. But the default shapes are kind of blasé.
  • This was probably there before and I ever looked, but the birthday cake and date — which is my site join date, I think? — might make people make wrong guesses about my youthfulness. Maybe this should be a different icon if it doesn’t represent a birthday? Or say what it is?
6 Likes

Ah, for some reason I remembered that I tried opening @darkpixlz on iPad and didn’t see their bio, but I suppose I had a brain glitch.

4 Likes

Quick bug report.

When you click through to a badge it leaves the card up during the transition. It should hide it early. (Firefox Linux)

5 Likes