From 56d393fcc8410a222f0099f323e452f2f80c1cdc Mon Sep 17 00:00:00 2001 From: Gnarwhal Date: Wed, 18 Sep 2024 21:47:51 +0100 Subject: [PATCH] Text display is good now --- package.json | 3 +- src/app/[...file]/content.tsx | 31 ++++++- src/app/[...file]/types/text.css.ts | 20 ++--- src/app/[...file]/types/text.tsx | 60 ++++++++----- src/app/colors.css.ts | 4 +- yarn.lock | 126 ++++++++++++++++------------ 6 files changed, 156 insertions(+), 88 deletions(-) diff --git a/package.json b/package.json index dbaee0d..09d3d46 100644 --- a/package.json +++ b/package.json @@ -10,7 +10,8 @@ }, "dependencies": { "@vanilla-extract/css": "^1.15.5", - "next": "14.2.9", + "next": "^14.2.12", + "prism-react-renderer": "^2.4.0", "react": "^18", "react-dom": "^18" }, diff --git a/src/app/[...file]/content.tsx b/src/app/[...file]/content.tsx index 003ecf9..c3099d0 100644 --- a/src/app/[...file]/content.tsx +++ b/src/app/[...file]/content.tsx @@ -60,7 +60,36 @@ export default function Content({ src }: { src: string}) { return response.text(); }, postprocess: (data: string) => { - set_content(); + const languages = { + // "markup", + js: "jsx", + mjs: "jsx", + jsx: "jsx", + // "js-extras", + ts: "tsx", + tsx: "tsx", + swift: "swift", + kt: "kotlin", + kts: "kotlin", + ktm: "kotlin", + // "objectivec", + // "reason", + rs: "rust", + // "graphql", + yml: "yaml", + yaml: "yaml", + go: "go", + c: "cpp", + cpp: "cpp", + cxx: "cpp", + h: "cpp", + hpp: "cpp", + hxx: "cpp", + py: "python", + json: "json", + } + const split = window.location.pathname.split('.'); + set_content(); } }; } diff --git a/src/app/[...file]/types/text.css.ts b/src/app/[...file]/types/text.css.ts index 3d9e1fa..2737583 100644 --- a/src/app/[...file]/types/text.css.ts +++ b/src/app/[...file]/types/text.css.ts @@ -5,23 +5,21 @@ import * as colors from '../../colors.css' export const group = style({ display: 'flex', fontFamily: 'monospace', - fontSize: '1.1em', + fontSize: '1em', lineHeight: '1.4em', - whiteSpace: 'pre-wrap', + whiteSpace: 'pre', tabSize: 4, + '@media': { + 'screen and (min-width: 768px)': { + fontSize: '1.1em', + } + } }); export const line_numbers = style({ - margin: 0, + margin: '0', marginRight: '0.5em', - borderRight: `1px solid ${colors.background2}`, paddingRight: '0.5em', color: colors.foreground2, -}); - -export const content = style({ -}); - -export const text = style({ - margin: 0, + textAlign: 'right', }); diff --git a/src/app/[...file]/types/text.tsx b/src/app/[...file]/types/text.tsx index 34114f6..3517996 100644 --- a/src/app/[...file]/types/text.tsx +++ b/src/app/[...file]/types/text.tsx @@ -1,24 +1,46 @@ +import { useEffect, useState } from 'react'; +import { Highlight, themes } from 'prism-react-renderer'; + import * as style from './text.css'; -export default function Text({ text }: { text: string }) { +export default function Text({ language, text }: { language: string, text: string }) { + console.log(language); const lines = text.split('\n'); - return ( -
-
- {lines.map((_, index) => { - return

{index}

; - })} -
-
- {lines.map((line, index) => { - if (line != '') { - return

{line}

; - } else { - return

{'\n'}

; - } - })} -
-
- ); + const media_matcher = window.matchMedia('(prefers-color-scheme: light)'); + const [light_theme, set_light_theme] = useState(media_matcher.matches); + + function check_light_theme(event) { + if (light_theme != event.matches) { + set_light_theme(!light_theme); + } + } + + useEffect(() => { + media_matcher.addEventListener('change', check_light_theme); + return () => { + media_matcher.removeEventListener('change', check_light_theme); + }; + }); + + return
+

{lines.map((_, index) => `${index}\n`)}

+ + {({ className, style, tokens, getLineProps, getTokenProps }) => ( +
+ {tokens.map((line, i) => ( +
+ {line.map((token, key) => ( + + ))} +
+ ))} +
+ )} + +
; } diff --git a/src/app/colors.css.ts b/src/app/colors.css.ts index 243e4ca..7913d85 100644 --- a/src/app/colors.css.ts +++ b/src/app/colors.css.ts @@ -11,7 +11,7 @@ globalStyle(':root', { [background]: '#000000', [background2]: '#303030', [foreground]: '#F0F0F0', - [foreground2]: '#777777', + [foreground2]: '#888888', [accent]: '#B454EA', }, '@media': { @@ -20,7 +20,7 @@ globalStyle(':root', { [background]: '#FFFFFF', [background2]: '#DADADA', [foreground]: '#171717', - [foreground2]: '#333333', + [foreground2]: '#777777', [accent]: '#9834D4', } } diff --git a/yarn.lock b/yarn.lock index 2c90449..7538d04 100644 --- a/yarn.lock +++ b/yarn.lock @@ -516,10 +516,10 @@ "@jridgewell/resolve-uri" "^3.1.0" "@jridgewell/sourcemap-codec" "^1.4.14" -"@next/env@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/env/-/env-14.2.9.tgz#f7fed48efa51b069cfc611082ad0101756df4c6a" - integrity sha512-hnDAoDPMii31V0ivibI8p6b023jOF1XblWTVjsDUoZKwnZlaBtJFZKDwFqi22R8r9i6W08dThUWU7Bsh2Rg8Ww== +"@next/env@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/env/-/env-14.2.12.tgz#15f1d1065a420416e92f177fc8c94ee4ecc2669d" + integrity sha512-3fP29GIetdwVIfIRyLKM7KrvJaqepv+6pVodEbx0P5CaMLYBtx+7eEg8JYO5L9sveJO87z9eCReceZLi0hxO1Q== "@next/eslint-plugin-next@14.2.9": version "14.2.9" @@ -528,50 +528,50 @@ dependencies: glob "10.3.10" -"@next/swc-darwin-arm64@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.9.tgz#6d6880b580a0cb8d71be929d5399f0904d867e0a" - integrity sha512-/kfQifl3uLYi3DlwFlzCkgxe6fprJNLzzTUFknq3M5wGYicDIbdGlxUl6oHpVLJpBB/CBY3Y//gO6alz/K4NWA== +"@next/swc-darwin-arm64@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-darwin-arm64/-/swc-darwin-arm64-14.2.12.tgz#263c68fd55538624a6236552d153a3487d601a33" + integrity sha512-crHJ9UoinXeFbHYNok6VZqjKnd8rTd7K3Z2zpyzF1ch7vVNKmhjv/V7EHxep3ILoN8JB9AdRn/EtVVyG9AkCXw== -"@next/swc-darwin-x64@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.9.tgz#56af7531ed75638923cd8cba9a43b724bcfd7fea" - integrity sha512-tK/RyhCmOCiXQ9IVdFrBbZOf4/1+0RSuJkebXU2uMEsusS51TjIJO4l8ZmEijH9gZa0pJClvmApRHi7JuBqsRw== +"@next/swc-darwin-x64@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-darwin-x64/-/swc-darwin-x64-14.2.12.tgz#0fc05a99094ac531692d552743f62f7dbbcb5bc8" + integrity sha512-JbEaGbWq18BuNBO+lCtKfxl563Uw9oy2TodnN2ioX00u7V1uzrsSUcg3Ep9ce+P0Z9es+JmsvL2/rLphz+Frcw== -"@next/swc-linux-arm64-gnu@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.9.tgz#d3e9a1fdf8eabd510c1139446178bfea2737c1e5" - integrity sha512-tS5eqwsp2nO7mzywRUuFYmefNZsUKM/mTG3exK2jIHv9TEVklE1SByB1KMhFkqlit1PxS9YK1tV8BOV90Wpbrw== +"@next/swc-linux-arm64-gnu@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-gnu/-/swc-linux-arm64-gnu-14.2.12.tgz#56214b10cdb1c47d6f26ae2dd00bc9b32fd2a694" + integrity sha512-qBy7OiXOqZrdp88QEl2H4fWalMGnSCrr1agT/AVDndlyw2YJQA89f3ttR/AkEIP9EkBXXeGl6cC72/EZT5r6rw== -"@next/swc-linux-arm64-musl@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.9.tgz#82e570b25b471e9aabba70c8f62ccb7dd33e45fa" - integrity sha512-8svpeTFNAMTUMKQbEzE8qRAwl9o7mNBv7LR1bmSkQvo1oy4WrNyZbhWsldOiKrc4mZ5dfQkGYsI9T75mIFMfeA== +"@next/swc-linux-arm64-musl@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-linux-arm64-musl/-/swc-linux-arm64-musl-14.2.12.tgz#017ccb35e94dd5336f38bdab90ccc7163467e0d1" + integrity sha512-EfD9L7o9biaQxjwP1uWXnk3vYZi64NVcKUN83hpVkKocB7ogJfyH2r7o1pPnMtir6gHZiGCeHKagJ0yrNSLNHw== -"@next/swc-linux-x64-gnu@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.9.tgz#277884aecc9ef7cddc9079d2dc137ecaa537ce0c" - integrity sha512-0HNulLWpKTB7H5BhHCkEhcRAnWUHeAYCftrrGw3QC18+ZywTdAoPv/zEqKy/0adqt+ks4JDdlgSQ1lNKOKjo0A== +"@next/swc-linux-x64-gnu@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-gnu/-/swc-linux-x64-gnu-14.2.12.tgz#b5df80780eceef6b44a0cedfe7234d34a60af1f9" + integrity sha512-iQ+n2pxklJew9IpE47hE/VgjmljlHqtcD5UhZVeHICTPbLyrgPehaKf2wLRNjYH75udroBNCgrSSVSVpAbNoYw== -"@next/swc-linux-x64-musl@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.9.tgz#6fd60f804c95b9cd8abf178424b76b63806c9b53" - integrity sha512-hhVFViPHLAVUJRNtwwm609p9ozWajOmRvzOZzzKXgiVGwx/CALxlMUeh+M+e0Zj6orENhWLZeilOPHpptuENsA== +"@next/swc-linux-x64-musl@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-linux-x64-musl/-/swc-linux-x64-musl-14.2.12.tgz#553ad8dd26e8fce343f2b01d741dffc8bb909e37" + integrity sha512-rFkUkNwcQ0ODn7cxvcVdpHlcOpYxMeyMfkJuzaT74xjAa5v4fxP4xDk5OoYmPi8QNLDs3UgZPMSBmpBuv9zKWA== -"@next/swc-win32-arm64-msvc@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.9.tgz#f7d99c80d118e29a5910f8925ff11eb29fd775b3" - integrity sha512-p/v6XlOdrk06xfN9z4evLNBqftVQUWiyduQczCwSj7hNh8fWTbzdVxsEiNOcajMXJbQiaX/ZzZdFgKVmmJnnGQ== +"@next/swc-win32-arm64-msvc@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-win32-arm64-msvc/-/swc-win32-arm64-msvc-14.2.12.tgz#cf9c3907f43b9a0cbe2f10a46f6c9f5de05ba9dc" + integrity sha512-PQFYUvwtHs/u0K85SG4sAdDXYIPXpETf9mcEjWc0R4JmjgMKSDwIU/qfZdavtP6MPNiMjuKGXHCtyhR/M5zo8g== -"@next/swc-win32-ia32-msvc@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.9.tgz#e233fd707d827786a676df4b858345e8812cbae3" - integrity sha512-IcW9dynWDjMK/0M05E3zopbRen7v0/yEaMZbHFOSS1J/w+8YG3jKywOGZWNp/eCUVtUUXs0PW+7Lpz8uLu+KQA== +"@next/swc-win32-ia32-msvc@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-win32-ia32-msvc/-/swc-win32-ia32-msvc-14.2.12.tgz#cad79313b383e95e6d53bdb631b47a26e63146e0" + integrity sha512-FAj2hMlcbeCV546eU2tEv41dcJb4NeqFlSXU/xL/0ehXywHnNpaYajOUvn3P8wru5WyQe6cTZ8fvckj/2XN4Vw== -"@next/swc-win32-x64-msvc@14.2.9": - version "14.2.9" - resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.9.tgz#c71cc74a6247ddcb4ec1b0e73f52e084c71efe9b" - integrity sha512-gcbpoXyWZdVOBgNa5BRzynrL5UR1nb2ZT38yKgnphYU9UHjeecnylMHntrQiMg/QtONDcJPFC/PmsS47xIRYoA== +"@next/swc-win32-x64-msvc@14.2.12": + version "14.2.12" + resolved "https://registry.yarnpkg.com/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-14.2.12.tgz#9d5b2f2733221ae85c3e5c6d4b6f8f1da32d5cae" + integrity sha512-yu8QvV53sBzoIVRHsxCHqeuS8jYq6Lrmdh0briivuh+Brsp6xjg80MAozUsBTAV9KNmY08KlX0KYTWz1lbPzEg== "@nodelib/fs.scandir@2.1.5": version "2.1.5" @@ -736,6 +736,11 @@ dependencies: undici-types "~6.19.2" +"@types/prismjs@^1.26.0": + version "1.26.4" + resolved "https://registry.yarnpkg.com/@types/prismjs/-/prismjs-1.26.4.tgz#1a9e1074619ce1d7322669e5b46fbe823925103a" + integrity sha512-rlAnzkW2sZOjbqZ743IHUhFcvzaGbqijwOu8QZnZCjfQzBqFE3s4lOTJEsxikImav9uzz/42I+O7YUs1mWgMlg== + "@types/prop-types@*": version "15.7.12" resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.12.tgz#12bb1e2be27293c1406acb6af1c3f3a1481d98c6" @@ -1191,6 +1196,11 @@ client-only@0.0.1: resolved "https://registry.yarnpkg.com/client-only/-/client-only-0.0.1.tgz#38bba5d403c41ab150bff64a95c85013cf73bca1" integrity sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA== +clsx@^2.0.0: + version "2.1.1" + resolved "https://registry.yarnpkg.com/clsx/-/clsx-2.1.1.tgz#eed397c9fd8bd882bfb18deab7102049a2f32999" + integrity sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA== + color-convert@^1.9.0: version "1.9.3" resolved "https://registry.yarnpkg.com/color-convert/-/color-convert-1.9.3.tgz#bb71850690e1f136567de629d2d5471deda4c1e8" @@ -2585,12 +2595,12 @@ natural-compare@^1.4.0: resolved "https://registry.yarnpkg.com/natural-compare/-/natural-compare-1.4.0.tgz#4abebfeed7541f2c27acfb29bdbbd15c8d5ba4f7" integrity sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw== -next@14.2.9: - version "14.2.9" - resolved "https://registry.yarnpkg.com/next/-/next-14.2.9.tgz#51d0e067cd9eb8a51fd5c0efd5d8f28181849729" - integrity sha512-3CzBNo6BuJnRjcQvRw+irnU1WiuJNZEp+dkzkt91y4jeIDN/Emg95F+takSYiLpJ/HkxClVQRyqiTwYce5IVqw== +next@^14.2.12: + version "14.2.12" + resolved "https://registry.yarnpkg.com/next/-/next-14.2.12.tgz#39d52c090c40980f4ae56f485ad234b777ebc955" + integrity sha512-cDOtUSIeoOvt1skKNihdExWMTybx3exnvbFbb9ecZDIxlvIbREQzt9A5Km3Zn3PfU+IFjyYGsHS+lN9VInAGKA== dependencies: - "@next/env" "14.2.9" + "@next/env" "14.2.12" "@swc/helpers" "0.5.5" busboy "1.6.0" caniuse-lite "^1.0.30001579" @@ -2598,15 +2608,15 @@ next@14.2.9: postcss "8.4.31" styled-jsx "5.1.1" optionalDependencies: - "@next/swc-darwin-arm64" "14.2.9" - "@next/swc-darwin-x64" "14.2.9" - "@next/swc-linux-arm64-gnu" "14.2.9" - "@next/swc-linux-arm64-musl" "14.2.9" - "@next/swc-linux-x64-gnu" "14.2.9" - "@next/swc-linux-x64-musl" "14.2.9" - "@next/swc-win32-arm64-msvc" "14.2.9" - "@next/swc-win32-ia32-msvc" "14.2.9" - "@next/swc-win32-x64-msvc" "14.2.9" + "@next/swc-darwin-arm64" "14.2.12" + "@next/swc-darwin-x64" "14.2.12" + "@next/swc-linux-arm64-gnu" "14.2.12" + "@next/swc-linux-arm64-musl" "14.2.12" + "@next/swc-linux-x64-gnu" "14.2.12" + "@next/swc-linux-x64-musl" "14.2.12" + "@next/swc-win32-arm64-msvc" "14.2.12" + "@next/swc-win32-ia32-msvc" "14.2.12" + "@next/swc-win32-x64-msvc" "14.2.12" node-releases@^2.0.18: version "2.0.18" @@ -2808,6 +2818,14 @@ prelude-ls@^1.2.1: resolved "https://registry.yarnpkg.com/prelude-ls/-/prelude-ls-1.2.1.tgz#debc6489d7a6e6b0e7611888cec880337d316396" integrity sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g== +prism-react-renderer@^2.4.0: + version "2.4.0" + resolved "https://registry.yarnpkg.com/prism-react-renderer/-/prism-react-renderer-2.4.0.tgz#c5ea692029c2f8b3fd04f63662d04ffd4eaf10a0" + integrity sha512-327BsVCD/unU4CNLZTWVHyUHKnsqcvj2qbPlQ8MiBE2eq2rgctjigPA1Gp9HLF83kZ20zNN6jgizHJeEsyFYOw== + dependencies: + "@types/prismjs" "^1.26.0" + clsx "^2.0.0" + prop-types@^15.8.1: version "15.8.1" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.8.1.tgz#67d87bf1a694f48435cf332c24af10214a3140b5"