pull/3/head
nimtaurel 2024-04-25 14:07:55 +05:00
parent 3781e71528
commit f6738ff7fa
5 changed files with 73 additions and 13 deletions

View File

@ -30,7 +30,7 @@
<h5>СВЯЗАТЬСЯ С НАМИ</h5>
<div class="line"></div>
<p>8 7172 97-26-36</p>
<p>8 800 004-07-10</p>
<p>8 800 004-07-10 (звонок бесплатный)</p>
<p>infobp@esep.kz</p>
</div>
</div>
@ -46,23 +46,42 @@
<main class="main-pf d-flex justify-content-center align-items-end">
<img src="img/pf_bg.jpg" alt="">
<div class="container px-2">
<div class="main-text-wrapper">
<div class="main-text-wrapper" id = 'pf-title'>
<h1>
ОБЛАЧНАЯ БУХГАЛТЕРИЯ
</h1>
<div class="line"></div>
</div>
<a href="https://planfact.kz/ru/" class="btn btn-pf">Перейти</a>
<div class="buttons-group d-flex flex-column column-gap-1 row-gap-1 justify-content-center align-items-center"><a href="https://planfact.kz/ru/" class="btn btn-pf mx-2">Перейти</a>
<div class="d-flex instructions-group">
<a href="https://www.youtube.com/@ESEP.PLANFACT/videos" target="_blank" class="btn btn-pf">Видеоинструкция</a>
<button onclick="downloadDoc()" class="btn btn-pf">Скачать инструкцию</button>
</div>
</div>
<div class="contact-us-wrapper d-flex flex-column justify-content-center align-items-center">
<h5>СВЯЗАТЬСЯ С НАМИ</h5>
<div class="line"></div>
<p>8 7172 97-20-76</p>
<p>8 800 004-04-33</p>
<p>8 800 004-04-33 (звонок бесплатный)</p>
<p>support@esep.kz</p>
</div>
</div>
</main>
</div>
</div>
<script>
function downloadDoc() {
const link = document.createElement('a');
link.href = 'docs/ПланФакт_Инструкции_Пользователя.zip'; // Укажите путь к файлу DOC
link.download = 'ПланФакт_Инструкции_Пользователя.zip'; // Укажите имя файла для скачивания
document.body.appendChild(link);
link.click(); // Программное нажатие на ссылку для скачивания
document.body.removeChild(link); // Удаление ссылки после скачивания
}
</script>
</body>
</html>

View File

