styles.css

.variable-safety-for-obsidian-css {
	--text-faint: "";
}

/* ────────────────────────────────────────────────────────────────────────── */

/* NOTE
Overwriting of (some) core styling is done on purpose. As noted in the README,
Quadro is intended to be used in specialized vaults, solely dedicated to QDA.

I assume that running multiple document.querySelector on every file-open and
adding classes to quite a few elements would have somewhat of a performance
impact, which I wanted to avoid if Quadro is to be run in dedicated vaults only
anyway.
*/

/* ────────────────────────────────────────────────────────────────────────── */
/* BLOCK IDS */

/* Make them less visible */
.cm-line .cm-blockid {
	opacity: 0.3;
}

/* Hide Block Id on non-active line */
.cm-line:not(.cm-active) .cm-blockid {
	display: none;
}

/* ────────────────────────────────────────────────────────────────────────── */
/* EMBEDDED LINKS */

.markdown-embed.internal-embed.inline-embed {
	--between-embeds-spacing: 2rem;
	border: none;
	padding: 0;
	padding-bottom: var(--between-embeds-spacing);
}

/* show location of embedded block links */
.markdown-embed.internal-embed.inline-embed::after {
	/* destination is saved in `alt` attribute */
	content: attr(alt);
	color: var(--text-faint);
	padding-left: 1.75rem;
	padding-top: 4px;
	font-size: 90%;
}

/* move link down to destination text */
.markdown-embed.internal-embed.inline-embed .markdown-embed-link {
	top: unset;
	left: 0;
}

/* remove wasted space */
.markdown-embed.internal-embed.inline-embed .markdown-embed-title {
	display: none;
}

.markdown-embed.internal-embed.inline-embed p {
	margin-bottom: 0;
}

/* spacing added by some themes (e.g. Prism) */
body .internal-embed .markdown-embed-content {
	padding: 0;
}

/* ────────────────────────────────────────────────────────────────────────── */
/* QUADRO UI ELEMENTS */

.quadro-settings-textarea {
	min-height: 5rem;
	min-width: 15rem;
}

.quadro-settings-input {
	min-width: 15rem;
}

.quadro-ribbon-button {
	border: 1px solid var(--text-faint);
}

.quadro-wide-input {
	width: 100%;
	min-width: 20rem;
}

.quadro-large-textarea {
	width: 100%;
	min-height: 10rem;
}