Styling updates and tidying of JS file
This commit is contained in:
parent
d480bcf962
commit
c044dc10bd
11
js/script.js
11
js/script.js
|
@ -24,12 +24,12 @@ icon.forEach((item) => {
|
|||
titleBar.appendChild(closeButton);
|
||||
|
||||
let windowTilte = document.createElement("h2");
|
||||
windowTilte.classList.add("title")
|
||||
windowTilte.classList.add("title");
|
||||
windowTilte.textContent = item.querySelector("figcaption").textContent;
|
||||
titleBar.appendChild(windowTilte);
|
||||
|
||||
let separator = document.createElement("div");
|
||||
separator.classList.add("separator")
|
||||
separator.classList.add("separator");
|
||||
imageWindow.appendChild(titleBar);
|
||||
imageWindow.appendChild(separator);
|
||||
|
||||
|
@ -72,10 +72,7 @@ icon.forEach((item) => {
|
|||
|
||||
closeButton.addEventListener("click", () => {
|
||||
imageWindow.remove();
|
||||
document.querySelector(".window").style.display = "block"
|
||||
});
|
||||
|
||||
|
||||
|
||||
document.querySelector(".window").style.display = "block";
|
||||
});
|
||||
});
|
||||
});
|
|
@ -3,24 +3,19 @@
|
|||
padding: 0;
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
body {
|
||||
box-sizing: border-box;
|
||||
height: 100vh;
|
||||
width: auto;
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 1fr;
|
||||
gap: 0.25rem;
|
||||
gap: 1.25rem;
|
||||
}
|
||||
|
||||
.site-info {
|
||||
height: 20rem;
|
||||
width: auto;
|
||||
margin: 1rem;
|
||||
margin-top: 3rem;
|
||||
margin: 3rem 2rem 0 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
|
@ -45,6 +40,10 @@ p {
|
|||
justify-items: center;
|
||||
}
|
||||
|
||||
.window {
|
||||
margin: 1rem 0 1rem 2rem;
|
||||
}
|
||||
|
||||
.img-icon {
|
||||
padding-left: 1.25rem;
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue