PAYDAY/PaydayFrontend
3
0 Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Третья секция

Browse Source
This commit is contained in:
Vsevo;od committed 2023-07-29 14:36:02 +03:00
1 parent 09b1ab6237
commit ef8db98184
7 files changed
+369 -374
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/css/style.css
+1 -335
View File
@@ -1,335 +1 @@
* {
font-family: "Roboto", sans-serif;
}
header {
position: relative;
height: 83px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-ms-flex-line-pack: center;
align-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
background-color: #fff;
}
.menu {
width: 435px;
height: 58px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: left;
-ms-flex-pack: left;
justify-content: left;
-ms-flex-line-pack: center;
align-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-left: 88px;
}
.menu_logo {
width: 40px;
height: 52px;
}
.menu_project_name {
margin-left: 20px;
}
.menu_project_name_text {
color: #20d37d;
font-size: 48px;
font-style: normal;
font-weight: 500;
}
.menu_hamburger {
display: block;
position: absolute;
left: 50px;
top: 17px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
height: 50px;
width: 50px;
background-color: #20d37d;
border-radius: 9px;
}
.menu_hamburger span {
display: block;
height: 5px;
width: 32px;
background-color: #fff;
margin: 0 9px 6px 9px;
}
.menu_hamburger span:nth-child(1) {
margin-top: 12px;
}
.menu_hamburger span:nth-child(3) {
margin-bottom: 12px;
}
.menu_hamburger_active {
-webkit-transition: 0.8 all;
transition: 0.8 all;
}
.menu_hamburger_active span:nth-child(1) {
margin-top: 12px;
-webkit-transform: translateY(12px) rotate(-45deg);
transform: translateY(12px) rotate(-45deg);
}
.menu_hamburger_active span:nth-child(2) {
display: none;
}
.menu_hamburger_active span:nth-child(3) {
margin-top: 12px;
-webkit-transform: translateY(-5px) rotate(45deg);
transform: translateY(-5px) rotate(45deg);
}
.header_login {
display: block;
height: 100%;
padding-left: 19px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-right: 10px;
width: 290px;
height: 71px;
background-color: #43ca79;
border-radius: 40px;
color: #fff;
font-size: 32px;
font-style: normal;
font-weight: 500;
}
.header_login_text {
padding-top: 6px;
height: 100%;
margin-left: 10px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
color: #000;
font-size: 22px;
font-style: normal;
font-weight: 500;
}
.universe {
position: relative;
min-height: 640px;
padding: 22px 0 30px 0;
background: -webkit-gradient(
linear,
left bottom,
left top,
from(#ececec),
to(#ececec)
),
#e8e8e8;
background: linear-gradient(0deg, #ececec 0%, #ececec 100%), #e8e8e8;
}
.universe_input_block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 50px;
margin-bottom: 25px;
}
.universe_input {
padding-left: 20px;
height: 100%;
border-radius: 40px;
display: block;
width: 100%;
border: 0px;
}
.universe_input:focus {
outline: none;
border: 1px solid gray;
}
.universe_search {
height: 35px;
width: 35px;
position: absolute;
right: 30px;
}
.universe_card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-left: 30px;
height: 205px;
width: 205px;
background-color: #fff;
border-radius: 44px;
}
.universe_card_text {
color: #2a2a2a;
font-size: 24px;
font-style: normal;
font-weight: 500;
}
.universe_card_text span {
color: #50d400;
font-family: Inter;
font-size: 16px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.universe_icon {
height: 130px;
width: 130px;
}
.universe_slid {
height: 18px;
width: 112px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
bottom: 30px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.universe_slid_active {
width: 20px;
margin-right: 8px;
border-radius: 50%;
background-color: #fff;
}
.universe_slid_disable {
width: 20px;
margin-right: 8px;
border-radius: 50%;
background-color: #aeaeae;
}
.navigation {
background: -webkit-gradient(
linear,
left bottom,
left top,
from(#ececec),
to(#ececec)
),
#e8e8e8;
background: linear-gradient(0deg, #ececec 0%, #ececec 100%), #e8e8e8;
position: relative;
min-height: 640px;
padding: 22px 0 30px 0;
}
.navigation_input_block {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: relative;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 60px;
margin-bottom: 60px;
}
.navigation_input {
padding-left: 20px;
height: 100%;
border-radius: 40px;
display: block;
width: 100%;
border: 0px;
font-size: 20px;
}
.navigation_input:focus {
outline: none;
border: 1px solid gray;
}
.navigation_search {
height: 35px;
width: 35px;
position: absolute;
right: 30px;
}
.navigation_info {
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
height: 56px;
background-color: #fff;
border-radius: 50px;
}
.navigation_info_text {
color: #545454;
font-size: 20px;
font-style: normal;
font-weight: 500;
}
.navigation_cost {
position: absolute;
right: 150px;
color: #20d37d;
font-size: 20px;
font-style: normal;
font-weight: 500;
}
.navigation_slid {
height: 18px;
width: 112px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
position: absolute;
bottom: 30px;
left: 50%;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.navigation_slid_active {
width: 20px;
margin-right: 8px;
border-radius: 50%;
background-color: #fff;
}
.navigation_slid_disable {
width: 20px;
margin-right: 8px;
border-radius: 50%;
background-color: #aeaeae;
} /*# sourceMappingURL=style.css.map */
*{font-family:"Roboto",sans-serif}header{z-index:1;position:fixed;top:0px;width:100%;height:70px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-line-pack:center;align-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background-color:#fff}.fixed{width:100px;background-color:#fff;height:70px}.menu{width:435px;height:58px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:left;-ms-flex-pack:left;justify-content:left;-ms-flex-line-pack:center;align-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-left:88px}.menu_logo{width:40px;height:52px}.menu_project_name{margin-left:20px}.menu_project_name_text{color:#20d37d;font-size:48px;font-style:normal;font-weight:500}.menu_hamburger{display:block;position:absolute;left:50px;top:17px;-webkit-transform:translateX(-50%);transform:translateX(-50%);height:50px;width:50px;background-color:#20d37d;border-radius:9px}.menu_hamburger span{display:block;height:5px;width:32px;background-color:#fff;margin:0 9px 6px 9px}.menu_hamburger span:nth-child(1){margin-top:12px}.menu_hamburger span:nth-child(3){margin-bottom:12px}.menu_hamburger_active{-webkit-transition:.8 all;transition:.8 all}.menu_hamburger_active span:nth-child(1){margin-top:12px;-webkit-transform:translateY(12px) rotate(-45deg);transform:translateY(12px) rotate(-45deg)}.menu_hamburger_active span:nth-child(2){display:none}.menu_hamburger_active span:nth-child(3){margin-top:12px;-webkit-transform:translateY(-5px) rotate(45deg);transform:translateY(-5px) rotate(45deg)}.header_login{display:block;height:100%;padding-left:19px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-right:10px;width:290px;height:71px;background-color:#43ca79;border-radius:40px;color:#fff;font-size:32px;font-style:normal;font-weight:500}.header_login_text{padding-top:6px;height:100%;margin-left:10px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;color:#000;font-size:22px;font-style:normal;font-weight:500}.universe{position:relative;min-height:640px;padding:22px 0 30px 0;background:-webkit-gradient(linear, left bottom, left top, from(#ECECEC), to(#ECECEC)),#e8e8e8;background:linear-gradient(0deg, #ECECEC 0%, #ECECEC 100%),#e8e8e8}.universe_input_block{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:50px;margin-bottom:25px}.universe_input{padding-left:20px;height:100%;border-radius:40px;display:block;width:100%;border:0px}.universe_input:focus{outline:none;border:1px solid gray}.universe_search{height:35px;width:35px;position:absolute;right:30px}.universe_card{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-ms-flex-line-pack:center;align-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:0 30px 20px 0;height:205px;width:205px;background-color:#fff;border-radius:44px}.universe_card_text{color:#2a2a2a;font-size:24px;font-style:normal;font-weight:500}.universe_card_text span{color:#50d400;font-size:16px;font-style:normal;font-weight:500}.universe_icon{height:130px;width:130px}.universe_slid{height:18px;width:112px;display:-webkit-box;display:-ms-flexbox;display:flex;position:absolute;bottom:30px;left:50%;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.universe_slid_active{width:20px;margin-right:8px;border-radius:50%;background-color:#fff}.universe_slid_disable{width:20px;margin-right:8px;border-radius:50%;background-color:#aeaeae}.navigation{background:-webkit-gradient(linear, left bottom, left top, from(#ECECEC), to(#ECECEC)),#e8e8e8;background:linear-gradient(0deg, #ECECEC 0%, #ECECEC 100%),#e8e8e8;min-height:660px;padding:22px 0 30px 0;margin-top:72px}.navigation_input_block{display:-webkit-box;display:-ms-flexbox;display:flex;position:relative;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:60px;margin-bottom:60px}.navigation_input{padding-left:20px;height:100%;border-radius:40px;display:block;width:100%;border:0px;font-size:20px}.navigation_input:focus{outline:none;border:1px solid gray}.navigation_fixed{background:-webkit-gradient(linear, left bottom, left top, from(rgb(236, 236, 236)), to(rgb(236, 236, 236))),#e8e8e8;background:linear-gradient(0deg, rgb(236, 236, 236) 0%, rgb(236, 236, 236) 100%),#e8e8e8;height:80px;width:100%;position:absolute;top:65px}.navigation #navigation{height:70px;padding-top:15px;top:66px;width:90%;left:5%}.navigatLine truncated
src/css/style.css.map
+1 -1
View File
@@ -1 +1 @@
{"version":3,"sources":["../sass/style.sass","../sass/_general.sass"],"names":[],"mappings":"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","file":"style.css"}
{"version":3,"sources":["../sass/style.sass","../sass/_general.sass"],"names":[],"mappings":"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 truncated
src/img/icons/alpha.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

src/index.html
+114 -19
View File
@@ -22,38 +22,133 @@
<img src="/img/logo/logoPayDay.png" alt="logo" class="menu_logo">
<div class="menu_project_name menu_project_name_text">Имя проекта</div>
</div>
<button class="header_login">
<!-- <button class="header_login">
Вход через <span class="header_login_text">ЕСИА</span>
</button>
</button> -->
</header>
<div class="fixed"></div>
<section class="navigation">
<div class="container container_flex">
<div class="row">
<div class="navigation_input_block col-md-12"><input type="text" class="navigation_input" placeholder="Введите код или название направления"><img src="/img/logo/search.svg" alt="search" class="navigation_search"></div>
</div>
<div class="row row-cols-lg-1 g-5 g-lg-3">
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
<div class="navigation_fixed"></div>
<div class="navigation_banks" id="navigation">
<div class="navigation_banks_univer ">СпбГУ</div>
<div class="navigation_banks_speciality ">09.03.04 - Программная инженерия</div>
<div class="navigation_banks_sort navigation_banks_sort_hamburger">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
<div class="row row-cols-lg-10 g-5 g-lg-3">
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
<div class="col-12 navigation_card navigation_bank_text">
<div class="navigation_bank">
<img src="./img/icons/alpha.png" alt="navigation" class="navigation_icon">
Альфа Банк <span>на 15 лет</span>
</div>
<div class="navigation_credit">
<span class="navigation_credit_cost">10000 рублей/мес</span>
<span class="navigation_credit_prosent">6% в год</span>
</div>
</div>
</div>
</div>
<div class="navigation_slid">
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_active"></span>
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_disable"></span>
<div class="navigation_choise">
<div class="navigation_slid">
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_active"></span>
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_disable"></span>
</div>
</div>
</section>
<footer>
<span>Copyrited By PayDay</span>
</footer>
<script src="js/script.js"></script>
</body>
</html>
src/index1.html
+10
View File
@@ -40,6 +40,16 @@
ЮФУ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/ufu.jpg" alt="universe" class="universe_icon">
ЮФУ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/ufu.jpg" alt="universe" class="universe_icon">
ЮФУ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/kubgu.jpg" alt="universe" class="universe_icon">
КубГУ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/vshe.png" alt="universe" class="universe_icon">
ВШЭ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/ufu.jpg" alt="universe" class="universe_icon">
ЮФУ <span>от 135т руб</span></div>
<div class="col-2 universe_card universe_card_text"><img src="./img/icons/ufu.jpg" alt="universe" class="universe_icon">
ЮФУ <span>от 135т руб</span></div>
</div>
</div>
src/index2.html
+59
View File
@@ -0,0 +1,59 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="./css/style.css">
<link rel="stylesheet" href="./css/bootstrap-grid.min.css">
<link rel="stylesheet" href="./css/bootstrap.min.css">
<title>PayDay</title>
</head>
<body>
<header>
<div class="menu">
<div class="menu_hamburger">
<span></span>
<span></span>
<span></span>
</div>
<img src="/img/logo/logoPayDay.png" alt="logo" class="menu_logo">
<div class="menu_project_name menu_project_name_text">Имя проекта</div>
</div>
<button class="header_login">
Вход через <span class="header_login_text">ЕСИА</span>
</button>
</header>
<section class="navigation">
<div class="container container_flex">
<div class="row">
<div class="navigation_input_block col-md-12"><input type="text" class="navigation_input" placeholder="Введите код или название направления"><img src="/img/logo/search.svg" alt="search" class="navigation_search"></div>
</div>
<div class="row row-cols-lg-1 g-5 g-lg-3">
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
</div>
<div class="col-md-12">
<div class="navigation_info navigation_info_text p-3">09.03.04 - Программная инженерия <span class="navigation_cost">От 5600 в мес.</span> 10+ Банков</div>
</div>
</div>
</div>
<div class="navigation_slid">
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_active"></span>
<span class="navigation_slid_disable"></span>
<span class="navigation_slid_disable"></span>
</div>
</section>
<script src="js/script.js"></script>
</body>
</html>
src/sass/_general.sass
+184 -19
View File
@@ -1,11 +1,18 @@
header
position: relative
height: 83px
z-index: 1
position: fixed
top: 0px
width: 100%
height: 70px
display: flex
justify-content: space-between
align-content: center
align-items: center
background-color: #fff
.fixed
width: 100px
background-color: #fff
height: 70px
.menu
width: 435px
height: 58px
@@ -116,7 +123,7 @@ header
justify-content: center
align-content: center
align-items: center
margin-left: 30px
margin: 0 30px 20px 0
height: 205px
width: 205px
background-color: #fff
@@ -130,11 +137,9 @@ header
font-weight: 500
span
color: #50D400
font-family: Inter
font-size: 16px
font-style: normal
font-weight: 500
line-height: normal
&_icon
height: 130px
@@ -160,9 +165,9 @@ header
background-color: #AEAEAE
.navigation
background: linear-gradient(0deg, #ECECEC 0%, #ECECEC 100%), #E8E8E8
position: relative
min-height: 640px
min-height: 660px
padding: 22px 0 30px 0
margin-top: 72px
&_input_block
display: flex
position: relative
@@ -181,7 +186,89 @@ header
&:focus
outline: none
border: 1px solid grey
&_fixed
background: linear-gradient(0deg, rgb(236, 236, 236) 0%, rgb(236, 236, 236) 100%), rgb(232, 232, 232)
height: 80px
width: 100%
position: absolute
top: 65px
#navigation
height: 70px
padding-top: 15px
top: 66px
width: 90%
left: 5%
&_banks
background: linear-gradient(0deg, #ECECEC 0%, #ECECEC 100%), #E8E8E8
position: fixed
top: 60px
display: flex
justify-content: space-between
height: 56px
margin-bottom: 10px
&_univer
width: 12%
display: flex
align-items: center
justify-content: center
border-radius: 50px
background-color: #fff
color: #20D37D
font-size: 22px
font-style: normal
font-weight: 500
&_speciality
width: 82%
margin-left: 10px
display: flex
align-items: center
justify-content: center
border-radius: 50px
background-color: #fff
color: #20D37D
font-size: 20px
font-style: normal
font-weight: 500
&_sort
width: 57px
margin-left: 10px
display: flex
align-items: center
justify-content: center
border-radius: 50%
background-color: #fff
&_hamburger
display: flex
align-items: center
justify-content: center
flex-direction: column
background-color: #fff
span
border-radius: 6px
display: block
height: 5px
width: 27px
background-color: #20D37D
margin: 0 9px 6px 9px
&:nth-child(1)
margin-top: 12px
&:nth-child(2)
width: 19px
&:nth-child(3)
width: 11px
margin-bottom: 12px
&_active
transition: 0.8 all
span
&:nth-child(1)
margin-top: 12px
transform: translateY(12px) rotate(-45deg)
&:nth-child(2)
display: none
&:nth-child(3)
margin-top: 12px
transform: translateY(-5px) rotate(45deg)
&_search
height: 35px
width: 35px
@@ -200,6 +287,10 @@ header
font-size: 20px
font-style: normal
font-weight: 500
.container_flex
display: flex
justify-content: center
align-items: center
&_cost
position: absolute
right: 150px
@@ -207,23 +298,97 @@ header
font-size: 20px
font-style: normal
font-weight: 500
&_card
display: flex
flex-direction: column
justify-content: center
align-content: center
align-items: center
margin-left: 30px
height: 60px
width: 880px
background-color: #fff
border-radius: 44px
&_text
color: #2A2A2A
font-size: 24px
font-style: normal
font-weight: 500
span
color: #50D400
font-size: 16px
font-style: normal
font-weight: 500
&_bank_text
margin: 0 0 6px 0
flex-direction: row
justify-content: space-between
color: #2A2A2A
font-size: 24px
font-style: normal
font-weight: 500
&_slid
height: 18px
width: 112px
display: flex
position: absolute
bottom: 30px
left: 50%
transform: translateX(-50%)
justify-content: center
height: 14px
width: 80px
&_active
width: 20px
margin-right: 8px
width: 14px
margin-right: 6px
border-radius: 50%
background-color: #fff
&_disable
span
width: 20px
margin-right: 8px
width: 14px
margin-right: 6px
border-radius: 50%
background-color: #AEAEAE
background-color: #AEAEAE
&_bank
display: flex
justify-content: space-between
align-items: center
&_icon
height: 45px
width: 45px
&_credit
display: flex
justify-content: space-between
align-items: center
width: 380px
height: 25px
padding-right: 30px
&_prosent
padding-left: 33px
color: #20D37D
font-size: 20px
font-style: normal
font-weight: 500
&_choise
position: fixed
background: linear-gradient(0deg, #ECECEC 0%, #ECECEC 100%), #E8E8E8
display: flex
justify-content: center
align-items: center
height: 50px
width: 100%
bottom: 50px
footer
width: 100%
bottom: 0px
position: fixed
background-color: #fff
height: 50px
display: flex
justify-content: center
align-items: center
align-content: center
span
width: 200px
color: #20d37d
font-size: 20px
font-style: normal
font-weight: 500