Extract styles to style.css

This commit is contained in:
Ivan Kaziev 2024-04-19 20:18:42 +03:00
parent 7954bfb5be
commit 646ff35b64
2 changed files with 48 additions and 13 deletions

View File

@ -18,6 +18,21 @@
position: absolute;
top: 70%;
border-radius: 3vw;
margin-left: 5%;
margin-top: 150px;
}
h6 {
text-align: center;
margin-top: 4px;
}
.seat_number {
width: 20px;
height: 18px;
text-align: center;
}
.buy_btn {
float: bottom;
margin-top: 40px;
}
.ticket_film_image {
object-fit: cover;
@ -58,7 +73,31 @@
padding-bottom: 2vw;
flex-direction: column;
}
.film_card, .seats_card {
.seats_card {
width: 100%;
background-color: #eaeaea;
margin-top: 1vw;
margin-bottom: 1vw;
border-radius: 3vw;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: flex-start;
width: 50%;
margin: 0 auto;
margin-top: 20px;
}
.card_body {
width: 80%;
margin-top: 180px;
margin: 0 auto;
}
.rows {
margin-top: 30%;
}
.film_card {
width: 100%;
background-color: #eaeaea;
margin-top: 1vw;

View File

@ -10,25 +10,21 @@
<img src="{{ session.film.image.url }}" class="film_session_image"
alt="Фотография фильма не найдена">
</div>
<div class="seats_card"
style="width: 50%; height:
{{ height }}px;
margin: 0 auto; margin-top: 20px"
>
<div style="width: 80%; margin-top: 80px; margin: 0 auto;">
<div class="seats_card" style="height: {{ height }}px;">
<div class="card_body">
<h1>{{ session.film.name }}</h1>
{{ session.auditorium.number }}<br>
{{ session.start_datetime }}
<div style="margin-top: 20%;">
<div class="line" style="margin-left: 5%; margin-top: 150px;">
<h6 style="text-align: center; margin-top: 4px">Экран</h6>
<div class="rows">
<div class="line">
<h6>Экран</h6>
</div>
{% for row in session.auditorium.row_count|get_range %}
<div class="row">
{% for seat in seats %}
<div class="film_card_row col">
<div class="film_card_row col-auto">
<a class="film_session">
<span style="width: 20px; height: 18px; text-align: center;">{{ seat.row_number }}</span>
<span class="seat_number">{{ seat.row_number }}</span>
</a>
</div>
{% endfor %}
@ -37,7 +33,7 @@
{% endfor %}
</div>
<div style="text-align: center">
<button class="btn btn-primary" style="float: bottom; margin-top: 40px;">Купить билет</button>
<button class="btn btn-primary buy_btn">Купить билет</button>
</div>
</div>
</div>