diff --git a/Iceshrimp.Frontend/Components/Compose.razor.css b/Iceshrimp.Frontend/Components/Compose.razor.css index c025316d..cc3eb6ad 100644 --- a/Iceshrimp.Frontend/Components/Compose.razor.css +++ b/Iceshrimp.Frontend/Components/Compose.razor.css @@ -54,6 +54,7 @@ } .cw-field { + padding: unset; margin-bottom: 0.5rem; width: 100%; } diff --git a/Iceshrimp.Frontend/Layout/Sidebar.razor b/Iceshrimp.Frontend/Layout/Sidebar.razor index bc3d6d3b..53e4a514 100644 --- a/Iceshrimp.Frontend/Layout/Sidebar.razor +++ b/Iceshrimp.Frontend/Layout/Sidebar.razor @@ -56,21 +56,21 @@
- +
- +
- +
-
diff --git a/Iceshrimp.Frontend/Layout/Sidebar.razor.css b/Iceshrimp.Frontend/Layout/Sidebar.razor.css index d2883ef4..3d19ff2b 100644 --- a/Iceshrimp.Frontend/Layout/Sidebar.razor.css +++ b/Iceshrimp.Frontend/Layout/Sidebar.razor.css @@ -10,22 +10,32 @@ > .sidebar-btn { background: var(--highlight-color); } + + > .bottom-bar-btn { + background: var(--highlight-color); + } + } +} + +::deep { + .bottom-bar-icon { + font-size: 20px !important; } } .bottom-bar-btn { display: inline-flex; height: 3rem; - width: 4rem; - min-width: 4rem; - max-width: 4rem; + width: 5rem; + min-width: 5rem; + max-width: 5rem; align-items: center; justify-content: center; - border-radius: 1.25rem; + border-radius: 0.5rem; margin-bottom: 0.5rem; margin-top: 0.5rem; - color: black; - background: var(--accent-color); + color: white; + background: var(--background-color); .text { display: none; @@ -33,7 +43,7 @@ } .btn:hover { - background-color: var(--hover-color); + background: var(--hover-color); } .icon { @@ -49,6 +59,8 @@ .sidebar-btn { display: flex; + /* This is possibly the jankiest parameter i have ever written (it should be percents but this works), it looks okay anyway */ + width: 13rem; height: 2.5rem; align-items: center; justify-content: start; @@ -71,8 +83,6 @@ .post-btn { background: var(--accent-color); - justify-self: start; - width: auto; } .rule { @@ -92,7 +102,7 @@ position: fixed; width: 15rem; height: 100vh; - z-index: +23; + z-index: +25; background-color: var(--foreground-color); } @@ -101,8 +111,7 @@ display: flex; flex-direction: column; height: 100vh; - max-width: 15rem; - min-width: 15rem; + width: 15rem; position: sticky; top: 0; background-color: var(--foreground-color); @@ -123,7 +132,8 @@ position: fixed; bottom: 0; left: 0; - background-color: var(--foreground-color); + background-color: var(--background-color); z-index: +24; + border-top: 0.1rem var(--highlight-color) solid; } }