mirror of
https://github.com/reonokiy/blog.nokiy.net.git
synced 2025-06-17 03:56:19 +02:00
refactor: separate rss and atom generation, optimize back button logic (#22)
* refactor: separate rss and atom generation, optimize back button logic, remove redundant whitespace in component styles * fix: add missing <published> tag in atom feed
This commit is contained in:
radishzz
GitHub
parent
4b05ba9caf
commit
fc1cc050bc
14 changed files with 576 additions and 418 deletions
|
|
@ -69,128 +69,98 @@ document.addEventListener('astro:page-load', initWaline)
|
|||
#waline .wl-login-info {
|
||||
--at-apply: 'mt-0 mr-3'
|
||||
}
|
||||
|
||||
#waline .wl-avatar {
|
||||
--at-apply: 'border-none'
|
||||
}
|
||||
|
||||
#waline .wl-logout-btn {
|
||||
--at-apply: 'z-99'
|
||||
}
|
||||
|
||||
#waline .wl-login-nick:not(:has(img)) {
|
||||
--at-apply: 'leading-3.6 mt-1.4';
|
||||
}
|
||||
|
||||
#waline .wl-panel {
|
||||
--at-apply: 'm-0 rounded border-secondary/25'
|
||||
}
|
||||
|
||||
#waline .wl-header {
|
||||
--at-apply: 'p-0';
|
||||
}
|
||||
|
||||
#waline .wl-header-item {
|
||||
border-bottom: 1px solid var(--waline-border-color);
|
||||
}
|
||||
|
||||
#waline .wl-header label {
|
||||
--at-apply: 'text-3';
|
||||
}
|
||||
|
||||
#waline .wl-header input {
|
||||
--at-apply: 'text-2.8';
|
||||
}
|
||||
|
||||
#waline .wl-card,
|
||||
#waline .wl-header.item3 {
|
||||
--at-apply: 'border-b-0';
|
||||
}
|
||||
|
||||
#waline .wl-card .wl-quote {
|
||||
--at-apply: 'border-is-none mt-4';
|
||||
}
|
||||
|
||||
#waline .wl-editor {
|
||||
--at-apply: 'min-h-24';
|
||||
}
|
||||
|
||||
#waline .wl-editor::placeholder {
|
||||
color: var(--waline-light-grey);
|
||||
}
|
||||
|
||||
#waline .wl-footer {
|
||||
--at-apply: 'm-2';
|
||||
}
|
||||
|
||||
#waline .wl-info .wl-btn {
|
||||
--at-apply: 'rounded';
|
||||
}
|
||||
|
||||
#waline .wl-text-number,
|
||||
#waline .wl-action[title="Markdown Guide"],
|
||||
#waline .wl-sort,
|
||||
#waline .wl-gallery::-webkit-scrollbar {
|
||||
--at-apply: 'hidden';
|
||||
}
|
||||
|
||||
#waline .wl-emoji-popup {
|
||||
--at-apply: 'start-0 rounded border-secondary/25';
|
||||
}
|
||||
|
||||
#waline .wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar {
|
||||
--at-apply: 'w-1.2';
|
||||
}
|
||||
|
||||
#waline .wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar-thumb {
|
||||
background: oklch(var(--un-preset-theme-colors-secondary) / 0.25);
|
||||
}
|
||||
|
||||
#waline .wl-emoji-popup .wl-tab-wrapper::-webkit-scrollbar-track-piece {
|
||||
--at-apply: 'bg-transparent';
|
||||
}
|
||||
|
||||
#waline .wl-gif-popup {
|
||||
--at-apply: 'border-secondary/25';
|
||||
}
|
||||
|
||||
#waline .wl-gif-popup input {
|
||||
--at-apply: 'bg-background border-secondary/25';
|
||||
}
|
||||
|
||||
#waline .wl-gif-popup input::placeholder {
|
||||
--at-apply: 'c-secondary/30 text-3.5';
|
||||
}
|
||||
|
||||
#waline .wl-gallery {
|
||||
--at-apply: 'scrollbar-hidden';
|
||||
}
|
||||
|
||||
#waline .wl-meta-head {
|
||||
--at-apply: 'pt-3 pb-2 px-0';
|
||||
}
|
||||
|
||||
#waline .wl-card-item {
|
||||
--at-apply: 'px-0';
|
||||
}
|
||||
|
||||
#waline .wl-user-avatar {
|
||||
--at-apply: 'mt-1';
|
||||
}
|
||||
|
||||
#waline .wl-content p {
|
||||
--at-apply: 'leading-6 text-3.5';
|
||||
}
|
||||
|
||||
#waline .wl-time {
|
||||
color: oklch(var(--un-preset-theme-colors-primary) / 0.75);
|
||||
}
|
||||
|
||||
#waline .wl-edit,
|
||||
#waline .wl-delete {
|
||||
--at-apply: 'mr-0.4';
|
||||
}
|
||||
|
||||
#waline .wl-like {
|
||||
--at-apply: 'mr-1.2';
|
||||
}
|
||||
|
|
@ -199,33 +169,33 @@ document.addEventListener('astro:page-load', initWaline)
|
|||
<!-- Official CSS Variables >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> -->
|
||||
<!-- https://waline.js.org/reference/client/style.html -->
|
||||
<style>
|
||||
#waline {
|
||||
/* Regular Colors */
|
||||
--waline-white: var(--uno-colors-background);
|
||||
--waline-light-grey: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
--waline-dark-grey: var(--uno-colors-secondary);
|
||||
#waline {
|
||||
/* Regular Colors */
|
||||
--waline-white: var(--uno-colors-background);
|
||||
--waline-light-grey: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
--waline-dark-grey: var(--uno-colors-secondary);
|
||||
|
||||
/* Theme Colors */
|
||||
--waline-theme-color: var(--uno-colors-primary);
|
||||
--waline-active-color: var(--uno-colors-primary);
|
||||
/* Theme Colors */
|
||||
--waline-theme-color: var(--uno-colors-primary);
|
||||
--waline-active-color: var(--uno-colors-primary);
|
||||
|
||||
/* Layout Colors */
|
||||
--waline-color: var(--uno-colors-secondary);
|
||||
--waline-bg-color: var(--uno-colors-background);
|
||||
--waline-bg-color-light: var(--uno-colors-background);
|
||||
--waline-bg-color-hover: var(--uno-colors-background);
|
||||
--waline-border-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
--waline-disable-bg-color: oklch(var(--un-preset-theme-colors-secondary) / 0.05);
|
||||
--waline-disable-color: var(--uno-colors-primary);
|
||||
/* Layout Colors */
|
||||
--waline-color: var(--uno-colors-secondary);
|
||||
--waline-bg-color: var(--uno-colors-background);
|
||||
--waline-bg-color-light: var(--uno-colors-background);
|
||||
--waline-bg-color-hover: var(--uno-colors-background);
|
||||
--waline-border-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
--waline-disable-bg-color: oklch(var(--un-preset-theme-colors-secondary) / 0.05);
|
||||
--waline-disable-color: var(--uno-colors-primary);
|
||||
|
||||
/* Special Colors */
|
||||
--waline-bq-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
/* Special Colors */
|
||||
--waline-bq-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
|
||||
/* Information */
|
||||
--waline-info-bg-color: var(--uno-colors-background);
|
||||
--waline-info-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
/* Information */
|
||||
--waline-info-bg-color: var(--uno-colors-background);
|
||||
--waline-info-color: oklch(var(--un-preset-theme-colors-primary) / 0.25);
|
||||
|
||||
/* Rendering Options */
|
||||
--waline-avatar-radius: 0.5rem;
|
||||
}
|
||||
</style>
|
||||
/* Rendering Options */
|
||||
--waline-avatar-radius: 0.5rem;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import GoBackIcon from '@/assets/icons/go-back.svg';
|
|||
id="back-button"
|
||||
class="hidden"
|
||||
lg="block absolute c-secondary/40 left--10 top-1/2 aspect-square w-4.5 translate-y--1/2 transition-colors ease-out c-secondary active:scale-90 hover:c-primary/80"
|
||||
aria-label="Back to home"
|
||||
aria-label="Go back"
|
||||
>
|
||||
<GoBackIcon
|
||||
aria-hidden="true"
|
||||
|
|
@ -21,16 +21,9 @@ function setupBackButton() {
|
|||
if (window.history.length > 1) {
|
||||
window.history.back()
|
||||
}
|
||||
else {
|
||||
// Click site title link to trigger view transition when no history
|
||||
const titleLink = document.getElementById('site-title-link') as HTMLAnchorElement
|
||||
if (titleLink) {
|
||||
titleLink.click()
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
setupBackButton()
|
||||
document.addEventListener('astro:page-load', setupBackButton)
|
||||
document.addEventListener('astro:after-swap', setupBackButton)
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -82,11 +82,9 @@ const filteredHeadings = headings.filter(heading =>
|
|||
.toc-title {
|
||||
--at-apply: 'font-semibold ml-4 select-none 2xl:hidden';
|
||||
}
|
||||
|
||||
.toc-list {
|
||||
--at-apply: 'list-none pl-0 space-y-2 mt-1 mb-4 2xl:space-y-1.2';
|
||||
}
|
||||
|
||||
.toc-link-h2, .toc-link-h3, .toc-link-h4 {
|
||||
--at-apply: 'text-sm no-underline font-normal text-balance select-none 2xl:(text-3.2 c-secondary/60 transition-colors ease-in hover:(c-secondary font-medium))';
|
||||
}
|
||||
|
|
@ -95,7 +93,6 @@ const filteredHeadings = headings.filter(heading =>
|
|||
.accordion-wrapper {
|
||||
--at-apply: 'grid rows-[0fr] duration-300 ease-in-out';
|
||||
}
|
||||
|
||||
.accordion-content {
|
||||
--at-apply: 'overflow-hidden max-h-66 2xl:(max-h-[calc(100vh-21.5rem)]) pl-4 pr-6';
|
||||
}
|
||||
|
|
@ -104,7 +101,6 @@ const filteredHeadings = headings.filter(heading =>
|
|||
.accordion-toggle:checked ~ .accordion-wrapper {
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
.accordion-toggle:checked ~ .accordion-wrapper .accordion-content {
|
||||
--at-apply: 'overflow-y-auto';
|
||||
}
|
||||
|
|
@ -113,19 +109,15 @@ const filteredHeadings = headings.filter(heading =>
|
|||
.accordion-wrapper {
|
||||
grid-template-rows: 1fr;
|
||||
}
|
||||
|
||||
.accordion-toggle:checked ~ .accordion-wrapper {
|
||||
grid-template-rows: 0fr;
|
||||
}
|
||||
|
||||
.accordion-content {
|
||||
--at-apply: 'overflow-y-auto';
|
||||
}
|
||||
|
||||
.accordion-toggle:checked ~ .accordion-wrapper .accordion-content {
|
||||
--at-apply: 'overflow-hidden';
|
||||
}
|
||||
|
||||
.toc-link-active {
|
||||
--at-apply: 'c-secondary font-medium';
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue