Skip to content

Commit

Permalink
📝 更新文档
Browse files Browse the repository at this point in the history
  • Loading branch information
@KomoriDev
KomoriDev committed Aug 13, 2023
1 parent a123fc2 commit 58d494d
Show file tree
Hide file tree
Showing 39 changed files with 2,464 additions and 1,255 deletions.
42 changes: 20 additions & 22 deletions docs/.vitepress/components/Curtain.vue
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,13 @@
Co-Author: Redlnn <[email protected]>
-->

<script lang="ts">
import { defineComponent } from 'vue'
<script setup lang="ts">
interface Props {
title: string
}
export default defineComponent({
name: 'Curtain',
props: {
title: {
type: String,
default: '你知道的太多了',
},
},
withDefaults(defineProps<Props>(), {
title: '你知道的太多了'
})
</script>

Expand All @@ -25,33 +21,35 @@ export default defineComponent({

<style scoped lang="scss">
.heimu {
color: #10B981;
color: rgba(60, 60, 67);
border-radius: 4px;
padding: 1.5px 4px;
margin: 0 2px;
text-shadow: none;
background-color: #10B981;
transition: color 0.13s linear, background-color 0.13s linear;
background-color: rgba(60, 60, 67);
transition:
color 0.13s linear,
background-color 0.13s linear;
html.dark & {
background-color: #10B981;
color: #10B981;
background-color: #e3e3e3;
color: #e3e3e3;
}
&:deep() {
code {
padding: 0.1rem 0.25rem;
background-color: #10B981;
color: #10B981;
background-color: rgba(60, 60, 67);
color: rgba(60, 60, 67);
html.dark & {
background-color: #10B981;
color: #10B981;
background-color: #e3e3e3;
color: #e3e3e3;
}
}
a {
color: #10B981;
color: rgba(60, 60, 67);
html.dark & {
color: #10B981;
color: #e3e3e3;
}
}
}
Expand All @@ -63,7 +61,7 @@ export default defineComponent({
&:deep() code {
background-color: var(--vp-c-bg) !important;
color: #10B981 !important;
color: rgba(60, 60, 67) !important;
}
html.dark &:deep() a,
Expand Down
111 changes: 33 additions & 78 deletions docs/.vitepress/components/FakeQQ/ChatFile.vue
View file
Original file line number Diff line number Diff line change
@@ -1,82 +1,37 @@
<!--
修改自 https://github.com/Redlnn/Fake-QQ-Chat-Window
MIT License
Copyright (c) 2022 Red_lnn
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
@author Red_lnn
@website https://github.com/Redlnn/Fake-QQ-Chat-Window
-->
<script setup lang="ts">
import { onMounted, ref, type Ref } from 'vue'
const props = defineProps<{
name: string
filename: string
filesize: string
fileicon: string
href: string
onright?: boolean
}>()
const file = ref<HTMLAnchorElement>()
onMounted(() => {
if (props.href && file.value) {
// const file = this.$refs.file as HTMLAnchorElement
file.value.href = props.href
}
})
</script>

<template>
<div class="fakeqq-message" :class="[onright ? 'right' : 'left']">
<div
v-if="avatar"
:style="{ 'background-image': `url(${avatar})` }"
class="fakeqq-message__avatar"
></div>
<div v-else class="fakeqq-message__avatar">
<span class="fakeqq-message__text-avatar">{{ name[0] }}</span>
<a ref="file" target="_blank" style="text-decoration: none">
<div class="normal-file file-element">
<div class="file-header">
<p class="file-name">
<span class="text-ellipsis">{{ filename }}</span>
</p>
<div class="file-icon" :style="{ backgroundImage: `url(${fileicon})` }"></div>
</div>
<div class="file-info">
<span>{{ filesize }}</span>
</div>
</div>
<div class="fakeqq-message__content">
<div class="fakeqq-message__name">{{ name }}</div>
<a ref="file" target="_blank" style="text-decoration: none; color: var(--vp-c-text-1)">
<div class="fakeqq-message__bubble" style="cursor: pointer">
<div class="fakeqq-message__bubble-arrow"></div>
<div class="fakeqq-file__content">
<div class="fakeqq-file__info">
<div class="fakeqq-file__name">{{ filename }}</div>
<div class="fakeqq-file__size">{{ filesize }}</div>
</div>
<div class="fakeqq-file__icon">
<img :src="fileicon" />
</div>
</div>
</div>
</a>
</div>
</div>
</a>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
name: 'ChatFile',
props: {
name: { type: String, required: true },
avatar: String,
filename: { type: String, required: true },
filesize: { type: String, required: true },
fileicon: { type: String, required: true },
href: { type: String, default: '' },
onright: Boolean,
},
mounted() {
if (this.href) {
const file = this.$refs.file as HTMLAnchorElement
file.href = this.href
}
},
})
</script>
113 changes: 59 additions & 54 deletions docs/.vitepress/components/FakeQQ/ChatImg.vue
View file
Original file line number Diff line number Diff line change
@@ -1,61 +1,66 @@
<!--
修改自 https://github.com/Redlnn/Fake-QQ-Chat-Window
<script setup lang="ts">
interface Props {
name: string
avatar?: string
tag?: string
tagBgColor?: string
tagColor?: string
src: string
onright: boolean
}
MIT License
Copyright (c) 2022 Red_lnn
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
@author Red_lnn
@website https://github.com/Redlnn/Fake-QQ-Chat-Window
-->

<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
name: 'ChatImg',
props: {
name: { type: String, required: true },
avatar: String,
src: { type: String, required: true },
onright: Boolean,
maxWidth: { type: String, default: '250px' },
},
withDefaults(defineProps<Props>(), {
name: '',
avatar: undefined,
tag: undefined,
tagBgColor: undefined,
tagColor: undefined,
src: undefined,
onright: false
})
</script>

<template>
<div class="fakeqq-message" :class="[onright ? 'right' : 'left']">
<div
v-if="avatar"
:style="{ 'background-image': `url(${avatar})` }"
class="fakeqq-message__avatar"
></div>
<div v-else class="fakeqq-message__avatar">
<span class="fakeqq-message__text-avatar">{{ name[0] }}</span>
</div>
<div class="fakeqq-message__content">
<div class="fakeqq-message__name">{{ name }}</div>
<img :src="src" :style="{ 'max-width': maxWidth }" />
<section>
<div class="message">
<div
class="message-container"
:class="[onright ? 'message-container--self message-container--align-right' : '']"
>
<span class="avatar-span">
<div
v-if="avatar"
class="avatar message-container__avatar"
:style="{ backgroundImage: `url(${avatar})` }"
></div>
<div v-else class="avatar message-container__avatar text-avatar">
<span>{{ name[0] }}</span>
</div>
</span>
<div class="user-name text-ellipsis">
<span class="text-ellipsis">{{ name }}</span>
<div
class="q-tag member-role-tag"
v-if="tag"
:style="{ backgroundColor: tagBgColor, color: tagColor }"
>
{{ tag }}
</div>
</div>
<div class="message-content__wrapper">
<div class="message-content__wrapper">
<div
class="msg-content-container container--others mix-message__container mix-message__container--pic"
>
<div class="message-content mix-message__inner">
<div class="image pic-element">
<img class="image-content" :src="src" />
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</template>
Loading

0 comments on commit 58d494d

Please sign in to comment.