Added a button to go to the file tree
It doesnt actually do anything yet but I'll probably make that soon. Also I think the icon for the button looks pretty good considering I wrote the svg myself instead of using an svg editor lol.
This commit is contained in:
1 parent
45c7ab53c4
commit
3097541dc8
3 files changed
+42
-2
No files matched your search
@@ -1,6 +1,14 @@
|
|||||||
@import "tailwindcss";
|
@import "tailwindcss";
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
@apply bg-[rgb(24,24,36)] ml-[10px] mt-3 p-5 border border-[rgb(48,48,72)] rounded-lg;
|
@apply bg-[rgb(24,24,36)] ml-[10px] mt-3 p-0 border border-[rgb(48,48,72)] rounded-lg;
|
||||||
@apply w-20 h-[calc(100vh_-_23px)];
|
@apply w-20 h-[calc(100vh_-_23px)];
|
||||||
|
@apply relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar button {
|
||||||
|
@apply w-15 h-15 bg-[rgb(54,54,72)] hover:bg-[rgb(72,72,96)];
|
||||||
|
@apply border border-[rgb(72,72,96)] hover:border-[rgb(96,96,128)] p-0 mt-2 rounded-lg;
|
||||||
|
@apply transition-colors cursor-pointer;
|
||||||
|
@apply absolute left-1/2 -translate-x-1/2;
|
||||||
}
|
}
|
||||||
@@ -0,0 +1,24 @@
|
|||||||
|
<svg
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
className="w-15 h-15"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
fill="currentColor"
|
||||||
|
>
|
||||||
|
<rect
|
||||||
|
width="10"
|
||||||
|
height="13"
|
||||||
|
x="8.5"
|
||||||
|
y="3.5"
|
||||||
|
fill="rgb(54, 54, 72)"
|
||||||
|
stroke='rgb(172, 172, 196)'
|
||||||
|
/>
|
||||||
|
|
||||||
|
<rect
|
||||||
|
width="10"
|
||||||
|
height="13"
|
||||||
|
x="5.5"
|
||||||
|
y="7.5"
|
||||||
|
fill="rgb(54, 54, 72)"
|
||||||
|
stroke='rgb(172, 172, 196)'
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 373 B |
@@ -2,6 +2,10 @@
|
|||||||
|
|
||||||
import './Editor_globals.css'
|
import './Editor_globals.css'
|
||||||
|
|
||||||
|
import Image from "next/image";
|
||||||
|
|
||||||
|
import file_list_icon from "./assets/file_list_icon.svg";
|
||||||
|
|
||||||
export default function Editor_Layout ({
|
export default function Editor_Layout ({
|
||||||
children
|
children
|
||||||
}: {
|
}: {
|
||||||
@@ -9,7 +13,11 @@ export default function Editor_Layout ({
|
|||||||
}) {
|
}) {
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className='sidebar'></div>
|
<div className='sidebar'>
|
||||||
|
<button>
|
||||||
|
<Image src={file_list_icon} alt="File list icon" width={60} height={60} />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
|
||||||
<main>{children}</main>
|
<main>{children}</main>
|
||||||
</>
|
</>
|
||||||
|
|||||||
Reference in new issue
Block a user