diff --git a/src/renderer.ts b/src/renderer.ts
index d0a1323..2208bb7 100644
--- a/src/renderer.ts
+++ b/src/renderer.ts
@@ -1469,8 +1469,8 @@ async function loadCutterFromPath(filePath: string): Promise
{
cutterStartTime = 0;
cutterEndTime = info.duration;
- byId('cutterInfo').style.display = 'flex';
- byId('timelineContainer').style.display = 'block';
+ byId('cutterInfo').classList.add('shown');
+ byId('timelineContainer').classList.add('shown');
byId('btnCut').disabled = false;
byId('infoDuration').textContent = formatTime(info.duration);
diff --git a/src/styles.css b/src/styles.css
index c8f795e..84f5c2b 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -2943,12 +2943,17 @@ select option {
}
.timeline-container {
+ display: none;
background: var(--bg-card);
border-radius: 8px;
padding: 20px;
margin-bottom: 20px;
}
+.timeline-container.shown {
+ display: block;
+}
+
.timeline {
position: relative;
height: 60px;
@@ -3027,15 +3032,19 @@ select option {
}
.cutter-info {
+ display: none;
background: var(--bg-card);
border-radius: 8px;
padding: 15px 20px;
margin-bottom: 20px;
- display: flex;
justify-content: space-around;
text-align: center;
}
+.cutter-info.shown {
+ display: flex;
+}
+
.cutter-info-item {
display: flex;
flex-direction: column;