GitHub/quartz
1
0
Fork 2
mirror of https://github.com/jackyzha0/quartz.git synced 2025-12-24 05:14:06 -06:00
Code Issues Actions Packages Projects Releases Wiki Activity

translate comments into English

Browse Source
This commit is contained in:
tsumac 2025-06-15 21:54:28 +09:00
parent e6449ffdc6
commit 668bb8b01a
3 changed files with 37 additions and 37 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
quartz/components/scripts/linkcard.inline.ts
View File

@ -1,29 +1,29 @@
// Handle link card image failures
function handleLinkCardImages() {
const linkCardImages = document.querySelectorAll('.rlc-image')
const linkCardImages = document.querySelectorAll('.rlc-image')
linkCardImages.forEach((img: Element) => {
const imgElement = img as HTMLImageElement
const container = imgElement.closest('.rlc-image-container')
linkCardImages.forEach((img: Element) => {
const imgElement = img as HTMLImageElement
const container = imgElement.closest('.rlc-image-container')
if (!container) return
if (!container) return
// 画像が既に読み込みエラーの場合（complete=true かつ naturalWidth=0）
if (imgElement.complete && imgElement.naturalWidth === 0) {
container.classList.add('image-failed')
return
}
// If the image has already failed to load (complete=true and naturalWidth=0)
if (imgElement.complete && imgElement.naturalWidth === 0) {
container.classList.add('image-failed')
return
}
// 画像読み込みエラー時のイベントリスナー
const handleError = () => {
container.classList.add('image-failed')
}
// Event listener for image load errors
const handleError = () => {
container.classList.add('image-failed')
}
imgElement.addEventListener('error', handleError)
window.addCleanup(() => imgElement.removeEventListener('error', handleError))
})
}
imgElement.addEventListener('error', handleError)
window.addCleanup(() => imgElement.removeEventListener('error', handleError))
})
}
// ページ読み込み時とナビゲーション時に実行
document.addEventListener('nav', handleLinkCardImages)
document.addEventListener('DOMContentLoaded', handleLinkCardImages)
// Execute on page load and navigation events
document.addEventListener('nav', handleLinkCardImages)
document.addEventListener('DOMContentLoaded', handleLinkCardImages)

10
quartz/components/styles/linkcard.scss
View File

@ -76,10 +76,10 @@
background: var(--lightgray);
position: relative;
overflow: hidden;
min-width: 120px; // 最小幅を設定
max-width: 300px; // 最大幅を設定
height: 120px; // 高さは固定
width: auto; // 幅は画像に応じて自動調整
min-width: 120px; // set minimum width
max-width: 300px; // set maximum width
height: 120px; // fixed height
width: auto; // width adjusts automatically to image
&.image-failed {
display: none;
@ -109,7 +109,7 @@
width: 100%;
height: 160px;
order: -1;
max-width: none; // モバイルでは最大幅制限を解除
max-width: none; // remove max-width restriction on mobile
&.image-failed {
display: none;

12
quartz/styles/linkcard.scss
View File

@ -76,10 +76,10 @@
background: var(--lightgray);
position: relative;
overflow: hidden;
min-width: 120px; // 最小幅を設定
max-width: 300px; // 最大幅を設定
height: 120px; // 高さは固定
width: auto; // 幅は画像に応じて自動調整
min-width: 120px; // set minimum width
max-width: 300px; // set maximum width
height: 120px; // fixed height
width: auto; // width adjusts automatically to image
&.image-failed {
display: none;
@ -91,7 +91,7 @@
height: 100%;
object-fit: cover;
object-position: center;
min-width: 100%; // コンテナの幅は最低限埋める
min-width: 100%; // ensure container is at least filled
}
}
@ -109,7 +109,7 @@
width: 100%;
height: 160px;
order: -1;
max-width: none; // モバイルでは最大幅制限を解除
max-width: none; // remove max-width restriction on mobile
&.image-failed {
display: none;