Mirrors/tachiyomi-website
2
0
Fork 0
mirror of https://github.com/tachiyomiorg/website.git synced 2024-10-31 23:15:05 +01:00
Code Issues Packages Projects Releases Wiki Activity

Stylize changelog

Browse Source
This commit is contained in:
Soitora 2023-08-31 23:49:16 +02:00
parent 19cbf9a150
commit 976ba0b351
No known key found for this signature in database
GPG Key ID: A6D711EB4F2CCD97
2 changed files with 70 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

75
website/src/.vitepress/theme/components/WhatsNew.vue
View File

@ -26,9 +26,13 @@ const whatsNew = computed(() => {
<div v-else-if="isError">
This is the error message: {{ error }}
</div>
<div v-else>
<div class="whatsNew" v-else>
<header>
<IconNewReleases />
<h2>What's new</h2>
<div v-html="whatsNew"></div>
</header>
<div v-html="whatsNew">
</div>
<div>
<p>
View the full release
@ -41,14 +45,69 @@ const whatsNew = computed(() => {
</template>
<style lang="stylus">
.buttons-wrapper {
display: flex
gap: 2rem
.whatsNew {
display: block
border: 1px solid var(--vp-c-bg-soft)
border-radius: 12px
background-color: var(--vp-c-bg-soft)
transition: border-color 0.25s, background-color 0.25s
padding: 24px
height: 100%
margin: 2em auto
& > a {
header {
display: flex
flex-direction: column
align-items: center
justify-content: center
align-items: baseline
margin: 0 0 1rem
}
svg {
font-size: 1.2em
margin-right: 0.5rem
vertical-align: middle
}
h2 {
font-size: 1.5rem
margin: 0
padding: 0
color: var(--vp-c-text-1)
border: none
}
div > p {
margin: 0 0 1rem
color: var(--vp-c-text-2)
font-size: 0.9rem
}
table {
border-radius: 8px
border-collapse: collapse
border: 1px solid var(--vp-c-divider)
tr,
th,
td {
border: none
width: 100%
}
tbody tr {
border-top: 1px solid var(--vp-c-divider)
}
tr > td {
&:first-child {
color: var(--vp-c-text-2)
}
&:last-child {
font-family: var(--vp-font-family-mono)
font-size: var(--vp-code-font-size)
}
}
}
}
</style>

3
website/src/.vitepress/theme/index.ts
View File

@ -14,7 +14,7 @@ import { VueQueryPlugin } from "@tanstack/vue-query";
import { enhanceAppWithTabs } from "vitepress-plugin-tabs/client";
// Import Icon components
import { IconDownload } from "@iconify-prerendered/vue-mdi";
import { IconDownload, IconNewReleases } from "@iconify-prerendered/vue-mdi";
export default {
...DefaultTheme,
@ -23,5 +23,6 @@ export default {
app.use(VueQueryPlugin);
enhanceAppWithTabs(app);
app.component("IconDownload", IconDownload);
app.component("IconNewReleases", IconNewReleases);
},
};