From dbabe3d81828f61c2e57b475b5dbaf3bc826364d Mon Sep 17 00:00:00 2001 From: andrei Date: Mon, 22 Apr 2024 09:22:12 +0500 Subject: [PATCH] =?UTF-8?q?=D0=BE=D0=BF=D1=82=D0=B8=D0=BC=D0=B8=D0=B7?= =?UTF-8?q?=D0=B8=D1=80=D0=BE=D0=B2=D0=B0=D0=BB=20=D0=BD=D0=B5=D0=BA=D0=BE?= =?UTF-8?q?=D1=82=D0=BE=D1=80=D1=8B=D0=B5=20css?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../css/includes/film_timtable_card.css | 11 ++- CineSync/static/css/style.css | 19 +++-- CineSync/static/css/tickets/my_orders.css | 3 + CineSync/static/css/timetable/session.css | 76 ++++++++++--------- CineSync/static/js/timetable/session.js | 2 +- CineSync/templates/tickets/my_orders.html | 5 ++ CineSync/templates/timetable/session.html | 68 +++++++++-------- 7 files changed, 109 insertions(+), 75 deletions(-) create mode 100644 CineSync/static/css/tickets/my_orders.css diff --git a/CineSync/static/css/includes/film_timtable_card.css b/CineSync/static/css/includes/film_timtable_card.css index de4befc..3e6a934 100644 --- a/CineSync/static/css/includes/film_timtable_card.css +++ b/CineSync/static/css/includes/film_timtable_card.css @@ -101,5 +101,14 @@ .film_title { font-size: 1.5vw; max-width: 40vw; - overflow-y: auto; + text-wrap: nowrap; + overflow-x: auto; +} +.film_title::-webkit-scrollbar { + height: 7px; +} +.film_title::-webkit-scrollbar-thumb { + background-color: #0d1d3a; + border-radius: 5vw; + border: 1px solid #eaeaea; } \ No newline at end of file diff --git a/CineSync/static/css/style.css b/CineSync/static/css/style.css index 9b41a2c..ca23e21 100644 --- a/CineSync/static/css/style.css +++ b/CineSync/static/css/style.css @@ -2,11 +2,12 @@ background-color: rgba(13, 39, 58, 0.8); border-radius: 2vw; width: 40%; - display: flex !important; + display: flex; flex-direction: column; align-items: center; margin-left: 15%; } + .header_title { width: 100%; text-align: center; @@ -14,16 +15,20 @@ font-weight: bold; margin-bottom: 2vw; } + .timetable_block { margin-top: 10vw; height: 100vw; } + .tab_btn { color: #eaeaea !important; } + .tab_btn.active { color: #0d1d3a !important; } + .timetable_body.active { margin-top: 1vw; margin-bottom: 10vw; @@ -31,20 +36,21 @@ padding-bottom: 2vw; flex-direction: column; } + .session_time { font-size: 12px; color: #eaeaea; } + .genre { margin-right: 0.5vw; } + .film_session { background-color: rgb(255, 64, 96); color: #eaeaea; font-weight: bold; - padding: 0.5vw; - padding-top: 1vw; - padding-bottom: 1vw; + padding: 1vw 0.8vw; margin: 0.3vw; border-radius: 0.5vw; text-decoration: none; @@ -52,14 +58,17 @@ align-items: center; justify-content: center; } + .film_session:hover { background-color: rgb(196, 47, 72); } + body::-webkit-scrollbar { width: 8px; } + body::-webkit-scrollbar-thumb { background-color: #eaeaea; border-radius: 5vw; border: 2px solid #0d1d3a; -} \ No newline at end of file +} diff --git a/CineSync/static/css/tickets/my_orders.css b/CineSync/static/css/tickets/my_orders.css new file mode 100644 index 0000000..8a02a2a --- /dev/null +++ b/CineSync/static/css/tickets/my_orders.css @@ -0,0 +1,3 @@ +.header_title { + margin-top: 5vw; +} \ No newline at end of file diff --git a/CineSync/static/css/timetable/session.css b/CineSync/static/css/timetable/session.css index 9235dd3..d75776b 100644 --- a/CineSync/static/css/timetable/session.css +++ b/CineSync/static/css/timetable/session.css @@ -1,61 +1,56 @@ .seats_card { - margin-left: 27%; - margin-right: 27%; - margin-top: 2vw; - margin-bottom: 5vw; + margin: 2vw auto 5vw; background-color: #eaeaea; border-radius: 3vw; display: flex; width: 46%; - max-height: 50vw !important ; - overflow-x: scroll; - overflow-y: scroll; + max-height: 50vw; + overflow: auto; flex-direction: column; flex-wrap: nowrap; } + .table_card { margin: 3vw; margin-top: 1.5vw; } + .seat_checkbox { display: none; } + .seat_checkbox:checked + .seat_number { color: #eaeaea; } -.selected { - background-color: #0d1d3a; -} -.selected:hover { + +.selected, .selected:hover { background-color: #0d1d3a; } + .seat_number { width: 1vw; height: 1.1vw; text-align: center; } + .buy_btn { margin-top: 2vw; - margin-left: 2vw; - margin-right: 2vw; } -.ticket_film_image { + +.ticket_film_image, .film_session_image { object-fit: cover; - height: 20vw !important; - width: 25% !important; + height: 20vw; + width: 25%; border-radius: 3vw; } + .film_session_image { margin-top: 4vw; - object-fit: cover; - height: 20vw !important; - width: 12vw !important; - border-radius: 3vw; + width: 12vw; } + .film_info_block { - margin-top: 5vw; - margin-right: 27%; - margin-left: 27%; + margin: 5vw auto 0; width: 46%; display: flex; flex-direction: row; @@ -64,6 +59,7 @@ height: 20vw; overflow-y: auto; } + .film_info_text_block { height: 20vw; display: flex; @@ -73,51 +69,61 @@ align-items: flex-start; margin-left: 1vw; } + .film_info_text, .film_info_description { color: #eaeaea; } + .film_info_description { max-height: 9.9vw; overflow-y: auto; } + .cell { - background-color: transparent !important; + background-color: transparent; height: 4vw; min-width: 3.5vw; - } + .row_number_cell { display: flex; align-items: center; justify-content: center; width: 3vw; } + .seats_card::-webkit-scrollbar { - height: 7px; - width: 7px; -} -.seats_card::-webkit-scrollbar-thumb { - background-color: #0d1d3a; - border-radius: 5vw; - border: 1px solid #eaeaea; + display: none; } + .film_info_description::-webkit-scrollbar { width: 5px; } + .film_info_description::-webkit-scrollbar-thumb { background-color: #eaeaea; border-radius: 5vw; } + .horizontal_line { - margin-left: 2vw; - margin-right: 2vw; + margin: 1vw 3.5vw; border-top: 10px solid; } + .display_title { width: 100%; text-align: center; font-size: 1.2vw; } + .disabled { background-color: #5a5a5a !important; -} \ No newline at end of file +} + +.seats_form { + display: flex; + flex-direction: column; + flex-wrap: nowrap; + align-items: center; + justify-content: center; +} diff --git a/CineSync/static/js/timetable/session.js b/CineSync/static/js/timetable/session.js index 3326bc7..e07c60f 100644 --- a/CineSync/static/js/timetable/session.js +++ b/CineSync/static/js/timetable/session.js @@ -10,7 +10,7 @@ document.querySelectorAll('.seat_checkbox').forEach(function(checkbox) { }); document.addEventListener('DOMContentLoaded', function() { - const form = document.querySelector('.seats_card'); + const form = document.querySelector('.seats_form'); const checkboxes = form.querySelectorAll('.seat_checkbox'); const buyButton = form.querySelector('.buy_btn'); diff --git a/CineSync/templates/tickets/my_orders.html b/CineSync/templates/tickets/my_orders.html index b53e9f1..4cadb4d 100644 --- a/CineSync/templates/tickets/my_orders.html +++ b/CineSync/templates/tickets/my_orders.html @@ -5,5 +5,10 @@ Мои заказы {% endblock %} {% block content %} + + +

Мои заказы

+
+
{% endblock %} \ No newline at end of file diff --git a/CineSync/templates/timetable/session.html b/CineSync/templates/timetable/session.html index fe3a7a9..9991473 100644 --- a/CineSync/templates/timetable/session.html +++ b/CineSync/templates/timetable/session.html @@ -22,40 +22,42 @@ -
- - {% csrf_token %} -
-

Экран

- - - {% for row in session.auditorium.rows.all %} - - - {% for _ in row.column_count|get_range %} - + + +
+ {% csrf_token %} +
+

Экран

+
Ряд {{ forloop.counter }} - {% with column_seat_str=forloop.counter|stringformat:"i" row_seat_str=row.row_number|stringformat:"i" %} - {% if column_seat_str|add:"-"|add:row_seat_str in occupied_seats %} - - {% else %} - - {% endif %} - {% endwith %} -
+ + {% for row in session.auditorium.rows.all %} + + + {% for _ in row.column_count|get_range %} + + {% endfor %} + {% endfor %} - - {% endfor %} - -
Ряд {{ forloop.counter }} + {% with column_seat_str=forloop.counter|stringformat:"i" row_seat_str=row.row_number|stringformat:"i" %} + {% if column_seat_str|add:"-"|add:row_seat_str in occupied_seats %} + + {% else %} + + {% endif %} + {% endwith %} +
+ + +
{% endblock %} \ No newline at end of file