Lucky Name

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_174":175,"_176":177},"routes/_app.x.$handle.$name",{"_94":93,"_31":42,"_102":84,"_26":103,"_13":14,"_104":-5,"_11":105,"_106":107,"_108":109,"_110":111,"_112":113,"_20":-5,"_114":-5,"_115":-5,"_116":24,"_117":118,"_119":56,"_120":-5,"_121":-5,"_122":123},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_40":41,"_31":42,"_35":43,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":54,"_55":56,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":77,"_78":79,"_80":81,"_82":24},"version",3,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":24,"_26":27,"_28":27},"file",{"_29":30,"_31":27,"_32":20,"_33":34,"_35":36,"_37":14,"_38":39,"_23":24},"previous","deleted",false,"deletedHere","path","styles.css","latestPath","fileId","ee23a7ac-80e4-11f1-a023-1607ee4eb77e","name","fileType","content",":root {\n --canvas: #f4f6f8;\n --surface: #ffffff;\n --ink: #16191d;\n --muted: #7a838d;\n --line: #d6dce2;\n --line-strong: #aab3bd;\n --accent: #007aff;\n --type-size: 15px;\n --row-height: 64px;\n}\n\n* {\n box-sizing: border-box;\n font-size: var(--type-size);\n}\n\nhtml { min-height: 100%; background: var(--canvas); }\n\nbody {\n min-height: 100vh;\n margin: 0;\n color: var(--ink);\n font-family: -apple-system, BlinkMacSystemFont, \"Helvetica Neue\", Arial, sans-serif;\n background: var(--canvas);\n}\n\n.stage {\n width: min(100% - 40px, 840px);\n margin: 0 auto;\n padding: 64px 0;\n}\n\n.machine {\n overflow: hidden;\n border: 1px solid var(--line-strong);\n border-radius: 28px;\n corner-shape: squircle;\n background: var(--surface);\n}\n\n.machine-top {\n min-height: 64px;\n display: grid;\n grid-template-columns: 1fr auto 1fr auto;\n align-items: center;\n gap: 24px;\n padding: 0 24px;\n color: var(--muted);\n letter-spacing: .16em;\n}\n\n.machine-top > span { height: 1px; background: var(--line); }\n.machine-top i { font-style: normal; }\n\n.name-menu-button {\n min-width: 72px;\n min-height: 34px;\n padding: 0 12px;\n border: 1px solid var(--line-strong);\n border-radius: 12px;\n corner-shape: squircle;\n color: var(--ink);\n background: var(--surface);\n font-family: inherit;\n letter-spacing: .04em;\n cursor: pointer;\n}\n\n.name-menu-button:hover,\n.name-menu-button[aria-expanded=\"true\"] {\n border-color: var(--accent);\n color: var(--accent);\n}\n\n.reels-wrap {\n position: relative;\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n height: 322px;\n overflow: hidden;\n border-top: 1px solid var(--line-strong);\n border-bottom: 1px solid var(--line-strong);\n background: var(--surface);\n perspective: 900px;\n}\n\n.reel-shell {\n position: relative;\n z-index: 2;\n min-width: 0;\n overflow: hidden;\n border-right: 1px solid var(--line);\n perspective: 720px;\n perspective-origin: 50% 50%;\n transform-origin: center;\n transition: transform .9s cubic-bezier(.22, .8, .2, 1);\n}\n\n.reel-shell:last-of-type { border-right: 0; }\n.reel-shell--left { transform: perspective(700px) rotateY(3deg); }\n.reel-shell--right { transform: perspective(700px) rotateY(-3deg); }\n.machine.is-settled .reel-shell { transform: rotateY(0); }\n.machine.is-settled .reel-shell--left { animation: settle-left .72s cubic-bezier(.2, .75, .25, 1) both; }\n.machine.is-settled .reel-shell--middle { animation: settle-middle .72s cubic-bezier(.2, .75, .25, 1) both; }\n.machine.is-settled .reel-shell--right { animation: settle-right .72s cubic-bezier(.2, .75, .25, 1) both; }\n\n@keyframes settle-left {\n 0% { transform: perspective(700px) rotateY(3deg); }\n 72% { transform: perspective(700px) rotateY(-.35deg); }\n 100% { transform: perspective(700px) rotateY(0); }\n}\n\n@keyframes settle-middle {\n 0%, 100% { transform: rotateY(0); }\n}\n\n@keyframes settle-right {\n 0% { transform: perspective(700px) rotateY(-3deg); }\n 72% { transform: perspective(700px) rotateY(.35deg); }\n 100% { transform: perspective(700px) rotateY(0); }\n}\n\n.reel {\n position: absolute;\n top: 50%;\n left: 0;\n width: 100%;\n height: var(--row-height);\n margin-top: calc(var(--row-height) / -2);\n transform-style: preserve-3d;\n pointer-events: none;\n will-change: transform;\n}\n.reel.is-animating { transition: transform var(--spin-duration) cubic-bezier(.12, .72, .12, 1); }\n\n.reel-item {\n position: absolute;\n inset: 0;\n height: var(--row-height);\n display: grid;\n place-items: center;\n padding: 0 12px;\n color: var(--ink);\n font-weight: 500;\n letter-spacing: .01em;\n white-space: nowrap;\n backface-visibility: hidden;\n transform-origin: 50% 50%;\n -webkit-font-smoothing: antialiased;\n}\n\n.reel-item[aria-selected=\"true\"] { font-weight: 600; }\n\n.selection-band {\n z-index: 3;\n position: absolute;\n left: 0;\n right: 0;\n top: 50%;\n height: var(--row-height);\n transform: translateY(-50%);\n pointer-events: none;\n border-top: 1px solid var(--accent);\n border-bottom: 1px solid var(--accent);\n}\n\n.reel-shine { display: none; }\n\n.spin-button {\n width: calc(100% - 48px);\n min-height: 56px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin: 24px;\n padding: 0 20px;\n border: 1px solid var(--accent);\n border-radius: 18px;\n corner-shape: squircle;\n color: var(--accent);\n background: var(--surface);\n font-family: inherit;\n font-weight: 500;\n letter-spacing: .12em;\n cursor: pointer;\n transition: color .15s, background-color .15s;\n}\n\n.spin-button:hover {\n color: var(--surface);\n background: var(--accent);\n}\n\n.spin-button:active { opacity: .65; }\n.spin-button:focus-visible { outline: 1px solid var(--accent); outline-offset: 3px; }\n.spin-button:disabled { cursor: wait; opacity: .45; }\n.spin-icon { color: currentColor; }\n\n.sheet-backdrop {\n z-index: 20;\n position: fixed;\n inset: 0;\n display: grid;\n place-items: center;\n padding: 24px;\n background: rgba(34, 42, 50, .18);\n}\n\n.sheet-backdrop[hidden] { display: none; }\n\n.name-sheet {\n width: min(100%, 520px);\n max-height: min(720px, calc(100vh - 48px));\n display: grid;\n grid-template-rows: auto minmax(0, 1fr) auto;\n overflow: hidden;\n border: 1px solid var(--line-strong);\n border-radius: 28px;\n corner-shape: squircle;\n background: var(--surface);\n}\n\n.name-sheet-header {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 24px;\n min-height: 80px;\n padding: 16px 20px;\n border-bottom: 1px solid var(--line);\n}\n\n.name-sheet-header > div { display: grid; gap: 6px; }\n.name-sheet-header strong { font-weight: 600; }\n.name-sheet-header span { color: var(--muted); }\n\n.sheet-close {\n width: 40px;\n height: 40px;\n border: 1px solid var(--line);\n border-radius: 14px;\n corner-shape: squircle;\n color: var(--ink);\n background: var(--surface);\n font-family: inherit;\n cursor: pointer;\n}\n\n.name-options {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 1px;\n overflow-y: auto;\n background: var(--line);\n}\n\n.name-option {\n min-height: 54px;\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 12px;\n padding: 0 18px;\n background: var(--surface);\n cursor: pointer;\n}\n\n.name-option:hover { color: var(--accent); }\n.name-option input { width: 18px; height: 18px; margin: 0; accent-color: var(--accent); }\n\n.sheet-done {\n min-height: 54px;\n margin: 16px;\n border: 1px solid var(--accent);\n border-radius: 16px;\n corner-shape: squircle;\n color: var(--surface);\n background: var(--accent);\n font-family: inherit;\n font-weight: 500;\n letter-spacing: .12em;\n cursor: pointer;\n}\n\n.sheet-close:focus-visible,\n.sheet-done:focus-visible,\n.name-menu-button:focus-visible {\n outline: 1px solid var(--accent);\n outline-offset: 3px;\n}\n\n@media (max-width: 600px) {\n .stage { width: min(100% - 24px, 840px); padding: 32px 0; }\n .machine-top { grid-template-columns: auto 1fr auto; gap: 12px; padding: 0 16px; }\n .machine-top > span:first-child { display: none; }\n .machine-top i { order: 1; }\n .machine-top > span { order: 2; }\n .name-menu-button { order: 3; }\n .reels-wrap { height: 286px; }\n .reel-item { overflow: hidden; text-overflow: ellipsis; }\n .spin-button { width: calc(100% - 32px); margin: 16px; }\n .sheet-backdrop { align-items: end; padding: 12px; }\n .name-sheet { max-height: calc(100vh - 24px); }\n .name-options { grid-template-columns: 1fr; }\n}\n\n@media (prefers-reduced-motion: reduce) {\n *, *::before, *::after {\n animation-duration: .01ms !important;\n transition-duration: .01ms !important;\n }\n}\n","createdAt",["D",1784185616131],"branchVersion","branchId","de7e0b58-f499-4280-9010-e7a3dff0fb9c","id","793b4a35-959e-45bd-b311-d9e0083c0097","lucky-name-picker",["D",1784185596280],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","A three-reel randomized name picker","imageUrl","35a0979d-a611-46c4-902a-11dbcdb2f551","pinnedFileId","e258e8a6-80e4-11f1-8e91-1607ee4eb77e","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","c301b66c-8ae3-41fc-9a3d-f49ec90d432a","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_94":93,"_101":97},"org",{"_94":93,"_95":-5,"_96":97,"_18":52,"_98":99,"_100":24},"branch",{"_13":83,"_31":84,"_40":39,"_85":41,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":42,"_92":93},"isOwned",4,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","brumm","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yWkQzRHNka3NaY2dKQ1FjcDJxWmJvUFRNNngifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_40":41,"_31":42,"_35":170,"_44":-5,"_45":24,"_46":47,"_48":47,"_49":50,"_51":-5,"_18":52,"_53":54,"_55":56,"_57":-5,"_58":-5,"_59":60,"_61":62,"_63":-5,"_64":-5,"_65":-5,"_66":-5,"_67":68,"_69":68,"_70":71,"_72":71,"_73":71,"_74":68,"_75":68,"_76":171,"_78":172,"_80":173,"_82":24},"tree",[157,158,159],"files",[157,158,159],"counts",{"_147":60,"_148":135,"_149":60,"_150":151,"_152":153},"contents",[124,125,126],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_40":140,"_31":141,"_29":142,"_128":-5,"_38":39,"_37":143,"_129":56,"_35":144,"_13":60,"_32":20,"_33":145,"_23":24,"_131":-5,"_26":146},{"_40":133,"_31":134,"_29":54,"_128":-5,"_38":39,"_37":135,"_129":56,"_35":136,"_13":60,"_32":137,"_33":138,"_23":24,"_131":-5,"_26":139},{"_40":127,"_31":27,"_29":30,"_128":-5,"_38":39,"_37":14,"_129":56,"_35":130,"_13":60,"_32":20,"_33":34,"_23":24,"_131":-5,"_26":132},"45cd3cb0-34bd-4439-b415-424c7ece189f","parentId","latest",["D",1784185616131],"label",[27],"12e35462-b987-4e93-8085-a4172ded6298","main.ts",1,["D",1784185596337],"http","import { staticHTTPServer } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport default staticHTTPServer();\n",[134],"34701433-4003-4965-b19e-e504ebc92d4a","index.html","ec362168-80e4-11f1-9fd2-1607ee4eb77e",2,["D",1784185612892],"\n\n \n \n \n \n Lucky Name\n \n \n \n

\n LUCKY NAME\n \n

\n\n

\n\n \n\n \n\n

\n \n \n\n",[141],"pulls","branches","forks","envVars",{"_154":60,"_156":60},"connections",{"_154":60,"_155":60},"count","unfilledCount","emptyCount",{"_40":140,"_31":141,"_29":142,"_128":-5,"_38":39,"_37":143,"_129":56,"_35":167,"_13":60,"_32":20,"_33":145,"_23":24,"_131":-5,"_161":168,"_26":169},{"_40":133,"_31":134,"_29":54,"_128":-5,"_38":39,"_37":135,"_129":56,"_35":164,"_13":60,"_32":137,"_33":138,"_23":24,"_131":-5,"_161":165,"_26":166},{"_40":127,"_31":27,"_29":30,"_128":-5,"_38":39,"_37":14,"_129":56,"_35":160,"_13":60,"_32":20,"_33":34,"_23":24,"_131":-5,"_161":162,"_26":163},["D",1784185616131],"children",[],[27],["D",1784185596337],[],[134],["D",1784185612892],[],[141],["D",1784185596280],{"_94":93,"_101":97},{"_94":93,"_95":-5,"_96":97,"_18":52,"_98":99,"_100":24},{"_13":83,"_31":84,"_40":39,"_85":41,"_86":-5,"_87":-5,"_88":-5,"_89":-5,"_90":-5,"_91":42,"_92":93},"ctx",{"_76":-5,"_121":207,"_208":209,"_210":211,"_212":24,"_213":24,"_214":24,"_215":56,"_216":-5,"_217":-7,"_218":-7,"_219":60,"_220":24,"_221":24,"_222":-5,"_223":24,"_224":24,"_225":24,"_226":-5},"ENV",{"_178":179,"_180":181,"_182":84,"_183":184,"_185":186,"_187":188,"_189":190,"_191":192,"_193":194,"_195":196,"_197":198,"_199":200,"_201":202,"_203":204,"_205":206},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","fdb67791413f4386b4dbf18f354029a617f6160f","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v3