Files
shadow-over-bishkek001/dialogEditor/src/components/LeftPanel/LeftPanel.module.css
T

186 lines
2.6 KiB
CSS

.panel {
width: 220px;
min-width: 220px;
background: #181825;
border-right: 1px solid #313244;
display: flex;
flex-direction: column;
height: 100%;
overflow: hidden;
}
.header {
padding: 12px 12px 6px;
border-bottom: 1px solid #313244;
}
.title {
font-size: 13px;
font-weight: 700;
color: #cdd6f4;
display: block;
}
.fileName {
font-size: 10px;
color: #6c7086;
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.fileButtons {
display: flex;
gap: 6px;
padding: 8px 10px;
border-bottom: 1px solid #313244;
}
.btn {
flex: 1;
background: #313244;
color: #cdd6f4;
border: none;
border-radius: 4px;
padding: 5px 8px;
font-size: 12px;
cursor: pointer;
transition: background 0.15s;
}
.btn:hover {
background: #45475a;
}
.btnSave {
background: #1e66f5;
color: #fff;
}
.btnSave:hover {
background: #2779e4;
}
.btnNew {
background: #40a02b;
color: #fff;
}
.btnNew:hover {
background: #37872b;
}
.errorMsg {
background: #2a0e14;
color: #f38ba8;
font-size: 11px;
padding: 6px 10px;
border-top: 1px solid #f38ba8;
}
.list {
flex: 1;
overflow-y: auto;
padding: 4px 0;
}
.emptyMsg {
padding: 16px 12px;
color: #6c7086;
font-size: 12px;
text-align: center;
}
.dialogueItem {
display: flex;
align-items: center;
padding: 6px 10px;
cursor: pointer;
border-radius: 4px;
margin: 1px 4px;
transition: background 0.1s;
}
.dialogueItem:hover {
background: #313244;
}
.dialogueItem.active {
background: #1e3a5f;
}
.dialogueId {
flex: 1;
font-size: 11px;
font-family: monospace;
color: #cdd6f4;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
display: flex;
align-items: center;
gap: 4px;
}
.errDot { color: #f38ba8; font-size: 9px; }
.warnDot { color: #f9e2af; font-size: 9px; }
.mobileDot { font-size: 10px; }
.copyBtn {
background: none;
border: none;
color: #6c7086;
cursor: pointer;
font-size: 13px;
line-height: 1;
padding: 0 2px;
flex-shrink: 0;
}
.copyBtn:hover {
color: #89b4fa;
}
.deleteBtn {
background: none;
border: none;
color: #6c7086;
cursor: pointer;
font-size: 16px;
line-height: 1;
padding: 0 2px;
flex-shrink: 0;
}
.deleteBtn:hover {
color: #f38ba8;
}
.footer {
padding: 8px;
border-top: 1px solid #313244;
}
.createForm {
display: flex;
gap: 4px;
}
.createInput {
flex: 1;
background: #313244;
border: 1px solid #45475a;
border-radius: 4px;
color: #cdd6f4;
font-size: 11px;
padding: 4px 6px;
min-width: 0;
font-family: monospace;
}
.createInput:focus {
outline: none;
border-color: #89b4fa;
}