It's now more like my personal homepage depends on TVL assets, not the other way around. Change-Id: Ifb9d61aa8ec2cab549e25de3a3dfbbd08f3d336c Reviewed-on: https://cl.tvl.fyi/c/depot/+/3435 Tested-by: BuildkiteCI Reviewed-by: sterni <sternenseemann@systemli.org>
		
			
				
	
	
		
			183 lines
		
	
	
	
		
			2.7 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			183 lines
		
	
	
	
		
			2.7 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
| /* Jetbrains Mono font from https://www.jetbrains.com/lp/mono/
 | |
|    licensed under Apache 2.0. Thanks, Jetbrains! */
 | |
| @font-face {
 | |
|     font-family: jetbrains-mono;
 | |
|     src: url(jetbrains-mono.woff2);
 | |
| }
 | |
| 
 | |
| @font-face {
 | |
|     font-family: jetbrains-mono;
 | |
|     font-weight: bold;
 | |
|     src: url(jetbrains-mono-bold.woff2);
 | |
| }
 | |
| 
 | |
| @font-face {
 | |
|     font-family: jetbrains-mono;
 | |
|     font-style: italic;
 | |
|     src: url(jetbrains-mono-italic.woff2);
 | |
| }
 | |
| 
 | |
| @font-face {
 | |
|     font-family: jetbrains-mono;
 | |
|     font-weight: bold;
 | |
|     font-style: italic;
 | |
|     src: url(jetbrains-mono-bold-italic.woff2);
 | |
| }
 | |
| 
 | |
| /* Generic-purpose styling */
 | |
| 
 | |
| body {
 | |
|     max-width: 800px;
 | |
|     margin: 40px auto;
 | |
|     line-height: 1.6;
 | |
|     font-size: 18px;
 | |
|     padding: 0 10px;
 | |
|     font-family: jetbrains-mono, monospace;
 | |
| }
 | |
| 
 | |
| p, a :not(.uncoloured-link) {
 | |
|     color: inherit;
 | |
| }
 | |
| 
 | |
| h1, h2, h3 {
 | |
|     line-height: 1.2
 | |
| }
 | |
| 
 | |
| /* Homepage styling */
 | |
| 
 | |
| .dark {
 | |
|     background-color: #181818;
 | |
|     color: #e4e4ef;
 | |
| }
 | |
| 
 | |
| .dark-link, .interblag-title {
 | |
|     color: #96a6c8;
 | |
| }
 | |
| 
 | |
| .entry-container {
 | |
|     display: flex;
 | |
|     flex-direction: row;
 | |
|     flex-wrap: wrap;
 | |
|     justify-content: flex-start;
 | |
| }
 | |
| 
 | |
| .interblag-title {
 | |
|     text-decoration: none;
 | |
| }
 | |
| 
 | |
| .entry {
 | |
|     width: 42%;
 | |
|     margin: 5px;
 | |
|     padding-left: 7px;
 | |
|     padding-right: 5px;
 | |
|     border: 2px solid;
 | |
|     border-radius: 5px;
 | |
|     flex-grow: 1;
 | |
|     text-decoration: none;
 | |
| }
 | |
| 
 | |
| .misc {
 | |
|     color: #73c936;
 | |
|     border-color: #73c936;
 | |
| }
 | |
| 
 | |
| .blog {
 | |
|     color: #268bd2;
 | |
|     border-color: #268bd2;
 | |
| }
 | |
| 
 | |
| .project {
 | |
|     color: #ff4f58;
 | |
|     border-color: #ff4f58;
 | |
| }
 | |
| 
 | |
| .entry-title {
 | |
|     color: inherit !important;
 | |
|     font-weight: bold;
 | |
|     text-decoration: none;
 | |
| }
 | |
| 
 | |
| .entry-date {
 | |
|     font-style: italic;
 | |
| }
 | |
| 
 | |
| /* Blog styling */
 | |
| 
 | |
| .light {
 | |
|     color: #383838;
 | |
| }
 | |
| 
 | |
| .blog-title {
 | |
|     color: inherit;
 | |
|     text-decoration: none;
 | |
| }
 | |
| 
 | |
| .footer {
 | |
|     text-align: right;
 | |
| }
 | |
| 
 | |
| .date {
 | |
|     text-align: right;
 | |
|     font-style: italic;
 | |
|     float: right;
 | |
| }
 | |
| 
 | |
| .inline {
 | |
|     display: inline;
 | |
| }
 | |
| 
 | |
| .lod {
 | |
|     text-align: center;
 | |
| }
 | |
| 
 | |
| .uncoloured-link {
 | |
|     color: inherit;
 | |
| }
 | |
| 
 | |
| pre {
 | |
|     width: 100%;
 | |
|     overflow: auto;
 | |
| }
 | |
| 
 | |
| img {
 | |
|     max-width: 100%;
 | |
| }
 | |
| 
 | |
| .cheddar-callout {
 | |
|     display: block;
 | |
|     padding: 10px;
 | |
| }
 | |
| 
 | |
| .cheddar-question {
 | |
|     color: #3367d6;
 | |
|     background-color: #e8f0fe;
 | |
| }
 | |
| 
 | |
| .cheddar-todo {
 | |
|     color: #616161;
 | |
|     background-color: #eeeeee;
 | |
| }
 | |
| 
 | |
| .cheddar-tip {
 | |
|     color: #00796b;
 | |
|     background-color: #e0f2f1;
 | |
| }
 | |
| 
 | |
| .cheddar-warning {
 | |
|     color: #a52714;
 | |
|     background-color: #fbe9e7;
 | |
| }
 | |
| 
 | |
| kbd {
 | |
|     background-color: #eee;
 | |
|     border-radius: 3px;
 | |
|     border: 1px solid #b4b4b4;
 | |
|     box-shadow: 0 1px 1px rgba(0, 0, 0, .2), 0 2px 0 0 rgba(255, 255, 255, .7) inset;
 | |
|     color: #333;
 | |
|     display: inline-block;
 | |
|     font-size: .85em;
 | |
|     font-weight: 700;
 | |
|     line-height: 1;
 | |
|     padding: 2px 4px;
 | |
|     white-space: nowrap;
 | |
| }
 |