툴바 버튼 수정
This commit is contained in:
@@ -14,15 +14,14 @@
|
|||||||
|
|
||||||
<div id="toolbar">
|
<div id="toolbar">
|
||||||
<button class="btn btn-warning" id="btn-open"><span>📁</span>폴더 열기 (O)</button>
|
<button class="btn btn-warning" id="btn-open"><span>📁</span>폴더 열기 (O)</button>
|
||||||
|
<button class="btn btn-success" id="btn-rename" disabled><span>✅</span>이름 변경 실행 (S)</button>
|
||||||
<div class="separator"></div>
|
<div class="separator"></div>
|
||||||
<div class="sort-group">
|
<div class="sort-group">
|
||||||
<button class="sort-btn" id="btn-sort-name">이름순</button>
|
<button class="sort-btn" id="btn-sort-name">이름순</button>
|
||||||
<button class="sort-btn" id="btn-sort-date">날짜순</button>
|
<button class="sort-btn" id="btn-sort-date">날짜순</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="separator"></div>
|
<div class="separator"></div>
|
||||||
<button class="btn btn-success" id="btn-rename" disabled><span>✅</span>이름 변경 실행 (S)</button>
|
<button class="btn btn-info active" id="btn-preview-toggle">🔍 미리보기</button>
|
||||||
<div class="separator"></div>
|
|
||||||
<button class="btn btn-ghost active" id="btn-preview-toggle">🔍 미리보기</button>
|
|
||||||
<div style="margin-left:auto; display:flex; align-items:center; gap:8px;">
|
<div style="margin-left:auto; display:flex; align-items:center; gap:8px;">
|
||||||
<span class="dir-path" id="dir-path">폴더를 선택하세요</span>
|
<span class="dir-path" id="dir-path">폴더를 선택하세요</span>
|
||||||
<button class="btn btn-warning" id="btn-reveal" disabled>Finder에서 열기</button>
|
<button class="btn btn-warning" id="btn-reveal" disabled>Finder에서 열기</button>
|
||||||
|
|||||||
@@ -9,6 +9,7 @@
|
|||||||
--accent2: #e96af7;
|
--accent2: #e96af7;
|
||||||
--success: #6af7a0;
|
--success: #6af7a0;
|
||||||
--warning: #f7c26a;
|
--warning: #f7c26a;
|
||||||
|
--info: #6ac8f7;
|
||||||
--text: #e8e8f0;
|
--text: #e8e8f0;
|
||||||
--muted: #6b6b8a;
|
--muted: #6b6b8a;
|
||||||
--drag-over: #3a2e70;
|
--drag-over: #3a2e70;
|
||||||
@@ -83,10 +84,14 @@ body.fullscreen #titlebar {
|
|||||||
.btn-ghost:hover { background: var(--card); }
|
.btn-ghost:hover { background: var(--card); }
|
||||||
.btn-ghost:disabled { color: var(--muted); border-color: var(--border); opacity: .4; cursor: not-allowed; }
|
.btn-ghost:disabled { color: var(--muted); border-color: var(--border); opacity: .4; cursor: not-allowed; }
|
||||||
.btn-ghost.active { border-color: var(--accent); color: var(--accent); }
|
.btn-ghost.active { border-color: var(--accent); color: var(--accent); }
|
||||||
|
.btn-info { background: #0d2535; color: var(--info); border: 1px solid #1a4060; }
|
||||||
|
.btn-info:hover { background: #132e42; }
|
||||||
|
.btn-info:disabled { opacity: .4; cursor: not-allowed; }
|
||||||
|
.btn-info:not(.active) { opacity: .4; }
|
||||||
.sort-group {
|
.sort-group {
|
||||||
display: flex;
|
display: flex;
|
||||||
background: var(--card);
|
background: #0d2535;
|
||||||
border: 1px solid var(--border);
|
border: 1px solid #1a4060;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
padding: 3px;
|
padding: 3px;
|
||||||
gap: 2px;
|
gap: 2px;
|
||||||
@@ -99,8 +104,8 @@ body.fullscreen #titlebar {
|
|||||||
background: transparent; color: var(--muted);
|
background: transparent; color: var(--muted);
|
||||||
transition: background .15s, color .15s;
|
transition: background .15s, color .15s;
|
||||||
}
|
}
|
||||||
.sort-btn:hover { background: var(--surface); color: var(--text); }
|
.sort-btn:hover { background: #132e42; color: var(--info); }
|
||||||
.sort-btn.active { background: var(--accent); color: #fff; }
|
.sort-btn.active { background: #1a3a4a; color: var(--info); }
|
||||||
.btn-success { background: #1a4a2e; color: var(--success); border: 1px solid #2a6a40; }
|
.btn-success { background: #1a4a2e; color: var(--success); border: 1px solid #2a6a40; }
|
||||||
.btn-success:hover { background: #204a34; }
|
.btn-success:hover { background: #204a34; }
|
||||||
.btn-success:disabled { opacity: .4; cursor: not-allowed; transform: none; }
|
.btn-success:disabled { opacity: .4; cursor: not-allowed; transform: none; }
|
||||||
|
|||||||
Reference in New Issue
Block a user