fix: hide pillars and suggestions on mobile to prevent overlap with step text
All checks were successful
Deploy Website / deploy (push) Successful in 2s
All checks were successful
Deploy Website / deploy (push) Successful in 2s
This commit is contained in:
69
index.html
69
index.html
@@ -781,30 +781,36 @@
|
|||||||
top: 72px;
|
top: 72px;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
padding-bottom: 16px;
|
padding-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
.wt-device-frame { max-height: 35vh; }
|
||||||
|
.wt-app { min-height: 0; max-height: calc(35vh - 22px); overflow: hidden; }
|
||||||
.wt-text {
|
.wt-text {
|
||||||
flex: none;
|
flex: none;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2;
|
|
||||||
}
|
}
|
||||||
.wt-step-pin { min-height: auto; }
|
.wt-step-pin { min-height: 100vh; }
|
||||||
|
.wt-step-pin:last-child { min-height: 70vh; }
|
||||||
.wt-step {
|
.wt-step {
|
||||||
position: relative;
|
position: sticky;
|
||||||
top: auto;
|
top: calc(72px + 35vh + 16px);
|
||||||
height: 80vh;
|
min-height: 0;
|
||||||
justify-content: center;
|
height: auto;
|
||||||
padding: 32px 16px;
|
padding: 24px 16px;
|
||||||
background: linear-gradient(180deg, rgba(244,237,243,0.95) 0%, rgba(244,237,243,0.8) 80%, transparent 100%);
|
background: rgba(244,237,243,0.97);
|
||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
.wt-step:first-child { padding-top: 24px; }
|
.wt-device { max-width: 100%; }
|
||||||
.wt-step:last-child { height: 60vh; }
|
.wt-app { min-height: 0; }
|
||||||
.wt-step.active { filter: blur(0px); }
|
.wt-pillars { display: none; }
|
||||||
.wt-app { min-height: 260px; }
|
.wt-suggestions { display: none; }
|
||||||
.wt-main { padding: 20px 24px; }
|
.wt-main { padding: 14px 16px; }
|
||||||
.wt-greeting-name { font-size: 24px; }
|
.wt-greeting-name { font-size: 20px; }
|
||||||
|
.wt-greeting-label { font-size: 11px; }
|
||||||
|
.wt-topbar { height: 22px; }
|
||||||
|
.wt-topbar span { width: 6px; height: 6px; }
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Walkthrough — Mobile */
|
/* Walkthrough — Mobile */
|
||||||
@@ -812,21 +818,28 @@
|
|||||||
.walkthrough { padding: 24px 0 16px; }
|
.walkthrough { padding: 24px 0 16px; }
|
||||||
.walkthrough-inner { padding: 0 16px; }
|
.walkthrough-inner { padding: 0 16px; }
|
||||||
.wt-device { top: 68px; }
|
.wt-device { top: 68px; }
|
||||||
|
.wt-device-frame { max-height: 30vh; }
|
||||||
|
.wt-app { max-height: calc(30vh - 22px); }
|
||||||
.wt-step {
|
.wt-step {
|
||||||
height: 75vh;
|
top: calc(68px + 30vh + 12px);
|
||||||
padding: 20px 12px;
|
padding: 20px 12px;
|
||||||
}
|
}
|
||||||
.wt-step:last-child { height: 55vh; }
|
.wt-main { padding: 10px 12px; }
|
||||||
.wt-app { min-height: 200px; font-size: 11px; }
|
.wt-greeting-name { font-size: 16px; }
|
||||||
.wt-main { padding: 16px 18px; }
|
.wt-greeting-name .wt-sparkle { font-size: 14px; }
|
||||||
.wt-greeting-name { font-size: 20px; }
|
.wt-greeting-label { font-size: 9px; }
|
||||||
.wt-greeting-name .wt-sparkle { font-size: 18px; }
|
.wt-sidebar { width: 30px; }
|
||||||
.wt-sidebar { width: 36px; }
|
.wt-sidebar-logo { width: 18px; height: 18px; }
|
||||||
.wt-sidebar-icon { width: 26px; height: 26px; }
|
.wt-sidebar-icon { width: 22px; height: 22px; }
|
||||||
.wt-sidebar-icon i { width: 13px; height: 13px; }
|
.wt-sidebar-icon i { width: 11px; height: 11px; }
|
||||||
.wt-brief { font-size: 11px; }
|
.wt-sidebar-avatar { width: 22px; height: 22px; font-size: 7px; }
|
||||||
.wt-chat-input { padding: 8px 10px 8px 14px; }
|
.wt-brief { font-size: 9px; }
|
||||||
.wt-suggestion { font-size: 11px; }
|
.wt-chat-input { padding: 6px 8px 6px 12px; }
|
||||||
|
.wt-chat-input span { font-size: 10px; }
|
||||||
|
.wt-chat-send { width: 22px; height: 22px; }
|
||||||
|
.wt-chat-send i { width: 11px; height: 11px; }
|
||||||
|
.wt-suggestion { font-size: 9px; }
|
||||||
|
.wt-suggestion i { width: 11px; height: 11px; }
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ═══════════════════════════════════════
|
/* ═══════════════════════════════════════
|
||||||
@@ -1318,7 +1331,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
<div>
|
<div>
|
||||||
<div class="name">Roberto Musso</div>
|
<div class="name">Roberto Musso</div>
|
||||||
<div class="title">CEO</div>
|
<div class="title">Founder</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user