diff --git a/assets/styles/global.css b/assets/styles/global.css deleted file mode 100644 index 9ec6618..0000000 --- a/assets/styles/global.css +++ /dev/null @@ -1,67 +0,0 @@ -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 100; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYULTRALIGHTITALIC.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 200; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYTHINITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYTHINITALIC.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 300; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYLIGHTITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYLIGHTITALIC.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: normal; - font-weight: 400; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYREGULAR.woff2) format('woff2'), url(../fonts/SFPRODISPLAYREGULAR.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: normal; - font-weight: 500; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYMEDIUM.woff2) format('woff2'), url(../fonts/SFPRODISPLAYMEDIUM.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 600; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYSEMIBOLDITALIC.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: normal; - font-weight: 700; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYBOLD.woff2) format('woff2'), url(../fonts/SFPRODISPLAYBOLD.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 800; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYHEAVYITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYHEAVYITALIC.woff) format('woff'); -} - -@font-face { - font-family: sf pro display; - font-style: italic; - font-weight: 900; - src: local('SF Pro Display'), url(../fonts/SFPRODISPLAYBLACKITALIC.woff2) format('woff2'), url(../fonts/SFPRODISPLAYBLACKITALIC.woff) format('woff'); -} - -:root { - --rp-font-family-base: 'SF Pro Display', 'Inter var experimental', 'Inter var', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Fira Sans', 'Droid Sans', - 'Helvetica Neue', sans-serif; -} diff --git a/docs/_meta.json b/docs/_meta.json index b3b4005..156e0d7 100644 --- a/docs/_meta.json +++ b/docs/_meta.json @@ -11,13 +11,11 @@ }, { "text": "论坛", - "link": "https://github.com/orgs/BiliUniverse/discussions", - "activeMatch": "^/discussions/" + "link": "https://github.com/orgs/BiliUniverse/discussions" }, { "type": "custom-link", "text": "赞助", - "link": "https://afdian.com/a/HashBrown", - "activeMatch": "^/a/HashBrown" + "link": "https://afdian.com/a/HashBrown" } ] diff --git a/docs/public/rspress-dark-logo.png b/docs/public/rspress-dark-logo.png deleted file mode 100644 index 928bcc9..0000000 Binary files a/docs/public/rspress-dark-logo.png and /dev/null differ diff --git a/docs/public/rspress-icon.png b/docs/public/rspress-icon.png deleted file mode 100644 index 6be2af2..0000000 Binary files a/docs/public/rspress-icon.png and /dev/null differ diff --git a/docs/public/rspress-light-logo.png b/docs/public/rspress-light-logo.png deleted file mode 100644 index 1e3442e..0000000 Binary files a/docs/public/rspress-light-logo.png and /dev/null differ diff --git a/package.json b/package.json index 52d86a7..4982e7b 100644 --- a/package.json +++ b/package.json @@ -9,20 +9,21 @@ }, "dependencies": { "@iringo/doc-ui": "^2.0.0", - "rehype-urls": "^1.2.0", + "remark-github": "^12.0.0", "rspress": "^1.37.2", "rspress-plugin-changelog": "^1.1.2", - "rspress-plugin-font-open-sans": "^1.0.0", "rspress-plugin-sitemap": "^1.1.1" }, "devDependencies": { "@biomejs/biome": "^1.9.4", "@rspress/shared": "^1.37.4", "@types/node": "^16.18.121", - "remark-github": "^12.0.0" + "@types/react": "^18.3.11", + "typescript": "^5.7.2" }, "repository": { "type": "git", "url": "https://github.com/Auraflare/Auraflare.github.io.git" - } + }, + "packageManager": "pnpm@9.15.0" } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 133744c..9615714 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -11,9 +11,9 @@ importers: '@iringo/doc-ui': specifier: ^2.0.0 version: 2.0.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - rehype-urls: - specifier: ^1.2.0 - version: 1.2.0 + remark-github: + specifier: ^12.0.0 + version: 12.0.0 rspress: specifier: ^1.37.2 version: 1.37.2(webpack@5.95.0) @@ -36,9 +36,12 @@ importers: '@types/node': specifier: ^16.18.121 version: 16.18.121 - remark-github: - specifier: ^12.0.0 - version: 12.0.0 + '@types/react': + specifier: ^18.3.11 + version: 18.3.13 + typescript: + specifier: ^5.7.2 + version: 5.7.2 packages: @@ -804,9 +807,6 @@ packages: hast-util-from-parse5@8.0.2: resolution: {integrity: sha512-SfMzfdAi/zAoZ1KkFEyyeXBn7u/ShQrfd675ZEE9M3qj+PMFX05xubzRyF76CCSJu8au9jgVxDV1+okFvgZU4A==} - hast-util-has-property@1.0.4: - resolution: {integrity: sha512-ghHup2voGfgFoHMGnaLHOjbYFACKrRh9KFttdCzMCbFoBMJXiNi2+XTrPP8+q6cDJM/RSqlCfVWrjp1H201rZg==} - hast-util-heading-rank@3.0.0: resolution: {integrity: sha512-EJKb8oMUXVHcWZTDepnr+WNbfnXKFNf9duMesmr4S8SXTJBJ9M4Yok08pu9vxdJwdlGRhVumk9mEhkEvKGifwA==} @@ -884,9 +884,6 @@ packages: is-alphanumerical@2.0.1: resolution: {integrity: sha512-hmbYhX/9MUMF5uh7tOXyK/n0ZvWpad5caBA17GsC6vyuCqaWliRG5K1qS9inmUhEMaOBIW7/whAnSwveW/LtZw==} - is-arrayish@0.3.2: - resolution: {integrity: sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==} - is-binary-path@2.1.0: resolution: {integrity: sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==} engines: {node: '>=8'} @@ -1375,9 +1372,6 @@ packages: rehype-external-links@2.1.0: resolution: {integrity: sha512-2YMJZVM1hxZnwl9IPkbN5Pjn78kXkAX7lq9VEtlaGA29qIls25vZN+ucNIJdbQUe+9NNFck17BiOhGmsD6oLIg==} - rehype-urls@1.2.0: - resolution: {integrity: sha512-+ygQd999ts0DxhTqttYmH0w0jK2ysE5lLjaJkSI4xd63XUB+g+TYXZtwXngr38QDMIVizquB2Bo35JNVggCL3A==} - remark-gfm@3.0.1: resolution: {integrity: sha512-lEFDoi2PICJyNrACFOfDD3JlLkuSbOa5Wd8EPt06HUdptv8Gn0bxYTdbU/XXQ3swAPkEaGxxPN9cbnMHvVu1Ig==} @@ -1615,9 +1609,6 @@ packages: stackframe@1.3.4: resolution: {integrity: sha512-oeVtt7eWQS+Na6F//S4kJ2K2VbRlS9D43mAlMyVpVWovy9o+jfgH8O9agzANzaiLjclA0oYzUXEM4PurhSUChw==} - stdopt@2.2.0: - resolution: {integrity: sha512-D/p41NgXOkcj1SeGhfXOwv9z1K6EV3sjAUY5aeepVbgEHv7DpKWLTjhjScyzMWAQCAgUQys1mjH0eArm4cjRGw==} - stringify-entities@4.0.4: resolution: {integrity: sha512-IwfBptatlO+QCJUo19AqvrPNqlVMpW9YEL2LIVY+Rpv2qsjCGxaDLNRgeGsQWJhfItebuJhsGSLjaBbNSQ+ieg==} @@ -1688,6 +1679,11 @@ packages: tslib@2.8.1: resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==} + typescript@5.7.2: + resolution: {integrity: sha512-i5t66RHxDvVN40HfDd1PsEThGNnlMCMT3jMUuoh9/0TaqWevNontacunWyN02LA9/fIbEWlcHZcgTKb9QoaLfg==} + engines: {node: '>=14.17'} + hasBin: true + uglify-js@3.19.3: resolution: {integrity: sha512-v3Xu+yuwBXisp6QYTcH4UbH+xYJXqnq2m/LtQVWKWzYc1iehYnLixoQDN9FH6/j9/oybfd6W9Ghwkl8+UMKTKQ==} engines: {node: '>=0.8.0'} @@ -1699,9 +1695,6 @@ packages: unist-util-generated@2.0.1: resolution: {integrity: sha512-qF72kLmPxAw0oN2fwpWIqbXAVyEqUzDHMsbtPvOudIlUzXYFIeQIuxXQCRCFh22B7cixvU0MG7m3MW8FTq/S+A==} - unist-util-is@3.0.0: - resolution: {integrity: sha512-sVZZX3+kspVNmLWBPAB6r+7D9ZgAFPNWm66f7YNb420RlQSbn+n8rG8dGZSkrER7ZIXGQYNm5pqC3v3HopH24A==} - unist-util-is@5.2.1: resolution: {integrity: sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==} @@ -1726,18 +1719,12 @@ packages: unist-util-visit-children@3.0.0: resolution: {integrity: sha512-RgmdTfSBOg04sdPcpTSD1jzoNBjt9a80/ZCzp5cI9n1qPzLZWF9YdvWGN2zmTumP1HWhXKdUWexjy/Wy/lJ7tA==} - unist-util-visit-parents@2.1.2: - resolution: {integrity: sha512-DyN5vD4NE3aSeB+PXYNKxzGsfocxp6asDc2XXE3b0ekO2BaRUpBicbbUygfSvYfUz1IkmjFR1YF7dPklraMZ2g==} - unist-util-visit-parents@5.1.3: resolution: {integrity: sha512-x6+y8g7wWMyQhL1iZfhIPhDAs7Xwbn9nRosDXl7qoPTSCy0yNxnKc+hWokFifWQIDGi154rdUqKvbCa4+1kLhg==} unist-util-visit-parents@6.0.1: resolution: {integrity: sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw==} - unist-util-visit@1.4.1: - resolution: {integrity: sha512-AvGNk7Bb//EmJZyhtRUnNMEpId/AZ5Ph/KUpTI09WHQuDZHKovQ1oEv3mfmKpWKtoMzyMC4GLBm1Zy5k12fjIw==} - unist-util-visit@4.1.2: resolution: {integrity: sha512-MSd8OUGISqHdVvfY9TPhyK2VdUrPgxkUtWSuMHF6XAAFuL4LokseigBnZtPnJMu+FbynTkFNnFlyjxpVKujMRg==} @@ -2674,8 +2661,6 @@ snapshots: vfile-location: 5.0.3 web-namespaces: 2.0.1 - hast-util-has-property@1.0.4: {} - hast-util-heading-rank@3.0.0: dependencies: '@types/hast': 3.0.4 @@ -2789,8 +2774,6 @@ snapshots: is-alphabetical: 2.0.1 is-decimal: 2.0.1 - is-arrayish@0.3.2: {} - is-binary-path@2.1.0: dependencies: binary-extensions: 2.3.0 @@ -3533,12 +3516,6 @@ snapshots: unified: 10.1.2 unist-util-visit: 4.1.2 - rehype-urls@1.2.0: - dependencies: - hast-util-has-property: 1.0.4 - stdopt: 2.2.0 - unist-util-visit: 1.4.1 - remark-gfm@3.0.1: dependencies: '@types/mdast': 3.0.15 @@ -3777,10 +3754,6 @@ snapshots: stackframe@1.3.4: {} - stdopt@2.2.0: - dependencies: - is-arrayish: 0.3.2 - stringify-entities@4.0.4: dependencies: character-entities-html4: 2.1.0 @@ -3838,6 +3811,8 @@ snapshots: tslib@2.8.1: {} + typescript@5.7.2: {} + uglify-js@3.19.3: optional: true @@ -3853,8 +3828,6 @@ snapshots: unist-util-generated@2.0.1: {} - unist-util-is@3.0.0: {} - unist-util-is@5.2.1: dependencies: '@types/unist': 2.0.11 @@ -3888,10 +3861,6 @@ snapshots: dependencies: '@types/unist': 3.0.3 - unist-util-visit-parents@2.1.2: - dependencies: - unist-util-is: 3.0.0 - unist-util-visit-parents@5.1.3: dependencies: '@types/unist': 2.0.11 @@ -3902,10 +3871,6 @@ snapshots: '@types/unist': 3.0.3 unist-util-is: 6.0.0 - unist-util-visit@1.4.1: - dependencies: - unist-util-visit-parents: 2.1.2 - unist-util-visit@4.1.2: dependencies: '@types/unist': 2.0.11 diff --git a/rspress.config.ts b/rspress.config.ts index 779c585..cfbc104 100644 --- a/rspress.config.ts +++ b/rspress.config.ts @@ -1,14 +1,10 @@ import fs from 'node:fs'; import path from 'node:path'; -import type { UrlWithStringQuery } from 'node:url'; import { pluginChangelog } from 'rspress-plugin-changelog'; import type { ChangelogPluginOptions } from 'rspress-plugin-changelog'; -import { pluginFontOpenSans } from 'rspress-plugin-font-open-sans'; import pluginSitemap from 'rspress-plugin-sitemap'; import { defineConfig } from 'rspress/config'; -const siteUrl = 'https://Auraflare.github.io'; - const generateChangelogParams = (items: Omit[]) => items.map((item) => ({ type: 'github-releases', @@ -22,15 +18,15 @@ export default defineConfig({ description: 'Cloudflare® 资源集成解决方案', icon: 'https://avatars.githubusercontent.com/u/190900859?s=200&v=4', logo: 'https://avatars.githubusercontent.com/u/190900859?s=80&v=4', + logoText: 'Auraflare', // logo: { // light: '/rspress-light-logo.png', // dark: '/rspress-dark-logo.png', // }, - globalStyles: path.resolve('./assets/styles/global.css'), head: [ ['link', { ref: 'preconnect', href: '//ipolyfill.edge-byted.com' }], ['link', { ref: 'dns-prefetch', href: '//ipolyfill.edge-byted.com' }], - ['script', { src: '//ipolyfill.edge-byted.com/0.0.24/polyfill.min.js', crossorigin: '' }], + ['script', { src: '//ipolyfill.edge-byted.com/0.0.25/polyfill.min.js', crossorigin: '' }], ], themeConfig: { socialLinks: [ @@ -52,30 +48,10 @@ export default defineConfig({ markdown: { mdxRs: false, remarkPlugins: [[require('remark-github')]], - rehypePlugins: [ - [ - require('rehype-urls'), - (url: UrlWithStringQuery, node: any) => { - switch (url.host) { - case 't.me': - case 'github.com': - node.properties.target = '_blank'; - break; - case null: - //console.log(url); - break; - default: - //console.log(url); - break; - } - }, - ], - ], }, plugins: [ - pluginFontOpenSans(), pluginSitemap({ - domain: siteUrl, + domain: 'https://Auraflare.github.io', }), pluginChangelog({ fetchOnDev: false, diff --git a/assets/fonts/SFPRODISPLAYBLACKITALIC.woff b/theme/assets/fonts/SFPRODISPLAYBLACKITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYBLACKITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYBLACKITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYBLACKITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYBLACKITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYBLACKITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYBLACKITALIC.woff2 diff --git a/assets/fonts/SFPRODISPLAYBOLD.woff b/theme/assets/fonts/SFPRODISPLAYBOLD.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYBOLD.woff rename to theme/assets/fonts/SFPRODISPLAYBOLD.woff diff --git a/assets/fonts/SFPRODISPLAYBOLD.woff2 b/theme/assets/fonts/SFPRODISPLAYBOLD.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYBOLD.woff2 rename to theme/assets/fonts/SFPRODISPLAYBOLD.woff2 diff --git a/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff b/theme/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYHEAVYITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYHEAVYITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYHEAVYITALIC.woff2 diff --git a/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff b/theme/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYLIGHTITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYLIGHTITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYLIGHTITALIC.woff2 diff --git a/assets/fonts/SFPRODISPLAYMEDIUM.woff b/theme/assets/fonts/SFPRODISPLAYMEDIUM.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYMEDIUM.woff rename to theme/assets/fonts/SFPRODISPLAYMEDIUM.woff diff --git a/assets/fonts/SFPRODISPLAYMEDIUM.woff2 b/theme/assets/fonts/SFPRODISPLAYMEDIUM.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYMEDIUM.woff2 rename to theme/assets/fonts/SFPRODISPLAYMEDIUM.woff2 diff --git a/assets/fonts/SFPRODISPLAYREGULAR.woff b/theme/assets/fonts/SFPRODISPLAYREGULAR.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYREGULAR.woff rename to theme/assets/fonts/SFPRODISPLAYREGULAR.woff diff --git a/assets/fonts/SFPRODISPLAYREGULAR.woff2 b/theme/assets/fonts/SFPRODISPLAYREGULAR.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYREGULAR.woff2 rename to theme/assets/fonts/SFPRODISPLAYREGULAR.woff2 diff --git a/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff b/theme/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2 diff --git a/assets/fonts/SFPRODISPLAYTHINITALIC.woff b/theme/assets/fonts/SFPRODISPLAYTHINITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYTHINITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYTHINITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYTHINITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYTHINITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYTHINITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYTHINITALIC.woff2 diff --git a/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff b/theme/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff similarity index 100% rename from assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff rename to theme/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff diff --git a/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2 b/theme/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2 similarity index 100% rename from assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2 rename to theme/assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2 diff --git a/theme/components/layout/hooks/use-top-arrived.ts b/theme/components/layout/hooks/use-top-arrived.ts new file mode 100644 index 0000000..de5db14 --- /dev/null +++ b/theme/components/layout/hooks/use-top-arrived.ts @@ -0,0 +1,23 @@ +import { useEffect, useState } from 'react'; + +export const useTopArrived = () => { + const [scrollY, setScrollY] = useState(0); + const topArrived = scrollY < 100; + + useEffect(() => { + const handleScroll = () => { + setScrollY(window.scrollY); + }; + window.addEventListener('scroll', handleScroll, { + capture: false, + passive: true, + }); + return () => { + window.removeEventListener('scroll', handleScroll); + }; + }, []); + + return { + topArrived, + }; +}; diff --git a/theme/components/layout/index.tsx b/theme/components/layout/index.tsx new file mode 100644 index 0000000..5d15fe1 --- /dev/null +++ b/theme/components/layout/index.tsx @@ -0,0 +1 @@ +export * from './layout'; diff --git a/theme/components/layout/layout.css b/theme/components/layout/layout.css new file mode 100644 index 0000000..ee9eaf6 --- /dev/null +++ b/theme/components/layout/layout.css @@ -0,0 +1,154 @@ +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 100; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYULTRALIGHTITALIC.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 200; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYTHINITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYTHINITALIC.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 300; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYLIGHTITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYLIGHTITALIC.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: normal; + font-weight: 400; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYREGULAR.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYREGULAR.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: normal; + font-weight: 500; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYMEDIUM.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYMEDIUM.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 600; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYSEMIBOLDITALIC.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: normal; + font-weight: 700; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYBOLD.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYBOLD.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 800; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYHEAVYITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYHEAVYITALIC.woff") format("woff"); +} + +@font-face { + font-family: "sf pro display"; + font-style: italic; + font-weight: 900; + src: local("SF Pro Display"), url("../../assets/fonts/SFPRODISPLAYBLACKITALIC.woff2") format("woff2"), + url("../../assets/fonts/SFPRODISPLAYBLACKITALIC.woff") format("woff"); +} + +:root { + --rp-font-family-base: + "SF Pro Display", "Inter var experimental", "Inter var", -apple-system, blinkmacsystemfont, "Segoe UI", roboto, oxygen, ubuntu, cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; + --rp-c-brand-light: #0fb7fa; + --rp-c-brand: #007aff; + --rp-c-brand-dark: #0072fb; + + --iringo-semi-transparent-component-color: rgba(242, 242, 247, 0.72); +} + +.dark { + --rp-c-brand: #0a84ff; + --iringo-semi-transparent-component-color: rgba(22, 22, 23, 0.8); +} + +.rspress-home-feature-card { + --rp-home-feature-bg: var(--iringo-semi-transparent-component-color); + position: relative; + overflow: hidden; + backdrop-filter: saturate(180%) blur(20px); + border: 0; + &::after { + --bg-size: calc(100% + 14px); + + position: absolute; + inset: 0; + pointer-events: none; + content: ""; + background: linear-gradient(to bottom right, #0894ff 0%, #c959dd 34%, #ff2e54 68%, #ff9004) 50% / var(--bg-size) + var(--bg-size); + border-radius: 2rem; + mask: linear-gradient(hsla(0deg, 0%, 100%, 0), hsla(0deg, 0%, 100%, 0)), + linear-gradient(hsl(0deg, 0%, 100%), hsl(0deg, 0%, 100%)); + mask-clip: padding-box, border-box; + mask-composite: intersect; + transition: border-color .3s ease-in-out; + } + &:hover { + border: 0; + &::after { + border: 2px solid #0000; + } + } +} + +.rspress-nav-search-button { + background-color: var(--iringo-semi-transparent-component-color); +} + +#search-container { + [class^="mask"] { + background-color: var(--iringo-semi-transparent-component-color); + backdrop-filter: saturate(180%) blur(20px); + } + [class^="modal"] { + background-color: #fafafccc; + .dark & { + background-color: #161617ee; + } + } +} + +.rc-tooltip-inner { + background-color: var(--iringo-semi-transparent-component-color) !important; + backdrop-filter: saturate(180%) blur(20px); +} + +.rspress-sidebar { + @media (min-width: 1025px) { + nav { + padding-top: 1rem; + } + [class^="navTitleMask"] { + visibility: hidden; + } + } +} + +.rspress-sidebar-back-drop { + background-color: var(--iringo-semi-transparent-component-color) !important; + backdrop-filter: saturate(180%) blur(20px); +} diff --git a/theme/components/layout/layout.module.scss b/theme/components/layout/layout.module.scss new file mode 100644 index 0000000..0c9d7f7 --- /dev/null +++ b/theme/components/layout/layout.module.scss @@ -0,0 +1,16 @@ +body { + &.top-arrived { + :global(.rspress-nav) { + background-color: #0000 !important; + backdrop-filter: none; + } + } + + :global(.rspress-nav) { + background-color: var(--iringo-semi-transparent-component-color); + backdrop-filter: saturate(180%) blur(20px); + transition-property: background-color, backdrop-filter; + transition-duration: .3s; + transition-timing-function: ease-in-out; + } +} diff --git a/theme/components/layout/layout.tsx b/theme/components/layout/layout.tsx new file mode 100644 index 0000000..79f445e --- /dev/null +++ b/theme/components/layout/layout.tsx @@ -0,0 +1,26 @@ +import { NavIcon } from '@iringo/doc-ui'; +import Theme from 'rspress/theme'; + +import { useEffect } from 'react'; +import { useTopArrived } from './hooks/use-top-arrived'; + +import styles from './layout.module.scss'; + +import './layout.css'; + +export const Layout = () => { + const { topArrived } = useTopArrived(); + + useEffect(() => { + if (topArrived) { + document.body.classList.add(styles.topArrived); + } else { + document.body.classList.remove(styles.topArrived); + } + return () => { + document.body.classList.remove(styles.topArrived); + }; + }, [topArrived]); + + return } />; +}; diff --git a/theme/env.d.ts b/theme/env.d.ts new file mode 100644 index 0000000..4cdccaf --- /dev/null +++ b/theme/env.d.ts @@ -0,0 +1,10 @@ +declare module 'csstype' { + interface Properties { + [key: `--${string}`]: string | number; + } +} + +declare module '*.module.scss' { + const content: { [className: string]: string }; + export default content; +} diff --git a/theme/index.tsx b/theme/index.tsx index 85745ca..3a08c1c 100644 --- a/theme/index.tsx +++ b/theme/index.tsx @@ -1,12 +1,10 @@ -import { NavIcon } from '@iringo/doc-ui'; import Theme from 'rspress/theme'; - -const Layout = () => { - return } />; -}; +//import { HomeLayout } from './components/home-layout'; +import { Layout } from './components/layout'; export default { ...Theme, + //HomeLayout, Layout, };