fix(landing): repair mobile layout
This commit is contained in:
@@ -579,11 +579,34 @@ h1 {
|
||||
}
|
||||
|
||||
@media (max-width: 860px) {
|
||||
html,
|
||||
body,
|
||||
#root {
|
||||
height: auto;
|
||||
min-height: 100%;
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-x: clip;
|
||||
}
|
||||
|
||||
body,
|
||||
#root {
|
||||
min-height: 100svh;
|
||||
}
|
||||
|
||||
.landing-shell {
|
||||
align-content: start;
|
||||
align-items: stretch;
|
||||
grid-template-columns: 1fr;
|
||||
grid-template-rows: auto minmax(0, 1fr);
|
||||
grid-template-rows: auto auto;
|
||||
gap: 18px;
|
||||
height: auto;
|
||||
min-height: 100svh;
|
||||
max-height: none;
|
||||
padding: 124px 18px 18px;
|
||||
overflow: clip;
|
||||
}
|
||||
|
||||
.hero-copy {
|
||||
@@ -624,9 +647,9 @@ h1 {
|
||||
}
|
||||
|
||||
.device-card {
|
||||
min-height: 0;
|
||||
height: 100%;
|
||||
max-height: 48vh;
|
||||
height: clamp(350px, 68vw, 470px);
|
||||
min-height: clamp(350px, 68vw, 470px);
|
||||
max-height: none;
|
||||
border-radius: 32px;
|
||||
}
|
||||
|
||||
@@ -636,7 +659,8 @@ h1 {
|
||||
}
|
||||
|
||||
.capture-frame {
|
||||
width: min(66%, 380px);
|
||||
width: min(58%, 270px);
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.slide-panel {
|
||||
@@ -717,7 +741,8 @@ h1 {
|
||||
}
|
||||
|
||||
.device-card {
|
||||
max-height: 42vh;
|
||||
height: 350px;
|
||||
min-height: 350px;
|
||||
}
|
||||
|
||||
.window-chrome {
|
||||
@@ -731,7 +756,7 @@ h1 {
|
||||
}
|
||||
|
||||
.capture-frame {
|
||||
width: 72%;
|
||||
width: min(58%, 240px);
|
||||
border-radius: 18px;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user