Initial commit

master
sync 1 year ago
commit cbe858bff3

@ -0,0 +1,102 @@
body {
background: hsl(0deg 100% 100%);
padding: 0;
margin: 0;
}
.payment {
--padding: 4px;
position: relative;
padding: var(--padding);
border: 1px solid hsl(210deg 10% 40%);
border-radius: 8px;
gap: 8px;
height: 100vh;
height: 100svh;
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1rem 1fr;
grid-row-gap: 15px;
}
.title_wrapper {
--padding: 4px;
position: relative;
padding: var(--padding);
border-radius: 8px;
gap: 8px;
height: 4vh;
height: 4svh;
display: grid;
grid-area: span 2/span 1;
grid-template-columns: 1fr;
grid-template-rows: 1rem 1rem;
grid-row-gap: 15px;
}
.section_wrapper {
--padding: 4px;
position: relative;
padding: var(--padding);
border-radius: 8px;
gap: 8px;
height: 2vh;
height: 2svh;
display: grid;
grid-template-columns: 1fr 5fr;
grid-template-rows: 1rem;
column-gap: 0px;
}
.section_header {
display: grid;
place-content: center;
border-radius: 3px;
background: hsl(0deg 100% 50%);
color: white;
font-size: 1.3125rem;
font-weight: bold;
grid-row-gap: 15px;
grid-column-gap: 0px;
}
.section_line {
display: grid;
place-content: center;
border-radius: 3px;
border-top: solid red 3px;
background: hsl(0deg 100% 100%);
color: white;
font-size: 1.3125rem;
font-weight: bold;
grid-row-gap: 15px;
grid-column-gap: 0px;
}
.payer {
--padding: 4px;
position: relative;
padding: var(--padding);
border: 1px solid hsl(210deg 10% 40%);
border-radius: 8px;
gap: 8px;
height: 100vh;
height: 100svh;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-rows: 1rem 1rem 1rem 1rem;
grid-row-gap: 15px;
}
.child {
display: grid;
margin-bottom: 1px;
place-content: self-start center;
border-radius: 3px;
background: hsl(0deg 100% 100%);
color: black;
font-size: 1.3125rem;
font-weight: bold;
}
.title {
display: grid;
place-content: center;
border-radius: 3px;
background: hsl(0deg 100% 100%);
color: black;
font-size: 1.3125rem;
font-weight: bold;
}

@ -0,0 +1,53 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Форма платежа по форме банка</title>
<link rel="stylesheet" href="grid.css">
</head>
<body>
<div class="payment">
<div class="title_wrapper">
<div class="title">Рублевый перевод на счета других клиентов или в другие банки, включая налоговые платежи</div>
<div class="title">№2 от 03.07.2024</div>
</div>
<div class="section_wrapper">
<div class="section_header">Плательщик</div>
<div class="section_line"></div>
</div>
<div class="payer">
<div class="child">Плательщик:</div>
<div class="child">Шигорина Наталья Николаевна 00234052</div>
<div class="child">Номер счета:</div>
<div class="child">
<select>
<option>12321</option>
<option>12322</option>
<option>12323</option>
</select>
</div>
<div class="child">ИНН:</div>
<div class="child">123456789123</div>
<div class="child">Сумма:</div>
<div class="child">
<span>
<input value="0-00"></input>
RUB</span>
</div>
<div class="child">Телефон или электронный адрес:</div>
<div class="child">+7-4942326120 schnn@mail.ru</div>
<div class="child"></div>
<div class="child"></div>
<div class="child">Адрес места жительства:</div>
<div class="child">г. Москва, ул. Дмитрия Ульянова 158/1, кв. 12</div>
<div class="child">Комиссии и расходы:</div>
<div class="child">
<select>
<option>OUR</option>
</select>
</div>
</div>
</div>
</body>
</html>
Loading…
Cancel
Save