za-ek/marketing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

scroll snap

Browse Source
This commit is contained in:
Zakhar 2026-05-21 13:18:16 +02:00
parent 493e5773f9
commit 6d9a8a8b33
1 changed files with 5 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
index.html
View File

@ -10,7 +10,9 @@
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Onest:wght@100..900&display=swap" rel="stylesheet">
<style> <style>
html, body {height: 100vh;overflow: hidden;}
body {background: #FCFFFB;padding:0;margin:0;font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, sans-serif;} body {background: #FCFFFB;padding:0;margin:0;font-family: 'Onest', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, sans-serif;}
#scroller {scroll-snap-type: y mandatory;overflow: scroll;height: 100vh;}
.container {max-width: 1440px;margin: 0 auto;position: relative;width:100%;} .container {max-width: 1440px;margin: 0 auto;position: relative;width:100%;}
.text_secondary {color:#6D8982;} .text_secondary {color:#6D8982;}
h1 {font-size: 254px;padding:0;margin:0;} h1 {font-size: 254px;padding:0;margin:0;}
@ -31,7 +33,7 @@
#try_button {background-color: #FFBA00;padding:13px 43px;font-weight: bold;border-radius: 100px;color:#0C3B2E;text-decoration: none; #try_button {background-color: #FFBA00;padding:13px 43px;font-weight: bold;border-radius: 100px;color:#0C3B2E;text-decoration: none;
display: flex;} display: flex;}
.page_container {width: 100%;height: 100vh;display: flex;flex-direction: column;align-items: center;justify-content: center;} .page_container {width: 100%;height: 100vh;display: flex;flex-direction: column;align-items: center;justify-content: center;scroll-snap-align: start;}
#page_index {} #page_index {}
#page_index_content {align-items: start;} #page_index_content {align-items: start;}
#page_index p {font-size: 18px;} #page_index p {font-size: 18px;}
@ -105,6 +107,7 @@
</div> </div>
</div> </div>
</div> </div>
<div id="scroller">
<div class="page_container" id="page_index"> <div class="page_container" id="page_index">
<div id="page_index_content"> <div id="page_index_content">
<h1 class="big_index_greeting">Хватит</h1> <h1 class="big_index_greeting">Хватит</h1>
@ -225,6 +228,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<div id="page_footer"> <div id="page_footer">
<div class="container container_row"> <div class="container container_row">
<div> <div>