✨ The solar network product page
This commit is contained in:
		| @@ -1,7 +1,7 @@ | ||||
| <template> | ||||
|   <main class="container mx-auto h-full px-8 flex flex-col gap-16"> | ||||
|     <div class="text-center py-56 flex flex-col items-center justify-center"> | ||||
|       <img src="/favicon.png" class="w-28 h-28 mb-4" /> | ||||
|       <nuxt-img src="/favicon.png" class="w-28 h-28 mb-4" /> | ||||
|       <h1 class="text-5xl font-extrabold mb-3">We <span id="who-are-we" /></h1> | ||||
|       <p class="text-xl mb-8"> | ||||
|         We are a group of friends that make software, hardware and any stuff | ||||
|   | ||||
							
								
								
									
										143
									
								
								app/pages/products/solar-network.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										143
									
								
								app/pages/products/solar-network.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,143 @@ | ||||
| <template> | ||||
|   <main class="container mx-auto h-full px-8 flex flex-col gap-16"> | ||||
|     <div class="text-center py-56 flex flex-col items-center justify-center"> | ||||
|       <img src="/solar-network/icon.png" class="w-28 h-28 mb-4" /> | ||||
|       <h1 class="text-5xl font-extrabold mb-3">Solar Network</h1> | ||||
|       <p class="text-xl mb-8"> | ||||
|         The amazing social network for technology, programming, ACG fans. | ||||
|       </p> | ||||
|       <n-alert | ||||
|         type="warning" | ||||
|         title="Under Construction" | ||||
|         class="max-w-lg mx-auto mb-8" | ||||
|         closable | ||||
|       > | ||||
|         <n-marquee> | ||||
|           <div style="margin-right: 64px"> | ||||
|             小羊懒得施工产品介绍,所以懂得都懂。不懂得我也不好多说,如果你真的知道可以去看我们的宣传片,如果你连宣传片都不知道在哪里的话我也不知道怎么办了。 | ||||
|           </div> | ||||
|         </n-marquee> | ||||
|       </n-alert> | ||||
|       <n-space justify="center"> | ||||
|         <n-button type="primary" size="large" round tag="a" href="#features"> | ||||
|           Explore features | ||||
|         </n-button> | ||||
|         <n-button type="default" size="large" round tag="a" href="#download"> | ||||
|           Download | ||||
|         </n-button> | ||||
|       </n-space> | ||||
|     </div> | ||||
|     <div id="features" class="pb-56"> | ||||
|       <client-only> | ||||
|         <n-grid cols="1 m:2 l:2" responsive="screen" x-gap="32" y-gap="16"> | ||||
|           <n-gi> | ||||
|             <div class="flex items-center justify-center"> | ||||
|               <iframe | ||||
|                 width="560" | ||||
|                 height="315" | ||||
|                 src="https://www.youtube-nocookie.com/embed/Pek0cLDAol4?si=f3J3Kqto5u-Nc_5f" | ||||
|                 title="YouTube video player" | ||||
|                 frameborder="0" | ||||
|                 allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" | ||||
|                 referrerpolicy="strict-origin-when-cross-origin" | ||||
|                 allowfullscreen | ||||
|               ></iframe> | ||||
|             </div> | ||||
|           </n-gi> | ||||
|           <n-gi> | ||||
|             <div | ||||
|               class="flex justify-center text-right h-full py-8 px-4 flex flex-col" | ||||
|             > | ||||
|               <h2 class="text-3xl font-bold mb-3">Features</h2> | ||||
|               <p class="text-lg mb-1"> | ||||
|                 As the alert described, this part is under construction. For now | ||||
|                 you can check out the video on the left. | ||||
|               </p> | ||||
|               <p class="text-md"> | ||||
|                 如果你看得懂这行字就说明你有可能访问不了 | ||||
|                 YouTube,你可以去哔哩哔哩上搜一下 「Solar Network」 | ||||
|                 我懒得放链接了( | ||||
|               </p> | ||||
|             </div> | ||||
|           </n-gi> | ||||
|         </n-grid> | ||||
|       </client-only> | ||||
|     </div> | ||||
|     <div id="download" class="pb-56"> | ||||
|       <client-only> | ||||
|         <n-grid cols="1 m:2 l:2" responsive="screen" x-gap="32" y-gap="16"> | ||||
|           <n-gi> | ||||
|             <div | ||||
|               class="flex justify-center text-left h-full py-8 px-4 flex flex-col" | ||||
|             > | ||||
|               <h2 class="text-3xl font-bold mb-3">Download</h2> | ||||
|               <p class="text-lg mb-1"> | ||||
|                 Get the latest version of Solar Network for your device. | ||||
|               </p> | ||||
|               <p class="text-lg"> | ||||
|                 File-hosting & versioning by | ||||
|                 <a | ||||
|                   class="underline" | ||||
|                   href="https://github.com/Solsynth/HyperNet.Surface" | ||||
|                   target="_blank" | ||||
|                   >GitHub</a | ||||
|                 > | ||||
|               </p> | ||||
|             </div> | ||||
|           </n-gi> | ||||
|           <n-gi> | ||||
|             <div class="flex items-center justify-center flex-col"> | ||||
|               <n-card title="Latest Release"> | ||||
|                 <p> | ||||
|                   <code>{{ latestRelease.data.value?.tag_name }}</code> | ||||
|                 </p> | ||||
|                 <p class="font-bold text-lg"> | ||||
|                   {{ latestRelease.data.value?.name }} | ||||
|                 </p> | ||||
|                 <n-button | ||||
|                   type="primary" | ||||
|                   tag="a" | ||||
|                   target="_blank" | ||||
|                   round | ||||
|                   class="mt-4" | ||||
|                   :href="latestRelease.data.value?.html_url" | ||||
|                 > | ||||
|                   Go to GitHub and Download | ||||
|                   <template #icon> | ||||
|                     <n-icon> | ||||
|                       <launch-round /> | ||||
|                     </n-icon> | ||||
|                   </template> | ||||
|                 </n-button> | ||||
|               </n-card> | ||||
|             </div> | ||||
|           </n-gi> | ||||
|         </n-grid> | ||||
|       </client-only> | ||||
|     </div> | ||||
|   </main> | ||||
| </template> | ||||
|  | ||||
| <script lang="ts" setup> | ||||
| import { | ||||
|   NSpace, | ||||
|   NButton, | ||||
|   NGrid, | ||||
|   NGi, | ||||
|   NCard, | ||||
|   NAlert, | ||||
|   NIcon, | ||||
|   NMarquee, | ||||
| } from "naive-ui"; | ||||
| import { Octokit } from "@octokit/rest"; | ||||
| import { LaunchRound } from "@vicons/material"; | ||||
|  | ||||
| const latestRelease = useAsyncData("sn-latest-release", async () => { | ||||
|   const octo = new Octokit({}); | ||||
|   const resp = await octo.repos.getLatestRelease({ | ||||
|     owner: "Solsynth", | ||||
|     repo: "Solian", | ||||
|   }); | ||||
|   return resp.data; | ||||
| }); | ||||
| </script> | ||||
							
								
								
									
										31
									
								
								bun.lock
									
									
									
									
									
								
							
							
						
						
									
										31
									
								
								bun.lock
									
									
									
									
									
								
							| @@ -11,6 +11,7 @@ | ||||
|         "@nuxt/image": "1.10.0", | ||||
|         "@nuxt/scripts": "0.11.10", | ||||
|         "@nuxtjs/tailwindcss": "6.14.0", | ||||
|         "@octokit/rest": "^22.0.0", | ||||
|         "@unhead/vue": "^2.0.3", | ||||
|         "@vueuse/core": "^13.6.0", | ||||
|         "@vueuse/nuxt": "13.6.0", | ||||
| @@ -291,6 +292,30 @@ | ||||
|  | ||||
|     "@nuxtjs/tailwindcss": ["@nuxtjs/tailwindcss@6.14.0", "", { "dependencies": { "@nuxt/kit": "^3.16.0", "autoprefixer": "^10.4.20", "c12": "^3.0.2", "consola": "^3.4.0", "defu": "^6.1.4", "h3": "^1.15.1", "klona": "^2.0.6", "ohash": "^2.0.11", "pathe": "^2.0.3", "pkg-types": "^2.1.0", "postcss": "^8.5.3", "postcss-nesting": "^13.0.1", "tailwind-config-viewer": "^2.0.4", "tailwindcss": "~3.4.17", "ufo": "^1.5.4", "unctx": "^2.4.1" } }, "sha512-30RyDK++LrUVRgc2A85MktGWIZoRQgeQKjE4CjjD64OXNozyl+4ScHnnYgqVToMM6Ch2ZG2W4wV2J0EN6F0zkQ=="], | ||||
|  | ||||
|     "@octokit/auth-token": ["@octokit/auth-token@6.0.0", "", {}, "sha512-P4YJBPdPSpWTQ1NU4XYdvHvXJJDxM6YwpS0FZHRgP7YFkdVxsWcpWGy/NVqlAA7PcPCnMacXlRm1y2PFZRWL/w=="], | ||||
|  | ||||
|     "@octokit/core": ["@octokit/core@7.0.3", "", { "dependencies": { "@octokit/auth-token": "^6.0.0", "@octokit/graphql": "^9.0.1", "@octokit/request": "^10.0.2", "@octokit/request-error": "^7.0.0", "@octokit/types": "^14.0.0", "before-after-hook": "^4.0.0", "universal-user-agent": "^7.0.0" } }, "sha512-oNXsh2ywth5aowwIa7RKtawnkdH6LgU1ztfP9AIUCQCvzysB+WeU8o2kyyosDPwBZutPpjZDKPQGIzzrfTWweQ=="], | ||||
|  | ||||
|     "@octokit/endpoint": ["@octokit/endpoint@11.0.0", "", { "dependencies": { "@octokit/types": "^14.0.0", "universal-user-agent": "^7.0.2" } }, "sha512-hoYicJZaqISMAI3JfaDr1qMNi48OctWuOih1m80bkYow/ayPw6Jj52tqWJ6GEoFTk1gBqfanSoI1iY99Z5+ekQ=="], | ||||
|  | ||||
|     "@octokit/graphql": ["@octokit/graphql@9.0.1", "", { "dependencies": { "@octokit/request": "^10.0.2", "@octokit/types": "^14.0.0", "universal-user-agent": "^7.0.0" } }, "sha512-j1nQNU1ZxNFx2ZtKmL4sMrs4egy5h65OMDmSbVyuCzjOcwsHq6EaYjOTGXPQxgfiN8dJ4CriYHk6zF050WEULg=="], | ||||
|  | ||||
|     "@octokit/openapi-types": ["@octokit/openapi-types@25.1.0", "", {}, "sha512-idsIggNXUKkk0+BExUn1dQ92sfysJrje03Q0bv0e+KPLrvyqZF8MnBpFz8UNfYDwB3Ie7Z0TByjWfzxt7vseaA=="], | ||||
|  | ||||
|     "@octokit/plugin-paginate-rest": ["@octokit/plugin-paginate-rest@13.1.1", "", { "dependencies": { "@octokit/types": "^14.1.0" }, "peerDependencies": { "@octokit/core": ">=6" } }, "sha512-q9iQGlZlxAVNRN2jDNskJW/Cafy7/XE52wjZ5TTvyhyOD904Cvx//DNyoO3J/MXJ0ve3rPoNWKEg5iZrisQSuw=="], | ||||
|  | ||||
|     "@octokit/plugin-request-log": ["@octokit/plugin-request-log@6.0.0", "", { "peerDependencies": { "@octokit/core": ">=6" } }, "sha512-UkOzeEN3W91/eBq9sPZNQ7sUBvYCqYbrrD8gTbBuGtHEuycE4/awMXcYvx6sVYo7LypPhmQwwpUe4Yyu4QZN5Q=="], | ||||
|  | ||||
|     "@octokit/plugin-rest-endpoint-methods": ["@octokit/plugin-rest-endpoint-methods@16.0.0", "", { "dependencies": { "@octokit/types": "^14.1.0" }, "peerDependencies": { "@octokit/core": ">=6" } }, "sha512-kJVUQk6/dx/gRNLWUnAWKFs1kVPn5O5CYZyssyEoNYaFedqZxsfYs7DwI3d67hGz4qOwaJ1dpm07hOAD1BXx6g=="], | ||||
|  | ||||
|     "@octokit/request": ["@octokit/request@10.0.3", "", { "dependencies": { "@octokit/endpoint": "^11.0.0", "@octokit/request-error": "^7.0.0", "@octokit/types": "^14.0.0", "fast-content-type-parse": "^3.0.0", "universal-user-agent": "^7.0.2" } }, "sha512-V6jhKokg35vk098iBqp2FBKunk3kMTXlmq+PtbV9Gl3TfskWlebSofU9uunVKhUN7xl+0+i5vt0TGTG8/p/7HA=="], | ||||
|  | ||||
|     "@octokit/request-error": ["@octokit/request-error@7.0.0", "", { "dependencies": { "@octokit/types": "^14.0.0" } }, "sha512-KRA7VTGdVyJlh0cP5Tf94hTiYVVqmt2f3I6mnimmaVz4UG3gQV/k4mDJlJv3X67iX6rmN7gSHCF8ssqeMnmhZg=="], | ||||
|  | ||||
|     "@octokit/rest": ["@octokit/rest@22.0.0", "", { "dependencies": { "@octokit/core": "^7.0.2", "@octokit/plugin-paginate-rest": "^13.0.1", "@octokit/plugin-request-log": "^6.0.0", "@octokit/plugin-rest-endpoint-methods": "^16.0.0" } }, "sha512-z6tmTu9BTnw51jYGulxrlernpsQYXpui1RK21vmXn8yF5bp6iX16yfTtJYGK5Mh1qDkvDOmp2n8sRMcQmR8jiA=="], | ||||
|  | ||||
|     "@octokit/types": ["@octokit/types@14.1.0", "", { "dependencies": { "@octokit/openapi-types": "^25.1.0" } }, "sha512-1y6DgTy8Jomcpu33N+p5w58l6xyt55Ar2I91RPiIA0xCJBXyUAhXCcmZaDWSANiha7R9a6qJJ2CRomGPZ6f46g=="], | ||||
|  | ||||
|     "@oxc-minify/binding-android-arm64": ["@oxc-minify/binding-android-arm64@0.77.3", "", { "os": "android", "cpu": "arm64" }, "sha512-9bGiDHSkPr6eaP4+/2DQerG+V69Ut4mezL1JtBTk54Iyc6tNsoHa9s+3wJSUHesXEgiHd/IxwuSXRtD9yC3VhQ=="], | ||||
|  | ||||
|     "@oxc-minify/binding-darwin-arm64": ["@oxc-minify/binding-darwin-arm64@0.77.3", "", { "os": "darwin", "cpu": "arm64" }, "sha512-DcRuFK/W3VqIlS8Wvb9bwd5yX+QTlr2ds2f5HW52OPx4odFwyF3+dD6nj3kyxvxITtf6U3jjqyaZEkq+LSQ5RQ=="], | ||||
| @@ -747,6 +772,8 @@ | ||||
|  | ||||
|     "base64-js": ["base64-js@1.5.1", "", {}, "sha512-AKpaYlHn8t4SVbOHCy+b5+KKgvR4vrsD8vbvrbiQJps7fKDTkjkDry6ji0rUJjC0kzbNePLwzxq8iypo41qeWA=="], | ||||
|  | ||||
|     "before-after-hook": ["before-after-hook@4.0.0", "", {}, "sha512-q6tR3RPqIB1pMiTRMFcZwuG5T8vwp+vUvEG0vuI6B+Rikh5BfPp2fQ82c925FOs+b0lcFQ8CFrL+KbilfZFhOQ=="], | ||||
|  | ||||
|     "binary-extensions": ["binary-extensions@2.3.0", "", {}, "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw=="], | ||||
|  | ||||
|     "bindings": ["bindings@1.5.0", "", { "dependencies": { "file-uri-to-path": "1.0.0" } }, "sha512-p2q/t/mhvuOj/UeLlV6566GD/guowlr0hHxClI0W9m7MWYkL1F0hLo+0Aexs9HSPCtR1SXQ0TD3MMKrXZajbiQ=="], | ||||
| @@ -1113,6 +1140,8 @@ | ||||
|  | ||||
|     "extract-zip": ["extract-zip@2.0.1", "", { "dependencies": { "debug": "^4.1.1", "get-stream": "^5.1.0", "yauzl": "^2.10.0" }, "optionalDependencies": { "@types/yauzl": "^2.9.1" }, "bin": { "extract-zip": "cli.js" } }, "sha512-GDhU9ntwuKyGXdZBUgTIe+vXnWj0fppUEtMDL0+idd5Sta8TGpHssn/eusA9mrPr9qNDym6SxAYZjNvCn/9RBg=="], | ||||
|  | ||||
|     "fast-content-type-parse": ["fast-content-type-parse@3.0.0", "", {}, "sha512-ZvLdcY8P+N8mGQJahJV5G4U88CSvT1rP8ApL6uETe88MBXrBHAkZlSEySdUlyztF7ccb+Znos3TFqaepHxdhBg=="], | ||||
|  | ||||
|     "fast-deep-equal": ["fast-deep-equal@3.1.3", "", {}, "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="], | ||||
|  | ||||
|     "fast-fifo": ["fast-fifo@1.3.2", "", {}, "sha512-/d9sfos4yxzpwkDkuN7k2SqFKtYNmCTzgfEpz82x34IM9/zc8KGxQoXg1liNC/izpRM/MBdt44Nmx41ZWqk+FQ=="], | ||||
| @@ -2233,6 +2262,8 @@ | ||||
|  | ||||
|     "unist-util-visit-parents": ["unist-util-visit-parents@6.0.1", "", { "dependencies": { "@types/unist": "^3.0.0", "unist-util-is": "^6.0.0" } }, "sha512-L/PqWzfTP9lzzEa6CKs0k2nARxTdZduw3zyh8d2NVBnsyvHjSX4TWse388YrrQKbvI8w20fGjGlhgT96WwKykw=="], | ||||
|  | ||||
|     "universal-user-agent": ["universal-user-agent@7.0.3", "", {}, "sha512-TmnEAEAsBJVZM/AADELsK76llnwcf9vMKuPz8JflO1frO8Lchitr0fNaN9d+Ap0BjKtqWqd/J17qeDnXh8CL2A=="], | ||||
|  | ||||
|     "universalify": ["universalify@2.0.1", "", {}, "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw=="], | ||||
|  | ||||
|     "unixify": ["unixify@1.0.0", "", { "dependencies": { "normalize-path": "^2.1.1" } }, "sha512-6bc58dPYhCMHHuwxldQxO3RRNZ4eCogZ/st++0+fcC1nr0jiGUtAdBJ2qzmLQWSxbtz42pWt4QQMiZ9HvZf5cg=="], | ||||
|   | ||||
| @@ -17,6 +17,7 @@ | ||||
|     "@nuxt/image": "1.10.0", | ||||
|     "@nuxt/scripts": "0.11.10", | ||||
|     "@nuxtjs/tailwindcss": "6.14.0", | ||||
|     "@octokit/rest": "^22.0.0", | ||||
|     "@unhead/vue": "^2.0.3", | ||||
|     "@vueuse/core": "^13.6.0", | ||||
|     "@vueuse/nuxt": "13.6.0", | ||||
|   | ||||
		Reference in New Issue
	
	Block a user