diff --git a/apps/web/src/routes/(authentication)/sign-in/index.tsx b/apps/web/src/routes/(authentication)/sign-in/index.tsx index 5e57e5d..e966c12 100644 --- a/apps/web/src/routes/(authentication)/sign-in/index.tsx +++ b/apps/web/src/routes/(authentication)/sign-in/index.tsx @@ -32,4 +32,4 @@ export default component$(() => { ); }); -export const head: DocumentHead = generateSeoConfig({ title: 'Sign up' }); +export const head: DocumentHead = generateSeoConfig({ title: 'Sign in' }); diff --git a/apps/web/src/routes/(authentication)/sign-up/index.tsx b/apps/web/src/routes/(authentication)/sign-up/index.tsx index d82c6e7..38c1fc9 100644 --- a/apps/web/src/routes/(authentication)/sign-up/index.tsx +++ b/apps/web/src/routes/(authentication)/sign-up/index.tsx @@ -32,4 +32,4 @@ export default component$(() => { ); }); -export const head: DocumentHead = generateSeoConfig({ title: 'Sign in' }); +export const head: DocumentHead = generateSeoConfig({ title: 'Sign up' }); diff --git a/apps/web/src/routes/(landing)/(contents)/privacy/index.tsx b/apps/web/src/routes/(landing)/(contents)/privacy/index.tsx new file mode 100644 index 0000000..3156629 --- /dev/null +++ b/apps/web/src/routes/(landing)/(contents)/privacy/index.tsx @@ -0,0 +1,68 @@ +import { component$ } from '@builder.io/qwik'; +import { DocumentHead } from '@builder.io/qwik-city'; +import { Box, Text } from '@producktivity/ui'; +import { generateSeoConfig } from '../../../../configs/seo'; + +export default component$(() => { + return ( + + + + Privacy Policy + + + นโยบายคุ้มครองข้อมูลส่วนบุคคล + + + +     เรารวบรวมข้อมูลเกี่ยวกับกิจกรรมของคุณในบริการของเราเพื่อติดต่อสอบถามข้อมูล การบริการ / ตรวจสอบรายละเอียดการสั่งซื้อสินค้า/จัดทำรายการสั่งซื้อ +     ทางเราได้จัดทำประกาศนโยบายความเป็นส่วนตัวนี้เพื่อแจ้งให้ทราบถึงนโยบายความเป็นส่วนตัว รายละเอียดการรวบรวมข้อมูล เพื่อการเปิดเผย วิเคราะห์ผลทางธุรกิจ และอื่น ๆ ตามพระราชบัญญัติ คุมครองข้อมูลส่วนบุคคล พ.ศ. 2562 หรือก็คือ PDPA เพราะทางเราตระหนักถึงความสำคัญ + + + ข้อมูลส่วนบุคคลที่เก็บรวบรวม + + +
  • ช่องทางการติดต่อ
    • +
  • อีเมล หมายเลขโทรศัพท์
    • +
  • รายละเอียดการชำระเงิน
    • +
  • ข้อความที่คุณค้นหา
    • +
  • บุคคลที่ผู้ใช้งานแชร์เนื้อหาด้วย
    • +
  • รูปภาพ
    • +
  • IP address
    • +
  • cookie
    • +     + + + การปกป้องข้อมูลส่วนบุคคล + +     มาตรการรักษาความปลอดภัยทางอิเล็กทรอนิกส์บนมาตรฐาน SSL ซึ่งช่วยลดความเสี่ยงในการถูกเข้าถึงข้อมูลของท่านโดยบุคคลที่ไม่ได้รับอนุญาต + + + การเปิดเภยข้อมูลต่อบุคคลภายนอก + +     ข้อมูลที่มีผลต่อการดำเนินธุรกิจ เรามีความจำเป็นต้องเปิดเผยข้อมูลส่วนบุคคลให้บุคคลที่สาม ตัวอย่างข้อมูลเช่น เพื่อการคิดโปรโมชั่น ทั้งนี้ทางเราขอรับรองว่า จะไม่นำข้อมูลส่วนบุคคลที่ทางเราได้เก็บรวบรวมไปเผยแพร่ในที่สาธารณะ หรือทำการขายข้อมูลให้กับบุคลที่ไม่เกี่ยวข้องโดยเด็ดขาด ยกเว้นกรณีที่มีผลทางกฏหมาย + + + ระยะเวลาการเก็บรักษาข้อมูลส่วนบุคคล + +     ทางเราจะเก็บรักษาข้อมูลส่วนบุคคลของผู้ใช้งานไว้ตามเท่าที่กำหนดสำหรับวัตถุประสงค์ของการเก็บข้อมูล และทางเราจะลบข้อมูลส่วนบุคคลเมื่อเห็นว่าข้อมูลนั้นไม่ตรงตามวัตถุประสงค์ และจะลบข้อมูลที่ไม่จำเป็นต่อการให้บริการโดยทันทีหลังจากที่ไม่ได้ใช้งาน + + + การใช้คุกกี้ + +     ทางเราจะใช้นโยบายที่สอดคล้องกับการเปลี่ยนแปลงของบริการ ดำเนินงานภายใต้กฏหมาย โดยทางเราจะเปิดเผยนโยบายการให้ผู้ใช้งานทราบผ่านเว็บไซต์ อย่างชัดเจนเมื่อมีการเยี่ยมชมเว็บไซต์ โปรดอ่านนโยบายการคุ้มครองข้อมูลส่วนบุคคลทุกครั้งเพื่อผลประโยชน์ของผู้ใช้งาน โดยที่ผู้ใช้งานสามารถตั้งค่าการเข้าถึงข้อมูลได้ + + + วิธีการติดต่อ + +     หากมีคำถาม ข้อเสนอแนะ หรือต้องการรายละเอียดเพิ่มเติมเกี่ยวกับ ประกาศ นโยบายความเป็นส่วนตัว หรือต้องการติดต่อเรื่องการใช้สิทธิ์ของคุณ โปรดติดต่อ xxxx + + การยกเลิกความยินยอม + +     ผู้ใช้งานสามารถเลือกยกเลิกความยินยอมในการใช้ข้อมูลส่วนบุคคลของท่านได้ตลอดเวลา โดยติดต่อเราทางอีเมลหรือตามช่องทางการติดต่อที่ระบุไว้ในเว็บไซต์ของเรา +     +     + ); +}); + +export const head: DocumentHead = generateSeoConfig({ title: 'Privacy Policy' }); diff --git a/apps/web/src/routes/(landing)/(contents)/terms/index.tsx b/apps/web/src/routes/(landing)/(contents)/terms/index.tsx new file mode 100644 index 0000000..e35f734 --- /dev/null +++ b/apps/web/src/routes/(landing)/(contents)/terms/index.tsx @@ -0,0 +1,33 @@ +import { component$ } from '@builder.io/qwik'; +import { DocumentHead } from '@builder.io/qwik-city'; +import { Box, Text } from '@producktivity/ui'; +import { generateSeoConfig } from '../../../../configs/seo'; + +export default component$(() => { + return ( + + + + Terms of Service + + + ข้อกำหนดและเงื่อนไขในการใช้บริการ + + + + + คุณสมบัติของผู้ใช้งาน + +     ไม่สมัครสมาชิกโดยใช้ในนามของผู้อื่นในการยืนยันตัวตน + + + การสมัครสมาชิก + +
  •   การสมัครสมาชิกเพื่อเพิ่มระกับการใช้งานรายเดือน ทางเราจะตัดยอดเงินทุก ๆ วันที่ 2 ของแต่ละเดือน เป็นการต่ออายุอัตโนมัติ หากผู้ใช้งานไม่มีการเตรียมเงินในช่องทางที่เลือกไว้เพียงพอ เครดิตการใช้งานที่คงเหลือยังสามารถใช้ได้จนหมดเครดิตการใช้งาน เป็นเครดิตสะสม
    • +
  •   หากต้องการยกเลิกการสมัครสมาชิก ต้องกดยกเลิกการสมัครก่อนการตัดยอดของเดือนนั้น ๆ อย่างน้อย 3 วัน และเมื่อกดยกเลิกยังสามารถใช้ยอดเครดิตได้จนถึงวันที่ 1 ของเดือนถัดไป
    • +     +     + ); +}); + +export const head: DocumentHead = generateSeoConfig({ title: 'Terms of Service' }); diff --git a/libs/web/shared/ui/src/lib/box/box.props.ts b/libs/web/shared/ui/src/lib/box/box.props.ts index be03c76..baf23f2 100644 --- a/libs/web/shared/ui/src/lib/box/box.props.ts +++ b/libs/web/shared/ui/src/lib/box/box.props.ts @@ -19,4 +19,5 @@ export interface BoxProps extends NativeDiv, PaddingProps, MarginProps, SizeProp variant?: BoxVariant; align?: BoxAlignment; direction?: BoxDirection; + prose?: boolean; } diff --git a/libs/web/shared/ui/src/styles.css b/libs/web/shared/ui/src/styles.css index b706115..f786eca 100644 --- a/libs/web/shared/ui/src/styles.css +++ b/libs/web/shared/ui/src/styles.css @@ -16,4 +16,4 @@ body, body { @apply min-h-dvh; -} +} \ No newline at end of file diff --git a/libs/web/shared/ui/tailwind.config.ts b/libs/web/shared/ui/tailwind.config.ts index 61bb9ea..46fdbad 100644 --- a/libs/web/shared/ui/tailwind.config.ts +++ b/libs/web/shared/ui/tailwind.config.ts @@ -1,6 +1,7 @@ import type { Config } from 'tailwindcss'; import { join } from 'path'; +import typography from '@tailwindcss/typography'; import { fontFamily } from 'tailwindcss/defaultTheme'; export default { @@ -78,7 +79,78 @@ export default { }, }, }, + typography: { + DEFAULT: { + css: [ + { + color: 'rgb(var(--on-surface))', + maxWidth: '48rem', + '[class~="lead"]': { + color: 'rgb(var(--on-surface-variant))', + }, + a: { + color: 'rgb(var(--primary))', + }, + 'ol > li::marker': { + color: 'rgb(var(--on-surface))', + }, + 'ul > li::marker': { + color: 'rgb(var(--on-surface))', + }, + dt: { + color: 'rgb(var(--on-surface))', + }, + hr: { + borderColor: 'rgb(var(--on-surface))', + }, + blockquote: { + color: 'rgb(var(--primary))', + borderInlineStartColor: 'rgb(var(--primary))', + }, + h1: { + color: 'rgb(var(--primary))', + }, + h2: { + color: 'rgb(var(--secondary))', + }, + h3: { + color: 'rgb(var(--tertiary))', + }, + h4: { + color: 'rgb(var(--on-surface))', + }, + kbd: { + color: 'rgb(var(--on-surface))', + boxShadow: '0 0 0 1px rgb(var(--on-surface) / 10%), 0 3px 0 rgb(var(--on-surface) / 10%)', + }, + code: { + color: 'rgb(var(--on-surface))', + }, + pre: { + color: 'rgb(var(--on-surface-variant))', + backgroundColor: 'rgb(var(--surface-variant))', + }, + thead: { + borderBottomColor: 'rgb(var(--outline))', + }, + 'thead th': { + color: 'rgb(var(--primary))', + }, + 'tbody tr': { + borderBottomColor: 'rgb(var(--outline))', + }, + tfoot: { + borderTopColor: 'rgb(var(--outline))', + }, + figcaption: { + color: 'rgb(var(--on-surface))', + }, + }, + ], + }, + + }, }, }, - plugins: [], + plugins: [typography], } satisfies Config; diff --git a/package.json b/package.json index 0a7e467..e1211df 100644 --- a/package.json +++ b/package.json @@ -27,6 +27,7 @@ "@storybook/addon-links": "^7.6.7", "@storybook/addon-themes": "^7.6.7", "@storybook/core-server": "^7.6.7", + "@tailwindcss/typography": "^0.5.12", "@tanstack/qwik-table": "^8.15.0", "@types/jest": "^29.4.0", "@types/node": "^20.11.9", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 306cbb0..3ed3148 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -68,6 +68,9 @@ importers: '@storybook/core-server': specifier: ^7.6.7 version: 7.6.10 + '@tailwindcss/typography': + specifier: ^0.5.12 + version: 0.5.12(tailwindcss@3.4.1) '@tanstack/qwik-table': specifier: ^8.15.0 version: 8.15.0(@builder.io/qwik@1.4.2) @@ -4863,6 +4866,18 @@ packages: tslib: 2.6.2 dev: true + /@tailwindcss/typography@0.5.12(tailwindcss@3.4.1): + resolution: {integrity: sha512-CNwpBpconcP7ppxmuq3qvaCxiRWnbhANpY/ruH4L5qs2GCiVDJXde/pjj2HWPV1+Q4G9+V/etrwUYopdcjAlyg==} + peerDependencies: + tailwindcss: '>=3.0.0 || insiders' + dependencies: + lodash.castarray: 4.4.0 + lodash.isplainobject: 4.0.6 + lodash.merge: 4.6.2 + postcss-selector-parser: 6.0.10 + tailwindcss: 3.4.1 + dev: true + /@tanstack/qwik-table@8.15.0(@builder.io/qwik@1.4.2): resolution: {integrity: sha512-gkZGjzwfb38CwJKJkyZy+kF6Iihwgul574/J3rZUcoHsphd/AyZRjjsPiA4E9NDi2XU9UtOyC9YDIPE/O0agxQ==} engines: {node: '>=12'} @@ -9387,6 +9402,10 @@ packages: p-locate: 5.0.0 dev: true + /lodash.castarray@4.4.0: + resolution: {integrity: sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==} + dev: true + /lodash.debounce@4.0.8: resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==} dev: true @@ -9399,6 +9418,10 @@ packages: resolution: {integrity: sha512-pDo3lu8Jhfjqls6GkMgpahsF9kCyayhgykjyLMNFTKWrpVdAQtYyB4muAMWozBB4ig/dtWAmsMxLEI8wuz+DYQ==} dev: true + /lodash.isplainobject@4.0.6: + resolution: {integrity: sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==} + dev: true + /lodash.memoize@4.1.2: resolution: {integrity: sha512-t7j+NzmgnQzTAYXcsHYLgimltOV1MXHtlOWf6GjL9Kj8GK5FInw5JotxvbOs+IvV1/Dzo04/fCGfLVs7aXb4Ag==} dev: true @@ -10735,6 +10758,14 @@ packages: postcss-selector-parser: 6.0.15 dev: true + /postcss-selector-parser@6.0.10: + resolution: {integrity: sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==} + engines: {node: '>=4'} + dependencies: + cssesc: 3.0.0 + util-deprecate: 1.0.2 + dev: true + /postcss-selector-parser@6.0.15: resolution: {integrity: sha512-rEYkQOMUCEMhsKbK66tbEU9QVIxbhN18YiniAwA7XQYTVBqrBy+P2p5JcdqsHgKM2zWylp8d7J6eszocfds5Sw==} engines: {node: '>=4'}