diff --git a/src/client/public/css/main.css b/src/client/public/css/main.css
index 3c9d905..69ccd78 100644
--- a/src/client/public/css/main.css
+++ b/src/client/public/css/main.css
@@ -22,7 +22,8 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
lg:bottom-0
-translate-x-full
transition-all
- duration-300
+ duration-200
+ ease-in
/* Position and Display */
transform
@@ -46,23 +47,25 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
@apply
[--auto-close:lg]
lg:block
- lg:translate-x-0
+ /* lg:translate-x-0 */
lg:end-auto
lg:bottom-0
-translate-x-full
transition-all
- duration-300
+ duration-200
+ lg:duration-100
+ ease-in
/* Position and Display */
transform
w-64
h-full
- /* hidden */
fixed
top-0
- start-64
+ lg:start-64
+ start-0
bottom-0
- z-[60]
+ z-[59]
/* Colours and Border */
bg-white
diff --git a/src/client/public/css/tailwind.css b/src/client/public/css/tailwind.css
index 0e01acb..096c5a6 100644
--- a/src/client/public/css/tailwind.css
+++ b/src/client/public/css/tailwind.css
@@ -1468,6 +1468,10 @@ video {
--auto-close: lg;
}
+.\[--is-layout-affect\:true\] {
+ --is-layout-affect: true;
+}
+
.\[--placement\:bottom-right\] {
--placement: bottom-right;
}
@@ -1537,7 +1541,8 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
- transition-duration: 300ms;
+ transition-duration: 200ms;
+ transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
--auto-close: lg;
}
@@ -1561,9 +1566,9 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
.layout-sidebar-guilds {
position: fixed;
top: 0px;
- inset-inline-start: 16rem;
+ inset-inline-start: 0px;
bottom: 0px;
- z-index: 60;
+ z-index: 59;
height: 100%;
width: 16rem;
--tw-translate-x: -100%;
@@ -1575,7 +1580,8 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
transition-property: all;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
- transition-duration: 300ms;
+ transition-duration: 200ms;
+ transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
--auto-close: lg;
}
@@ -1583,9 +1589,9 @@ hs-accordion-toggle w-full text-start flex items-center gap-x-3.5 py-2 px-2.5 te
.layout-sidebar-guilds {
inset-inline-end: auto;
bottom: 0px;
+ inset-inline-start: 16rem;
display: block;
- --tw-translate-x: 0px;
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+ transition-duration: 100ms;
}
}
diff --git a/src/client/views/layout.ejs b/src/client/views/layout.ejs
index a545ff9..49c5b69 100644
--- a/src/client/views/layout.ejs
+++ b/src/client/views/layout.ejs
@@ -6,7 +6,7 @@
<%= title %>
-
+