taozuqin/ST-Bionic-Memory-Ecology
1
0
Fork 0
mirror of https://github.com/Youzini-afk/ST-Bionic-Memory-Ecology.git synced 2026-05-15 22:30:38 +08:00
Code Issues Packages Projects Releases Wiki Activity

style(panel): memory list as full-width cards with chips

Browse Source 
Made-with: Cursor
This commit is contained in:
Youzini-afk
2026-04-06 16:19:29 +08:00
parent 76b5116798
commit b6c2ff89ff
2 changed files with 116 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files

150
style.css
View File

@@ -752,101 +752,131 @@
list-style: none;
padding: 0;
margin: 0;
}
.bme-memory-badges {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
flex-shrink: 0;
max-width: min(11rem, 42%);
}
.bme-memory-badges .bme-type-badge {
margin-top: 0;
max-width: 100%;
white-space: normal;
word-break: break-word;
line-height: 1.25;
text-align: left;
}
.bme-memory-body {
flex: 1;
min-width: 0;
display: flex;
flex-direction: column;
align-items: stretch;
gap: 4px;
gap: 8px;
}
.bme-memory-item {
display: flex;
align-items: flex-start;
gap: 10px;
padding: 10px 8px;
border-radius: 6px;
margin-bottom: 4px;
display: block;
margin: 0;
padding: 0;
cursor: pointer;
transition: background 0.1s;
border: 1px solid transparent;
list-style: none;
}
.bme-memory-item:hover {
background: var(--bme-surface-high);
border-color: var(--bme-border);
.bme-memory-card {
display: flex;
flex-direction: column;
align-items: stretch;
gap: 8px;
padding: 11px 12px;
border-radius: 10px;
background: var(--bme-surface-low, #1b1b1e);
border: 1px solid var(--bme-border);
transition:
background 0.15s,
border-color 0.15s,
box-shadow 0.15s;
}
.bme-memory-item.selected {
.bme-memory-item:hover .bme-memory-card {
background: var(--bme-surface-container, #1f1f22);
border-color: rgba(255, 255, 255, 0.1);
box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}
.bme-memory-item.selected .bme-memory-card {
background: var(--bme-primary-dim);
border-color: var(--bme-primary);
box-shadow: 0 0 0 1px rgba(233, 69, 96, 0.12);
}
.bme-memory-card-head {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 6px;
}
.bme-memory-card-head .bme-type-badge {
margin-top: 0;
flex-shrink: 0;
}
.bme-memory-scope-chip {
display: inline-block;
font-size: 9px;
font-weight: 600;
padding: 2px 8px;
border-radius: 999px;
letter-spacing: 0.02em;
color: var(--bme-on-surface-dim);
background: var(--bme-surface-high, #2a2a2d);
border: 1px solid var(--bme-border);
line-height: 1.3;
max-width: 100%;
word-break: break-word;
}
.bme-memory-name {
font-size: 12px;
font-weight: 600;
font-size: 13px;
font-weight: 650;
color: var(--bme-on-surface);
line-height: 1.35;
line-height: 1.4;
letter-spacing: 0.01em;
word-break: break-word;
overflow-wrap: anywhere;
}
.bme-memory-content {
font-size: 11px;
color: var(--bme-on-surface-dim);
line-height: 1.45;
font-size: 11.5px;
color: rgba(228, 225, 230, 0.72);
line-height: 1.5;
display: -webkit-box;
-webkit-line-clamp: 3;
line-clamp: 3;
-webkit-line-clamp: 4;
line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
word-break: break-word;
overflow-wrap: anywhere;
}
.bme-memory-meta {
.bme-memory-foot {
display: flex;
flex-direction: column;
gap: 8px;
margin-top: 2px;
padding-top: 8px;
border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.bme-memory-stats {
display: flex;
flex-wrap: wrap;
align-items: baseline;
gap: 6px 10px;
margin-top: 2px;
align-items: center;
gap: 6px;
}
.bme-memory-stat-pill {
display: inline-flex;
align-items: center;
padding: 3px 9px;
border-radius: 999px;
font-size: 10px;
font-weight: 600;
color: var(--bme-on-surface-dim);
}
.bme-memory-metric {
flex: 0 0 auto;
white-space: nowrap;
background: var(--bme-surface-lowest, #0e0e11);
border: 1px solid var(--bme-border);
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
.bme-memory-regionline {
flex: 1 1 100%;
min-width: 0;
white-space: normal;
line-height: 1.35;
opacity: 0.92;
.bme-memory-region {
font-size: 10px;
line-height: 1.45;
color: var(--bme-on-surface-dim);
opacity: 0.95;
word-break: break-word;
overflow-wrap: anywhere;
}