shelving/ui/block/Blockquote.module.css

Toolkit for using data in JavaScript.

@import "../style/base.css";

@layer components {
	.blockquote,
	.prose blockquote {
		display: block;
		margin-inline: 0;
		margin-block: var(--blockquote-spacing, var(--spacing-paragraph));
		border-inline-start: var(--blockquote-thickness, var(--thickness, var(--stroke-focus))) solid
			var(--blockquote-color-border, var(--color-vivid));
		padding-block: var(--blockquote-padding, var(--space-small));
		padding-inline-start: var(--blockquote-indent, var(--space-normal));

		text-align: var(--blockquote-align, left);
	}
}

@layer overrides {
	.blockquote,
	.prose blockquote {
		&:first-child {
			margin-block-start: 0;
		}
		&:last-child {
			margin-block-end: 0;
		}
	}
}