mirror of
https://github.com/MindWorkAI/AI-Studio.git
synced 2026-11-05 08:07:21 +00:00
49 lines
1.5 KiB
CSS
49 lines
1.5 KiB
CSS
/*
|
|
* At most two columns, decided by the width of the grid itself: a column is at least half of the
|
|
* grid wide, so a third never fits, and at least 20rem, so two columns need about 40rem. Below that,
|
|
* the quadrants stand below each other. min(20rem, 100%) keeps a single column from overflowing a
|
|
* grid narrower than 20rem.
|
|
*/
|
|
.swot-quadrant-grid {
|
|
--swot-gap: 1rem;
|
|
display: grid;
|
|
gap: var(--swot-gap);
|
|
grid-template-columns: repeat(auto-fit, minmax(max(min(20rem, 100%), calc((100% - var(--swot-gap)) / 2)), 1fr));
|
|
}
|
|
|
|
.swot-quadrant {
|
|
border: 1px solid var(--mud-palette-lines-default);
|
|
border-radius: var(--mud-default-borderradius);
|
|
min-width: 0;
|
|
padding: 1rem;
|
|
}
|
|
|
|
.swot-quadrant-header {
|
|
margin-bottom: 0.65rem;
|
|
}
|
|
|
|
.swot-quadrant-axes {
|
|
color: var(--mud-palette-text-secondary);
|
|
display: block;
|
|
font-size: 0.8rem;
|
|
}
|
|
|
|
.swot-strengths {
|
|
border-top: 0.3rem solid var(--mud-palette-success);
|
|
background: color-mix(in srgb, var(--mud-palette-success) 8%, transparent);
|
|
}
|
|
|
|
.swot-weaknesses {
|
|
border-top: 0.3rem solid var(--mud-palette-warning);
|
|
background: color-mix(in srgb, var(--mud-palette-warning) 8%, transparent);
|
|
}
|
|
|
|
.swot-opportunities {
|
|
border-top: 0.3rem solid var(--mud-palette-info);
|
|
background: color-mix(in srgb, var(--mud-palette-info) 8%, transparent);
|
|
}
|
|
|
|
.swot-threats {
|
|
border-top: 0.3rem solid var(--mud-palette-error);
|
|
background: color-mix(in srgb, var(--mud-palette-error) 8%, transparent);
|
|
} |