nimtaurel
/
landing
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix

pull/3/head
nimtaurel 2023-12-28 14:31:10 +06:00
parent b1966a6bd9
commit 9a693d9231
5 changed files with 161 additions and 81 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
.idea/git_toolbox_prj.xml Normal file
View File

@ -0,0 +1,15 @@
<?xml version="1.0" encoding="UTF-8"?>
<project version="4">
<component name="GitToolBoxProjectSettings">
<option name="commitMessageIssueKeyValidationOverride">
<BoolValueOverride>
<option name="enabled" value="true" />
</BoolValueOverride>
</option>
<option name="commitMessageValidationEnabledOverride">
<BoolValueOverride>
<option name="enabled" value="true" />
</BoolValueOverride>
</option>
</component>
</project>

12
index.html
View File

@ -3,12 +3,12 @@
<head> <head>
<meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1"> <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1">
<title>ESEP</title> <title>ESEP</title>
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.css"> <link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="styles.css"> <link rel="stylesheet" href="styles.css">
</head> </head>
<body> <body>
<div class="row"> <div class="row">
<div class="PBP-container col-12 col-sm-12 col-md-6"> <div class="PBP-container col-md-6 col-sm-12">
<header class="PBP-header p-2"> <header class="PBP-header p-2">
<div class="logo-container"> <div class="logo-container">
<p><b>ESEP </b>ПБП</p> <p><b>ESEP </b>ПБП</p>
@ -17,7 +17,7 @@
</header> </header>
<main class="d-flex justify-content-center align-items-center"> <main class="d-flex justify-content-center align-items-center">
<img src="img/pb_bg.jpg" alt=""> <img src="img/pb_bg.jpg" alt="">
<div class="main-container px-2"> <div class="container px-2">
<div class="main-text-wrapper"> <div class="main-text-wrapper">
<h1> <h1>
ПОРТАЛ<br> ПОРТАЛ<br>
@ -35,16 +35,16 @@
</div> </div>
</main> </main>
</div> </div>
<div class="PF-container col-12 col-sm-12 col-md-6"> <div class="PF-container col-md-6 col-sm-12">
<header class="PF-header p-2"> <header class="PF-header p-2">
<div class="logo-container"> <div class="logo-container">
<p><b>ESEP </b>ПЛАН<span>ФАКТ</span></p> <p><b>ESEP </b>ПЛАН<span>ФАКТ</span></p>
<p class="sm-text">ОБЛАЧНАЯ БУХГАЛТЕРИЯ</p> <p class="sm-text">ОБЛАЧНАЯ БУХГАЛТЕРИЯ</p>
</div> </div>
</header> </header>
<main class="main-pf d-flex justify-content-center align-items-center"> <main class="main-pf d-flex justify-content-center align-items-end">
<img src="img/pf_bg.jpg" alt=""> <img src="img/pf_bg.jpg" alt="">
<div class="main-container px-2"> <div class="container px-2">
<div class="main-text-wrapper"> <div class="main-text-wrapper">
<h1> <h1>
ОБЛАЧНАЯ БУХГАЛТЕРИЯ ОБЛАЧНАЯ БУХГАЛТЕРИЯ

52
styles.css
View File

@ -12,12 +12,11 @@ header {
height: 70px; height: 70px;
} }
.main-container { .container {
max-height: 100%; max-height: 50vh;
display: flex; display: flex;
justify-content: center; justify-content: end;
flex-direction: column; flex-direction: column;
flex-grow: 1;
align-items: center; align-items: center;
position: absolute; position: absolute;
bottom: 5%; bottom: 5%;
@ -33,7 +32,7 @@ header {
} }
.logo-container p { .logo-container p {
font-weight: 300; font-weight: 300;
font-size: 20px; font-size: 1.3rem;
margin-bottom: 0; margin-bottom: 0;
} }
.logo-container p b { .logo-container p b {
@ -46,7 +45,7 @@ header {
} }
.logo-container .sm-text { .logo-container .sm-text {
font-size: 11px; font-size: 11px;
letter-spacing: 1.4px; letter-spacing: 1.7px;
} }
.main-text-wrapper { .main-text-wrapper {
@ -166,14 +165,43 @@ header {
background-color: #001529; background-color: #001529;
} }
@media screen and (max-width: 768px) { @media (max-width: 768px) {
.main-container { .PBP-container, .PF-container {
bottom: 25%; height: 50vh;
} }
.PBP-container header, .PF-container header {
height: 50px;
} }
@media screen and (max-width: 992px) { .PBP-container header p, .PF-container header p {
.main-container { font-size: 0.8rem;
bottom: 25%; letter-spacing: 1.2px;
}
.PBP-container header .sm-text, .PF-container header .sm-text {
font-size: 0.6rem;
letter-spacing: 0;
}
.PBP-container main, .PF-container main {
height: calc(50vh - 50px);
min-height: fit-content;
}
.PBP-container main .container, .PF-container main .container {
height: 100%;
bottom: 0;
}
.PBP-container main .container .main-text-wrapper, .PF-container main .container .main-text-wrapper {
margin-bottom: 10px;
}
.PBP-container main .container .main-text-wrapper h1, .PF-container main .container .main-text-wrapper h1 {
font-size: 1.5rem;
}
.PBP-container main .container .main-text-wrapper .line, .PF-container main .container .main-text-wrapper .line {
width: 120px;
}
.PBP-container main .container h5, .PF-container main .container h5 {
font-size: 1rem;
}
.PBP-container main .container p, .PF-container main .container p {
font-size: 0.8rem;
} }
} }

2
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;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;;;AAIN;EACE;IACE;;;AAGJ;EACE;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;;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"}

61
styles.scss
View File

@ -12,12 +12,11 @@ header {
height: 70px; height: 70px;
} }
.main-container { .container {
max-height: 100%; max-height: 50vh;
display: flex; display: flex;
justify-content: center; justify-content: end;
flex-direction: column; flex-direction: column;
flex-grow: 1;
align-items: center; align-items: center;
position: absolute; position: absolute;
bottom: 5%; bottom: 5%;
@ -33,7 +32,7 @@ header {
p { p {
font-weight: 300; font-weight: 300;
font-size: 20px; font-size: 1.3rem;
margin-bottom: 0; margin-bottom: 0;
b { b {
@ -49,7 +48,7 @@ header {
.sm-text { .sm-text {
font-size: 11px; font-size: 11px;
letter-spacing: 1.4px; letter-spacing: 1.7px;
} }
} }
@ -195,13 +194,51 @@ header {
} }
} }
} }
@media screen and (max-width: 768px) {
.main-container { @media (max-width: 768px) {
bottom: 25%; .PBP-container, .PF-container {
height: 50vh;
header {
height: 50px;
p {
font-size: 0.8rem;
letter-spacing: 1.2px;
}
.sm-text {
font-size: 0.6rem;
letter-spacing: 0;
} }
} }
@media screen and (max-width: 992px) {
.main-container { main {
bottom: 25%; height: calc(50vh - 50px);
min-height: fit-content;
.container {
height: 100%;
bottom: 0;
.main-text-wrapper {
margin-bottom: 10px;
h1 {
font-size: 1.5rem;
}
.line {
width: 120px;
} }
} }
h5 {
font-size: 1rem;
}
p {
font-size: 0.8rem
}
}
}
}
}