From 2191a98b4f0b637d910b25039f56f70d63291055 Mon Sep 17 00:00:00 2001 From: Thomas Hallock Date: Mon, 15 Sep 2025 11:59:55 -0500 Subject: [PATCH] chore: regenerate Panda CSS styles and update lockfile MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Update generated CSS styles for memory quiz results grid component and update pnpm lockfile with new typst dependencies. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- .../src__app__games__memory-quiz__page.css | 220 ++++++++++-------- .../chunks/src__app__games__page.css | 1 + .../chunks/src__app__guide__page.css | 2 + .../styled-system/chunks/src__app__page.css | 1 + apps/web/styled-system/styles.css | 122 +++++++--- pnpm-lock.yaml | 27 ++- 6 files changed, 237 insertions(+), 136 deletions(-) diff --git a/apps/web/styled-system/chunks/src__app__games__memory-quiz__page.css b/apps/web/styled-system/chunks/src__app__games__memory-quiz__page.css index 5e4742ab..cd51edbf 100644 --- a/apps/web/styled-system/chunks/src__app__games__memory-quiz__page.css +++ b/apps/web/styled-system/chunks/src__app__games__memory-quiz__page.css @@ -1,17 +1,5 @@ @layer utilities { - .h_800pt { - height: 800pt - } - - .w_200pt { - width: 200pt - } - - .h_250pt { - height: 250pt - } - .max-w_600px { max-width: 600px } @@ -104,10 +92,6 @@ justify-content: flex-end } - .bg_red\.500 { - background: var(--colors-red-500) - } - .rounded_6px { border-radius: 6px } @@ -183,18 +167,18 @@ overflow-y: auto } - .d_grid { - display: grid + .text_gray\.700 { + color: var(--colors-gray-700) + } + + .mb_16px { + margin-bottom: 16px } .w_fit-content { width: fit-content } - .perspective_1000px { - perspective: 1000px - } - .max-w_200px { max-width: 200px } @@ -203,6 +187,26 @@ transform: rotateY(0deg) } + .border_3px_solid_\#28a745 { + border: 3px solid #28a745 + } + + .d_grid { + display: grid + } + + .p_8px { + padding: 8px + } + + .perspective_1000px { + perspective: 1000px + } + + .aspect_3\/4 { + aspect-ratio: 3/4 + } + .transition_transform_0\.8s { transition: transform 0.8s } @@ -227,6 +231,14 @@ opacity: 0.8 } + .border_green\.500 { + border-color: var(--colors-green-500) + } + + .border_red\.500 { + border-color: var(--colors-red-500) + } + .backface_hidden { backface-visibility: hidden; -webkit-backface-visibility: hidden @@ -236,8 +248,8 @@ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) } - .border_3px_solid_\#28a745 { - border: 3px solid #28a745 + .border_3px_solid { + border: 3px solid } .transform_rotateY\(180deg\) { @@ -248,6 +260,54 @@ width: 100% } + .bg_red\.500 { + background: var(--colors-red-500) + } + + .top_8px { + top: 8px + } + + .right_8px { + right: 8px + } + + .w_32px { + width: 32px + } + + .h_32px { + height: 32px + } + + .shadow_0_2px_4px_rgba\(0\,_0\,_0\,_0\.2\) { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) + } + + .bottom_8px { + bottom: 8px + } + + .left_8px { + left: 8px + } + + .p_4px_8px { + padding: 4px 8px + } + + .rounded_4px { + border-radius: 4px + } + + .bg_rgba\(0\,_0\,_0\,_0\.7\) { + background: rgba(0, 0, 0, 0.7) + } + + .fs_12px { + font-size: 12px + } + .mt_12px { margin-top: 12px } @@ -562,6 +622,10 @@ gap: 10px } + .justify_space-between { + justify-content: space-between + } + .gap_20px { gap: 20px } @@ -570,54 +634,14 @@ font-size: 18px } - .mt_16px { - margin-top: 16px - } - - .mb_16px { - margin-bottom: 16px - } - - .text_gray\.700 { - color: var(--colors-gray-700) - } - - .bg_green\.50 { - background: var(--colors-green-50) - } - - .bg_red\.50 { - background: var(--colors-red-50) - } - - .border_green\.200 { - border-color: var(--colors-green-200) - } - - .border_red\.200 { - border-color: var(--colors-red-200) - } - - .m_8px_0 { - margin: 8px 0 - } - - .p_8px { - padding: 8px - } - - .rounded_4px { - border-radius: 4px - } - - .justify_space-between { - justify-content: space-between - } - .font_500 { font-weight: 500 } + .mt_16px { + margin-top: 16px + } + .justify_center { justify-content: center } @@ -849,6 +873,20 @@ min-width: 90px } } + @media (min-width: 1024px) { + + .\[\@media_\(min-width\:_1024px\)\]\:aspect_3\/4 { + aspect-ratio: 3/4 + } + + .\[\@media_\(min-width\:_1024px\)\]\:h_120px { + height: 120px + } + + .\[\@media_\(min-width\:_1024px\)\]\:min-w_90px { + min-width: 90px + } + } @media screen and (min-width: 48em) { .md\:px_4 { @@ -856,6 +894,20 @@ } } + @media (min-width: 1024px) { + .\[\@media_\(min-width\:_1024px\)\]\:aspect_3\/4 { + aspect-ratio: 3/4 + } + + .\[\@media_\(min-width\:_1024px\)\]\:h_120px { + height: 120px + } + + .\[\@media_\(min-width\:_1024px\)\]\:min-w_90px { + min-width: 90px + } + } + @media (max-width: 768px) { .\[\@media_\(max-width\:_768px\)\]\:gap_10px { gap: 10px @@ -867,22 +919,6 @@ .\[\@media_\(max-width\:_768px\)\]\:min-w_100px { min-width: 100px } - .\[\@media_\(max-width\:_768px\)\]\:fs_40px { - font-size: 40px - } - - .\[\@media_\(max-width\:_768px\)\]\:gap_10px { - gap: 10px - } - - .\[\@media_\(max-width\:_768px\)\]\:h_130px { - height: 130px - } - - .\[\@media_\(max-width\:_768px\)\]\:min-w_100px { - min-width: 100px - } - .\[\@media_\(max-width\:_768px\)\]\:fs_40px { font-size: 40px } @@ -899,22 +935,6 @@ .\[\@media_\(max-width\:_480px\)\]\:min-w_90px { min-width: 90px } - .\[\@media_\(max-width\:_480px\)\]\:fs_32px { - font-size: 32px - } - - .\[\@media_\(max-width\:_480px\)\]\:gap_8px { - gap: 8px - } - - .\[\@media_\(max-width\:_480px\)\]\:h_120px { - height: 120px - } - - .\[\@media_\(max-width\:_480px\)\]\:min-w_90px { - min-width: 90px - } - .\[\@media_\(max-width\:_480px\)\]\:fs_32px { font-size: 32px } diff --git a/apps/web/styled-system/chunks/src__app__games__page.css b/apps/web/styled-system/chunks/src__app__games__page.css index 11192e87..0b169c76 100644 --- a/apps/web/styled-system/chunks/src__app__games__page.css +++ b/apps/web/styled-system/chunks/src__app__games__page.css @@ -362,6 +362,7 @@ .md\:grid-cols_repeat\(2\,_minmax\(0\,_1fr\)\) { grid-template-columns: repeat(2, minmax(0, 1fr)) } + .md\:px_6 { padding-inline: var(--spacing-6) } diff --git a/apps/web/styled-system/chunks/src__app__guide__page.css b/apps/web/styled-system/chunks/src__app__guide__page.css index b0e15808..47f847fb 100644 --- a/apps/web/styled-system/chunks/src__app__guide__page.css +++ b/apps/web/styled-system/chunks/src__app__guide__page.css @@ -627,6 +627,7 @@ .md\:grid-cols_repeat\(2\,_minmax\(0\,_1fr\)\) { grid-template-columns: repeat(2, minmax(0, 1fr)) } + .md\:p_8 { padding: var(--spacing-8) } @@ -634,6 +635,7 @@ .md\:fs_3xl { font-size: var(--font-sizes-3xl) } + .md\:grid-cols_repeat\(3\,_minmax\(0\,_1fr\)\) { grid-template-columns: repeat(3, minmax(0, 1fr)) } diff --git a/apps/web/styled-system/chunks/src__app__page.css b/apps/web/styled-system/chunks/src__app__page.css index 0c677da9..62efb578 100644 --- a/apps/web/styled-system/chunks/src__app__page.css +++ b/apps/web/styled-system/chunks/src__app__page.css @@ -230,6 +230,7 @@ .md\:grid-cols_3 { grid-template-columns: repeat(3, minmax(0, 1fr)) } + .md\:fs_6xl { font-size: var(--font-sizes-6xl) } diff --git a/apps/web/styled-system/styles.css b/apps/web/styled-system/styles.css index 04c73ea9..5fc43cc3 100644 --- a/apps/web/styled-system/styles.css +++ b/apps/web/styled-system/styles.css @@ -13,10 +13,6 @@ align-self: start } - .h_800pt { - height: 800pt - } - .max-w_600px { max-width: 600px } @@ -93,10 +89,6 @@ justify-content: flex-end } - .bg_red\.500 { - background: var(--colors-red-500) - } - .rounded_6px { border-radius: 6px } @@ -157,12 +149,12 @@ max-height: 60vh } - .w_fit-content { - width: fit-content + .mb_16px { + margin-bottom: 16px } - .perspective_1000px { - perspective: 1000px + .w_fit-content { + width: fit-content } .max-w_200px { @@ -173,6 +165,18 @@ transform: rotateY(0deg) } + .border_3px_solid_\#28a745 { + border: 3px solid #28a745 + } + + .p_8px { + padding: 8px + } + + .perspective_1000px { + perspective: 1000px + } + .transition_transform_0\.8s { transition: transform 0.8s } @@ -197,6 +201,10 @@ opacity: 0.8 } + .border_red\.500 { + border-color: var(--colors-red-500) + } + .backface_hidden { backface-visibility: hidden; -webkit-backface-visibility: hidden @@ -206,14 +214,62 @@ box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) } - .border_3px_solid_\#28a745 { - border: 3px solid #28a745 + .border_3px_solid { + border: 3px solid } .transform_rotateY\(180deg\) { transform: rotateY(180deg) } + .bg_red\.500 { + background: var(--colors-red-500) + } + + .top_8px { + top: 8px + } + + .right_8px { + right: 8px + } + + .w_32px { + width: 32px + } + + .h_32px { + height: 32px + } + + .shadow_0_2px_4px_rgba\(0\,_0\,_0\,_0\.2\) { + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) + } + + .bottom_8px { + bottom: 8px + } + + .left_8px { + left: 8px + } + + .p_4px_8px { + padding: 4px 8px + } + + .rounded_4px { + border-radius: 4px + } + + .bg_rgba\(0\,_0\,_0\,_0\.7\) { + background: rgba(0, 0, 0, 0.7) + } + + .fs_12px { + font-size: 12px + } + .mt_12px { margin-top: 12px } @@ -491,30 +547,14 @@ font-size: 18px } - .mt_16px { - margin-top: 16px - } - - .mb_16px { - margin-bottom: 16px - } - - .m_8px_0 { - margin: 8px 0 - } - - .p_8px { - padding: 8px - } - - .rounded_4px { - border-radius: 4px - } - .font_500 { font-weight: 500 } + .mt_16px { + margin-top: 16px + } + .gap_15px { gap: 15px } @@ -2118,6 +2158,20 @@ } } + @media (min-width: 1024px) { + .\[\@media_\(min-width\:_1024px\)\]\:aspect_3\/4 { + aspect-ratio: 3/4 + } + + .\[\@media_\(min-width\:_1024px\)\]\:h_120px { + height: 120px + } + + .\[\@media_\(min-width\:_1024px\)\]\:min-w_90px { + min-width: 90px + } + } + @media screen and (min-width: 64em) { .lg\:grid-cols_repeat\(5\,_minmax\(0\,_1fr\)\) { grid-template-columns: repeat(5, minmax(0, 1fr)) diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 08871d00..a97e4b98 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -25,9 +25,18 @@ importers: apps/web: dependencies: - '@myriaddreamin/typst.ts': + '@myriaddreamin/typst-all-in-one.ts': specifier: 0.6.1-rc3 version: 0.6.1-rc3 + '@myriaddreamin/typst-ts-renderer': + specifier: 0.6.1-rc3 + version: 0.6.1-rc3 + '@myriaddreamin/typst-ts-web-compiler': + specifier: 0.6.1-rc3 + version: 0.6.1-rc3 + '@myriaddreamin/typst.ts': + specifier: 0.6.1-rc3 + version: 0.6.1-rc3(@myriaddreamin/typst-ts-renderer@0.6.1-rc3)(@myriaddreamin/typst-ts-web-compiler@0.6.1-rc3) '@pandacss/dev': specifier: ^0.20.0 version: 0.20.1(jsdom@27.0.0)(typescript@5.0.2) @@ -1202,15 +1211,27 @@ packages: '@jridgewell/resolve-uri': 3.1.2 '@jridgewell/sourcemap-codec': 1.5.5 + /@myriaddreamin/typst-all-in-one.ts@0.6.1-rc3: + resolution: {integrity: sha512-IFkPEDTfE8/IYEpJxeNMRCOqeQ0NP9+30VHk1EmLIGHMiDcqkMJ04MEF1eHdPX5L8XjAuyKI4jPZQvHSXaQRnA==} + dev: false + /@myriaddreamin/typst-ts-renderer@0.6.0: resolution: {integrity: sha512-56Mids4E5Ob6LeEeXDedvmsVnEWnLmc1qeUOeUSruL/zI3S9QXleF/c3Os1FXwJmLuCFbWTEIq8Quh2cXlnxKw==} dev: false + /@myriaddreamin/typst-ts-renderer@0.6.1-rc3: + resolution: {integrity: sha512-m4OHUXYvxDcE6yEvTIl+s7Y721RMWpVTUDXRN2o08P2ckkgxmtloVwHkdCAbrV5w19b5f/fcSaCW2xbxaw+XnA==} + dev: false + /@myriaddreamin/typst-ts-web-compiler@0.6.0: resolution: {integrity: sha512-P/eIJ5RnfElj0NYzn5PI296t/IwWtgqUyyTMi5Jm5X3V5kZfskkH+LI7mSQe8tEyxwgCvxbxvFe5adinA3K8Gg==} dev: false - /@myriaddreamin/typst.ts@0.6.1-rc3: + /@myriaddreamin/typst-ts-web-compiler@0.6.1-rc3: + resolution: {integrity: sha512-6KD2QKUI1KVcBpKxh/LQX02224NnjMWlRQy/IqtROekDKUdoCoSlf5PV7aETYyI4bA1mtNrzMkBGdCeum/4frA==} + dev: false + + /@myriaddreamin/typst.ts@0.6.1-rc3(@myriaddreamin/typst-ts-renderer@0.6.1-rc3)(@myriaddreamin/typst-ts-web-compiler@0.6.1-rc3): resolution: {integrity: sha512-pGzaJ5SV0JjrNWn14Bicy0nPTtfD5+4kHwGUDYSebSMbfAtNHfi+Et7k4PiXqunwRm7Obkk5iZufiRM2jOlfbg==} peerDependencies: '@myriaddreamin/typst-ts-renderer': ^0.6.1-rc3 @@ -1221,6 +1242,8 @@ packages: '@myriaddreamin/typst-ts-web-compiler': optional: true dependencies: + '@myriaddreamin/typst-ts-renderer': 0.6.1-rc3 + '@myriaddreamin/typst-ts-web-compiler': 0.6.1-rc3 idb: 7.1.1 dev: false