FlowForge/frontend/src/index.css

86 lines
1.5 KiB
CSS

@tailwind base;
@tailwind components;
@tailwind utilities;
body {
margin: 0;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
@apply bg-gray-50;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
/* Custom styles for react-flow */
.react-flow__node {
@apply shadow-md rounded-md;
cursor: grab;
user-select: none;
pointer-events: auto;
}
.react-flow__node.dragging {
cursor: grabbing;
}
.react-flow__node-default {
@apply bg-white border border-gray-200;
}
.react-flow__handle {
@apply w-3 h-3;
pointer-events: auto;
}
.react-flow__handle-top {
@apply top-0 -translate-y-1/2;
}
.react-flow__handle-bottom {
@apply bottom-0 translate-y-1/2;
}
.react-flow__edge-path {
@apply stroke-2 stroke-gray-400;
}
.react-flow__controls {
@apply shadow-md;
}
/* Ensure React Flow pane is properly configured */
.react-flow__pane {
cursor: default;
}
/* Node types */
.node-webhook {
@apply border-l-4 border-l-blue-500;
}
.node-http-request {
@apply border-l-4 border-l-green-500;
}
.node-function {
@apply border-l-4 border-l-purple-500;
}
.node-delay {
@apply border-l-4 border-l-amber-500;
}
.node-email {
@apply border-l-4 border-l-red-500;
}
.node-logger {
@apply border-l-4 border-l-gray-500;
}