DIWHY
/
spatialsystems
mirror of https://github.com/gtitov/spatialsystems.git
3
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

лэндос по слайдам

Browse Source
main
gman 8 months ago
parent 0e72e8a04e
commit e0da57f21a
2 changed files with 104 additions and 185 deletions
Show Stats Download Patch File Download Diff File

145
index.html
Unescape View File

@ -5,6 +5,8 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Пространственные Системы</title> <title>Пространственные Системы</title>
<link rel="stylesheet" href="fullpage/fullpage.min.css">
<script src="fullpage/fullpage.js"></script>
<link rel="stylesheet" href="style.css"> <link rel="stylesheet" href="style.css">
</head> </head>
@ -25,92 +27,87 @@
</div> </div>
</div> </div>
</div> </div>
<div class="fullpage">
<div id="first-container"> <div class="section">
<div id="first-wrap"> <div class="hero">
<div id="first-title">
Разработка геоинформационных ML/AutoML систем Разработка геоинформационных ML/AutoML систем
</div> </div>
<div class="arrow-down"></div>
</div> </div>
</div> <div class="section">
<div class="section-title">Наши особенности</div>
<div id="what-container"> <div class="features">
<div id="what-wrap"> <div class="block-container">
<div> <div class="block-title">True data driven</div>
<div id="what-title">Наши особенности</div> <div class="block-text">В основе наших систем лежит предиктивная аналитика на базе
<div id="what-content"> машинного обучения на реальных ретроспективных данных, что делает содержание системы
<div class="block-container"> отражением реальности</div>
<div class="block-title">True data driven</div> </div>
<div class="block-text">В основе наших систем лежит предиктивная аналитика на базе <div class="block-container">
машинного обучения на реальных ретроспективных данных, что делает содержание системы <div class="block-title">AutoML</div>
отражением реальности</div> <div class="block-text">Все data science процессы автоматизированы, предиктивные модели
</div> обновляются по мере накопления новых данных, что позволяет поддерживать системы в
<div class="block-container"> актуальном состоянии</div>
<div class="block-title">AutoML</div> </div>
<div class="block-text">Все data science процессы автоматизированы, предиктивные модели <div class="block-container">
обновляются по мере накопления новых данных, что позволяет поддерживать системы в <div class="block-title">Реактивность</div>
актуальном состоянии</div> <div class="block-text">Наши системы оснащены инструментами симуляций, позволяющими
</div> пользователю
<div class="block-container"> перед принятием реального решения в режиме онлайн смоделировать целевую ситуацию и
<div class="block-title">Реактивность</div> оценить эффект её реализации</div>
<div class="block-text">Наши системы оснащены инструментами симуляций, позволяющими пользователю </div>
перед принятием реального решения в режиме онлайн смоделировать целевую ситуацию и <div class="block-container">
оценить эффект её реализации</div> <div class="block-title">Прозрачность</div>
</div> <div class="block-text">Мы используем модели машинного обучения, позволяющие
<div class="block-container"> интерпретировать
<div class="block-title">Прозрачность</div> каждый прогноз и понять какие именно факторы и в какой степени повлияли на итоговое
<div class="block-text">Мы используем модели машинного обучения, позволяющие интерпретировать значение
каждый прогноз и понять какие именно факторы и в какой степени повлияли на итоговое значение
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="arrow-down"></div>
</div> </div>
</div> <div class="section">
<div class="section-title">
<div id="trusted-container"> Нам доверяют
<div id="trusted-wrap"> </div>
<div> <div class="partners">
<div id="trusted-title"> <div class="trusted-block">
Нам доверяют <img src="partners_logo/autoru.png" />
</div> </div>
<div id="trusted-content"> <div class="trusted-block">
<div class="trusted-block"> <img src="partners_logo/mapsme.png" />
<img src="partners_logo/autoru.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/mapsme.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/pik.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/youdrive.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/autoru.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/mapsme.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/pik.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/youdrive.png" />
</div>
</div> </div>
</div> <div class="trusted-block">
<!-- <div id="footer-container"> <img src="partners_logo/pik.png" />
<div id="footer-title">
Свяжитесь с нами
</div> </div>
<a href="contacts.html" id="footer-link"> <div class="trusted-block">
Контакты <img src="partners_logo/youdrive.png" />
</a> </div>
</div> --> <div class="trusted-block">
<img src="partners_logo/autoru.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/mapsme.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/pik.png" />
</div>
<div class="trusted-block">
<img src="partners_logo/youdrive.png" />
</div>
</div>
</div> </div>
</div> </div>
<script>
new fullpage('.fullpage', {});
document.querySelectorAll('.arrow-down').forEach(
el => el.addEventListener('click', () => {
fullpage_api.moveSectionDown();
})
)
</script>
</body> </body>
</html> </html>

