mirror of
https://github.com/raunaqgupta/obsidian-cooklang-codeblock-plugin.git
synced 2026-07-22 17:20:30 +00:00
Flatten the metadata <dl> so <dt>/<dd> pairs are direct grid items, removing the need for a wrapper div with display: contents (which has historically had patchy accessibility tree support). Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
134 lines
2.7 KiB
CSS
134 lines
2.7 KiB
CSS
.cooklang-recipe {
|
|
border-radius: var(--radius-s);
|
|
padding: var(--size-4-4);
|
|
color: var(--text-normal);
|
|
line-height: var(--line-height-normal);
|
|
position: relative;
|
|
border: var(--border-width) solid var(--background-modifier-border);
|
|
}
|
|
|
|
.cooklang-metadata {
|
|
padding-bottom: var(--size-4-4);
|
|
}
|
|
|
|
.cooklang-title {
|
|
margin: 0 0 var(--size-4-2) 0;
|
|
font-size: var(--h3-size);
|
|
font-weight: var(--h3-weight);
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.cooklang-meta-list {
|
|
margin: 0;
|
|
display: grid;
|
|
grid-template-columns: max-content 1fr;
|
|
gap: var(--size-4-1) var(--size-4-3);
|
|
}
|
|
|
|
.cooklang-meta-key {
|
|
font-weight: var(--font-semibold);
|
|
color: var(--text-muted);
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.cooklang-meta-value {
|
|
margin: 0;
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
/* ---------- Section headings ---------- */
|
|
|
|
.cooklang-recipe h4 {
|
|
margin: var(--size-4-4) 0 var(--size-4-2) 0;
|
|
font-size: var(--h4-size);
|
|
font-weight: var(--h4-weight);
|
|
color: var(--text-normal);
|
|
text-transform: capitalize;
|
|
}
|
|
|
|
.cooklang-recipe > .cooklang-metadata + .cooklang-ingredients h4,
|
|
.cooklang-recipe > .cooklang-ingredients:first-child h4 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
/* ---------- Ingredients & cookware lists ---------- */
|
|
|
|
.cooklang-ingredients ul,
|
|
.cooklang-cookware ul {
|
|
margin: 0;
|
|
}
|
|
|
|
.cooklang-ingredient-item,
|
|
.cooklang-cookware-item {
|
|
margin: var(--size-4-1) 0;
|
|
}
|
|
|
|
.cooklang-quantity {
|
|
font-weight: var(--font-semibold);
|
|
}
|
|
|
|
/* ---------- Steps ---------- */
|
|
|
|
.cooklang-steps ol {
|
|
margin: 0;
|
|
}
|
|
|
|
.cooklang-step {
|
|
margin: var(--size-4-2) 0;
|
|
padding-left: var(--size-4-1);
|
|
}
|
|
|
|
.cooklang-step::marker {
|
|
color: var(--text-muted);
|
|
font-weight: var(--font-semibold);
|
|
}
|
|
|
|
/* ---------- Inline token highlights ---------- */
|
|
|
|
.cooklang-inline-timer {
|
|
display: inline-block;
|
|
background: var(--background-secondary);
|
|
color: var(--text-normal);
|
|
padding: var(--size-2-1) var(--size-4-2);
|
|
border-radius: var(--radius-s);
|
|
font-family: var(--font-monospace);
|
|
font-size: var(--font-smaller);
|
|
}
|
|
|
|
/* ---------- Error state ---------- */
|
|
|
|
.cooklang-error {
|
|
border: var(--border-width) solid var(--text-error);
|
|
border-radius: var(--radius-m);
|
|
padding: var(--size-4-3) var(--size-4-4);
|
|
margin: var(--size-4-4) 0;
|
|
background: var(--background-primary);
|
|
color: var(--text-normal);
|
|
}
|
|
|
|
.cooklang-error-header {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: var(--size-4-2);
|
|
margin-bottom: var(--size-4-2);
|
|
}
|
|
|
|
.cooklang-error-icon {
|
|
color: var(--text-error);
|
|
font-size: var(--font-ui-medium);
|
|
}
|
|
|
|
.cooklang-error-message {
|
|
font-weight: var(--font-semibold);
|
|
color: var(--text-error);
|
|
}
|
|
|
|
.cooklang-error-source {
|
|
margin: 0;
|
|
padding: var(--size-4-2) var(--size-4-3);
|
|
background: var(--background-secondary);
|
|
border-radius: var(--radius-s);
|
|
font-size: var(--font-smallest);
|
|
white-space: pre-wrap;
|
|
color: var(--text-muted);
|
|
}
|