styles: improve responsivness of cube#7881
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Try |
|
|
|
i have corrected the next section overlapping but why is proselint failing, i didnt change anything else |
TusharThakur04
force-pushed
the
styles/cube-responsivness
branch
from
9826512 to
a733a28
Compare
TusharThakur04
changed the title
|
The same problem on |
|
I found that |
removing what? |
|
@TusharThakur04 oh, sorry, wrong PR, no let's make height more dynamic to avoid extra spaces and more high on small devices to avoid problem with background |
add some space in the bottom inside the section like this
|
TusharThakur04
force-pushed
the
styles/cube-responsivness
branch
from
a733a28 to
2de6029
Compare
|
@evenstensberg take a look too |
|
@TusharThakur04 reduce some min-height |
| height: calc(100vh - 56px); | ||
| min-height: 320px; | ||
| max-height: 720px; | ||
| // height: calc(100vh - 56px); |
| max-height: 720px; | ||
| // height: calc(100vh - 56px); | ||
| min-height: 650px; | ||
| height: clamp(500px, calc(100vh - 56px), 700px); |
There was a problem hiding this comment.
whats your values based on? A comment would be nice here.
| position: relative; | ||
| grid-row: 2 / 3; | ||
| } | ||
| min-height: 480px; |
There was a problem hiding this comment.
I'll review this later, but instead of hard coded pixels on smaller devices we should use relative to screen size. (rem, em, etc)
TusharThakur04
force-pushed
the
styles/cube-responsivness
branch
from
618dbbc to
b0fff02
Compare
|
@evenstensberg @ovflowd please review, i have experimented with diff values and have made sure there is no overlapping in any screen size. |
evenstensberg
left a comment
evenstensberg
left a comment
There was a problem hiding this comment.
lgtm, I'd prefer a comment on how you calculated the height, but not blocking. thank you!
6 participants
Summary
Even after the merge #7878 , there was still some flaws in the responsiveness of the cube which has been fixed now.
What kind of change does this PR introduce?
styles
Did you add tests for your changes?
no
Does this PR introduce a breaking change?
no
If relevant, what needs to be documented once your changes are merged or what have you already documented?
before:
Screencast from 2026-02-25 22-18-24.webm
after:
Screencast from 2026-02-25 22-20-05.webm