cc-dashboard/planka-custom/planka.css
Vadym Samoilenko 7c15f884c1 fix: Planka admin user + branding CSS; project job_number edit form; report filename; devops title
- 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>
2026-05-07 13:49:00 +01:00

158 lines
4.1 KiB
CSS
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/* ============================================================
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;
}