Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: menu #16

Merged
merged 1 commit into from
Sep 23, 2023
Merged

feat: menu #16

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
11 changes: 8 additions & 3 deletions app.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
<template>
<div class="bg-gray-100 w-full min-h-screen dark:bg-gray-900">
<main class="max-w-3xl m-auto">
<nuxt-page />
</main>
<div class="max-w-3xl m-auto py-10 px-7">
<main>
<nuxt-page />
</main>
<footer>
<git-meta />
</footer>
</div>
</div>
</template>
54 changes: 54 additions & 0 deletions components/git-meta.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,54 @@
<template>
<div
class="dark:hover:text-gray-100 dark:text-gray-300 mt-4 leading-loose dark:prose-invert dark:prose-headings:text-gray-300">
<hr class="text-center mx-auto border border-solid border-[#1f2937] rounded-[5px]"/>
<div
class="text-center flex flex-wrap justify-center items-center py-4 bg-slate-900 mt-4 rounded-md">
<div style="text-align: right; margin-right: 10px;">
<a
href="https://github.com/SnowballXueQiu/RescueMe"
rel="noopener noreferrer"
target="_blank">
<svg fill="currentColor" height="16" viewBox="0 0 16 16" width="16"
xmlns="http://www.w3.org/2000/svg">
<path
d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.012 8.012 0 0 0 16 8c0-4.42-3.58-8-8-8z"/>
</svg>
</a>
</div>
<div class="text-center flex-wrap justify-center items-center hidden md:flex">
<a class="underline-offset-4 hover:underline"
href="https://github.com/SnowballXueQiu/RescueMe"
rel="noopener noreferrer"
target="_blank">SnowballXueQiu/RescueMe</a>
<div class="flex items-center ml-[10px]">
<svg fill="currentColor" height="16" viewBox="0 0 16 16" width="16"
xmlns="http://www.w3.org/2000/svg">
<path
d="M9.5 3.25a2.25 2.25 0 1 1 3 2.122V6A2.5 2.5 0 0 1 10 8.5H6a1 1 0 0 0-1 1v1.128a2.251 2.251 0 1 1-1.5 0V5.372a2.25 2.25 0 1 1 1.5 0v1.836A2.493 2.493 0 0 1 6 7h4a1 1 0 0 0 1-1v-.628A2.25 2.25 0 0 1 9.5 3.25Zm-6 0a.75.75 0 1 0 1.5 0 .75.75 0 0 0-1.5 0Zm8.25-.75a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5ZM4.25 12a.75.75 0 1 0 0 1.5.75.75 0 0 0 0-1.5Z"></path>
</svg>
&nbsp;
<a :href="`https://github.com/SnowballXueQiu/RescueMe/commit/${commit}`"
class="underline-offset-4 hover:underline"
rel="noopener noreferrer"
target="_blank">{{ commit }}</a> &nbsp;&nbsp;
<svg fill="currentColor" height="16" viewBox="0 0 16 16" width="16"
xmlns="http://www.w3.org/2000/svg">
<path
d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327 .668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"></path>
</svg>
<span>&nbsp{{ stargazers_count }}</span>
</div>
</div>
</div>
</div>
</template>

<script lang="ts" setup>
const stargazers_count = ref(0);
const commit = ref('');

fetch('https://api.github.com/repos/SnowballXueQiu/RescueMe').then(res => res.json()).then((json) => stargazers_count.value = json.stargazers_count),
fetch('https://api.github.com/repos/SnowballXueQiu/RescueMe/commits/main').then(res => res.json()).then((json) => commit.value = (json.sha as string)?.slice?.(0, 8) ?? '')

</script>
12 changes: 12 additions & 0 deletions components/logo.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<template>
<div
class="w-full transition-all duration-1000 text-center mb-4 dark:prose-invert dark:prose-headings:text-gray-300"
key="banner"
data-delay="1"
>
<img alt="Rescue Me" class="mx-auto"
src="/logo.svg">
<br/>
<hr class="mx-auto w-full" style="border: 1px solid #1f2937; border-radius: 5px;">
</div>
</template>
38 changes: 29 additions & 9 deletions nuxt.config.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,43 @@
import usePreRenderRoute from "./scripts/usePreRenderRoute";

