rcnn/web/src/coaster/AccelerationStripsPanel.module.css
2026-04-24 03:39:20 +02:00

99 lines
1.7 KiB
CSS

.panel {
width: 340px;
background: rgba(8, 8, 12, 0.84);
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 12px;
overflow: hidden;
}
.toggle {
width: 100%;
padding: 10px 14px;
background: transparent;
border: none;
color: rgba(255, 255, 255, 0.75);
font-size: 13px;
font-weight: 600;
cursor: pointer;
text-align: left;
display: flex;
align-items: center;
gap: 6px;
transition: background 0.15s;
}
.toggle:hover {
background: rgba(255, 255, 255, 0.06);
}
.arrow {
font-style: normal;
display: inline-block;
transition: transform 0.15s;
font-size: 10px;
color: rgba(255, 255, 255, 0.4);
}
.arrowOpen {
transform: rotate(90deg);
}
.count {
margin-left: auto;
font-size: 11px;
font-weight: 500;
color: rgba(245, 158, 11, 0.7);
}
.body {
padding: 4px 12px 12px;
border-top: 1px solid rgba(255, 255, 255, 0.07);
}
.stripRow {
display: flex;
align-items: center;
gap: 5px;
margin-bottom: 6px;
font-size: 12px;
}
.stripIndex {
color: rgba(245, 158, 11, 0.9);
font-weight: 600;
min-width: 44px;
flex-shrink: 0;
}
.rangeSep {
color: rgba(255, 255, 255, 0.28);
font-size: 11px;
}
.stripDelete {
margin-left: auto;
flex-shrink: 0;
width: 20px;
height: 20px;
border-radius: 4px;
border: 1px solid rgba(255, 69, 58, 0.25);
background: rgba(255, 69, 58, 0.08);
color: rgba(255, 100, 80, 0.85);
cursor: pointer;
font-size: 14px;
line-height: 1;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
}
.stripDelete:hover {
background: rgba(255, 69, 58, 0.2);
}
.empty {
font-size: 11px;
color: rgba(255, 255, 255, 0.25);
padding: 4px 0 2px;
}