Skip to content

Conversation

@maxkele
Copy link
Contributor

@maxkele maxkele commented Oct 22, 2022

No description provided.

@vercel
Copy link

vercel bot commented Oct 22, 2022

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Updated
shocktober-tracker-goodbyte ✅ Ready (Inspect) Visit Preview Oct 22, 2022 at 2:03PM (UTC)

@maxkele maxkele marked this pull request as draft October 22, 2022 13:45
Copy link
Member

@qjack001 qjack001 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just that small fix to the spacing then its all good. I would maybe prefer the tooltip version, since it scales down further, but either or can work.


padding: 0.22em 0.11em 0;
margin: 0;
margin-bottom: auto;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

In flex layout, auto margin takes up all available space. You should at least add it back when the titles disappear to keep the usernames from clustering up at the top:

Screen Shot 2022-10-22 at 12 41 47 PM

{
font-size: 1.3rem;
transform: translate(-3px, -3px);
margin-bottom: auto;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah I see you do add it back in, but a little too late. These styles only kick in after 975px, while the titles disappear at 1400.

hsl(0, 100%, 38%, 0.5));
}

@media (min-width: 1400px) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If you flip this to max-width, you can move the styling to the main block, and move the display: none rule to the media query. This way you could re-add the margin-bottom: auto to the h3 at the same time.

Alternatively, if you want this to be a min-width rule, just remove the auto margin here, and leave it in the initial rule.

@maxkele maxkele marked this pull request as ready for review November 4, 2022 00:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants