diff --git a/src/main/resources/static/css/filtration_styles.css b/src/main/resources/static/css/filtration_styles.css index c633b90..46ba17e 100644 --- a/src/main/resources/static/css/filtration_styles.css +++ b/src/main/resources/static/css/filtration_styles.css @@ -75,6 +75,54 @@ select { align-items: center; gap: 10px; } + +.input-range { + display: flex; + gap: 10px; + margin-top: 5px; +} + +.input-range input { + width: 100px; + padding: 5px; + border: 1px solid #ccc; + border-radius: 4px; +} +#map { + width: 100%; + height: 100%; + cursor: pointer; + position: relative; + top: 0; + left: 0; + width: 300px; + height: 200px; + transition: all 0.3s ease-in-out; + z-index: 1; +} + +#map.fullscreen { + position: fixed; /* Карта будет на весь экран */ + top: 0; + left: 0; + width: 100vw; + height: 100vh; + z-index: 1000; /* Выводим карту на передний план */ + border-radius: 0; +} + +#fullscreenControls { + display: none; + position: fixed; + top: 10px; + right: 10px; + z-index: 1001; +} + +#fullscreenControls.visible { + display: flex; + gap: 10px; +} /* Цвет звездочек */ .star { color: #003366; @@ -96,18 +144,6 @@ input[type="number"] { font-family: 'Century Gothic', Arial, sans-serif; } -.input-range { - display: flex; - gap: 10px; - margin-top: 5px; -} - -.input-range input { - width: 100px; - padding: 5px; - border: 1px solid #ccc; - border-radius: 4px; -} input[type="text"] { font-family: 'Century Gothic', Arial, sans-serif; } @@ -127,6 +163,7 @@ input[type="text"] { .dropdown { position: relative; width: 90%; + z-index: 2; } #regionInput, @@ -161,13 +198,8 @@ input[type="text"] { display: flex; flex-direction: column; padding: 10px; - z-index: 1; } -.map { - z-index: 2; - -} .checkbox-container label { margin: 5px 0; } diff --git a/src/main/resources/static/css/main_styles.css b/src/main/resources/static/css/main_styles.css index 74263a4..ac35184 100644 --- a/src/main/resources/static/css/main_styles.css +++ b/src/main/resources/static/css/main_styles.css @@ -72,7 +72,7 @@ header { width: 300px; } -.filter-btn { +.filter-btn, .mapsearch-btn { padding: 10px 20px; background-color: #003366; color: #FFFFFF; diff --git a/src/main/resources/static/css/map-search_styles.css b/src/main/resources/static/css/map-search_styles.css new file mode 100644 index 0000000..082bae5 --- /dev/null +++ b/src/main/resources/static/css/map-search_styles.css @@ -0,0 +1,113 @@ +html, body { + height: 100%; /* Высота экрана */ + margin: 0; /* Убираем отступы */ + overflow: hidden; /* Убираем прокрутку */ +} +/* Устанавливаем карту на весь экран */ +#map { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; +} + +/* Сайдбар слева, без фона по умолчанию */ +#sidebar { + font-family: 'Century Gothic', Arial, sans-serif; + position: absolute; + top: 0; + left: 0; + height: 100%; + width: 420px; + background-color: transparent; + color: white; + padding: 20px; + z-index: 1000; + overflow-y: auto; + display: flex; + flex-direction: column; + transition: background-color 0.3s ease; +} + +/* Когда фоновый цвет должен быть видим */ +#sidebar.showBackground { + background-color: #6C7D9F; +} + +#sidebar .leaflet-routing-container { + color: #003366; + width: 100%; + font-size: 0.75rem; +} + +/* Контейнер для поиска внутри сайдбара */ +#searchContainer { + padding: 10px; + display: flex; + align-items: center; + gap: 10px; + margin-bottom: 20px; +} + +.hidden { + display: none !important; +} + +input[type="text"] { + font-family: 'Century Gothic', Arial, sans-serif; + width: 95%; + padding: 10px; + border: 1px solid #ddd; + border-radius: 5px; + color: #003366; +} + +#routeStart, #routeEnd { + margin-bottom: 15px; +} + +button { + display: inline-block; + padding: 10px; + background-color: #003366; + color: white; + font-family: 'Century Gothic', Arial, sans-serif; + border: none; + border-radius: 5px; + cursor: pointer; +} + +button:hover { + background-color: #012850; +} + +#routeButton { + width: 100%; + box-sizing: border-box; /* Учитывает отступы и границы в ширине */ +} +#backButton, #backButtonRoute { + display: flex; + align-items: center; + justify-content: center; + border: none; + padding: 10px; + margin: 0; + cursor: pointer; + +} + +#backButtonRoute { + margin-bottom: 15px; +} + +#backButton .back-icon, #backButtonRoute .back-icon { + width: 24px; + height: 24px; + object-fit: contain; +} + +#buildRouteButton { + width: 100%; + box-sizing: border-box; +} diff --git a/src/main/resources/static/css/profile_styles.css b/src/main/resources/static/css/profile_styles.css index 99d3e5e..c212ca9 100644 --- a/src/main/resources/static/css/profile_styles.css +++ b/src/main/resources/static/css/profile_styles.css @@ -60,7 +60,7 @@ header { color: #666; } -#import-export-button, #back-button, #logout-button { +#import-export-button, #back-button, #logout-button, #save-photo-button, #cancel-photo-button, #change-photo-button{ margin-top: 10px; padding: 10px 20px; background-color: #003366; @@ -145,6 +145,13 @@ header { font-weight: bold; } +#photo-url-input { + padding: 10px; + border: 1px solid #cccccc; + border-radius: 20px; + width: 300px; +} + /* Стили для отзыва */ .review { diff --git a/src/main/resources/static/css/statistics_styles.css b/src/main/resources/static/css/statistics_styles.css new file mode 100644 index 0000000..297d028 --- /dev/null +++ b/src/main/resources/static/css/statistics_styles.css @@ -0,0 +1,91 @@ +body { + font-family: 'Century Gothic', Arial, sans-serif; + background-color: #E6F0FF; +} + +/* Основной контейнер */ + +.container { + + padding: 30px; + border-radius: 10px; + width: 85%; + margin: 0 auto; + box-sizing: border-box; +} + +header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 20px; +} + +header h1 { + font-size: 32px; + font-weight: 1000; + color: #003366; +} + +.profile-btn { + border: none; +} + +.profile-img { + width: 50px; + height: 50px; + border-radius: 50%; + object-fit: cover; + cursor: pointer; +} + +.back-btn { + padding: 10px 20px; + background-color: #003366; + color: white; + border: none; + cursor: pointer; + text-decoration: none; + transition: background-color 0.3s; +} + +.back-btn:hover { + background-color: #012850; +} + +.content h2 { + font-size: 18px; + color: #003366; + margin-bottom: 20px; +} + +.content { + width: 500px; + justify-content: center; + align-items: center; +} + +form { + font-size: 16px; + color: #003366; +} + +form label { + display: block; + margin-bottom: 10px; +} + +form .btn { + font-family: 'Century Gothic', Arial, sans-serif; + padding: 10px 20px; + background-color: #003366; + font-size: 1rem; + color: white; + border: none; + cursor: pointer; + text-decoration: none; + transition: background-color 0.3s; +} +form .btn:hover { + background-color: #012850; +}