export default defineNuxtConfig({
devtools: { enabled: false },
devtools: { enabled: true },
modules: [
'@nuxt/content',
'@nuxtjs/tailwindcss'
],
css: ['@/assets/css/main.css'],
// css: ['@/assets/css/main.css'],
nitro: {
preset: 'vercel'
preset: 'static',
prerender:{
routes: [...usePreRenderRoute()],
},
},
experimental: {
externalVue: true,
payloadExtraction: true,
inlineSSRStyles: false,
},
vite: {
vite:{
build: {
cssCodeSplit: true,
cssMinify: true,
chunkSizeWarningLimit: 2000,
minify: true,
minify: 'terser',
terserOptions:{
compress: {
drop_console: true,
drop_debugger: true,
dead_code: false,
},
},
},
},
experimental: {
externalVue: true,
payloadExtraction: true
app:{
head:{
htmlAttrs:{
lang: 'zh-cn'
},
title: 'Rescume Life',
}
},
})
4 changes: 3 additions & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
},
"devDependencies": {
"@nuxt/devtools": "latest",
"@nuxt/webpack-builder": "^3.7.3",
"@tailwindcss/typography": "^0.5.10",
"autoprefixer": "^10.4.15",
"glob": "^10.3.4",
Expand All @@ -20,6 +21,7 @@
},
"dependencies": {
"@nuxt/content": "^2.8.2",
"@nuxtjs/tailwindcss": "^6.8.0"
"@nuxtjs/tailwindcss": "^6.8.0",
"@vueuse/core": "^10.4.1"
}
}
129 changes: 0 additions & 129 deletions pages/[...slug].vue
View file
Open in desktop

This file was deleted.

23 changes: 23 additions & 0 deletions pages/index.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,23 @@
<template>
<div>
<logo />
<content-navigation v-slot="{navigation}">
<ul class="mx-auto">
<template v-for="nav in navigation">
<nuxt-link :to="`/posts/${nav.title}`">
<li
v-if="!nav._draft"
class="
cursor-pointer transition-all duration-500 my-5
text-lg xl:text-xl md:text-lg
dark:text-gray-400 hover:dark:text-gray-100
"
>
{{ nav.title }}
</li>
</nuxt-link>
</template>
</ul>
</content-navigation>
</div>
</template>
60 changes: 60 additions & 0 deletions pages/posts/[...slug].vue
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
<template>
<div>
<p @click="back()" class="cursor-pointer dark:hover:text-gray-100 dark:text-gray-300 ">Back</p>
<transition-group :css="false" @enter="onEnter">
<content-renderer v-if="docFinish" key="renderer" :value="parsedContent" class="
transition-all duration-1000
dark:prose-invert
prose-p:text-gray-700 dark:prose-p:text-gray-300
dark:prose-headings:text-gray-200
prose prose-img:border prose-img:border-solid prose-img:border-gray-200
dark:prose-img:border-gray-700
prose-img:rounded-md max-w-full mx-auto" data-delay="1.2"/>
</transition-group>
<section
v-if="docFinish"
key="footer"
class="transition-all w-full mt-4 text-right opacity-50 text-gray-600 font-sans text-sm dark:text-gray-100">
<a v-for="([author], idx) in parsedContent?.authors"
class="underline-offset-4">
{{ author }} {{ idx === parsedContent?.authors.length - 1 ? '' : ', ' }}
</a>
<br/>
<div v-if="parsedContent?.copyright" class="mt-1 w-fit mr-0 ml-auto">
<span class="underline-offset-4 hover:underline">
&copy; <a :href="parsedContent?.copyright.url">{{ parsedContent?.copyright.name }}</a>
</span>
</div>
</section>
</div>
</template>

<style>
</style>

<script lang="ts" setup>
import { ParsedContent } from '@nuxt/content/dist/runtime/types';
const finish = ref(false);
const docFinish = ref(false);
const onEnter = (el: Element, done: () => void) => {
const delay = Number((el as HTMLElement).dataset.delay ?? 0) * 1000;
const element = el as HTMLElement;
element.style.opacity = '0';
element.style.transform = 'translateY(-20px)';
setTimeout(() => {
element.style.opacity = '1';
element.style.transform = 'translateY(0px)';
done();
}, delay);
}
const parsedContent = ref<ParsedContent>();
const router = useRouter();
const back = () => router.back();
useAsyncData('content', () => queryContent('/').find())
.then((content)=>{
if (content.data.value){
parsedContent.value=content.data.value[0];
}
docFinish.value = true;
})
</script>
20 changes: 0 additions & 20 deletions scripts/useAllRouter.ts
View file
Open in desktop

This file was deleted.

Loading