Vertinext/packages/vuetom/styles/custom-blocks.scss

58 lines
1.3 KiB
SCSS

:root {
// custom-block.tip
--vp-custom-block-tip-border: var(--vp-c-brand-light);
--vp-custom-block-tip-text: var(--vp-c-brand);
--vp-custom-block-tip-bg: transparent;
// custom-block.warning
--vp-custom-block-warning-border: #b99a02;
--vp-custom-block-warning-text: #b49704;
--vp-custom-block-warning-bg: #e7c00010;
// custom-block.danger
--vp-custom-block-danger-border: #b90e0e;
--vp-custom-block-danger-text: #cf0b0b;
--vp-custom-block-danger-bg: #cc000010;
// custom-block.info
--vp-custom-block-info-border: #05b640;
--vp-custom-block-info-text: #05b740;
--vp-custom-block-info-bg: #06ce4910;
}
.custom-block.tip,
.custom-block.info,
.custom-block.warning,
.custom-block.danger {
margin: 1rem 0;
border-width: 2px;
border-left: 0.5rem solid;
border-radius: 0.5rem;
padding: 0.5rem 1.3rem;
overflow-x: auto;
&:hover {
transition: all 0.5s;
box-shadow: var(--vp-shadow-4);
border-left: 2px solid;
}
a {
cursor: pointer;
}
.custom-block-title {
font-weight: 600;
}
}
.custom-block.details {
margin: 1rem 0;
border-width: 2px;
border-radius: 0.5rem;
padding: 0.5rem 1.3rem;
summary {
outline: none;
cursor: pointer;
}
}
.dark {
.custom-block.tip {
background-color: #23232380;
}
}