Skip to content
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion assets/sass/install.scss
Original file line number Diff line number Diff line change
Expand Up @@ -42,9 +42,11 @@

@media (max-width: $mobile-m) {
a[role="tab"] {
padding: .5rem;
padding: .5rem .25rem;
Copy link
Collaborator

Choose a reason for hiding this comment

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

I think this change is all we need.

Until you want to take it one step further and support really narrow screens. But in that case I suggest we work on putting flex-direction: column on .install-tabs, so we have vertical tabs. But there's more work to be done to have it look nicely, because for example round corners aren't okay:

Image

(and it would also be better to not have "Install" and "Latest version" side-by-side.

font-size: 0.75rem;
Copy link
Collaborator

Choose a reason for hiding this comment

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

It's arguable, but I think it's too small. I rather have you drop this line out.

line-height: 1.2em;
display: flex;
flex: 1;
Copy link
Collaborator

Choose a reason for hiding this comment

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

@kushkumarkashyap7280 This makes the tab buttons grow on semi-small screens:

Image

vs the old

Image

Is that intentional?


On large'ish screen we always show tab buttons that fit the contentd;

Image

Why have them grow on mobile? As far as I can tell, it has no effect on the issue you're trying to fix.


span {
margin: auto;
Expand Down
Loading