refactor(styles): use JetBrains Mono variable
- Remove Google fonts' "JetBrains Mono" as it didn't support variable and add the variable ttf for it Signed-off-by: Akshit Garg <garg.akshit@gmail.com>
This commit is contained in:
		
							parent
							
								
									0ed4427322
								
							
						
					
					
						commit
						8c99eb04a4
					
				| @ -25,6 +25,7 @@ esbuild | ||||
|     outfile: "../priv/static/assets/app.js", | ||||
|     minify: productionBuild, | ||||
|     watch: !productionBuild, | ||||
|     external: ["*.ttf"], | ||||
|     plugins: [ | ||||
|       postCSSPlugin({ | ||||
|         plugins: [postcssImport, tailwindcss, autoprefixer], | ||||
|  | ||||
| @ -3,11 +3,18 @@ | ||||
| @import "tailwindcss/components"; | ||||
| @import "tailwindcss/utilities"; | ||||
| 
 | ||||
| @font-face { | ||||
|   font-family: "JetBrains Mono"; | ||||
|   src: url(/fonts/jetbrains_mono_variable.ttf); | ||||
|   font-weight: 100 1000; | ||||
|   font-stretch: 25% 151%; | ||||
| } | ||||
| 
 | ||||
| * { | ||||
|   font-family: "JetBrains Mono", monospace; | ||||
|   color: white; | ||||
| 	font-size: 14px; | ||||
| 	font-weight: bold; | ||||
|   font-size: 14px; | ||||
|   font-weight: bold; | ||||
| } | ||||
| 
 | ||||
| html, | ||||
| @ -17,7 +24,7 @@ body { | ||||
| } | ||||
| 
 | ||||
| a:hover { | ||||
|   color: #ff9800 | ||||
|   color: #ff9800; | ||||
| } | ||||
| 
 | ||||
| header { | ||||
| @ -29,31 +36,31 @@ code { | ||||
| } | ||||
| 
 | ||||
| code { | ||||
| 	white-space: pre; | ||||
| 	font-size: 14px; | ||||
| 	font-weight: bold; | ||||
|   white-space: pre; | ||||
|   font-size: 14px; | ||||
|   font-weight: bold; | ||||
| } | ||||
| 
 | ||||
| textarea { | ||||
| 	font-size: 14px; | ||||
| 	font-weight: bold; | ||||
|   font-size: 14px; | ||||
|   font-weight: bold; | ||||
| } | ||||
| 
 | ||||
| .alert { | ||||
| 	width: 100%; | ||||
| 	text-align: center; | ||||
|   width: 100%; | ||||
|   text-align: center; | ||||
| } | ||||
| 
 | ||||
| .alert-info { | ||||
| 	background-color: #1ed98e; | ||||
| 	color: black; | ||||
| 	font-weight: bold; | ||||
|   background-color: #1ed98e; | ||||
|   color: black; | ||||
|   font-weight: bold; | ||||
| } | ||||
| 
 | ||||
| .alert-danger { | ||||
| 	background-color: #ff9800; | ||||
| 	color: black; | ||||
| 	font-weight: bold; | ||||
|   background-color: #ff9800; | ||||
|   color: black; | ||||
|   font-weight: bold; | ||||
| } | ||||
| 
 | ||||
| @import './highlight.css'; | ||||
| @import "./highlight.css"; | ||||
|  | ||||
							
								
								
									
										
											BIN
										
									
								
								assets/static/fonts/jetbrains_mono_variable.ttf
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										
											BIN
										
									
								
								assets/static/fonts/jetbrains_mono_variable.ttf
									
									
									
									
									
										Normal file
									
								
							
										
											Binary file not shown.
										
									
								
							| @ -6,9 +6,6 @@ | ||||
|     <meta name="viewport" content="width=device-width, initial-scale=1.0"/> | ||||
|     <title>Katbin</title> | ||||
|     <link rel="stylesheet" href="<%= Routes.static_path(@conn, "/assets/app.css") %>"/> | ||||
|     <link rel="preconnect" href="https://fonts.googleapis.com"> | ||||
|     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | ||||
|     <link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700;800&display=swap" rel="stylesheet"> | ||||
|     <script defer type="text/javascript" src="<%= Routes.static_path(@conn, "/assets/app.js") %>"></script> | ||||
|   </head> | ||||
|   <body class="flex flex-col "> | ||||
|  | ||||
		Loading…
	
		Reference in New Issue
	
	Block a user
	 Akshit Garg
						Akshit Garg