95 lines
		
	
	
		
			2.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			95 lines
		
	
	
		
			2.2 KiB
		
	
	
	
		
			HTML
		
	
	
	
	
	
| {{ $page := . }}
 | |
| 
 | |
| <style>
 | |
| body, html {
 | |
|     height: 100%;
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] {
 | |
|     counter-reset: paige-figure;
 | |
|     max-width: 100%;
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] figure.paige-figure.paige-figure-numbered {
 | |
|     counter-increment: paige-figure;
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] figure.paige-figure.paige-figure-numbered figcaption:empty::before {
 | |
|     content: "{{ i18n `paige_figure` }} " counter(paige-figure);
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] figure.paige-figure.paige-figure-numbered figcaption::before {
 | |
|     content: "{{ i18n `paige_figure` }} " counter(paige-figure) ": ";
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] > blockquote {
 | |
|     padding: 0.5rem 1rem;
 | |
|     border-left: 0.25rem solid var(--bs-border-color);
 | |
|     padding-right: 0.25rem;
 | |
| }
 | |
| 
 | |
| section[class="paige-content"] > blockquote p:last-of-type {
 | |
|     margin-bottom: 0;
 | |
| }
 | |
| 
 | |
| {{ with $page.Param "paige.content_max_width" }}
 | |
|     section[class="paige-content"], section[class="paige-toc"] {
 | |
|         max-width: {{ . }};
 | |
|     }
 | |
| {{ end }}
 | |
| 
 | |
| {{ with $page.Param "paige.metadata_max_width" }}
 | |
|     section[class="paige-metadata"] {
 | |
|         max-width: {{ . }};
 | |
|     }
 | |
| {{ end }}
 | |
| 
 | |
| .paige-figure .highlight .chroma pre,
 | |
| .paige-figure .highlight pre.chroma {
 | |
|     margin-bottom: 0;
 | |
| }
 | |
| 
 | |
| .highlight .chroma .lnt,
 | |
| .highlight .chroma .hl {
 | |
|     display: flex;
 | |
| }
 | |
| 
 | |
| .paige-figure > div > div[class="highlight"] > pre, .paige-figure > div > :last-child {
 | |
|     margin-bottom: 0;
 | |
| }
 | |
| 
 | |
| .paige-header-link {
 | |
|     margin-left: 0.5ch;
 | |
|     opacity: 0;
 | |
|     position: absolute;
 | |
|     text-decoration: none;
 | |
|     transition: color 0.15s ease-in-out, opacity 0.15s ease-in-out;
 | |
| }
 | |
| 
 | |
| @media (prefers-reduced-motion: reduce) {
 | |
|     .paige-header-link {
 | |
|         transition: none;
 | |
|     }
 | |
| }
 | |
| 
 | |
| .paige-header-link:focus, .paige-header-link:hover, :hover > .paige-header-link, :target > .paige-header-link {
 | |
|     opacity: 1;
 | |
| }
 | |
| 
 | |
| {{ with $page.Param "paige.color_scheme" }}
 | |
|     {{ if eq . "dark" }}
 | |
|         {{ partial "paige/dark.css" . | safeCSS }}
 | |
|     {{ else if eq . "light" }}
 | |
|         {{ partial "paige/light.css" . | safeCSS }}
 | |
|     {{ end }}
 | |
| {{ else }}
 | |
|     @media (prefers-color-scheme: dark) {
 | |
|         {{ partial "paige/dark.css" . | safeCSS }}
 | |
|     }
 | |
| 
 | |
|     @media (prefers-color-scheme: light) {
 | |
|         {{ partial "paige/light.css" . | safeCSS }}
 | |
|     }
 | |
| {{ end }}
 | |
| </style>
 |