| | |
|---|
| | | padding: 0 1rem; |
|---|
| | | overflow-y: hidden; |
|---|
| | | transition: max-height 0.3s ease; |
|---|
| | | box-sizing: border-box; |
|---|
| | | |
|---|
| | | & > *:nth-child(2) { |
|---|
| | | margin-top: 0; |
|---|
| | |
|---|
| | | |
|---|
| | | &[data-callout="note"] { |
|---|
| | | --color: #448aff; |
|---|
| | | --border: #448aff22; |
|---|
| | | --bg: #448aff09; |
|---|
| | | --border: #448aff44; |
|---|
| | | --bg: #448aff10; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="abstract"] { |
|---|
| | | --color: #00b0ff; |
|---|
| | | --border: #00b0ff22; |
|---|
| | | --bg: #00b0ff09; |
|---|
| | | --border: #00b0ff44; |
|---|
| | | --bg: #00b0ff10; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="info"], |
|---|
| | | &[data-callout="todo"] { |
|---|
| | | --color: #00b8d4; |
|---|
| | | --border: #00b8d422; |
|---|
| | | --bg: #00b8d409; |
|---|
| | | --border: #00b8d444; |
|---|
| | | --bg: #00b8d410; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="tip"] { |
|---|
| | | --color: #00bfa5; |
|---|
| | | --border: #00bfa522; |
|---|
| | | --bg: #00bfa509; |
|---|
| | | --border: #00bfa544; |
|---|
| | | --bg: #00bfa510; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="success"] { |
|---|
| | | --color: #09ad7a; |
|---|
| | | --border: #09ad7122; |
|---|
| | | --bg: #09ad7109; |
|---|
| | | --border: #09ad7144; |
|---|
| | | --bg: #09ad7110; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="question"] { |
|---|
| | | --color: #dba642; |
|---|
| | | --border: #dba64222; |
|---|
| | | --bg: #dba64209; |
|---|
| | | --border: #dba64244; |
|---|
| | | --bg: #dba64210; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="warning"] { |
|---|
| | | --color: #db8942; |
|---|
| | | --border: #db894222; |
|---|
| | | --bg: #db894209; |
|---|
| | | --border: #db894244; |
|---|
| | | --bg: #db894210; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="failure"], |
|---|
| | | &[data-callout="danger"], |
|---|
| | | &[data-callout="bug"] { |
|---|
| | | --color: #db4242; |
|---|
| | | --border: #db424222; |
|---|
| | | --bg: #db424209; |
|---|
| | | --border: #db424244; |
|---|
| | | --bg: #db424210; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="example"] { |
|---|
| | | --color: #7a43b5; |
|---|
| | | --border: #7a43b522; |
|---|
| | | --bg: #7a43b509; |
|---|
| | | --border: #7a43b544; |
|---|
| | | --bg: #7a43b510; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="quote"] { |
|---|
| | |
|---|
| | | opacity: 0.8; |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | & > .callout-title-inner > p { |
|---|
| | | color: var(--color); |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .callout-icon { |
|---|
