\n Hand-Drawn Font and Card Showcase\n

\n\n

\n This page is made of card elements that are made to look hand-made as well as two fonts made from my handwriting.\n

\n\n

\n {fonts.map((font, index) => (\n

\n {font.name} Showcase\n

\n Regular text (1rem)\n

\n Larger text (1.5rem)\n

\n Even larger (2rem)\n

\n Attempted bold (1rem)\n

\n Attempted italic (1rem)\n

\n {index === 1 && (\n

\n The quick brown fox jumps over the lazy dog. 1234567890!@#$%^&*()\n

\n )}\n

\n ))}\n

\n\n

\n {cardConfigs.map((config, index) => {\n const CardComponent = config.type === \"Ballpoint\" ? BallpointPenCard : MarkerPenCard;\n const font = fonts[index % 2].name;\n return (\n \n

\n {config.type} Card\n

\n {config.type === \"Ballpoint\" ? \"Fine lines with subtle variations\" : \"Varying thickness with smooth transitions\"}\n

\n Size: {config.width}x{config.height}\n

\n {config.type === \"Ballpoint\" \n ? `Stroke: ${config.strokeWidth}, Waviness: ${config.waviness}`\n : `Thickness: ${config.minThickness}-${config.maxThickness}, Waves: ${config.waves}`\n }\n

\n \n );\n })}\n

\n\n

\n Created with\n \n BallpointPenCard\n \n and\n \n MarkerPenCard\n \n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nexport default async function server(request) {\n return new Response(\n `\n \n \n \n \n Hand-Drawn Font and Card Showcase\n \n \n \n

\n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}",[],[171],"files",[149,169],"counts",{"_182":31,"_183":157,"_184":31,"_185":31},"pulls","branches","forks","envVars","contents",[188,191],{"_105":150,"_98":151,"_152":153,"_154":-5,"_155":138,"_156":157,"_158":111,"_107":189,"_102":31,"_160":161,"_162":163,"_164":27,"_165":-5,"_101":190},["D",1743389816953],[151],{"_105":170,"_98":171,"_152":118,"_154":-5,"_155":138,"_156":137,"_158":111,"_107":192,"_102":173,"_160":174,"_162":175,"_164":27,"_165":-5,"_101":193},["D",1743391932427],[171],"upstreamProject",{"_105":196,"_98":197,"_114":-5,"_115":-5,"_112":113,"_21":198},"94d8d91c-2783-11f0-b46e-569c3dd06744","handDrawnCardShowcase",{"_96":97,"_133":134},"upstreamBranch",{"_105":141,"_107":201,"_202":203,"_98":42,"_139":196,"_102":204,"_140":-5,"_142":-5,"_205":206,"_109":-5,"_131":27,"_112":113,"_146":97,"_145":197},["D",1746210653990],"updatedAt",["D",1743259195507],6,"lockfileKey","1746366039831-esm.town_v_dcm31_handDrawnCardShowcase@6-main","emptyEnvVars","isNew","routes/_app.x.$handle.$name.compare.$branch",{"_96":97,"_98":99,"_100":42,"_103":211,"_215":-5,"_216":-5,"_217":218,"_235":111,"_236":214,"_237":238,"_241":-5},{"_105":106,"_98":99,"_107":212,"_109":-5,"_110":111,"_112":113,"_114":-5,"_115":-5,"_12":116,"_117":118,"_119":111,"_120":-5,"_121":31,"_122":123,"_124":123,"_125":126,"_127":126,"_128":126,"_129":123,"_130":123,"_131":27,"_21":213,"_135":214},["D",1746210696596],{"_96":97,"_133":134},{"_102":137,"_98":42,"_105":138,"_139":106,"_140":141,"_142":31,"_143":113,"_144":116,"_145":99,"_146":97},"ahead","behind","diff",{"_219":220,"_164":232,"_233":234},"added",[221,228],{"_101":151,"_222":-7,"_223":224},"targetFile","sourceFile",{"_105":150,"_98":151,"_152":153,"_154":-5,"_155":138,"_156":157,"_158":111,"_107":159,"_102":31,"_160":161,"_162":163,"_164":27,"_165":-5,"_166":-7,"_101":225,"_226":227},[151],"contentHash","8434fd87fcb045c9c0e58fd58848109fc18a4600d962fb614a24bfd0e454691f",{"_101":171,"_222":-7,"_223":229},{"_105":170,"_98":171,"_152":118,"_154":-5,"_155":138,"_156":137,"_158":111,"_107":172,"_102":173,"_160":174,"_162":175,"_164":27,"_165":-5,"_166":-7,"_101":230,"_226":231},[171],"d75580ffd3123dc8a42cbd6ef91aff7f6796dca11660048417559bc272418e5d",[],"modified",[],"hasChanges","sourceBranch","targetBranch",{"_105":141,"_107":239,"_202":240,"_98":42,"_139":196,"_102":204,"_140":-5,"_142":-5,"_205":206,"_109":-5,"_131":27,"_112":113,"_146":97,"_145":197},["D",1746210653990],["D",1743259195507],"pull","routes/_app","actionData","errors"]

MergesuperCopperBison/mainintohandDrawnCardShowcase/main

README.md+52-0

Hmain.tsx+212-0