diff --git a/src/renderer/delete.js b/src/renderer/delete.js
index 2726fa9..09b3522 100644
--- a/src/renderer/delete.js
+++ b/src/renderer/delete.js
@@ -24,14 +24,17 @@ deleteConfirmBtn.addEventListener('click', async () => {
await _doDelete(files);
});
+function showDeleteModal(files) {
+ renderTextList(deleteFileList, files.map(f => f.name));
+ _pendingFiles = files;
+ openModal(deleteModal);
+}
+
export function deleteSelected() {
if (!state.selectedIdxs.size) return;
const filesToDelete = [...state.selectedIdxs].sort((a, b) => a - b)
.map(i => state.files[i]).filter(Boolean);
- if (!filesToDelete.length) return;
- renderTextList(deleteFileList, filesToDelete.map(f => f.name));
- _pendingFiles = filesToDelete;
- openModal(deleteModal);
+ if (filesToDelete.length) showDeleteModal(filesToDelete);
}
export function init(gridEl) {
@@ -43,19 +46,11 @@ export function init(gridEl) {
if (!card) return;
const idx = parseInt(card.dataset.idx);
- let filesToDelete;
- if (state.selectedIdxs.size > 0 && state.selectedIdxs.has(idx)) {
- filesToDelete = [...state.selectedIdxs].sort((a, b) => a - b)
- .map(i => state.files[i]).filter(Boolean);
- } else {
- filesToDelete = [state.files[idx]].filter(Boolean);
- }
+ const filesToDelete = (state.selectedIdxs.size > 0 && state.selectedIdxs.has(idx))
+ ? [...state.selectedIdxs].sort((a, b) => a - b).map(i => state.files[i]).filter(Boolean)
+ : [state.files[idx]].filter(Boolean);
- if (!filesToDelete.length) return;
-
- renderTextList(deleteFileList, filesToDelete.map(f => f.name));
- _pendingFiles = filesToDelete;
- openModal(deleteModal);
+ if (filesToDelete.length) showDeleteModal(filesToDelete);
});
}
diff --git a/src/renderer/index.html b/src/renderer/index.html
index 0a36e57..5467128 100644
--- a/src/renderer/index.html
+++ b/src/renderer/index.html
@@ -43,7 +43,7 @@
_
자리 순번
- →
+ →
photo_001.jpg
0개 파일
@@ -53,7 +53,7 @@
🗂️
폴더를 열어 이미지를 불러오세요
- JPG · PNG · GIF · BMP · TIFF · WEBP · HEIC
+
JPG · PNG · GIF · BMP · TIFF · WEBP · HEIC
@@ -64,7 +64,7 @@
diff --git a/src/renderer/style.css b/src/renderer/style.css
index 684a288..17a3bdb 100644
--- a/src/renderer/style.css
+++ b/src/renderer/style.css
@@ -70,6 +70,7 @@ header h1 {
font-family: 'JetBrains Mono', monospace;
font-size: 11px; color: var(--muted); opacity: .7;
max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
+ margin-left: auto;
}
/* ── 앱 레이아웃 ── */
@@ -105,12 +106,7 @@ aside {
.file-explorer {
flex: 1;
overflow: auto;
- scrollbar-width: thin;
- scrollbar-color: var(--border) transparent;
}
-.file-explorer::-webkit-scrollbar { width: 6px; height: 6px; }
-.file-explorer::-webkit-scrollbar-track { background: transparent; }
-.file-explorer::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
/* ── 메인 콘텐츠 ── */
main {
@@ -192,6 +188,7 @@ main {
#input-prefix { width: 160px; }
#input-digits { width: 50px; text-align: center; }
.format-sep { color: var(--muted); font-family: 'JetBrains Mono', monospace; font-size: 14px; }
+.format-arrow { color: var(--muted); font-size: 12px; }
#preview-name {
font-family: 'JetBrains Mono', monospace; font-size: 13px;
color: var(--accent2); background: rgba(124,106,247,.1);
@@ -201,15 +198,24 @@ main {
#sel-count { font-size: 12px; color: var(--accent); font-weight: 700; display: none; }
#sel-count.visible { display: inline; }
+/* ── 공통 스크롤바 ── */
+.file-explorer,
+#grid-container {
+ scrollbar-width: thin;
+ scrollbar-color: var(--border) transparent;
+}
+.file-explorer::-webkit-scrollbar,
+#grid-container::-webkit-scrollbar { width: 6px; }
+.file-explorer::-webkit-scrollbar-track,
+#grid-container::-webkit-scrollbar-track { background: transparent; }
+.file-explorer::-webkit-scrollbar-thumb,
+#grid-container::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
+
/* ── 그리드 컨테이너 ── */
#grid-container {
flex: 1; overflow-y: auto; padding: 20px;
position: relative;
- scrollbar-width: thin; scrollbar-color: var(--border) transparent;
}
-#grid-container::-webkit-scrollbar { width: 6px; }
-#grid-container::-webkit-scrollbar-track { background: transparent; }
-#grid-container::-webkit-scrollbar-thumb { background: var(--border); border-radius: 3px; }
/* ── 그리드: 고정 열 폭 (--thumb-size) ── */
#grid {
@@ -226,6 +232,7 @@ main {
}
#empty-state .icon { font-size: 64px; opacity: .3; }
#empty-state p { font-size: 15px; text-align: center; line-height: 1.6; }
+.empty-state-hint { font-size: 12px; opacity: .6; }
/* ── 카드 ── */
.card {
@@ -527,7 +534,7 @@ footer span { font-size: 11px; color: var(--muted); }
outline-offset: -2px;
}
-/* ── 이동 모달 ── */
+/* ── 모달 공통 ── */
.modal-overlay {
position: fixed; inset: 0;
background: rgba(0,0,0,.65); backdrop-filter: blur(4px);