diff --git a/assets/icons/blog.svg b/assets/icons/blog.svg
index c966f12..fd47943 100644
--- a/assets/icons/blog.svg
+++ b/assets/icons/blog.svg
@@ -1 +1 @@
-
\ No newline at end of file
+
\ No newline at end of file
diff --git a/assets/icons/home.svg b/assets/icons/home.svg
index d39a49e..e7c2bc7 100644
--- a/assets/icons/home.svg
+++ b/assets/icons/home.svg
@@ -1,6 +1,6 @@
-
+
diff --git a/assets/scss/partials/sidebar.scss b/assets/scss/partials/sidebar.scss
index e046183..a613816 100644
--- a/assets/scss/partials/sidebar.scss
+++ b/assets/scss/partials/sidebar.scss
@@ -34,28 +34,31 @@
&::before {
content: attr(data-title);
- left: 100%;
+ left: calc(100% + 0.5rem);
position: absolute;
top: 50%;
transform: translateY(-50%);
- background-color: var(--sidebar-accent-2);
+ background-color: var(--sidebar-accent-3);
color: var(--text-accent-900);
padding: 0.2rem 0.5rem;
border-radius: 0.5rem;
pointer-events: none;
opacity: 0%;
transition: opacity 0.3s ease-in-out;
+ z-index: 201;
}
&::after {
content: "";
- transform: translate(-100%, -50%);
- border-left: 0.5rem solid transparent;
- border-top: 0.5rem solid transparent;
- border-bottom: 0.5rem solid transparent;
- border-right: 0.7rem solid var(--sidebar-accent-2);
+ transform: translate(-50%, -50%) rotate(45deg);
+ transform-origin: center;
+ background-color: var(--sidebar-accent-3);
top: 50%;
+ height: 1.2rem;
+ width: 1.2rem;
+ z-index: 200;
+ border-radius: 0 0 0 0.5rem;
position: absolute;
- left: 100%;
+ left: calc(100% + 0.5rem);
pointer-events: none;
opacity: 0%;
transition: opacity 0.3s ease-in-out;
@@ -97,7 +100,6 @@
left: 0;
bottom: 0;
padding: 0.4rem;
- border-radius: 2rem 2rem 0 0;
border: 1px solid var(--sidebar-border);
border-bottom: 0;
}
@@ -117,18 +119,21 @@
margin: 0.5em 0;
position: relative;
letter-spacing: 0.025rem;
- overflow: hidden;
aspect-ratio: 1 / 1;
display: flex;
align-items: center;
justify-content: center;
transition: background-color 0.2s linear;
+ overflow: hidden;
@media (max-width: 1140px) {
margin: 0 0.5rem;
}
a {
- display: block;
- padding: 3rem;
+ overflow: visible;
+ display: flex;
+ align-items: center;
+ width: 100%;
+ height: 100%;
}
&::after {
background-color: var(--sidebar-accent-1);
diff --git a/layouts/partials/sidebar.html b/layouts/partials/sidebar.html
index 77512df..6a1084f 100644
--- a/layouts/partials/sidebar.html
+++ b/layouts/partials/sidebar.html
@@ -12,9 +12,9 @@