99 lines
1.6 KiB
CSS
99 lines
1.6 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
--foreground-rgb: 30, 41, 59;
|
|
--background-rgb: 248, 250, 252;
|
|
}
|
|
|
|
body {
|
|
color: rgb(var(--foreground-rgb));
|
|
background: rgb(var(--background-rgb));
|
|
}
|
|
|
|
/* React Flow Customization - n8n style */
|
|
.react-flow__node {
|
|
cursor: grab;
|
|
}
|
|
|
|
.react-flow__node:active {
|
|
cursor: grabbing;
|
|
}
|
|
|
|
.react-flow__node.selected {
|
|
outline: none;
|
|
}
|
|
|
|
.react-flow__edge-path {
|
|
stroke-linecap: round;
|
|
}
|
|
|
|
.react-flow__controls {
|
|
box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1);
|
|
}
|
|
|
|
.react-flow__controls-button {
|
|
background: white;
|
|
border-bottom: 1px solid #e2e8f0;
|
|
width: 28px;
|
|
height: 28px;
|
|
}
|
|
|
|
.react-flow__controls-button:hover {
|
|
background: #f1f5f9;
|
|
}
|
|
|
|
.react-flow__controls-button svg {
|
|
fill: #64748b;
|
|
}
|
|
|
|
/* Range input styling */
|
|
input[type="range"] {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
background: transparent;
|
|
}
|
|
|
|
input[type="range"]::-webkit-slider-thumb {
|
|
-webkit-appearance: none;
|
|
appearance: none;
|
|
width: 16px;
|
|
height: 16px;
|
|
border-radius: 50%;
|
|
background: currentColor;
|
|
cursor: pointer;
|
|
margin-top: -6px;
|
|
box-shadow: 0 1px 3px rgba(0,0,0,0.2);
|
|
}
|
|
|
|
input[type="range"]::-webkit-slider-runnable-track {
|
|
width: 100%;
|
|
height: 4px;
|
|
background: #e2e8f0;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
input[type="range"]:focus {
|
|
outline: none;
|
|
}
|
|
|
|
/* Scrollbar */
|
|
::-webkit-scrollbar {
|
|
width: 8px;
|
|
height: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
background: #f1f5f9;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background: #cbd5e1;
|
|
border-radius: 4px;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb:hover {
|
|
background: #94a3b8;
|
|
}
|