mirror of
https://github.com/reonokiy/blog.nokiy.net.git
synced 2025-06-16 03:32:51 +02:00
chore: update theme guides and project comments, add astro-compress to remove comments
This commit is contained in:
radishzzz
parent
1db68e8716
commit
ef192c4545
21 changed files with 319 additions and 101 deletions
|
|
@ -41,6 +41,7 @@ function initWaline() {
|
|||
init({
|
||||
el: '#waline',
|
||||
serverURL,
|
||||
// Share comments on posts in different languages
|
||||
path: window.location.pathname.replace(/^\/([a-z]{2}(-[a-z]{2})?)\//, '/'),
|
||||
lang: walineLang,
|
||||
emoji,
|
||||
|
|
|
|||
|
|
@ -4,6 +4,7 @@ function setupGithubCards() {
|
|||
if (githubCards.length === 0)
|
||||
return
|
||||
|
||||
// Create an intersection observer to lazy load GitHub repo data when cards enter viewport
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach((entry) => {
|
||||
if (entry.isIntersecting) {
|
||||
|
|
|
|||
|
|
@ -10,8 +10,10 @@ function setupPostPageAnimation() {
|
|||
const tocContainer = document.getElementById('toc-container')
|
||||
|
||||
const isLargeScreen = window.matchMedia('(min-width: 1024px)').matches
|
||||
const isSmallScreen = window.matchMedia('(max-width: 1535px)').matches
|
||||
|
||||
// Post Content + Tags + Comments (First 15 elements)
|
||||
// Post Content + Tags + Comments
|
||||
// First 15 elements
|
||||
gsap.from(allElements.slice(0, 15), {
|
||||
opacity: 0,
|
||||
y: '3rem',
|
||||
|
|
@ -20,8 +22,7 @@ function setupPostPageAnimation() {
|
|||
ease: 'power2.out',
|
||||
stagger: 0.05,
|
||||
})
|
||||
|
||||
// Post Content + Tags + Comments (Rest elements)
|
||||
// Rest elements as the 16 element
|
||||
if (allElements.length > 15) {
|
||||
gsap.from(allElements.slice(15), {
|
||||
opacity: 0,
|
||||
|
|
@ -32,8 +33,9 @@ function setupPostPageAnimation() {
|
|||
})
|
||||
}
|
||||
|
||||
// Desktop Animations
|
||||
if (isLargeScreen) {
|
||||
// Desktop Post Date
|
||||
// Post Date
|
||||
if (dateElement) {
|
||||
gsap.from(dateElement, {
|
||||
opacity: 0,
|
||||
|
|
@ -44,7 +46,7 @@ function setupPostPageAnimation() {
|
|||
})
|
||||
}
|
||||
|
||||
// Desktop TOC Icon
|
||||
// TOC Icon
|
||||
if (tocIcon) {
|
||||
gsap.from(tocIcon, {
|
||||
opacity: 0,
|
||||
|
|
@ -55,7 +57,7 @@ function setupPostPageAnimation() {
|
|||
})
|
||||
}
|
||||
|
||||
// Desktop Toc List
|
||||
// Toc List
|
||||
if (tocListChildren.length > 0) {
|
||||
gsap.from(tocListChildren, {
|
||||
opacity: 0,
|
||||
|
|
@ -67,7 +69,7 @@ function setupPostPageAnimation() {
|
|||
})
|
||||
}
|
||||
|
||||
// Desktop Back Button
|
||||
// Back Button
|
||||
if (backButton) {
|
||||
gsap.from(backButton, {
|
||||
opacity: 0,
|
||||
|
|
@ -78,17 +80,16 @@ function setupPostPageAnimation() {
|
|||
})
|
||||
}
|
||||
}
|
||||
else {
|
||||
// Mobile TOC Container
|
||||
if (tocContainer) {
|
||||
gsap.from(tocContainer, {
|
||||
opacity: 0,
|
||||
y: '3rem',
|
||||
duration: 0.5,
|
||||
delay: 0.1,
|
||||
ease: 'power2.out',
|
||||
})
|
||||
}
|
||||
|
||||
// Mobile Animation (for screens smaller than 1536px)
|
||||
if (isSmallScreen && tocContainer) {
|
||||
gsap.from(tocContainer, {
|
||||
opacity: 0,
|
||||
y: '3rem',
|
||||
duration: 0.5,
|
||||
delay: 0.1,
|
||||
ease: 'power2.out',
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -19,25 +19,30 @@ const filteredHeadings = headings.filter(heading =>
|
|||
---
|
||||
|
||||
{filteredHeadings.length > 0 && (
|
||||
// TOC Container
|
||||
<div
|
||||
id="toc-container"
|
||||
class="mb-4 uno-round-border bg-secondary/5 2xl:(fixed left-0 top-43.5 max-w-[min(calc(50vw-38rem),13rem)] border-none bg-secondary/0)"
|
||||
>
|
||||
{/* Hidden Checkbox */}
|
||||
<input
|
||||
type="checkbox"
|
||||
id="toc-toggle"
|
||||
class="accordion-toggle"
|
||||
hidden
|
||||
/>
|
||||
{/* TOC Toggle */}
|
||||
<div class="relative h-12 w-full">
|
||||
<label
|
||||
for="toc-toggle"
|
||||
class="absolute inset-0 flex cursor-pointer items-center 2xl:(static flex c-secondary/40 transition-colors ease-out hover:c-secondary/80)"
|
||||
>
|
||||
{/* Title on Mobile */}
|
||||
<span class="toc-title">
|
||||
{currentUI.toc}
|
||||
</span>
|
||||
|
||||
{/* Icon on Desktop */}
|
||||
<TocIcon
|
||||
id="toc-icon"
|
||||
aria-hidden="true"
|
||||
|
|
@ -47,13 +52,14 @@ const filteredHeadings = headings.filter(heading =>
|
|||
</label>
|
||||
</div>
|
||||
|
||||
{/* Expandable content wrapper */}
|
||||
{/* Expandable Content Wrapper with Accordion Animation */}
|
||||
<div class="accordion-wrapper">
|
||||
<nav
|
||||
id="toc-content"
|
||||
class="accordion-content"
|
||||
aria-label="Table of Contents"
|
||||
>
|
||||
{/* TOC List */}
|
||||
<ul
|
||||
id="toc-list"
|
||||
class="toc-list"
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ To create automatic figure captions, use the standard Markdown image syntax `
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Output
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ Para crear leyendas automáticas para figuras, utilice la sintaxis estándar de
|
|||
### Sintaxis
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Resultado
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ abbrlink: markdown-extended-features
|
|||
### 構文
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 効果
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ abbrlink: markdown-extended-features
|
|||
### Синтаксис
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Результат
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ abbrlink: markdown-extended-features
|
|||
### 語法
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 效果
|
||||
|
|
|
|||
|
|
@ -17,9 +17,9 @@ abbrlink: markdown-extended-features
|
|||
### 语法
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 效果
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ To add an image, add an exclamation mark `!`, followed by alt text in brackets `
|
|||
### Syntax
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Output
|
||||
|
|
@ -211,51 +213,3 @@ To create a code block, add three backticks ```` ``` ```` at the start and end o
|
|||
- Milk
|
||||
- Cheese
|
||||
```
|
||||
|
||||
#### Output
|
||||
|
||||
- Fruit
|
||||
- Apple
|
||||
- Orange
|
||||
- Banana
|
||||
- Dairy
|
||||
- Milk
|
||||
- Cheese
|
||||
|
||||
## Other Elements
|
||||
|
||||
Including `<sup>` superscript, `<sub>` subscript, `<abbr>` abbreviation, `<del>` strikethrough, `<u>` wavy underline, `<kbd>` keyboard input, and `<mark>` highlight.
|
||||
|
||||
### Syntax
|
||||
|
||||
```html
|
||||
H<sub>2</sub>O
|
||||
|
||||
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
|
||||
|
||||
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
|
||||
|
||||
Good writers always check for <u title="spelling">speling</u> mistakes.
|
||||
|
||||
Press <kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>Delete</kbd> to end the session.
|
||||
|
||||
There is <del>nothing</del> no code either good or bad, but running it makes it so.
|
||||
|
||||
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.
|
||||
```
|
||||
|
||||
### Output
|
||||
|
||||
H<sub>2</sub>O
|
||||
|
||||
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
|
||||
|
||||
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
|
||||
|
||||
Good writers always check for <u title="spelling">speling</u> mistakes.
|
||||
|
||||
Press <kbd>CTRL</kbd> + <kbd>ALT</kbd> + <kbd>Delete</kbd> to end the session.
|
||||
|
||||
There is <del>nothing</del> no code either good or bad, but running it makes it so.
|
||||
|
||||
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ Para agregar una imagen, añada un signo de exclamación `!`, seguido de texto a
|
|||
### Sintaxis
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Resultado
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ abbrlink: markdown-style-guide
|
|||
### 構文
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 効果
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sap
|
|||
### Синтаксис
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### Результат
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ abbrlink: markdown-style-guide
|
|||
### 語法
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 效果
|
||||
|
|
|
|||
|
|
@ -61,7 +61,9 @@ abbrlink: markdown-style-guide
|
|||
### 语法
|
||||
|
||||
```
|
||||
|
||||
|
||||
|
||||
|
||||
```
|
||||
|
||||
### 效果
|
||||
|
|
|
|||
|
|
@ -9,11 +9,11 @@ import GsapAnimation from '@/components/Widgets/GsapAnimation.astro'
|
|||
import themeConfig from '@/config'
|
||||
import Head from '@/layouts/Head.astro'
|
||||
import { getPageInfo } from '@/utils/page'
|
||||
import '@/styles/animation.css'
|
||||
import '@/styles/extend.css'
|
||||
import '@/styles/font.css'
|
||||
import '@/styles/global.css'
|
||||
import '@/styles/markdown.css'
|
||||
import '@/styles/transition.css'
|
||||
|
||||
interface Props {
|
||||
postTitle?: string
|
||||
|
|
@ -26,8 +26,8 @@ const { postTitle, postDescription, postSlug, supportedLangs = [] } = Astro.prop
|
|||
const { isPost } = getPageInfo(Astro.url.pathname)
|
||||
const fontStyle = themeConfig.global.fontStyle === 'serif' ? 'font-serif' : 'font-sans'
|
||||
const MarginBottom = isPost && themeConfig.comment?.enabled
|
||||
? 'mb-10' // Post page with comment system
|
||||
: 'mb-12' // Other pages without comment system
|
||||
? 'mb-10' // Post page with comments
|
||||
: 'mb-12' // Other pages without comments
|
||||
---
|
||||
|
||||
<html
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue