diff --git a/astro.config.mjs b/astro.config.mjs index 9a25601..161ef7b 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -1,26 +1,36 @@ // @ts-check -import { defineConfig } from 'astro/config'; -import starlight from '@astrojs/starlight'; +import { defineConfig } from "astro/config"; +import starlight from "@astrojs/starlight"; // https://astro.build/config export default defineConfig({ - integrations: [ - starlight({ - title: 'My Docs', - social: [{ icon: 'github', label: 'GitHub', href: 'https://github.com/withastro/starlight' }], - sidebar: [ - { - label: 'Guides', - items: [ - // Each item here is one entry in the navigation menu. - { label: 'Example Guide', slug: 'guides/example' }, - ], - }, - { - label: 'Reference', - autogenerate: { directory: 'reference' }, - }, - ], - }), - ], + integrations: [ + starlight({ + title: "हिंदकी", + social: [ + { + icon: "github", + label: "GitHub", + href: "https://github.com/withastro/starlight", + }, + ], + customCss: [ + // Path to your custom CSS file + "./src/styles/custom.css", + ], + sidebar: [ + { + label: "Guides", + items: [ + // Each item here is one entry in the navigation menu. + { label: "Example Guide", slug: "guides/example" }, + ], + }, + { + label: "Reference", + autogenerate: { directory: "reference" }, + }, + ], + }), + ], }); diff --git a/package-lock.json b/package-lock.json index 00048a1..af185c7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,6 +11,10 @@ "@astrojs/starlight": "^0.36.0", "astro": "^5.6.1", "sharp": "^0.34.2" + }, + "devDependencies": { + "prettier": "^3.6.2", + "prettier-plugin-astro": "^0.14.1" } }, "node_modules/@astrojs/compiler": { @@ -4922,6 +4926,37 @@ "node": ">=4" } }, + "node_modules/prettier": { + "version": "3.6.2", + "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.6.2.tgz", + "integrity": "sha512-I7AIg5boAr5R0FFtJ6rCfD+LFsWHp81dolrFD8S79U9tb8Az2nGrJncnMSnys+bpQJfRUzqs9hnA81OAA3hCuQ==", + "dev": true, + "license": "MIT", + "bin": { + "prettier": "bin/prettier.cjs" + }, + "engines": { + "node": ">=14" + }, + "funding": { + "url": "https://github.com/prettier/prettier?sponsor=1" + } + }, + "node_modules/prettier-plugin-astro": { + "version": "0.14.1", + "resolved": "https://registry.npmjs.org/prettier-plugin-astro/-/prettier-plugin-astro-0.14.1.tgz", + "integrity": "sha512-RiBETaaP9veVstE4vUwSIcdATj6dKmXljouXc/DDNwBSPTp8FRkLGDSGFClKsAFeeg+13SB0Z1JZvbD76bigJw==", + "dev": true, + "license": "MIT", + "dependencies": { + "@astrojs/compiler": "^2.9.1", + "prettier": "^3.0.0", + "sass-formatter": "^0.7.6" + }, + "engines": { + "node": "^14.15.0 || >=16.0.0" + } + }, "node_modules/prismjs": { "version": "1.30.0", "resolved": "https://registry.npmjs.org/prismjs/-/prismjs-1.30.0.tgz", @@ -5391,6 +5426,23 @@ "fsevents": "~2.3.2" } }, + "node_modules/s.color": { + "version": "0.0.15", + "resolved": "https://registry.npmjs.org/s.color/-/s.color-0.0.15.tgz", + "integrity": "sha512-AUNrbEUHeKY8XsYr/DYpl+qk5+aM+DChopnWOPEzn8YKzOhv4l2zH6LzZms3tOZP3wwdOyc0RmTciyi46HLIuA==", + "dev": true, + "license": "MIT" + }, + "node_modules/sass-formatter": { + "version": "0.7.9", + "resolved": "https://registry.npmjs.org/sass-formatter/-/sass-formatter-0.7.9.tgz", + "integrity": "sha512-CWZ8XiSim+fJVG0cFLStwDvft1VI7uvXdCNJYXhDvowiv+DsbD1nXLiQ4zrE5UBvj5DWZJ93cwN0NX5PMsr1Pw==", + "dev": true, + "license": "MIT", + "dependencies": { + "suf-log": "^2.5.3" + } + }, "node_modules/sax": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/sax/-/sax-1.4.1.tgz", @@ -5608,6 +5660,16 @@ "inline-style-parser": "0.2.4" } }, + "node_modules/suf-log": { + "version": "2.5.3", + "resolved": "https://registry.npmjs.org/suf-log/-/suf-log-2.5.3.tgz", + "integrity": "sha512-KvC8OPjzdNOe+xQ4XWJV2whQA0aM1kGVczMQ8+dStAO6KfEB140JEVQ9dE76ONZ0/Ylf67ni4tILPJB41U0eow==", + "dev": true, + "license": "MIT", + "dependencies": { + "s.color": "0.0.15" + } + }, "node_modules/tiny-inflate": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/tiny-inflate/-/tiny-inflate-1.0.3.tgz", diff --git a/package.json b/package.json index bac96dd..8e1fc20 100644 --- a/package.json +++ b/package.json @@ -13,5 +13,9 @@ "@astrojs/starlight": "^0.36.0", "astro": "^5.6.1", "sharp": "^0.34.2" + }, + "devDependencies": { + "prettier": "^3.6.2", + "prettier-plugin-astro": "^0.14.1" } -} \ No newline at end of file +} diff --git a/public/fonts/Martel-Black.ttf b/public/fonts/Martel-Black.ttf new file mode 100644 index 0000000..a44b5fb Binary files /dev/null and b/public/fonts/Martel-Black.ttf differ diff --git a/public/fonts/Martel-Bold.ttf b/public/fonts/Martel-Bold.ttf new file mode 100644 index 0000000..40cdd8f Binary files /dev/null and b/public/fonts/Martel-Bold.ttf differ diff --git a/public/fonts/Martel-ExtraBold.ttf b/public/fonts/Martel-ExtraBold.ttf new file mode 100644 index 0000000..778fc40 Binary files /dev/null and b/public/fonts/Martel-ExtraBold.ttf differ diff --git a/public/fonts/Martel-ExtraLight.ttf b/public/fonts/Martel-ExtraLight.ttf new file mode 100644 index 0000000..08b7ecd Binary files /dev/null and b/public/fonts/Martel-ExtraLight.ttf differ diff --git a/public/fonts/Martel-Light.ttf b/public/fonts/Martel-Light.ttf new file mode 100644 index 0000000..2865a60 Binary files /dev/null and b/public/fonts/Martel-Light.ttf differ diff --git a/public/fonts/Martel-Regular.ttf b/public/fonts/Martel-Regular.ttf new file mode 100644 index 0000000..ce9725e Binary files /dev/null and b/public/fonts/Martel-Regular.ttf differ diff --git a/public/fonts/Martel-SemiBold.ttf b/public/fonts/Martel-SemiBold.ttf new file mode 100644 index 0000000..e69f808 Binary files /dev/null and b/public/fonts/Martel-SemiBold.ttf differ diff --git a/public/fonts/MinionPro_Bold.otf b/public/fonts/MinionPro_Bold.otf new file mode 100644 index 0000000..e280cfc Binary files /dev/null and b/public/fonts/MinionPro_Bold.otf differ diff --git a/public/fonts/MinionPro_BoldIt.otf b/public/fonts/MinionPro_BoldIt.otf new file mode 100644 index 0000000..fbc917a Binary files /dev/null and b/public/fonts/MinionPro_BoldIt.otf differ diff --git a/public/fonts/MinionPro_It.otf b/public/fonts/MinionPro_It.otf new file mode 100644 index 0000000..028c3b5 Binary files /dev/null and b/public/fonts/MinionPro_It.otf differ diff --git a/public/fonts/MinionPro_Regular.otf b/public/fonts/MinionPro_Regular.otf new file mode 100644 index 0000000..f76a6bc Binary files /dev/null and b/public/fonts/MinionPro_Regular.otf differ diff --git a/public/fonts/MyriadPro_Bold.otf b/public/fonts/MyriadPro_Bold.otf new file mode 100644 index 0000000..7d9c67f Binary files /dev/null and b/public/fonts/MyriadPro_Bold.otf differ diff --git a/public/fonts/MyriadPro_BoldIt.otf b/public/fonts/MyriadPro_BoldIt.otf new file mode 100644 index 0000000..38626fd Binary files /dev/null and b/public/fonts/MyriadPro_BoldIt.otf differ diff --git a/public/fonts/MyriadPro_It.otf b/public/fonts/MyriadPro_It.otf new file mode 100644 index 0000000..e7645ef Binary files /dev/null and b/public/fonts/MyriadPro_It.otf differ diff --git a/public/fonts/MyriadPro_Regular.otf b/public/fonts/MyriadPro_Regular.otf new file mode 100644 index 0000000..d13ca43 Binary files /dev/null and b/public/fonts/MyriadPro_Regular.otf differ diff --git a/src/content/docs/404.mdx b/src/content/docs/404.mdx new file mode 100644 index 0000000..99c87cd --- /dev/null +++ b/src/content/docs/404.mdx @@ -0,0 +1,9 @@ +--- +title: किधर गया हैं? +description: The page you're looking for doesn't exist. +template: splash +--- + +# 404 | कुछ नहीं है यहाँ + +[← घर वापस जाऐं](/) diff --git a/src/content/docs/guides/example.md b/src/content/docs/guides/example.md deleted file mode 100644 index ebd0f3b..0000000 --- a/src/content/docs/guides/example.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: Example Guide -description: A guide in my new Starlight docs site. ---- - -Guides lead a user through a specific task they want to accomplish, often with a sequence of steps. -Writing a good guide requires thinking about what your users are trying to do. - -## Further reading - -- Read [about how-to guides](https://diataxis.fr/how-to-guides/) in the Diátaxis framework diff --git a/src/content/docs/index.mdx b/src/content/docs/index.mdx index 664b681..99c927d 100644 --- a/src/content/docs/index.mdx +++ b/src/content/docs/index.mdx @@ -1,36 +1,33 @@ --- -title: Welcome to Starlight -description: Get started building your docs site with Starlight. +title: हिंदकी +description: Ryan's Hindi Notes. template: splash +head: + - tag: title + content: Hindki | हिंदकी hero: - tagline: Congrats on setting up a new Starlight project! - image: - file: ../../assets/houston.webp + tagline: Welcome to Hindki! actions: - - text: Example Guide - link: /guides/example/ + - text: Dictionary + link: /dictionary/index/ icon: right-arrow - - text: Read the Starlight docs - link: https://starlight.astro.build + - text: Hindi Textbook (260 MB) + link: https://files.pandu.ski/share/2BfsIfEb icon: external variant: minimal + attrs: + target: _blank + rel: noopener --- -import { Card, CardGrid } from '@astrojs/starlight/components'; +## हिंदकी के बारे में -## Next steps +Hindki is a collection of my personal notes on learning Hindi, and an evolving knowledge base that (maybe, hopefully) I can one day use as the backend of an AI-powered language tutor. If it helps you too, बढ़िया! - - - Edit `src/content/docs/index.mdx` to see this page change. - - - Add Markdown or MDX files to `src/content/docs` to create new pages. - - - Edit your `sidebar` and other config in `astro.config.mjs`. - - - Learn more in [the Starlight Docs](https://starlight.astro.build/). - - +It includes a dictionary, grammar notes, and other resources I've found helpful in my studies. + +As I learn more Hindi, I'll convert this and the rest of the interface to Hindi as well. + +### इसका नाम क्यों "हिंदकी"? + +The name "Hindki" is a play on the words "Hindi" and "Anki", because I was initially building this as a personal flashcard system similar to [Anki](https://apps.ankiweb.net/), but for Hindi. It also kind of works as a Hindi adjective meaning "related to Hindi" (in fact, [this word exists in Persian](https://translate.google.com/?sl=fa&tl=en&text=%D9%87%DB%8C%D9%86%D8%AF%D9%82%DB%8C%20&op=translate)), and it is also a sort of "wiki", since it's a knowledge base. All very satisfying. diff --git a/src/content/docs/reference/example.md b/src/content/docs/reference/example.md deleted file mode 100644 index 0224f09..0000000 --- a/src/content/docs/reference/example.md +++ /dev/null @@ -1,11 +0,0 @@ ---- -title: Example Reference -description: A reference page in my new Starlight docs site. ---- - -Reference pages are ideal for outlining how things work in terse and clear terms. -Less concerned with telling a story or addressing a specific use case, they should give a comprehensive outline of what you're documenting. - -## Further reading - -- Read [about reference](https://diataxis.fr/reference/) in the Diátaxis framework diff --git a/src/styles/custom.css b/src/styles/custom.css new file mode 100644 index 0000000..faf4b49 --- /dev/null +++ b/src/styles/custom.css @@ -0,0 +1,366 @@ +/* MinionPro (Default serif font) */ +@font-face { + font-family: "MinionPro"; + src: url("/fonts/MinionPro_Regular.otf") format("opentype"); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "MinionPro"; + src: url("/fonts/MinionPro_It.otf") format("opentype"); + font-weight: 400; + font-style: italic; + font-display: swap; +} + +@font-face { + font-family: "MinionPro"; + src: url("/fonts/MinionPro_Bold.otf") format("opentype"); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "MinionPro"; + src: url("/fonts/MinionPro_BoldIt.otf") format("opentype"); + font-weight: 700; + font-style: italic; + font-display: swap; +} + +/* MyriadPro (Default sans-serif font) */ +@font-face { + font-family: "MyriadPro"; + src: url("/fonts/MyriadPro_Regular.otf") format("opentype"); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "MyriadPro"; + src: url("/fonts/MyriadPro_It.otf") format("opentype"); + font-weight: 400; + font-style: italic; + font-display: swap; +} + +@font-face { + font-family: "MyriadPro"; + src: url("/fonts/MyriadPro_Bold.otf") format("opentype"); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "MyriadPro"; + src: url("/fonts/MyriadPro_BoldIt.otf") format("opentype"); + font-weight: 700; + font-style: italic; + font-display: swap; +} + +/* Custom font for Devanagari script - Multiple weights */ +@font-face { + font-family: "hindi"; + src: url("/fonts/Martel-Light.ttf") format("truetype"); + font-weight: 300; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "hindi"; + src: url("/fonts/Martel-Regular.ttf") format("truetype"); + font-weight: 400; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "hindi"; + src: url("/fonts/Martel-SemiBold.ttf") format("truetype"); + font-weight: 600; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "hindi"; + src: url("/fonts/Martel-Bold.ttf") format("truetype"); + font-weight: 700; + font-style: normal; + font-display: swap; +} + +@font-face { + font-family: "hindi"; + src: url("/fonts/Martel-Black.ttf") format("truetype"); + font-weight: 900; + font-style: normal; + font-display: swap; +} + +/* Apply default fonts and Devanagari font to content */ +:root { + --sl-font-system: "MyriadPro", system-ui, sans-serif; + --sl-font: "MyriadPro", system-ui, sans-serif; +} + +/* Set global font default to sans-serif */ +body { + font-family: "MyriadPro", system-ui, sans-serif; +} + +/* Apply serif font to content/reading areas */ +p, +.sl-markdown-content p, +blockquote, +.sl-markdown-content blockquote, +li, +.sl-markdown-content li, +.content, +.prose, +.sl-markdown-content { + font-family: "MinionPro", Georgia, serif; + font-size: 1.5rem; /* 18px, up from default 16px */ +} + +/* Keep UI elements as sans-serif with Devanagari support */ +.sl-nav, +.sl-sidebar, +.sl-page-title, +.card, +.starlight-card, +button, +.sl-search-box, +nav, +header, +footer { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; +} + +/* Specific targeting for Devanagari text */ +[lang="hi"], +[lang="sa"], +.devanagari { + font-family: "hindi", "Noto Sans Devanagari", sans-serif !important; +} + +/* Auto-detect Devanagari characters using CSS unicode-range approach */ +/* This creates a fallback system that will use the hindi font for Devanagari characters */ +@font-face { + font-family: "DevanagariAuto"; + src: url("/fonts/Martel-Regular.ttf") format("truetype"); + font-weight: 400; + font-style: normal; + font-display: swap; + unicode-range: + U+0900-097F, U+200C-200D; /* Devanagari block + zero-width joiners */ +} + +@font-face { + font-family: "DevanagariAuto"; + src: url("/fonts/Martel-Light.ttf") format("truetype"); + font-weight: 300; + font-style: normal; + font-display: swap; + unicode-range: U+0900-097F, U+200C-200D; +} + +@font-face { + font-family: "DevanagariAuto"; + src: url("/fonts/Martel-SemiBold.ttf") format("truetype"); + font-weight: 600; + font-style: normal; + font-display: swap; + unicode-range: U+0900-097F, U+200C-200D; +} + +@font-face { + font-family: "DevanagariAuto"; + src: url("/fonts/Martel-Bold.ttf") format("truetype"); + font-weight: 700; + font-style: normal; + font-display: swap; + unicode-range: U+0900-097F, U+200C-200D; +} + +@font-face { + font-family: "DevanagariAuto"; + src: url("/fonts/Martel-Black.ttf") format("truetype"); + font-weight: 900; + font-style: normal; + font-display: swap; + unicode-range: U+0900-097F, U+200C-200D; +} + +/* Update font stacks to include automatic Devanagari detection */ +body { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; +} + +/* Apply serif font to content/reading areas with Devanagari support */ +p, +.sl-markdown-content p, +blockquote, +.sl-markdown-content blockquote, +li, +.sl-markdown-content li, +.content, +.prose, +.sl-markdown-content { + font-family: "DevanagariAuto", "MinionPro", Georgia, serif; + font-size: 1.5rem; /* 18px, up from default 16px */ +} + +/* Alternative approach: Apply to all text content */ +/* Uncomment if you want the Devanagari font to be the primary font */ +/* +body { + font-family: 'DevanagariFont', 'Noto Sans Devanagari', system-ui, sans-serif; +} +*/ + +/* Ensure proper rendering for complex scripts */ +.devanagari, +[lang="hi"], +[lang="sa"] { + font-feature-settings: + "kern" 1, + "liga" 1; + text-rendering: optimizeLegibility; +} + +/* Font weight utility classes */ +.hindi-light { + font-family: "hindi", "Noto Sans Devanagari", sans-serif; + font-weight: 300; +} + +.hindi-regular { + font-family: "hindi", "Noto Sans Devanagari", sans-serif; + font-weight: 400; +} + +.hindi-semibold { + font-family: "hindi", "Noto Sans Devanagari", sans-serif; + font-weight: 600; +} + +.hindi-bold { + font-family: "hindi", "Noto Sans Devanagari", sans-serif; + font-weight: 700; +} + +.hindi-black { + font-family: "hindi", "Noto Sans Devanagari", sans-serif; + font-weight: 900; +} + +/* Override Starlight's heading fonts */ +h1, +.sl-markdown-content h1 { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 700; /* Bold */ +} + +h2, +.sl-markdown-content h2 { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 700; /* Bold */ +} + +h3, +.sl-markdown-content h3, +h4, +.sl-markdown-content h4 { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 700; /* Bold */ +} + +h5, +.sl-markdown-content h5, +h6, +.sl-markdown-content h6 { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 400; /* Regular */ +} + +/* Font family utility classes */ +.minion, +.serif { + font-family: "DevanagariAuto", "MinionPro", Georgia, serif; +} + +.myriad, +.sans { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; +} + +/* Font weight utilities for main fonts */ +.minion-regular, +.serif-regular { + font-family: "DevanagariAuto", "MinionPro", Georgia, serif; + font-weight: 400; +} + +.minion-bold, +.serif-bold { + font-family: "DevanagariAuto", "MinionPro", Georgia, serif; + font-weight: 700; +} + +.myriad-regular, +.sans-regular { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 400; +} + +.myriad-bold, +.sans-bold { + font-family: "DevanagariAuto", "MyriadPro", system-ui, sans-serif; + font-weight: 700; +} + +/* Custom background colors for a more paper-like feel */ +:root { + /* Light theme - warm paper-like background */ + --sl-color-bg: #fefcf8; /* Warm off-white, like aged paper */ + --sl-color-bg-nav: #faf8f4; /* Slightly darker for navigation */ + --sl-color-bg-sidebar: #f8f6f2; /* Even softer for sidebar */ + --sl-color-bg-inline-code: #f4f2ee; /* Subtle for inline code */ + + /* Custom accent color for links and buttons */ + --sl-color-accent: #336699; + --sl-color-accent-low: #336699; + --sl-color-accent-high: #336699; +} + +/* Dark theme overrides */ +[data-theme="dark"] { + --sl-color-bg: #1a1814; /* Dark warm background */ + --sl-color-bg-nav: #1e1c18; + --sl-color-bg-sidebar: #16140f; + --sl-color-bg-inline-code: #2a2620; + + /* Keep the same accent color in dark theme */ + --sl-color-accent: #336699; + --sl-color-accent-low: #336699; + --sl-color-accent-high: #336699; +} + +/* Additional paper-like styling */ +body { + background-color: var(--sl-color-bg); +} + +/* Subtle texture effect (optional) */ +.sl-markdown-content, +main { + background-color: var(--sl-color-bg); +}