clawbot
cb28892f89
make css now runs the standalone tailwindcss CLI, v4.2.1, pinned by sha256, in a build stage of the Dockerfile instead of whatever tailwindcss is on the host. A css-check stage, run by make check and required by the image build, fails when static/css/tailwind.css differs from what make css generates. input.css now names its sources (the templates, app.js, and the Go file that picks status colour classes) instead of letting the whole checkout be scanned, where words in Go code and docs became unused classes. .btn-text is removed and tailwind.css regenerated; it only loses unused rules. Model: opus-5-5
108 lines
3.8 KiB
CSS
108 lines
3.8 KiB
CSS
/* Classes are taken only from the files named below. A class written in
|
|
any other file is not generated: name that file here too. */
|
|
@import "tailwindcss" source(none);
|
|
@source "../../templates/**/*.html";
|
|
@source "../js/app.js";
|
|
/* targetStatus picks a target's status colour class */
|
|
@source "../../internal/handlers/recent_events.go";
|
|
|
|
/* Material Design inspired theme customization */
|
|
@theme {
|
|
/* Primary colors */
|
|
--color-primary-50: #e3f2fd;
|
|
--color-primary-100: #bbdefb;
|
|
--color-primary-200: #90caf9;
|
|
--color-primary-300: #64b5f6;
|
|
--color-primary-400: #42a5f5;
|
|
--color-primary-500: #2196f3;
|
|
--color-primary-600: #1e88e5;
|
|
--color-primary-700: #1976d2;
|
|
--color-primary-800: #1565c0;
|
|
--color-primary-900: #0d47a1;
|
|
|
|
/* Error colors */
|
|
--color-error-50: #ffebee;
|
|
--color-error-500: #f44336;
|
|
--color-error-700: #d32f2f;
|
|
|
|
/* Success colors */
|
|
--color-success-50: #e8f5e9;
|
|
--color-success-500: #4caf50;
|
|
--color-success-700: #388e3c;
|
|
|
|
/* Warning colors */
|
|
--color-warning-50: #fff3e0;
|
|
--color-warning-500: #ff9800;
|
|
--color-warning-700: #f57c00;
|
|
|
|
/* Material Design elevation shadows */
|
|
--shadow-elevation-1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
|
--shadow-elevation-2: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
|
|
--shadow-elevation-3: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
|
|
}
|
|
|
|
/* Material Design component styles */
|
|
@layer components {
|
|
/* Buttons */
|
|
.btn-primary {
|
|
@apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-primary-600 text-white hover:bg-primary-700 active:bg-primary-800 focus:ring-primary-500 shadow-elevation-1 hover:shadow-elevation-2;
|
|
}
|
|
|
|
.btn-secondary {
|
|
@apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-white text-gray-700 border border-gray-300 hover:bg-gray-50 active:bg-gray-100 focus:ring-primary-500;
|
|
}
|
|
|
|
.btn-danger {
|
|
@apply inline-flex items-center justify-center px-4 py-2 rounded-md font-medium text-sm transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed bg-error-500 text-white hover:bg-error-700 active:bg-red-800 focus:ring-red-500 shadow-elevation-1 hover:shadow-elevation-2;
|
|
}
|
|
|
|
/* Cards */
|
|
.card {
|
|
@apply bg-white rounded-lg shadow-elevation-1 overflow-hidden;
|
|
}
|
|
|
|
.card-elevated {
|
|
@apply bg-white rounded-lg shadow-elevation-1 overflow-hidden hover:shadow-elevation-2 transition-shadow;
|
|
}
|
|
|
|
/* Form inputs */
|
|
.input {
|
|
@apply w-full px-4 py-3 border border-gray-300 rounded-md text-gray-900 placeholder-gray-500 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent transition-all;
|
|
}
|
|
|
|
.label {
|
|
@apply block text-sm font-medium text-gray-700 mb-1;
|
|
}
|
|
|
|
.form-group {
|
|
@apply mb-4;
|
|
}
|
|
|
|
/* Status badges */
|
|
.badge-success {
|
|
@apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-success-50 text-success-700;
|
|
}
|
|
|
|
.badge-error {
|
|
@apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-error-50 text-error-700;
|
|
}
|
|
|
|
.badge-info {
|
|
@apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-primary-50 text-primary-700;
|
|
}
|
|
|
|
/* App bar / Navigation */
|
|
.app-bar {
|
|
@apply bg-white shadow-elevation-1 px-6 py-4;
|
|
}
|
|
|
|
/* Alert / Message boxes */
|
|
.alert-error {
|
|
@apply p-4 rounded-md mb-4 bg-error-50 text-error-700 border border-error-500/20;
|
|
}
|
|
|
|
.alert-success {
|
|
@apply p-4 rounded-md mb-4 bg-success-50 text-success-700 border border-success-500/20;
|
|
}
|
|
}
|