144
style.css
Unescape View File

@ -153,41 +153,24 @@ html {
} }
} }
.section-title {
line-height: 40px;
font-size: xx-large;
text-transform: uppercase;
/* Hero */ color: var(--primary-text-color);
#first-container {
display: flex;
position: relative;
flex-direction: column;
padding: 80px 30px 0;
width: 100%;
box-sizing: border-box;
@media (max-width: 850px) { mix-blend-mode: normal;
padding-top: 170px; margin: 30px 0;
}
} }
#first-wrap { /* Hero */
display: flex; .hero {
flex-direction: column;
position: relative; position: relative;
display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
width: calc(100vw - 60px); font-size: 1.5rem;
min-height: calc(100vh - var(--header-height));
box-sizing: border-box;
padding: 60px 0 50px 0;
@media (max-width: 850px) {
min-height: calc(100vh - 170px);
}
}
#first-title {
line-height: calc(100vw / 23);
font-size: calc(100vw / 30);
text-transform: uppercase; text-transform: uppercase;
background-size: 100%; background-size: 100%;
@ -196,60 +179,35 @@ html {
-webkit-text-fill-color: transparent; -webkit-text-fill-color: transparent;
background-image: linear-gradient(55deg, rgb(255, 255, 255) 20%, rgba(245, 192, 192, 0.8) 100%); background-image: linear-gradient(55deg, rgb(255, 255, 255) 20%, rgba(245, 192, 192, 0.8) 100%);
margin-bottom: 30px;
@media (max-width: 850px) { @media (max-width: 850px) {
max-width: 100%; font-size: 1rem;
line-height: 33px;
font-size: 30px;
} }
} }
/* Наши особенности */ .arrow-down {
#what-container { position: absolute;
border-top: 1px solid #CCCCCC; bottom: 20px;
display: flex; right: 50%;
position: relative; transform: translateX(50%);
width: 100%; display: block;
background: var(--primary-color); height: 30px;
justify-content: center; width: 30px;
align-items: center; background: url("./svg/Arrow_to_bottom.svg") no-repeat center;
box-sizing: border-box; background-size: contain;
cursor: pointer;
} }
#what-wrap { .arrow-down:hover {
display: flex; opacity: 0.5;
flex-direction: column;
position: relative;
justify-content: space-between;
width: calc(100vw - 60px);
min-height: calc(100vh - var(--header-height));
/* min-height: inherit; */
box-sizing: border-box;
padding: 50px 0;
@media (max-width: 850px) {
min-height: inherit;
}
} }
#what-title {
line-height: 40px;
font-size: xx-large;
text-transform: uppercase;
color: var(--primary-text-color);
mix-blend-mode: normal;
margin-bottom: 30px;
}
#what-content { .features {
display: flex; display: flex;
width: 100%; width: 100%;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
margin-top: 60px;
} }
.block-container { .block-container {
@ -278,7 +236,7 @@ html {
.block-text { .block-text {
max-width: 450px; max-width: 450px;
line-height: 40px; line-height: 40px;
font-size: 28px; font-size: 24px;
padding-right: 50px; padding-right: 50px;
color: var(--accent-text-color); color: var(--accent-text-color);
@ -291,48 +249,11 @@ html {
/* Нам доверяют */ /* Нам доверяют */
#trusted-container { .partners {
display: flex;
flex-direction: column;
width: 100%;
justify-content: center;
align-items: center;
}
#trusted-wrap {
display: flex;
flex-direction: column;
position: relative;
justify-content: space-between;
width: calc(100vw - 60px);
min-height: calc(100vh - var(--header-height));
border-top: 1px solid #CCCCCC;
box-sizing: border-box;
padding: 50px 0;
@media (max-width: 850px) {
min-height: calc(100vh - 170px);
}
}
#trusted-title {
line-height: 40px;
font-size: 30px;
text-transform: uppercase;
color: #cccccc;
mix-blend-mode: normal;
margin-bottom: 30px;
}
#trusted-content {
display: flex; display: flex;
width: 100%; width: 100%;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
margin-top: 60px;
margin-bottom: 60px;
} }
.trusted-block { .trusted-block {
@ -343,15 +264,16 @@ html {
padding: 30px 0 90px; padding: 30px 0 90px;
align-items: center; align-items: center;
img {
height: 45px;
}
@media (max-width: 850px) { @media (max-width: 850px) {
width: 50%; width: 50%;
} }
} }
.trusted-block img {
height: 45px;
object-fit: contain;
}
#footer-container { #footer-container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;

Write Preview
Loading…
Cancel
Save