Respo

2025-08-01 14:32:59 +02:00
parent 036afcbc74
commit f5a468393a
9 changed files with 307 additions and 29 deletions
--- a/layout/images/shopping-basket.svg
+++ b/layout/images/shopping-basket.svg
@@ -0,0 +1,3 @@
+<svg width="64" height="64" viewBox="0 0 64 64" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M61.0585 23.548H46.7054L36.6156 4.0934C36.2539 3.3959 35.6422 2.88102 34.8932 2.64352C34.1441 2.40602 33.3476 2.47452 32.6501 2.83627C32.4076 2.96202 32.1906 3.11752 32 3.2954C31.8092 3.11765 31.5923 2.96202 31.3498 2.83627C30.6524 2.47452 29.8556 2.40615 29.1066 2.64352C28.3576 2.8809 27.746 3.3959 27.3843 4.0934L16.749 24.5999C16.3873 25.2974 16.3187 26.094 16.5562 26.843C16.6372 27.0986 16.753 27.3369 16.895 27.556H2.9415C2.35337 27.556 1.875 27.0776 1.875 26.4895C1.875 25.9015 2.3535 25.423 2.9415 25.423H13.6296C14.1474 25.423 14.5671 25.0034 14.5671 24.4855C14.5671 23.9678 14.1474 23.548 13.6296 23.548H2.9415C1.31962 23.548 0 24.8676 0 26.4895C0 27.8346 0.90775 28.9709 2.14263 29.3199L7.5725 58.2786C7.92188 60.1426 9.552 61.4955 11.4485 61.4955H52.5516C54.4481 61.4955 56.0781 60.1426 56.4276 58.2786L61.8575 29.3198C63.0922 28.9709 64 27.8346 64 26.4895C64 24.8675 62.6804 23.548 61.0585 23.548ZM33.5134 4.5009C33.7662 4.36977 34.0551 4.3449 34.3266 4.43102C34.5981 4.51702 34.82 4.70377 34.9511 4.95665L45.5864 25.4633C45.7175 25.7161 45.7424 26.005 45.6562 26.2765C45.5702 26.5481 45.3835 26.7699 45.1305 26.901C44.8778 27.0323 44.5889 27.057 44.3172 26.971C44.0456 26.885 43.8239 26.6983 43.6927 26.4454L38.3752 16.192L33.0576 5.93865C32.7869 5.41665 32.9914 4.77165 33.5134 4.5009ZM45.9974 29.4311L45.1102 38.5784H32.9375V29.4311H45.9974ZM32 7.9719L42.0285 27.3084C42.0727 27.3939 42.121 27.4764 42.1726 27.556H21.8274C21.879 27.4764 21.9273 27.3939 21.9715 27.3085L22.9494 25.4231H37.2188C37.7365 25.4231 38.1562 25.0035 38.1562 24.4856C38.1562 23.9679 37.7365 23.5481 37.2188 23.5481H23.9217L32 7.9719ZM18.4135 25.4631L29.0489 4.95652C29.18 4.70365 29.4017 4.5169 29.6734 4.4309C29.7796 4.39715 29.8885 4.38052 29.9969 4.38052C30.1655 4.38052 30.3328 4.42102 30.4866 4.50077C31.0086 4.77165 31.2131 5.41652 30.9424 5.93852L20.307 26.4451C20.1759 26.698 19.9541 26.8848 19.6825 26.9708C19.4111 27.0568 19.1222 27.032 18.8692 26.9008C18.6164 26.7696 18.4296 26.5479 18.3436 26.2763C18.2575 26.0049 18.2824 25.7161 18.4135 25.4631ZM4.07113 29.4311H16.1189L17.006 38.5784H5.78625L4.07113 29.4311ZM6.13788 40.4533H17.1879L18.075 49.6004H7.85288L6.13788 40.4533ZM11.4484 59.6206C10.4536 59.6206 9.59862 58.911 9.41537 57.9333L8.2045 51.4754H18.2568L19.0467 59.6206H11.4484ZM31.0625 59.6206H20.9304L20.1405 51.4754H31.0625V59.6206ZM31.0625 49.6004H19.9586L19.0715 40.4533H31.0625V49.6004ZM31.0625 38.5784H18.8897L18.0026 29.4311H31.0625V38.5784ZM43.0696 59.6206H32.9375V51.4754H43.8595L43.0696 59.6206ZM44.0414 49.6005H32.9375V40.4534H44.9285L44.0414 49.6005ZM54.5846 57.9333C54.4014 58.911 53.5462 59.6206 52.5515 59.6206H44.9533L45.7433 51.4754H55.7955L54.5846 57.9333ZM56.1471 49.6005H45.9251L46.8122 40.4534H57.8623L56.1471 49.6005ZM58.2137 38.5783H46.9941L47.8812 29.431H59.9289L58.2137 38.5783ZM61.0585 27.5561H61.0433H61.0415H47.105C47.247 27.337 47.3626 27.0988 47.4437 26.8431C47.5916 26.3765 47.6207 25.8913 47.5342 25.4231H61.0585C61.6466 25.4231 62.125 25.9016 62.125 26.4896C62.125 27.0776 61.6465 27.5561 61.0585 27.5561Z" fill="white"/>
+</svg>
--- a/layout/style-css/style.css
+++ b/layout/style-css/style.css
--- a/layout/style-css/style.css.map
+++ b/layout/style-css/style.css.map
--- a/layout/style-scss/.htaccess
+++ b/layout/style-scss/.htaccess
@@ -0,0 +1,9 @@
+
+<IfModule mod_rewrite.c>
+RewriteEngine On
+RewriteBase /
+RewriteRule ^index\.php$ - [L]
+RewriteCond %{REQUEST_FILENAME} !-f
+RewriteCond %{REQUEST_FILENAME} !-d
+RewriteRule . /index.php [L]
+</IfModule>
--- a/layout/style-scss/style.scss
+++ b/layout/style-scss/style.scss
@@ -254,8 +254,15 @@ body {
 	flex-direction: column;
 	flex-grow: 1;

-	.tickets {
+	.tickets_calendar {
 		margin-top: 100px;
+		width: 100%;
+		margin-bottom: 50px;
+	}
+
+	.tickets {
+		// margin-top: 100px;
+		// margin-top: 50px;
 		margin-bottom: 50px;
 		display: flex;
 		flex-direction: column;
@@ -287,6 +294,11 @@ body {
 				.title {
 					font-weight: 800;
 					font-size: 46px;
+
+					@include respond-below(md) {
+						font-size: 36px;
+						font-size: 22px;
+					}
 				}

 				.description {
@@ -339,6 +351,13 @@ body {
 				.ticket__name {
 					font-size: 46px;
 					font-weight: 800;
+
+					@include respond-below(md) {
+						font-size: 32px;
+					}
+					@include respond-below(sm) {
+						font-size: 28px;
+					}
 				}

 				.description {
@@ -354,6 +373,20 @@ body {
 					font-weight: 800;
 					text-transform: uppercase;
 					text-decoration: underline;
+
+					@include respond-below(md) {
+						font-size: 16px;
+					}
+				}
+
+				@include respond-below(md) {
+					padding-left: 10px;
+					padding-right: 10px;
+					width: 400px;
+				}
+
+				@include respond-below(xs) {
+					width: 100%;
 				}
 			}

@@ -363,12 +396,26 @@ body {
 				margin-left: 40px;
 				font-weight: 800;
 				min-width: 138px;
+
+				@include respond-below(md) {
+					font-size: 36px;
+					min-width: 130px;
+				}
+				@include respond-below(sm) {
+					margin-left: 0;
+					min-width: unset;
+					margin-bottom: 0;
+				}
 			}

 			//przyciski
 			.ticket-quantity {
 				margin-left: 30px;

+				@include respond-below(sm) {
+					margin-left: 0;
+				}
+
 				.button {
 					width: 30px;
 					height: 30px;
@@ -383,6 +430,14 @@ body {
 					padding: 0 5px;
 				}
 			}
+
+			@include respond-below(sm) {
+				flex-direction: column;
+				row-gap: 15px;
+			}
+			@include respond-below(xs) {
+				width: 100%;
+			}
 		}
 	}

@@ -496,6 +551,14 @@ body {
 	}
 }

+.shopping-cart-container {
+	&--active {
+		.shopping-cart {
+			opacity: 1;
+			transform: translateX(0);
+		}
+	}
+}
 //shoping cart
 .shopping-cart {
 	opacity: 0;
@@ -513,10 +576,15 @@ body {
 	width: 230px;
 	padding: 20px 0;
 	transition: opacity 0.2s;
+	transform: translateX(100%);

 	// border: 1px solid $base-font-color;
-	&--active {
-		opacity: 1;
+	// &--active {
+	// 	opacity: 1;
+	// 	transform: translateX(0);
+	// }
+	&.hide {
+		display: none;
 	}

 	.basket {
@@ -537,6 +605,8 @@ body {
 		border-right: 1px solid $base-font-color;
 		border-left: 1px solid $base-font-color;
 		// border: 1px solid $base-font-color;
+		max-height: calc(90svh - 400px);
+		overflow: auto;

 		p {
 			margin-bottom: 0;
@@ -617,6 +687,50 @@ body {
 	}
 }

+.mobile-cart-btn {
+	position: fixed;
+	bottom: 50px;
+	right: 0;
+	opacity: 1;
+	z-index: 10;
+	border-top-left-radius: 10px;
+	border-bottom-left-radius: 10px;
+	background-color: #72b81b;
+	padding: 20px 15px 15px 15px;
+	transition: all 250ms ease-in-out;
+	cursor: pointer;
+
+	// @media (min-width: 1300px) {
+	// 	display: none;
+	// }
+
+	&.hide {
+		transform: translateX(100%);
+	}
+
+	span {
+		position: absolute;
+		top: 8px;
+		right: 5px;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		padding: 5px;
+		background: #fff;
+		border-radius: 100%;
+		width: 20px;
+		height: 20px;
+		line-height: 1;
+		font-size: 12px;
+	}
+	.mobile-cart-btn--img {
+		img {
+			width: 100%;
+			max-width: 40px;
+		}
+	}
+}
+
 //* Basket - "page"
 #basket_page {
 	.basket_content {
@@ -630,6 +744,7 @@ body {
 		table {
 			width: 100%;
 			background: $cWhite;
+			border-collapse: collapse;

 			tr {
 				text-align: center;
@@ -641,18 +756,33 @@ body {
 					h3 {
 						font-size: 1.25rem;
 						font-weight: 800;
+
+						@include respond-below(md) {
+							font-size: 0.85rem;
+						}
 					}
 				}

 				td {
 					padding: 8px;

+					@include respond-below(md) {
+						font-size: 14px;
+					}
+
 					.btn_t1 {
 						width: 30px;
 						height: 30px;
 						border-radius: 50%;
 						border: none;
 						transition: 150ms ease-in-out;
+						background: rgb(240, 240, 240);
+						display: inline-block;
+						color: #000;
+
+						i {
+							color: #000;
+						}
 					}

 					.btn_t1.add {
@@ -678,6 +808,65 @@ body {
 					}
 				}
 			}
+
+			@include respond-below(sm) {
+				background: transparent;
+
+				thead,
+				tbody,
+				th,
+				td,
+				tr {
+					display: block;
+				}
+
+				tbody {
+					> tr {
+						&:first-child {
+							display: none;
+						}
+					}
+				}
+
+				thead {
+					display: none; /* Приховуємо заголовки */
+				}
+
+				tr {
+					margin-bottom: 15px;
+					border: 1px solid #ddd;
+					padding: 10px;
+					border-radius: 10px;
+					background: #fff;
+				}
+
+				td {
+					position: relative;
+					padding-left: 50%;
+					text-align: right;
+					border: none;
+					min-height: 38px;
+					padding-left: 140px !important;
+
+					&:not(:last-child) {
+						border-bottom: 1px solid #eee;
+					}
+				}
+
+				td::before {
+					content: attr(data-label);
+					position: absolute;
+					left: 10px;
+					top: 50%;
+					font-weight: bold;
+					color: #555;
+					transform: translateY(-50%);
+
+					@include respond-below(xs) {
+						font-size: 12px;
+					}
+				}
+			}
 		}
 	}

@@ -912,8 +1101,8 @@ body {

 				th {
 					padding: 15px 10px;
-					font-size: 1.25rem;
-					font-weight: 800;
+					font-size: 16px;
+					font-weight: 600;
 					border-bottom: none;
 				}
 			}
@@ -922,6 +1111,8 @@ body {
 		tbody {
 			tr {
 				td {
+					font-size: 14px;
+
 					&.edit-btn {
 						a {
 							margin-left: 20px;
@@ -1195,3 +1386,30 @@ body {
 		}
 	}
 }
+
+#dateForm {
+	display: flex;
+	justify-content: center;
+	gap: 15px;
+	flex-wrap: wrap;
+
+	._title {
+		width: 100%;
+		font-weight: 600;
+		font-size: 30px;
+		text-align: center;
+	}
+}
+
+.basket_protection {
+	display: grid;
+	grid-template-columns: 1fr;
+	justify-content: flex-end;
+	margin: 10px auto;
+	text-align: right;
+
+	p {
+		margin-bottom: 0;
+		font-style: italic;
+	}
+}