diff --git a/src/app/components/main-layout/main-layout.component.scss b/src/app/components/main-layout/main-layout.component.scss
index 0ea5de8..11457ad 100644
--- a/src/app/components/main-layout/main-layout.component.scss
+++ b/src/app/components/main-layout/main-layout.component.scss
@@ -8,7 +8,6 @@ app-header {
left: 232px;
right: 0;
height: 96px;
- width: 100%;
background-color: var(--white);
z-index: 1;
}
@@ -46,6 +45,16 @@ app-sidebar-mobile {
display: none;
}
+/* Media queries */
+
+@media (max-width: 1440px) {
+ app-header,
+ app-sidebar,
+ .main-content {
+ left: 60px;
+ }
+}
+
@media screen and (max-width: 910px) {
.main-content {
padding: 32px;
diff --git a/src/app/shared/components/header/header.component.scss b/src/app/shared/components/header/header.component.scss
index 80c0d3e..77d9e32 100644
--- a/src/app/shared/components/header/header.component.scss
+++ b/src/app/shared/components/header/header.component.scss
@@ -2,7 +2,6 @@
display: flex;
justify-content: space-between;
align-items: center;
- width: calc(100% - 232px);
height: 93px;
box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.1);
}
diff --git a/src/app/shared/components/sidebar/sidebar.component.html b/src/app/shared/components/sidebar/sidebar.component.html
index 63efb67..795c1ce 100644
--- a/src/app/shared/components/sidebar/sidebar.component.html
+++ b/src/app/shared/components/sidebar/sidebar.component.html
@@ -59,7 +59,8 @@
'active-link': currentPath === 'privacy-policy'
}"
>
- {{ "sidebar.privacyPolicy" | translate }}
+
+ {{ "sidebar.privacyPolicy" | translate }}
- {{ "sidebar.legalNotice" | translate }}
+
+ {{ "sidebar.legalNotice" | translate }}
- {{ "sidebar.logout" | translate }}
+
{{
+ "sidebar.logout" | translate
+ }}
diff --git a/src/app/shared/components/sidebar/sidebar.component.scss b/src/app/shared/components/sidebar/sidebar.component.scss
index 47ce54c..13b9da6 100644
--- a/src/app/shared/components/sidebar/sidebar.component.scss
+++ b/src/app/shared/components/sidebar/sidebar.component.scss
@@ -27,19 +27,23 @@ nav {
padding-left: 56px;
height: 46px;
cursor: pointer;
+
img {
width: 30px;
height: 30px;
padding-right: 8px;
}
+
span {
text-align: center;
font-size: 16px;
color: var(--light-gray);
}
+
&:hover {
background-color: var(--very-dark-blue);
}
+
&:active {
background-color: var(--very-dark-blue);
}
@@ -54,6 +58,7 @@ nav {
align-items: center;
flex-direction: column;
margin-bottom: 30px;
+
a {
justify-content: center;
width: fit-content;
@@ -64,6 +69,19 @@ nav {
text-decoration: none;
color: var(--light-gray);
cursor: pointer;
+
+ img {
+ display: none;
+ width: 30px;
+ height: 30px;
+ cursor: pointer;
+
+ &:hover {
+ filter: brightness(0) saturate(100%) invert(75%) sepia(51%)
+ saturate(5547%) hue-rotate(164deg) brightness(97%) contrast(82%);
+ }
+ }
+
&:hover {
color: var(--light-blue);
}
@@ -75,5 +93,48 @@ nav {
}
.active-link {
- color: var(--light-blue) !important;
+ cursor: auto !important;
+ filter: brightness(0) saturate(100%) invert(75%) sepia(51%) saturate(5547%)
+ hue-rotate(164deg) brightness(97%) contrast(82%) !important;
+}
+
+/* Media queries */
+
+@media (max-width: 1440px) {
+ section,
+ nav {
+ width: 60px;
+ }
+
+ .logo {
+ width: 40px;
+ height: 73px;
+ margin: 10px;
+ }
+
+ .nav-links-inner {
+ justify-content: center;
+ width: 100%;
+ padding: 6px 0;
+
+ img {
+ padding-right: 0;
+ }
+
+ span {
+ display: none;
+ }
+ }
+
+ .reference {
+ a {
+ img {
+ display: block;
+ }
+
+ span {
+ display: none;
+ }
+ }
+ }
}
diff --git a/src/assets/img/sidebar/legal-notice.svg b/src/assets/img/sidebar/legal-notice.svg
new file mode 100644
index 0000000..f6c68d6
--- /dev/null
+++ b/src/assets/img/sidebar/legal-notice.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/img/sidebar/logout.svg b/src/assets/img/sidebar/logout.svg
new file mode 100644
index 0000000..5c0e49f
--- /dev/null
+++ b/src/assets/img/sidebar/logout.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/assets/img/sidebar/privacy-policy.svg b/src/assets/img/sidebar/privacy-policy.svg
new file mode 100644
index 0000000..e2af45a
--- /dev/null
+++ b/src/assets/img/sidebar/privacy-policy.svg
@@ -0,0 +1 @@
+
\ No newline at end of file