| | |
| | | |
| | | html { |
| | | scroll-behavior: smooth; |
| | | -webkit-text-size-adjust: none; |
| | | text-size-adjust: none; |
| | | overflow-x: hidden; |
| | | width: 100vw; |
| | |
| | | } |
| | | |
| | | ::selection { |
| | | background: color-mix(in srgb, var(--tertiary) 75%, transparent); |
| | | background: color-mix(in srgb, var(--tertiary) 60%, transparent); |
| | | color: var(--darkgray); |
| | | } |
| | | |
| | |
| | | background-color: var(--highlight); |
| | | padding: 0 0.1rem; |
| | | border-radius: 5px; |
| | | line-height: 1.4rem; |
| | | |
| | | &:has(> img) { |
| | | background-color: none; |
| | |
| | | padding: 0; |
| | | } |
| | | } |
| | | |
| | | &.external .external-icon { |
| | | height: 1ex; |
| | | margin: 0 0.15em; |
| | | |
| | | > path { |
| | | fill: var(--dark); |
| | | } |
| | | } |
| | | } |
| | | |
| | | .desktop-only { |
| | |
| | | |
| | | & .sidebar.right { |
| | | right: calc(calc(100vw - $pageWidth) / 2 - $sidePanelWidth); |
| | | flex-wrap: wrap; |
| | | & > * { |
| | | @media all and (max-width: $fullPageWidth) { |
| | | flex: 1; |
| | | min-width: 140px; |
| | | } |
| | | } |
| | | } |
| | |
| | | opacity: 0; |
| | | transition: opacity 0.2s ease; |
| | | transform: translateY(-0.1rem); |
| | | display: inline-block; |
| | | font-family: var(--codeFont); |
| | | user-select: none; |
| | | } |
| | |
| | | |
| | | pre { |
| | | font-family: var(--codeFont); |
| | | padding: 0.5rem; |
| | | padding: 0 0.5rem; |
| | | border-radius: 5px; |
| | | overflow-x: auto; |
| | | border: 1px solid var(--lightgray); |
| | | position: relative; |
| | | |
| | | &.mermaid { |
| | | &:has(> code.mermaid) { |
| | | border: none; |
| | | } |
| | | |
| | |
| | | counter-increment: line 0; |
| | | display: grid; |
| | | padding: 0.5rem 0; |
| | | overflow-x: scroll; |
| | | |
| | | & [data-highlighted-chars] { |
| | | background-color: var(--highlight); |