- docker-compose: add DEFAULT_ADMIN_* passthrough + CUSTOM_UI_OVERRIDE_STYLESHEETS + mount planka-custom/ - planka-custom/planka.css: hide Planka logo/title/footer, override to orange theme matching CC Dashboard - ProjectDetailView: inline edit form for display_name/client/job_number/repo_url via PATCH /api/projects/:id - ReportsView: download filename uses report.period_date + report.type (report-2026-05-07-daily.md) - AppLayout: add devops → 'Azure DevOps' title entry Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
158 lines
4.1 KiB
CSS
158 lines
4.1 KiB
CSS
/* ============================================================
|
||
CC Dashboard × Planka — Custom Branding Override
|
||
============================================================ */
|
||
|
||
/* Body background — match CC Dashboard gradient */
|
||
body {
|
||
background: linear-gradient(135deg, #f0f4fa 0%, #fef9f5 100%) !important;
|
||
font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
|
||
}
|
||
|
||
/* ---- Login page ---- */
|
||
|
||
/* Hide Planka logo */
|
||
img.logo,
|
||
.logo,
|
||
[class*="logo"] img,
|
||
[class*="logo"],
|
||
a[class*="logo"] {
|
||
display: none !important;
|
||
}
|
||
|
||
/* Add CC Dashboard logo via pseudo-element on the outer wrapper */
|
||
[class*="wrapper"] > [class*="content"]::before,
|
||
.ui.middle.aligned.grid::before {
|
||
content: '';
|
||
display: block;
|
||
width: 56px;
|
||
height: 56px;
|
||
margin: 0 auto 16px;
|
||
border-radius: 16px;
|
||
background: linear-gradient(135deg, #f97316, #ea580c);
|
||
box-shadow: 0 8px 24px rgba(249,115,22,0.35);
|
||
}
|
||
|
||
/* Override heading "PLANKA" → show CC Dashboard */
|
||
[class*="title"],
|
||
.ui.huge.header,
|
||
h1.header {
|
||
font-size: 0 !important;
|
||
}
|
||
[class*="title"]::after,
|
||
.ui.huge.header::after,
|
||
h1.header::after {
|
||
content: 'Tasks Board';
|
||
font-size: 1.5rem !important;
|
||
font-weight: 700 !important;
|
||
color: #1e293b !important;
|
||
letter-spacing: -0.02em;
|
||
}
|
||
|
||
/* Sub-title "Log In" */
|
||
[class*="subtitle"],
|
||
.ui.large.header,
|
||
h3.header {
|
||
color: #64748b !important;
|
||
font-weight: 500 !important;
|
||
font-size: 0.95rem !important;
|
||
}
|
||
|
||
/* Hide "Powered by PLANKA" footer */
|
||
[class*="copyright"],
|
||
[class*="poweredBy"],
|
||
[class*="powered-by"],
|
||
footer {
|
||
display: none !important;
|
||
visibility: hidden !important;
|
||
}
|
||
|
||
/* Card/panel styling */
|
||
.ui.stacked.segment,
|
||
[class*="wrapper"] > [class*="content"] {
|
||
background: rgba(255, 255, 255, 0.85) !important;
|
||
backdrop-filter: blur(16px) !important;
|
||
-webkit-backdrop-filter: blur(16px) !important;
|
||
border-radius: 20px !important;
|
||
border: 1px solid rgba(255, 255, 255, 0.9) !important;
|
||
box-shadow: 0 8px 40px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0,0,0,0.04) !important;
|
||
padding: 40px 36px !important;
|
||
}
|
||
|
||
/* Input fields */
|
||
.ui.input input,
|
||
input[type="text"],
|
||
input[type="email"],
|
||
input[type="password"] {
|
||
border-radius: 10px !important;
|
||
border-color: #e2e8f0 !important;
|
||
background: #f8fafc !important;
|
||
font-family: inherit !important;
|
||
transition: border-color 0.15s, box-shadow 0.15s !important;
|
||
}
|
||
.ui.input input:focus,
|
||
input:focus {
|
||
border-color: #f97316 !important;
|
||
box-shadow: 0 0 0 3px rgba(249,115,22,0.12) !important;
|
||
outline: none !important;
|
||
}
|
||
|
||
/* Primary / teal button → orange */
|
||
.ui.fluid.large.teal.button,
|
||
.ui.teal.button,
|
||
button[class*="teal"],
|
||
.ui.fluid.button.positive,
|
||
.ui.positive.button {
|
||
background: linear-gradient(135deg, #f97316 0%, #ea580c 100%) !important;
|
||
color: white !important;
|
||
border-radius: 10px !important;
|
||
font-weight: 600 !important;
|
||
letter-spacing: 0.01em !important;
|
||
box-shadow: 0 4px 14px rgba(249,115,22,0.35) !important;
|
||
border: none !important;
|
||
transition: all 0.2s !important;
|
||
}
|
||
.ui.fluid.large.teal.button:hover,
|
||
.ui.teal.button:hover {
|
||
background: linear-gradient(135deg, #ea580c 0%, #c2410c 100%) !important;
|
||
box-shadow: 0 6px 20px rgba(249,115,22,0.45) !important;
|
||
transform: translateY(-1px) !important;
|
||
}
|
||
|
||
/* Label text */
|
||
.ui.form .field > label {
|
||
color: #374151 !important;
|
||
font-weight: 600 !important;
|
||
font-size: 0.8rem !important;
|
||
text-transform: uppercase !important;
|
||
letter-spacing: 0.05em !important;
|
||
}
|
||
|
||
/* Error messages */
|
||
.ui.error.message {
|
||
border-radius: 10px !important;
|
||
border-left: 3px solid #f97316 !important;
|
||
background: #fff7ed !important;
|
||
color: #c2410c !important;
|
||
}
|
||
|
||
/* ---- In-app top bar & sidebar ---- */
|
||
|
||
/* Top navigation - subtle */
|
||
[class*="header"],
|
||
.ui.menu:not(.secondary):not(.vertical) {
|
||
background: rgba(255,255,255,0.8) !important;
|
||
backdrop-filter: blur(12px) !important;
|
||
-webkit-backdrop-filter: blur(12px) !important;
|
||
border-bottom: 1px solid #e2e8f0 !important;
|
||
box-shadow: 0 1px 4px rgba(0,0,0,0.06) !important;
|
||
}
|
||
|
||
/* Primary action buttons in-app */
|
||
.ui.primary.button,
|
||
.ui.button.primary {
|
||
background: #f97316 !important;
|
||
color: white !important;
|
||
}
|
||
.ui.primary.button:hover {
|
||
background: #ea580c !important;
|
||
}
|