Day.js · 2kB JavaScript date utility library 了解一下。
import dayjs from 'dayjs';
import relativeTime from 'dayjs/plugin/relativeTime'; // 引入相对时间插件
import 'dayjs/locale/zh-cn'; // 引入中文语言包
dayjs.extend(relativeTime); // 使用相对时间插件
dayjs.locale('zh-cn'); // 设置语言为中文
{dayjs(时间).fromNow()}
HomePage About 组件使用了一个左边为头像图片与鼠标交互,右边使用 typed.js
打字机的方案,参考自 Karhdo’s Blog - Coding Adventure。
其中打字机方案的配置如下:
async function initTyped() {
const typedElement = document.getElementById('typedElement');
if (!typedElement) return;
const { default: Typed } = await import('typed.js');
const options = {
strings: ['老麦幽居处,柴扉向晓开。', '清风梳翠柳,暖日抚青苔。', '乐观、坚持;梦,近在咫尺。'],
// 可以使用元素,如:stringsElement: '#bios',
typeSpeed: 80,
backSpeed: 50,
backDelay: 5000,
loop: true,
showCursor: true,
cursorChar: '|'
};
const typed = new Typed(typedElement, options);
const handleBeforeSwap = () => {
typed.destroy();
window.removeEventListener('astro:before-swap', handleBeforeSwap);
};
window.addEventListener('astro:before-swap', handleBeforeSwap);
}
document.addEventListener('astro:page-load', () => {
initTyped();
});
朋友说我还年轻,可以驾驭丰富的颜色。其实他也老了,只是他不肯承认而已。他最初的想法是让标签按钮在页面每次刷新都从样式库里取唯一的值。可他试验了半天都以失败告终,最终退而求其次,只在项目打包时让标签按钮从样式库里取唯一值。
朋友想修改特定页面的内容容器宽度,咨询了主题作者,给出的方案却并未解决朋友的需求。朋友请教于他,他简单了解后给出了很多相应的方案,最终均失败了。一番查看后才发现,原来内容 ID 容器的父容器限制了宽度,结合朋友所用主题,他觉得仅用 CSS 的方法无法完全满足朋友的需求。于是他想到以下方法来解决,
if (document.getElementById('post-6615')) {
document.documentElement.style.setProperty('--be-main-width', '1200px');
}
设置容器宽度原本是 CSS 的工作,但其实换个思路的话,解决问题的办法会变得十分的简单。
追了十四集,他觉得并不如前作《白夜追凶》。让他对这部剧产生兴趣是因为各大影视 UP 主的推广,看之前他十分期待,可十四集过去了,他认为他的期待暂时是过高了。
重温了一遍《三大队》。感动的泪水还是不自觉的再流了一遍,人嘛,有时候就得像程兵那样。倔一点,狠一点。