refactor: Flatten directory structure
Move project files from uzdb/ subdirectory to root directory for cleaner project structure.
Changes:
- Move frontend/ to root
- Move internal/ to root
- Move build/ to root
- Move all config files (go.mod, wails.json, etc.) to root
- Remove redundant uzdb/ subdirectory nesting
Project structure is now:
├── frontend/ # React application
├── internal/ # Go backend
├── build/ # Wails build assets
├── doc/ # Design documentation
├── main.go # Entry point
└── ...
🤖 Generated with Qoder
This commit is contained in:
73
frontend/src/components/common/StatusIndicator.css
Normal file
73
frontend/src/components/common/StatusIndicator.css
Normal file
@@ -0,0 +1,73 @@
|
||||
/**
|
||||
* StatusIndicator Component Styles
|
||||
*/
|
||||
|
||||
.status-indicator {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-right: var(--space-2);
|
||||
transition: all var(--transition-normal) var(--ease-in-out);
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* Connected state - Green with glow */
|
||||
.status-indicator.status-connected {
|
||||
background-color: var(--success);
|
||||
box-shadow: 0 0 4px var(--success);
|
||||
}
|
||||
|
||||
/* Active state - Blue with pulse animation */
|
||||
.status-indicator.status-active {
|
||||
background-color: var(--primary);
|
||||
box-shadow: 0 0 8px var(--primary);
|
||||
animation: pulse 2s infinite;
|
||||
}
|
||||
|
||||
/* Disconnected state - Gray with border */
|
||||
.status-indicator.status-disconnected {
|
||||
background-color: var(--text-muted);
|
||||
border: 1px solid var(--border);
|
||||
}
|
||||
|
||||
/* Connecting state - Orange spinning animation */
|
||||
.status-indicator.status-connecting {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border: 2px solid var(--warning);
|
||||
border-top-color: transparent;
|
||||
animation: spin 1s linear infinite;
|
||||
}
|
||||
|
||||
/* Error state - Red with help cursor */
|
||||
.status-indicator.status-error {
|
||||
background-color: var(--error);
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
/* Hover effect for clickable indicators */
|
||||
.status-indicator[tabindex]:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
|
||||
.status-indicator[tabindex]:focus-visible {
|
||||
outline: 2px solid var(--primary);
|
||||
outline-offset: 2px;
|
||||
}
|
||||
|
||||
/* Animations */
|
||||
@keyframes pulse {
|
||||
0%, 100% {
|
||||
opacity: 1;
|
||||
}
|
||||
50% {
|
||||
opacity: 0.6;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes spin {
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user