100 lines
2.0 KiB
CSS
100 lines
2.0 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
@layer components {
|
|
.sidebar {
|
|
@apply fixed top-0 left-0
|
|
h-screen w-16 m-0
|
|
flex flex-col
|
|
bg-sidebar text-secondary
|
|
z-40;
|
|
}
|
|
|
|
.sidebar-icon {
|
|
@apply relative flex items-center justify-center
|
|
h-14 w-14 my-2 mx-auto
|
|
shadow-lg bg-gray-800 text-secondary
|
|
hover:bg-green-900 hover:text-primary
|
|
rounded-3xl
|
|
hover:rounded-xl
|
|
transition-all duration-300 ease-linear
|
|
cursor-pointer;
|
|
}
|
|
|
|
.sidebar-icon-active {
|
|
@apply bg-green-900 text-primary rounded-xl;
|
|
}
|
|
|
|
.sidebar-tooltip {
|
|
@apply absolute w-auto p-2 m-2 min-w-max left-14
|
|
rounded-md shadow-md text-white bg-sidebar
|
|
text-sm font-bold
|
|
transition-all duration-100 invisible origin-left;
|
|
}
|
|
|
|
.sidebar-hr {
|
|
@apply bg-gray-600
|
|
border border-gray-600 rounded-full
|
|
mx-2;
|
|
}
|
|
|
|
.content {
|
|
@apply ml-16;
|
|
}
|
|
|
|
.flow-editor {
|
|
@apply flex flex-row
|
|
bg-content;
|
|
}
|
|
|
|
.flow-panel {
|
|
@apply relative flex flex-col
|
|
bg-panel
|
|
z-30;
|
|
}
|
|
|
|
.flow-panel-button {
|
|
@apply absolute flex items-center justify-center
|
|
w-10 h-10 mt-4 -right-12
|
|
bg-gray-800 text-secondary
|
|
rounded-xl cursor-pointer;
|
|
}
|
|
|
|
.node-layout {
|
|
@apply flex flex-col items-center
|
|
w-[150px] h-fit bg-gray-700
|
|
p-[4px];
|
|
}
|
|
|
|
.node-handle-big {
|
|
@apply w-[150px] h-[20px];
|
|
}
|
|
|
|
.node-header {
|
|
@apply flex flex-row w-full h-[20px] justify-between items-center
|
|
mb-1 px-[4px]
|
|
border-b border-b-gray-500;
|
|
}
|
|
|
|
.node-title {
|
|
@apply text-white text-xs font-bold;
|
|
}
|
|
|
|
.node-content {
|
|
@apply flex flex-col w-full h-fit
|
|
mb-[4px];
|
|
}
|
|
|
|
.node-component {
|
|
@apply relative flex flex-row h-fit rounded-md
|
|
bg-gray-600
|
|
pr-2 my-1 mx-2
|
|
text-white align-middle;
|
|
}
|
|
|
|
.node-component-handle {
|
|
@apply left-0 w-[12px] h-[30px] mr-2 rounded-tl-md rounded-bl-md;
|
|
}
|
|
}
|