Template:Home/ConservationPanel.css
Template page
More actions
/* Landrace.wiki — Conservation Panel (TemplateStyles-safe) */ .lw-cons-panel{ background:#ffffff; border:1px solid #e5e7eb; border-left:4px solid #2d5016; border-radius:12px; padding:18px; box-shadow:0 6px 16px rgba(0,0,0,.04); margin:2em 0; } .lw-cons-title{ font-weight:700;color:#2d5016;text-transform:uppercase; letter-spacing:.04em;font-size:.9rem;margin-bottom:.5rem; } /* Top metrics */ .lw-cons-metrics{ display:grid;grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px;margin:8px 0 6px; } .lw-metric{ background:#f8f9fa;border:1px solid #e5e7eb;border-radius:10px; padding:14px 12px;text-align:center; } .lw-metric .num{display:block;font-size:1.75rem;font-weight:800;color:#1f2937;line-height:1.1;} .lw-metric .label{display:block;margin-top:4px;font-size:.85rem;color:#6b7280} /* Status breakdown (renamed to avoid collisions) */ .lw-breakdown{ display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:4px 16px;margin-top:10px; } .lw-row{ display:flex;align-items:center;min-height:32px;font-size:.95rem;color:#1f2937; background:transparent;border:0;padding:0;border-radius:0; /* kill any upstream pill styles */ } .lw-row .lw-dot{width:10px;height:10px;border-radius:50%;background:currentColor; box-shadow:inset 0 0 0 1px rgba(255,255,255,.6);margin-right:8px;} .lw-row .lw-label{font-weight:600;background:none;padding:0;margin:0;border:0;} .lw-row .lw-line{flex:1;border-bottom:1px dashed #e5e7eb;margin:0 8px;height:0;} .lw-row .lw-count{font-variant-numeric:tabular-nums;background:none;padding:0;margin:0;border:0;} .lw-stable{color:#2e7d32} .lw-vulnerable{color:#f59e0b} .lw-endangered{color:#f97316} .lw-critical{color:#dc2626} .lw-extinct{color:#111827} .lw-unknown{color:#9ca3af} /* Actions — style the inner anchors so redlinks don't scream */ .lw-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px} .lw-btn{ display:inline-flex;align-items:center;gap:6px; padding:8px 12px;border-radius:8px; border:1px solid #e5e7eb;background:#ffffff; color:#2d5016;font-weight:600;transition:background .15s,border-color .15s,transform .15s; } .lw-btn:hover{background:#f8f9fa;border-color:#d1d5db;transform:translateY(-1px)} .lw-btn--primary{background:#2d5016;color:#ffffff;border-color:#2d5016} .lw-btn--primary:hover{background:#3d6b1f;border-color:#3d6b1f} /* Make the link inside look like the button; neutralize redlink styles */ .lw-btn > a, .lw-btn > a:visited, .lw-btn > a.new{ color:inherit !important; text-decoration:none !important; background:transparent !important; border:0 !important; padding:0 !important; } @media (max-width:768px){ .lw-cons-metrics{grid-template-columns:1fr;gap:10px} .lw-breakdown{grid-template-columns:1fr} }