This repository has been archived on 2024-01-13. You can view files and clone it. You cannot open issues or pull requests or push a commit.
Files
arka-mvp/templates/index.html
T

137 lines
2.7 KiB
HTML

{% extends 'base.html' %}
{% block title %} Арка | Главная {% endblock %}
{% load static %}
{% block styles %}
<style>
main {
width: 90%;
margin-left: 8%;
font-size: 30px;
font-weight: 900;
}
main > h1{
margin-top: 7%;
margin-left: 10%;
width: 60%;
}
#intro-wrapper {
display: flex;
position: absolute;
z-index:-1;
top: 0;
left: 0;
right: 0;
justify-content: right;
}
#intro-wrapper > img{
width: 40%;
}
.buttons {
/* вот тут был display: inline */
display: flex;
flex-direction: row ;
width: 40%;
height: 10%;
margin-left: 5%;
margin-top: 5%;
}
.buttons > a {
color: #eee;
background: var(--brand-color);
padding: 3% 5%;
margin-left: 5%;
text-decoration: none;
font-size: 20px;
border-radius: 12px;
}
.slogo {
box-sizing: border-box;
display: flex;
margin-left: 10%;
margin-bottom: 10%;
width: 35%;
height: 10%;
}
.slogo > h3 {
background: rgba(175, 162, 255, 0.06);
backdrop-filter: blur(5px);
color: var(--brand-color);
font-weight: 800;
font-size: 20px;
line-height: 27px;
border-radius: 24px;
padding: 5% 8%;
font-style: normal;
}
#slogo-cube, #slogo-arc {
z-index: -1;
position: absolute;
}
#slogo-cube {
width: 59px;
height: 66px;
left: 15%;
top: 539px;
transform: rotate(18.48deg);
}
#slogo-arc {
width: 53px;
height: 49px;
left: 47%;
top: 423px;
transform: rotate(5.86deg);
}
</style>
{% endblock %}
{% block content %}
<div id="intro-wrapper">
<img src="{% static 'images/intro.webp' %}" alt="">
</div>
<h1>Создай объявление и получи ремонт с гарантией качества</h1>
<div class="slogo">
<img id="slogo-cube" src="{% static 'images/cube.png' %}" alt="">
<h3>Здесь вы найдёте проверенного исполнителя или заказчика под любую вашу задачу и профиль</h3>
<img id="slogo-arc" src="{% static 'images/arc.png' %}" alt="">
</div>
<div class="buttons">
<a href="{% url 'index' %}">Создать заказ</a>
<a href="{% url 'index' %}">Стать исполнителем</a>
</div>
<a href="{% url 'user-agreement' %}">Пользовательское соглашение</a>
{% endblock %}