@ -54,7 +54,7 @@ header {
flex-direction: column;
justify-content: end;
align-items: center;
margin-bottom: 20%;
margin-bottom: 25%;
height: 100px;
}
.main-text-wrapper h1 {
@ -117,7 +117,7 @@ header {
color: white;
font-size: 16px;
font-weight: 500;
margin-bottom: 15%;
margin-bottom: 0;
transition: all 0.3s;
}
.PBP-container main .btn:active, .PF-container main .btn:active {
@ -128,12 +128,14 @@ header {
}
.PBP-container main .btn-pb, .PF-container main .btn-pb {
background-color: #1871b2;
margin-bottom: 10%;
}
.PBP-container main .btn-pb:hover, .PF-container main .btn-pb:hover {
background-color: #093460;
}
.PBP-container main .btn-pf, .PF-container main .btn-pf {
background-color: #146960;
width: fit-content;
}
.PBP-container main .btn-pf:hover, .PF-container main .btn-pf:hover {
background-color: #0e4f47;
@ -142,13 +144,15 @@ header {
font-weight: 600;
margin-bottom: 0;
text-shadow: 5px 3px 4px rgba(0, 0, 0, 0.17);
font-size: 1rem;
}
.PBP-container main .contact-us-wrapper .line, .PF-container main .contact-us-wrapper .line {
width: 100px;
height: 1px;
}
.PBP-container main .contact-us-wrapper p, .PF-container main .contact-us-wrapper p {
font-weight: bolder;
font-weight: 400;
font-size: 0.8rem;
}
.PF-container .main-text-wrapper p, .PF-container .main-text-wrapper h1, .PF-container .main-text-wrapper h5, .PF-container .contact-us-wrapper p, .PF-container .contact-us-wrapper h1, .PF-container .contact-us-wrapper h5 {
@ -188,6 +192,9 @@ header {
height: 100%;
bottom: 0;
}
.PBP-container main .container #pf-title, .PF-container main .container #pf-title {
margin-bottom: 10px;
}
.PBP-container main .container .main-text-wrapper, .PF-container main .container .main-text-wrapper {
margin-bottom: 10px;
}
@ -204,5 +211,19 @@ header {
font-size: 0.8rem;
}
}
.buttons-group {
margin-bottom: 10%;
}
.buttons-group .instructions-group {
gap: 0.4rem;
}
.buttons-group .instructions-group .btn {
background: linear-gradient(32deg, #D05353 24%, #E58F65 100%);
font-size: 12px;
}
#pf-title {
margin-bottom: calc(25% - 35px);
}
/*# sourceMappingURL=styles.css.map */

View File

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;AAAA;EAEE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAIJ;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAKJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;;AAEA;EACE;;AAIJ;EACE;;AAEA;EACE;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;;;AAQJ;EACE;;AAEF;EACE;;;AAOF;EACE;;AAEF;EACE;;;AAKN;EACE;IACE;;EAEA;IACE;;EAEA;IACE;IACA;;EAEF;IACE;IACA;;EAIJ;IACE;IACA;;EAEA;IACE;IACA;;EAEA;IACE;;EAEA;IACE;;EAGF;IACE;;EAGJ;IACE;;EAEF;IACE","file":"styles.css"}
{"version":3,"sourceRoot":"","sources":["styles.scss"],"names":[],"mappings":"AAAA;AAAA;EAEE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAIJ;EACE;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAKJ;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;;;AAQJ;EACE;;AAEF;EACE;;;AAOF;EACE;;AAEF;EACE;;;AAKN;EACE;IACE;;EAEA;IACE;;EAEA;IACE;IACA;;EAEF;IACE;IACA;;EAIJ;IACE;IACA;;EAEA;IACE;IACA;;EACA;IACE;;EAEF;IACE;;EACA;IACE;;EAGF;IACE;;EAGJ;IACE;;EAEF;IACE;;;AAOV;EACE;;AACA;EACE;;AACA;EACE;EACA;;;AAKN;EACE","file":"styles.css"}

View File

@ -58,7 +58,7 @@ header {
flex-direction: column;
justify-content: end;
align-items: center;
margin-bottom: 20%;
margin-bottom: 25%;
height: 100px;
h1 {
@ -127,7 +127,7 @@ header {
color: white;
font-size: 16px;
font-weight: 500;
margin-bottom: 15%;
margin-bottom: 0;
transition: all 0.3s;
&:active {
@ -140,6 +140,7 @@ header {
.btn-pb {
background-color: #1871b2;
margin-bottom: 10%;
&:hover {
background-color: #093460;
@ -148,6 +149,7 @@ header {
.btn-pf {
background-color: #146960;
width: fit-content;
&:hover {
background-color: #0e4f47;
@ -159,6 +161,7 @@ header {
font-weight: 600;
margin-bottom: 0;
text-shadow: 5px 3px 4px rgba(0, 0, 0, 0.17);
font-size: 1rem;
}
.line {
@ -167,7 +170,8 @@ header {
}
p {
font-weight: bolder;
font-weight: 400;
font-size: 0.8rem;
}
}
}
@ -219,10 +223,11 @@ header {
.container {
height: 100%;
bottom: 0;
#pf-title {
margin-bottom: 10px;
}
.main-text-wrapper {
margin-bottom: 10px;
h1 {
font-size: 1.5rem;
}
@ -242,3 +247,18 @@ header {
}
}
.buttons-group {
margin-bottom: 10%;
.instructions-group {
gap: 0.4rem;
.btn {
background: linear-gradient(32deg, #D05353 24%, #E58F65 100%);
font-size: 12px;
}
}
}
#pf-title {
margin-bottom: calc(25% - 35px);
}