Minecraft-Console-Client/docs/.vuepress/styles/index.scss

84 lines
2.5 KiB
SCSS

.custom-container {
--custom-container-accent: var(--vp-c-accent-bg);
--custom-container-title: var(--vp-c-accent-text);
--custom-container-soft: var(--vp-c-accent-soft);
margin: 0.75rem 0;
padding: 0.85rem 1rem;
border-inline-start: 0.35rem solid var(--custom-container-accent);
border-radius: 0.75rem;
background: var(--custom-container-soft);
color: inherit;
font-size: var(--hint-font-size, 0.92rem);
transition:
background var(--vp-t-color),
color var(--vp-t-color),
border-color var(--vp-t-color);
}
.custom-container > .custom-container-title {
margin: 0 0 0.45rem;
color: var(--custom-container-title);
font-weight: 700;
line-height: 1.25;
}
.custom-container > :last-child {
margin-bottom: 0;
}
.custom-container > :not(.custom-container-title):first-child {
margin-top: 0;
}
.custom-container a {
color: var(--vp-c-accent);
}
.custom-container :not(pre) > code {
background: var(--vp-c-control);
}
.custom-container.tip {
--custom-container-accent: var(--tip-c-accent, var(--vp-c-green-bg));
--custom-container-title: var(--tip-c-text, var(--vp-c-green-text));
--custom-container-soft: var(--tip-c-soft, var(--vp-c-green-soft));
}
.custom-container.info {
--custom-container-accent: var(--info-c-accent, var(--vp-c-blue-bg));
--custom-container-title: var(--info-c-text, var(--vp-c-blue-text));
--custom-container-soft: var(--info-c-soft, var(--vp-c-blue-soft));
}
.custom-container.note {
--custom-container-accent: var(--note-c-accent, var(--vp-c-grey-bg));
--custom-container-title: var(--note-c-text, var(--vp-c-grey-text));
--custom-container-soft: var(--note-c-soft, var(--vp-c-grey-soft));
}
.custom-container.important {
--custom-container-accent: var(--important-c-accent, var(--vp-c-purple-bg));
--custom-container-title: var(--important-c-text, var(--vp-c-purple-text));
--custom-container-soft: var(--important-c-soft, var(--vp-c-purple-soft));
}
.custom-container.warning {
--custom-container-accent: var(--warning-c-accent, var(--vp-c-yellow-bg));
--custom-container-title: var(--warning-c-text, var(--vp-c-yellow-text));
--custom-container-soft: var(--warning-c-soft, var(--vp-c-yellow-soft));
}
.custom-container.danger,
.custom-container.caution {
--custom-container-accent: var(--caution-c-accent, var(--vp-c-red-bg));
--custom-container-title: var(--caution-c-text, var(--vp-c-red-text));
--custom-container-soft: var(--caution-c-soft, var(--vp-c-red-soft));
}
@media (max-width: 719px) {
.custom-container {
margin-inline: -0.75rem;
border-radius: 0.5rem;
}
}