skills/pbakaus_impeccable
1
0
Fork 0
mirror of https://github.com/pbakaus/impeccable.git synced 2026-09-14 15:16:35 +03:00
Code Issues Packages Projects Releases Wiki Activity

Refine antidote section: inline critique note, remove card layout

Browse Source 
Replace the detector summary card and badge system with a simple
inline note below the tabbed Do/Don't patterns: "/critique catches
all of these. 16 deterministically, the rest through LLM analysis."
Gallery of Shame and Suggest a pattern links sit inline alongside.

Subtle divider separates the note from the patterns above.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Paul Bakaus
2026-03-18 09:55:35 -07:00
co-authored by Claude Opus 4.6
parent 0ac2e2bd07
commit d444d25988
3 changed files with 4026 additions and 147 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/css/main.css
+39 -89
View File
@@ -820,7 +820,6 @@ code {
.solution-section {
padding: var(--spacing-2xl) 0;
border-top: 1px solid var(--color-mist);
}
.solution-content {
@@ -1982,112 +1981,63 @@ code {
text-decoration: underline;
}
/* Detector summary */
.detector-summary {
margin-bottom: var(--spacing-xl);
border: 1px solid var(--color-mist);
border-radius: 6px;
background: white;
overflow: hidden;
}
.detector-header {
padding: var(--spacing-sm) var(--spacing-md);
border-bottom: 1px solid var(--color-mist);
background: var(--color-cream);
}
.detector-label {
font-family: var(--font-mono);
font-size: 0.75rem;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.08em;
color: var(--color-accent);
}
.detector-label code {
font-family: var(--font-mono);
font-size: 0.75rem;
color: var(--color-accent);
}
.detector-categories {
padding: var(--spacing-md);
display: flex;
flex-direction: column;
gap: var(--spacing-sm);
}
.detector-category {
/* Critique callout — inline note below tabs */
.critique-callout {
border-top: 1px solid var(--color-mist);
padding-top: var(--spacing-md);
margin-bottom: var(--spacing-md);
display: flex;
align-items: baseline;
gap: var(--spacing-sm);
flex-wrap: wrap;
font-size: 0.8125rem;
color: var(--color-ash);
line-height: 1.55;
}
.detector-category-name {
font-size: 0.6875rem;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.08em;
.critique-callout-body {
display: contents;
}
.critique-callout-title {
display: none;
}
.critique-callout-text {
color: var(--color-ash);
min-width: 5.5rem;
}
.critique-callout-text code {
font-family: var(--font-mono);
font-size: 0.8125rem;
color: var(--color-charcoal);
}
.critique-callout-links {
display: flex;
gap: var(--spacing-sm);
flex-shrink: 0;
}
.detector-chips {
display: flex;
flex-wrap: wrap;
gap: 6px;
}
.detector-chip {
font-family: var(--font-mono);
font-size: 0.6875rem;
color: var(--color-charcoal);
background: var(--color-cream);
padding: 3px 10px;
border-radius: 3px;
border: 1px solid var(--color-mist);
white-space: nowrap;
line-height: 1.4;
}
.detector-footer {
padding: var(--spacing-sm) var(--spacing-md);
border-top: 1px solid var(--color-mist);
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--spacing-md);
flex-wrap: wrap;
}
.detector-count {
font-size: 0.8125rem;
color: var(--color-ash);
}
.detector-gallery-link {
.critique-callout-link {
font-size: 0.8125rem;
font-weight: 500;
color: var(--color-accent);
text-decoration: none;
font-weight: 500;
white-space: nowrap;
}
.detector-gallery-link:hover {
.critique-callout-link:hover {
text-decoration: underline;
}
@media (max-width: 600px) {
.detector-category {
flex-direction: column;
gap: 4px;
}
.critique-callout-link--secondary {
color: var(--color-ash);
font-weight: 400;
}
.detector-category-name {
min-width: auto;
}
.critique-callout-link--secondary:hover {
color: var(--color-charcoal);
}
/* ============================================