| | |
|---|
| | | border: 1px solid var(--border); |
|---|
| | | background-color: var(--bg); |
|---|
| | | border-radius: 5px; |
|---|
| | | padding: 0 0.7rem; |
|---|
| | | padding: 0 1rem; |
|---|
| | | overflow-y: hidden; |
|---|
| | | transition: max-height 0.3s ease; |
|---|
| | | |
|---|
| | | & > *:nth-child(2) { |
|---|
| | | margin-top: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | &[data-callout="note"] { |
|---|
| | | --color: #448aff; |
|---|
| | |
|---|
| | | --color: var(--secondary); |
|---|
| | | --border: var(--lightgray); |
|---|
| | | } |
|---|
| | | |
|---|
| | | &.is-collapsed > .callout-title > .fold { |
|---|
| | | transform: rotateZ(-90deg) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | gap: 5px; |
|---|
| | | margin: 1rem 0; |
|---|
| | | padding: 1rem 0; |
|---|
| | | color: var(--color); |
|---|
| | | |
|---|
| | | & .fold { |
|---|
| | | margin-left: 0.5rem; |
|---|
| | | transition: transform 0.3s ease; |
|---|
| | | opacity: 0.8; |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .callout-icon { |
|---|
