Edit website structure

public/assets/css/main.scss

@@ -80,23 +80,23 @@ body {
 // HEADER
 // ----------------------------------------------------------------------------
 
-// Header bar
+// Sidebar
 
-.header-bar {
+.sidebar {
 	position: fixed;
 	top: 0;
 	bottom: 0;
 	left: 0;
-	padding: var(--header-bar-vertical-padding) var(--header-bar-horizontal-padding);
+	padding: var(--sidebar-vertical-padding) var(--sidebar-horizontal-padding);
 	overflow-y: auto;
 	background-color: transparent;
 	transition: background-color 400ms ease-in-out;
 
-	.header-bar__nav {
+	.sidebar__nav {
 
-		.header-bar__nav-item {
+		.sidebar__nav-item {
 
-			+ .header-bar__nav-item {
+			+ .sidebar__nav-item {
 				margin: 0.75rem 0 0 0;
 			}
 		}
@@ -107,7 +107,7 @@ body {
 		}
 	}
 
-	.header-bar__social {
+	.sidebar__social {
 		display: flex;
 		align-items: center;
 		margin: 1rem 0 0 0;
@@ -135,14 +135,14 @@ body {
 	&:hover {
 		background-color: var(--transparent-white);
 
-		.header-bar__nav {
+		.sidebar__nav {
 			
 			a {
 				color: var(--black);
 			}
 		}
 
-		.header-bar__social {
+		.sidebar__social {
 
 			svg {
 				fill: var(--black);
@@ -157,12 +157,12 @@ body {
 
 // Home section
 
-.home-section {
+.exhibitions-section {
 	width: 100vw;
 	height: 100vh;
 }
 
-.home-section__iframe {
+.exhibitions-section__iframe {
 	width: 100%;
 	height: 100%;
 }

public/assets/css/partials/variables.scss

@@ -26,8 +26,8 @@
 	// Dimensions
 
 	--icon-size: 2rem;
-	--header-bar-vertical-padding: 1rem;
-	--header-bar-horizontal-padding: 1rem;
+	--sidebar-vertical-padding: 1rem;
+	--sidebar-horizontal-padding: 1rem;
 
 	// Colors