mirror of
https://github.com/tachiyomiorg/website.git
synced 2024-12-20 23:22:00 +01:00
Stylize changelog
This commit is contained in:
parent
19cbf9a150
commit
976ba0b351
@ -26,9 +26,13 @@ const whatsNew = computed(() => {
|
||||
<div v-else-if="isError">
|
||||
This is the error message: {{ error }}
|
||||
</div>
|
||||
<div v-else>
|
||||
<h2>What's new</h2>
|
||||
<div v-html="whatsNew"></div>
|
||||
<div class="whatsNew" v-else>
|
||||
<header>
|
||||
<IconNewReleases />
|
||||
<h2>What's new</h2>
|
||||
</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>
|
||||
|
@ -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);
|
||||
},
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user