first commit

user/themes/ethica/scss/template/_header.scss

@@ -0,0 +1,102 @@
+body{
+	display: inline-flex;
+}
+
+#header{
+	z-index: 1;
+	width: $header-width;
+	height: 100%;
+	padding-top: 1.5rem;
+	padding-left: 30px;
+	position: fixed;
+	background: white;
+
+	#logo{
+		padding-bottom: 15px;
+	}
+	#navbar{
+		padding-left: 15px;
+		
+		.sous-menu{
+			height: $fonth2;
+			transition: all 0.3s ease-in-out;
+			transition-delay: 0.5s;
+			& > ol{
+				visibility: hidden;
+			  opacity: 0;
+			  transition: visibility 0.5s, opacity 0.5s linear;
+				margin-left: 30px;
+				padding-left: 5px;
+			}
+
+			&:hover{
+				height: 100px;
+				transition: all 0.3s ease-in-out;
+				& > a {
+					text-decoration: underline;
+					&::after {
+						@include background-nav-sm('../images/trait.svg');
+					}
+				}
+				& > ol{
+					visibility: visible;
+					transition: all 0.5s linear;
+					transition-delay: 0.2s;
+					opacity: 1;
+				}
+			}
+		}
+		.underline{
+			&::before{
+				@include background-nav('../images/point_b.svg');
+			}
+		}
+		.block{
+			height: 100px;
+			transition: all 0.3s ease-in-out;
+			&::before{
+				@include background-nav('../images/point_b.svg');
+			}
+			& > a::after {
+				@include background-nav-sm('../images/trait.svg');
+			}
+			ol{
+				visibility: visible;
+				transition: visibility 0.5s, opacity 0.5s linear;
+				opacity: 1;
+			}
+		}
+
+		ul > li, ol{
+			&::before{
+				@include background-nav-content-b;
+				@include background-nav-b('../images/point.svg');
+			}
+			.underline{
+				&::before{
+					@include background-nav('../images/point_b.svg');
+				}
+			}
+			&:hover{
+				&::before{
+					@include background-nav('../images/point_b.svg');
+				}
+				&> a{
+					text-decoration: underline;
+				}
+			}
+		}
+	}
+	.separation{
+		position: absolute;
+		left: 100%;
+		width: 1px;
+		height: 100%;
+		top: 1.5rem;
+		background: black;
+		&::before{
+			@include background-nav-content-s;
+			@include background-nav('../images/point_b.svg');
+		}
+	}
+}