https://full-finger.github.io/ Recent content on FullFinger's blog Hugo zh-cn Mon, 23 Mar 2026 22:05:45 +0800 https://full-finger.github.io/post/26032201/ Sun, 22 Mar 2026 20:30:00 +0800 https://full-finger.github.io/post/26032201/ 通过简单的振子模型来估计硅酸盐玻璃的折射率等光学性质 https://full-finger.github.io/post/helloworld/ Tue, 22 Oct 2019 18:46:47 +0800 https://full-finger.github.io/post/helloworld/ <p>这是一篇测试的文章，您不必理会其内容</p> https://full-finger.github.io/readme/ Mon, 01 Jan 0001 00:00:00 +0000 https://full-finger.github.io/readme/ <h1 id="欢迎">欢迎</h1> <p><img src="https://img.shields.io/badge/%E4%BD%A0%E5%A5%BD!-orangeorange.svg?style=social" alt="欢迎语1"><br> <img src="https://img.shields.io/badge/Hello!-orangeorange.svg?style=social" alt="欢迎语2"><br> <img src="https://img.shields.io/badge/Ciallo%EF%BD%9E%28%E2%88%A0%E3%83%BB%CF%89%3C%29%E2%8C%92%E2%98%85-orange?style=social" alt="欢迎语3"><br> <img src="https://img.shields.io/badge/%E3%81%93%E3%82%93%E3%81%AB%E3%81%A1%E3%81%AF!-orangeorange.svg?style=social" alt="欢迎语4"></p> <div class="gh-heatmap-wrap"> <div class="gh-heatmap-card"> <div class="gh-heatmap-header"> <h3 class="gh-heatmap-title">GitHub</h3> <span class="gh-heatmap-stats"> 过去一年 <strong id="gh-stats-count">--</strong> 次贡献 </span> </div> <div class="gh-heatmap-body" id="gh-heatmap-body"> <div id="gh-skeleton" class="gh-skeleton"> <div class="gh-skeleton-header"> <span></span><span></span><span></span><span></span><span></span><span></span> </div> <div class="gh-skeleton-grid"> <div class="gh-skeleton-side"> <span></span><span></span><span></span><span></span><span></span><span></span><span></span> </div> <div class="gh-skeleton-cells" id="gh-skel-cells"></div> </div> </div> <svg id="gh-svg" class="gh-heatmap-svg" preserveAspectRatio="xMidYMid meet" style="opacity:0"></svg> </div> <div class="gh-heatmap-footer"> <div class="gh-heatmap-legend"> <span>少</span> <div class="gh-legend-cell" style="--o:0.05"></div> <div class="gh-legend-cell" style="--o:0.25"></div> <div class="gh-legend-cell" style="--o:0.5"></div> <div class="gh-legend-cell" style="--o:0.75"></div> <div class="gh-legend-cell" style="--o:1"></div> <span>多</span> </div> </div> </div> <div id="gh-tooltip" class="gh-tooltip"> <div class="gh-tooltip__arrow"></div> <div class="gh-tooltip__body"></div> </div> </div> <style> .gh-heatmap-wrap { position: relative; margin: 20px 0; } .gh-heatmap-card { background: rgba(255,255,255,0.7); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(0,0,0,0.08); border-radius: 16px; padding: 14px 18px; box-shadow: 0 8px 32px rgba(0,0,0,0.08); } [data-color-mode="dark"] .gh-heatmap-card { background: rgba(17,24,39,0.96); border-color: rgba(148,163,184,0.25); box-shadow: 0 10px 32px rgba(0,0,0,0.65); } .gh-heatmap-header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 8px; gap: 10px; } .gh-heatmap-title { font-size: 1.1rem; font-weight: 600; margin: 0; color: inherit; letter-spacing: 0.5px; } .gh-heatmap-stats { font-size: 0.8rem; color: inherit; opacity: 0.6; white-space: nowrap; } .gh-heatmap-stats strong { color: #239a3b; font-weight: 700; opacity: 1; } .gh-heatmap-body { overflow-x: auto; overflow-y: hidden; margin: 0 -12px; padding: 0 12px; position: relative; height: 110px; } .gh-heatmap-svg { width: 100%; height: auto; display: block; transition: opacity 0.4s ease; position: relative; } .gh-skeleton { position: absolute; top: 0; left: 40px; right: 40px; transition: opacity 0.3s ease; } .gh-skeleton-header { display: flex; gap: 14px; margin-bottom: 4px; padding: 4px 0 2px 0; } .gh-skeleton-header span { width: 28px; height: 10px; border-radius: 3px; background: currentColor; opacity: 0.08; animation: ghPulse 1.5s ease-in-out infinite; flex-shrink: 0; } .gh-skeleton-header span:nth-child(2) { animation-delay: 0.1s; } .gh-skeleton-header span:nth-child(3) { animation-delay: 0.2s; } .gh-skeleton-header span:nth-child(4) { animation-delay: 0.3s; } .gh-skeleton-header span:nth-child(5) { animation-delay: 0.4s; } .gh-skeleton-header span:nth-child(6) { animation-delay: 0.5s; } .gh-skeleton-grid { display: flex; gap: 3px; } .gh-skeleton-side { display: flex; flex-direction: column; gap: 3px; flex-shrink: 0; margin-left: -28px; } .gh-skeleton-side span { width: 24px; height: 11px; border-radius: 2px; background: currentColor; opacity: 0.06; animation: ghPulse 1.5s ease-in-out infinite; flex-shrink: 0; } .gh-skeleton-side span:nth-child(odd) { opacity: 0; } .gh-skeleton-cells { flex: 1; display: grid; grid-template-columns: repeat(53, 11px); grid-template-rows: repeat(7, 11px); gap: 3px; } .gh-skel-cell { width: 11px; height: 11px; border-radius: 2px; background: currentColor; opacity: 0.06; animation: ghPulse 1.5s ease-in-out infinite; } @media (max-width: 640px) { .gh-skeleton-cells { grid-template-rows: repeat(14, 11px); } .gh-skeleton-side { } .gh-skeleton-side span { display: block; } .gh-skeleton-side span:nth-child(odd) { display: none; } } @keyframes ghPulse { 0%, 100% { opacity: 0.06; } 50% { opacity: 0.14; } } .gh-skeleton.hidden { opacity: 0; pointer-events: none; } .gh-heatmap-footer { display: flex; justify-content: flex-end; margin-top: 10px; } .gh-heatmap-legend { display: flex; align-items: center; gap: 5px; font-size: 0.75rem; color: inherit; opacity: 0.6; } .gh-legend-cell { width: 11px; height: 11px; border-radius: 2px; background: #239a3b; opacity: var(--o); flex-shrink: 0; } .gh-tooltip { position: fixed; pointer-events: none; z-index: 1000; display: none; } .gh-tooltip.show { display: block; } .gh-tooltip__body { background: rgba(30,30,30,0.95); backdrop-filter: blur(12px); border-radius: 8px; padding: 8px 12px; font-size: 0.75rem; font-weight: 500; color: #fff; white-space: nowrap; box-shadow: 0 4px 16px rgba(0,0,0,0.25); position: relative; } [data-color-mode="dark"] .gh-tooltip__body { background: rgba(17,24,39,0.95); } .gh-tooltip__arrow { position: absolute; left: 50%; width: 0; height: 0; border-style: solid; transform: translateX(-50%); } .gh-tooltip.above .gh-tooltip__arrow { top: 100%; border-width: 6px 6px 0 6px; border-color: rgba(30,30,30,0.95) transparent transparent transparent; margin-top: -1px; } [data-color-mode="dark"] .gh-tooltip.above .gh-tooltip__arrow { border-color: rgba(17,24,39,0.95) transparent transparent transparent; } .gh-tooltip.below .gh-tooltip__arrow { bottom: 100%; border-width: 0 6px 6px 6px; border-color: transparent transparent rgba(30,30,30,0.95) transparent; margin-bottom: -1px; } [data-color-mode="dark"] .gh-tooltip.below .gh-tooltip__arrow { border-color: transparent transparent rgba(17,24,39,0.95) transparent; } .gh-tooltip.above.show { animation: ghFadeIn 150ms ease-out; } .gh-tooltip.below.show { animation: ghFadeInBelow 150ms ease-out; } @keyframes ghFadeIn { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } } @keyframes ghFadeInBelow { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } } .heatmap-cell { transition: opacity 150ms, filter 150ms; cursor: default; } .heatmap-cell:hover { opacity: 1 !important; filter: drop-shadow(0 2px 6px rgba(35,154,59,0.4)); } </style> <script> (function () { 'use strict'; const NS = 'http://www.w3.org/2000/svg'; const CELL = 11, GAP = 3; const LEVEL_OPACITY = [0.05, 0.25, 0.5, 0.75, 1.0]; const MONTHS = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec']; const DAYS_7 = ['', 'Mon', '', 'Wed', '', 'Fri', '']; const DAYS_14 = ['', 'Mon', '', 'Tue', '', 'Wed', '', 'Thu', '', 'Fri', '', 'Sat', '', 'Sun']; const LABEL_OFFSET = 28, HEADER_OFFSET = 16; const MOBILE_BREAKPOINT = 640; const svg = document.getElementById('gh-svg'); const statsCount = document.getElementById('gh-stats-count'); const tooltip = document.getElementById('gh-tooltip'); const tooltipBody = tooltip.querySelector('.gh-tooltip__body'); const tooltipArrow = tooltip.querySelector('.gh-tooltip__arrow'); const skeleton = document.getElementById('gh-skeleton'); const skelCells = document.getElementById('gh-skel-cells'); let contributions = []; let dataLoaded = false; function buildSkeletonCells() { skelCells.innerHTML = ''; const rows = getRows(); const cols = rows === 14 ? 27 : 53; skelCells.style.gridTemplateRows = `repeat(${rows}, 11px)`; skelCells.style.gridTemplateColumns = `repeat(${cols}, 11px)`; for (let i = 0; i < cols * rows; i++) { const d = document.createElement('div'); d.className = 'gh-skel-cell'; d.style.animationDelay = (Math.random() * 1.5).toFixed(2) + 's'; skelCells.appendChild(d); } } function buildSkeletonSide() { const side = skeleton.querySelector('.gh-skeleton-side'); side.innerHTML = ''; const rows = getRows(); for (let i = 0; i < rows; i++) { const span = document.createElement('span'); if (i % 2 === 0) { span.style.opacity = '0'; span.style.height = '11px'; } side.appendChild(span); } } buildSkeletonSide(); buildSkeletonCells(); function isDark() { return document.documentElement.getAttribute('data-color-mode') === 'dark'; } function labelColor() { return isDark() ? 'rgba(255,255,255,0.55)' : 'rgba(0,0,0,0.4)'; } function cellColor(level) { return `rgba(35,154,59,${LEVEL_OPACITY[Math.min(level, 4)]})`; } function getRows() { return window.innerWidth <= MOBILE_BREAKPOINT ? 14 : 7; } function getDays() { return getRows() === 14 ? DAYS_14 : DAYS_7; } function weeks() { return Math.ceil(contributions.length / getRows()); } function svgSize() { return { w: LABEL_OFFSET + weeks() * (CELL + GAP), h: HEADER_OFFSET + getRows() * (CELL + GAP), }; } async function fetchData(retries = 3) { const controller = new AbortController(); const timeout = setTimeout(() => controller.abort(), 8000); try { const res = await fetch( `https://github-contributions-api.jogruber.de/v4/full-finger?y=last`, { signal: controller.signal } ); clearTimeout(timeout); if (!res.ok) throw new Error(res.status); return res.json(); } catch (e) { clearTimeout(timeout); if (retries > 0) { await new Promise(r => setTimeout(r, 2000)); return fetchData(retries - 1); } throw e; } } function buildMonthLabels() { const rows = getRows(); const labels = []; let last = -1; for (let w = 0; w < weeks(); w++) { const idx = w * rows; if (idx >= contributions.length) break; const m = new Date(contributions[idx].date).getMonth(); if (m !== last) { labels.push({ text: MONTHS[m], x: LABEL_OFFSET + w * (CELL + GAP) }); last = m; } } if (labels.length >= 2 && labels[1].x - labels[0].x < 40) { labels.shift(); } return labels; } function render() { if (!dataLoaded || contributions.length === 0) return; const rows = getRows(); const days = getDays(); const { w, h } = svgSize(); svg.setAttribute('viewBox', `0 0 ${w} ${h}`); svg.innerHTML = ''; const bodyEl = document.getElementById('gh-heatmap-body'); bodyEl.style.height = h + 'px'; const fill = labelColor(); buildMonthLabels().forEach(({ text, x }) => { const el = document.createElementNS(NS, 'text'); el.setAttribute('x', x); el.setAttribute('y', 11); el.setAttribute('font-size', 10); el.setAttribute('fill', fill); el.textContent = text; svg.appendChild(el); }); days.forEach((d, i) => { if (!d) return; const el = document.createElementNS(NS, 'text'); el.setAttribute('x', 0); el.setAttribute('y', HEADER_OFFSET + i * (CELL + GAP) + CELL - 1); el.setAttribute('font-size', 9); el.setAttribute('fill', fill); el.textContent = d; svg.appendChild(el); }); contributions.forEach((day, idx) => { const col = Math.floor(idx / rows); const row = idx % rows; const rect = document.createElementNS(NS, 'rect'); rect.setAttribute('x', LABEL_OFFSET + col * (CELL + GAP)); rect.setAttribute('y', HEADER_OFFSET + row * (CELL + GAP)); rect.setAttribute('width', CELL); rect.setAttribute('height', CELL); rect.setAttribute('rx', 2); rect.setAttribute('ry', 2); rect.setAttribute('class', 'heatmap-cell'); rect.setAttribute('fill', cellColor(day.level)); rect.dataset.date = day.date; rect.dataset.count = day.count; svg.appendChild(rect); }); } function transitionIn() { skeleton.classList.add('hidden'); setTimeout(() => { skeleton.style.display = 'none'; svg.style.opacity = '1'; }, 300); } function formatDate(str) { const d = new Date(str); return `${d.getFullYear()}年${d.getMonth() + 1}月${d.getDate()}日`; } function showTooltip(e) { const rect = e.target; if (!rect.dataset.date) return; const count = parseInt(rect.dataset.count, 10); tooltipBody.textContent = count > 0 ? `${formatDate(rect.dataset.date)}: ${count} 次贡献` : `${formatDate(rect.dataset.date)}: 无贡献`; tooltip.classList.add('show'); const cellRect = rect.getBoundingClientRect(); const tipRect = tooltip.getBoundingClientRect(); const gap = 8, margin = 8; let x = cellRect.left + cellRect.width / 2 - tipRect.width / 2; let y = cellRect.top - tipRect.height - gap; let above = true; x = Math.max(margin, Math.min(x, window.innerWidth - tipRect.width - margin)); if (y < margin) { y = cellRect.bottom + gap; above = false; } tooltip.style.left = x + 'px'; tooltip.style.top = y + 'px'; tooltip.classList.toggle('above', above); tooltip.classList.toggle('below', !above); const arrowX = cellRect.left + cellRect.width / 2 - x; tooltipArrow.style.left = arrowX + 'px'; } function hideTooltip() { tooltip.classList.remove('show'); } svg.addEventListener('mouseover', (e) => { if (e.target.classList.contains('heatmap-cell')) showTooltip(e); }); svg.addEventListener('mouseout', (e) => { if (e.target.classList.contains('heatmap-cell')) hideTooltip(e); }); new MutationObserver(render).observe(document.documentElement, { attributes: true, attributeFilter: ['data-color-mode'], }); let lastRows = getRows(); window.addEventListener('resize', () => { const current = getRows(); if (current !== lastRows) { lastRows = current; if (!dataLoaded) { buildSkeletonCells(); buildSkeletonSide(); } render(); } }); fetchData() .then((data) => { statsCount.textContent = data.total.lastYear; contributions = data.contributions; dataLoaded = true; render(); transitionIn(); }) .catch(() => { statsCount.textContent = '加载失败'; skeleton.classList.add('hidden'); setTimeout(() => { skeleton.style.display = 'none'; }, 300); }); })(); </script> <p>19岁，是学生</p>