Template:Home/ConservationPanel.css: Difference between revisions
Template page
More actions
Eloise Zomia (talk | contribs) No edit summary |
Eloise Zomia (talk | contribs) No edit summary |
||
| Line 1: | Line 1: | ||
/* | /* Panel */ | ||
.lw-cons-panel{background:#fff;border:1px solid #e5e7eb;border-left:4px solid #2d5016; | |||
.lw-cons-panel{ | border-radius:14px;padding:20px;box-shadow:0 8px 18px rgba(0,0,0,.05);margin:2em 0;} | ||
.lw-cons-title{font-weight:800;color:#2d5016;text-transform:uppercase;letter-spacing:.05em; | |||
border-radius:14px;padding:20px;box-shadow:0 8px 18px rgba(0,0,0,.05);margin:2em 0; | font-size:.9rem;margin-bottom:14px;} | ||
} | |||
.lw-cons-title{ | |||
font-size:.9rem;margin-bottom: | |||
} | |||
/* KPIs */ | /* KPIs */ | ||
.lw-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px} | .lw-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px;} | ||
.lw-kpi{ | .lw-kpi{background:linear-gradient(180deg,#fbfdff 0%,#f3f6fa 100%);border:1px solid #e5e7eb; | ||
border-radius:12px;padding:16px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.03);} | |||
.lw-kpi__num{font-size:2rem;font-weight:800;color:#111827;line-height:1.1;letter-spacing:.01em;} | |||
} | .lw-kpi__label{margin-top:6px;font-size:.85rem;color:#6b7280;} | ||
.lw-kpi__num{font-size:2rem;font-weight:800;color:#111827;line-height:1.1;letter-spacing:.01em} | |||
.lw-kpi__label{margin-top:6px;font-size:.85rem;color:#6b7280 | |||
/* Status bar – single-row, artifact-free */ | |||
.lw-statusbar{display:flex;align-items:stretch;height:14px;padding:2px;border-radius:999px; | |||
background:#f3f4f6;border:1px solid #e5e7eb;overflow:hidden;white-space:nowrap; | |||
font-size:0;line-height:0;direction:ltr;} | |||
/* If your wiki injects stray text nodes, this hides them */ | |||
.lw-statusbar span{font-size:0;line-height:0;} | |||
.lw-statusbar .lw-seg{display:block;height:100%;box-sizing:border-box;flex:0 0 auto;} | |||
.lw-statusbar .lw-seg + .lw-seg{border-left:2px solid #fff;opacity:.98;} | |||
.lw-statusbar .lw-seg:first-child{border-top-left-radius:999px;border-bottom-left-radius:999px;} | |||
.lw-statusbar .lw-seg:last-child{border-top-right-radius:999px;border-bottom-right-radius:999px;} | |||
/* widths (sum ~100%; last nudged to avoid rounding overflow) */ | |||
.lw-w-178{width:1.78%} .lw-w-468{width:4.68%} .lw-w-958{width:9.58%} | |||
.lw-w-1982{width:19.82%} .lw-w-2829{width:28.29%} .lw-w-3585{width:35.85%} | |||
/* colors */ | /* colors */ | ||
.lw-s-stable{background:#2e7d32} | .lw-s-stable{background:#2e7d32;} .lw-s-vulnerable{background:#f59e0b;} | ||
.lw-s-vulnerable{background:#f59e0b} | .lw-s-endangered{background:#f97316;} .lw-s-critical{background:#dc2626;} | ||
.lw-s-endangered{background:#f97316} | .lw-s-extinct{background:#111827;} .lw-s-unknown{background:#9ca3af;} | ||
.lw-s-critical{background:#dc2626} | |||
.lw-s-extinct{background:#111827} | |||
.lw-s-unknown{background:#9ca3af | |||
} | |||
Revision as of 13:25, 23 August 2025
/* Panel */
.lw-cons-panel{background:#fff;border:1px solid #e5e7eb;border-left:4px solid #2d5016;
border-radius:14px;padding:20px;box-shadow:0 8px 18px rgba(0,0,0,.05);margin:2em 0;}
.lw-cons-title{font-weight:800;color:#2d5016;text-transform:uppercase;letter-spacing:.05em;
font-size:.9rem;margin-bottom:14px;}
/* KPIs */
.lw-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:14px;}
.lw-kpi{background:linear-gradient(180deg,#fbfdff 0%,#f3f6fa 100%);border:1px solid #e5e7eb;
border-radius:12px;padding:16px;text-align:center;box-shadow:0 2px 8px rgba(0,0,0,.03);}
.lw-kpi__num{font-size:2rem;font-weight:800;color:#111827;line-height:1.1;letter-spacing:.01em;}
.lw-kpi__label{margin-top:6px;font-size:.85rem;color:#6b7280;}
/* Status bar – single-row, artifact-free */
.lw-statusbar{display:flex;align-items:stretch;height:14px;padding:2px;border-radius:999px;
background:#f3f4f6;border:1px solid #e5e7eb;overflow:hidden;white-space:nowrap;
font-size:0;line-height:0;direction:ltr;}
/* If your wiki injects stray text nodes, this hides them */
.lw-statusbar span{font-size:0;line-height:0;}
.lw-statusbar .lw-seg{display:block;height:100%;box-sizing:border-box;flex:0 0 auto;}
.lw-statusbar .lw-seg + .lw-seg{border-left:2px solid #fff;opacity:.98;}
.lw-statusbar .lw-seg:first-child{border-top-left-radius:999px;border-bottom-left-radius:999px;}
.lw-statusbar .lw-seg:last-child{border-top-right-radius:999px;border-bottom-right-radius:999px;}
/* widths (sum ~100%; last nudged to avoid rounding overflow) */
.lw-w-178{width:1.78%} .lw-w-468{width:4.68%} .lw-w-958{width:9.58%}
.lw-w-1982{width:19.82%} .lw-w-2829{width:28.29%} .lw-w-3585{width:35.85%}
/* colors */
.lw-s-stable{background:#2e7d32;} .lw-s-vulnerable{background:#f59e0b;}
.lw-s-endangered{background:#f97316;} .lw-s-critical{background:#dc2626;}
.lw-s-extinct{background:#111827;} .lw-s-unknown{background:#9ca3af;}