This commit is contained in:
2024-01-18 14:12:43 +01:00
parent 173d5bbf70
commit a32c93feb4
3 changed files with 22 additions and 23 deletions

View File

@@ -13,7 +13,7 @@ body {
header { header {
position: fixed; position: fixed;
background-color: #000; background-color: #162938;
top: 0; top: 0;
left: -50; left: -50;
width: 100%; width: 100%;
@@ -92,7 +92,7 @@ div {
label { label {
display: block; display: block;
margin-bottom: 5px; margin-bottom: 5px;
color: #000; color: #162938;
} }
select, input, textarea { select, input, textarea {
@@ -103,7 +103,7 @@ select, input, textarea {
} }
button { button {
background-color: #000; background-color: #162938;
color: #fff; color: #fff;
padding: 10px 20px; padding: 10px 20px;
border: none; border: none;

View File

@@ -16,6 +16,9 @@ document.addEventListener("DOMContentLoaded", function () {
event.stopPropagation(); event.stopPropagation();
wrapper.classList.remove('active-popup'); wrapper.classList.remove('active-popup');
} }
function hideLoginForm() {
wrapper.classList.remove('active-popup');
}
registerLink.addEventListener('click', function (event) { registerLink.addEventListener('click', function (event) {
openLoginForm(event); openLoginForm(event);
@@ -26,20 +29,9 @@ document.addEventListener("DOMContentLoaded", function () {
openLoginForm(event); openLoginForm(event);
wrapper.classList.remove('active'); wrapper.classList.remove('active');
}); });
closeLoginForm();
btnPopup.addEventListener('click', openLoginForm); btnPopup.addEventListener('click', openLoginForm);
iconClose.addEventListener('click', closeLoginForm); iconClose.addEventListener('click', closeLoginForm);
}); });
window.addEventListener('scroll', function() {
var headerPlaceholder = document.querySelector('.header-placeholder');
var header = document.querySelector('header');
if (window.scrollY >= header.offsetTop) {
headerPlaceholder.style.display = 'block';
} else {
headerPlaceholder.style.display = 'none';
}
});

View File

@@ -7,7 +7,7 @@
} }
body { body {
/* display: flex; */ /* Remove this line */
justify-content: center; justify-content: center;
align-items: center; align-items: center;
min-height: 100vh; min-height: 100vh;
@@ -89,7 +89,7 @@ header {
.wrapper { .wrapper {
position: fixed; position: fixed;
width: 100%; width: 100%;
max-width: 400px; /* Set maximum width */ max-width: 400px;
height: 440px; height: 440px;
background: transparent; background: transparent;
border: 2px solid rgba(255, 255, 255, .5); border: 2px solid rgba(255, 255, 255, .5);
@@ -109,11 +109,11 @@ header {
@media only screen and (max-width: 768px) { @media only screen and (max-width: 768px) {
.wrapper { .wrapper {
max-width: none; /* Remove maximum width for smaller screens */ max-width: none;
} }
header { header {
padding: 20px 20px; /* Adjust padding for smaller screens */ padding: 20px 20px;
} }
.navigation { .navigation {
flex-direction: column; flex-direction: column;
@@ -329,15 +329,21 @@ header {
} }
.photo-grid { .photo-grid {
display: grid; display: flex;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); flex-wrap: wrap;
gap: 20px; justify-content: space-around;
text-align: left;
} }
.row {
display: flex;
flex-wrap: wrap;
gap: 20px;
}
.photo { .photo {
position: relative; position: relative;
width: calc(50% - 10px); /* Adjust the width as needed */
margin-bottom: 20px;
} }
.photo img { .photo img {
@@ -369,6 +375,7 @@ header {
margin: 0; margin: 0;
} }
.header-placeholder { .header-placeholder {
height: 80px; height: 80px;
width: 100%; width: 100%;