refacto: Changing display of revenues per planet by default + fixing WS for revenues
This commit is contained in:
gauvainboiche
+127
-31
@@ -1,5 +1,7 @@
|
||||
/* ── Reset & base ─────────────────────────────────────────────────────────── */
|
||||
|
||||
.hidden { display: none !important; }
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
@@ -772,6 +774,41 @@ button:hover {
|
||||
animation: econDeltaFade 3s ease forwards;
|
||||
}
|
||||
|
||||
/* ── Resource section tabs ────────────────────────────────────────────────── */
|
||||
|
||||
.resTabs {
|
||||
display: flex;
|
||||
gap: 2px;
|
||||
padding: 6px 8px 0;
|
||||
}
|
||||
|
||||
.resTabBtn {
|
||||
flex: 1;
|
||||
padding: 4px 8px;
|
||||
background: rgba(255, 255, 255, 0.05);
|
||||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||||
border-radius: 4px 4px 0 0;
|
||||
color: rgba(233, 238, 246, 0.55);
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
font-size: 11px;
|
||||
font-weight: 600;
|
||||
cursor: pointer;
|
||||
letter-spacing: 0.03em;
|
||||
transition: color 0.15s, background 0.15s, border-color 0.15s;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.resTabBtn:hover {
|
||||
color: rgba(233, 238, 246, 0.85);
|
||||
background: rgba(255, 255, 255, 0.09);
|
||||
}
|
||||
|
||||
.resTabBtn--active {
|
||||
background: rgba(113, 199, 255, 0.12);
|
||||
border-color: rgba(113, 199, 255, 0.35);
|
||||
color: rgba(113, 199, 255, 0.95);
|
||||
}
|
||||
|
||||
/* ── Economy resource table ───────────────────────────────────────────────── */
|
||||
|
||||
.econTableWrap {
|
||||
@@ -1254,47 +1291,106 @@ canvas {
|
||||
color: rgba(220, 75, 85, 0.9);
|
||||
}
|
||||
|
||||
/* ── Player list popup ─────────────────────────────────────────────────────── */
|
||||
/* ── Players list panel ───────────────────────────────────────────────────── */
|
||||
|
||||
.playerListPopup {
|
||||
position: absolute;
|
||||
z-index: 30;
|
||||
min-width: 120px;
|
||||
max-width: 200px;
|
||||
border-radius: 10px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.13);
|
||||
background: rgba(12, 18, 38, 0.97);
|
||||
backdrop-filter: blur(8px);
|
||||
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.6);
|
||||
padding: 8px 10px;
|
||||
.playerListPanel {
|
||||
padding: 10px 10px 12px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.playerListFilter {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.playerListSearchInput {
|
||||
flex: 1;
|
||||
padding: 6px 10px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
background: rgba(255, 255, 255, 0.06);
|
||||
color: #e9eef6;
|
||||
font-size: 12px;
|
||||
outline: none;
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
transition: border-color 0.15s;
|
||||
}
|
||||
|
||||
.playerListSearchInput:focus {
|
||||
border-color: rgba(113, 199, 255, 0.5);
|
||||
}
|
||||
|
||||
.playerListSearchInput::placeholder {
|
||||
color: rgba(233, 238, 246, 0.35);
|
||||
}
|
||||
|
||||
.playerListSortBtn {
|
||||
padding: 5px 10px;
|
||||
font-size: 11px;
|
||||
font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
|
||||
pointer-events: auto;
|
||||
font-weight: 700;
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
border-radius: 8px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.14);
|
||||
background: rgba(255, 255, 255, 0.07);
|
||||
color: rgba(233, 238, 246, 0.75);
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
transition: background 0.15s;
|
||||
}
|
||||
|
||||
.playerListPopup.hidden {
|
||||
display: none;
|
||||
.playerListSortBtn:hover {
|
||||
background: rgba(255, 255, 255, 0.13);
|
||||
color: #e9eef6;
|
||||
}
|
||||
|
||||
.playerListName--blue {
|
||||
.playerListTableWrap {
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.playerListTable {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
font-size: 11px;
|
||||
font-family: "Courier New", Courier, monospace;
|
||||
}
|
||||
|
||||
.playerListTable thead th {
|
||||
padding: 5px 8px;
|
||||
text-align: left;
|
||||
font-size: 10px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.08);
|
||||
}
|
||||
|
||||
.playerListTable thead th.playerListTh--blue {
|
||||
color: rgba(90, 200, 255, 0.85);
|
||||
}
|
||||
|
||||
.playerListTable thead th.playerListTh--red {
|
||||
color: rgba(220, 75, 85, 0.85);
|
||||
}
|
||||
|
||||
.playerListTable tbody tr:hover {
|
||||
background: rgba(255, 255, 255, 0.04);
|
||||
}
|
||||
|
||||
.playerListTable td {
|
||||
padding: 3px 8px;
|
||||
border-bottom: 1px solid rgba(255, 255, 255, 0.04);
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.playerListCell--blue {
|
||||
color: rgba(90, 200, 255, 0.9);
|
||||
padding: 2px 0;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.playerListName--red {
|
||||
.playerListCell--red {
|
||||
color: rgba(220, 75, 85, 0.9);
|
||||
padding: 2px 0;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.playerListEmpty {
|
||||
color: rgba(233, 238, 246, 0.4);
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/* ── Map action animation ─────────────────────────────────────────────────── */
|
||||
|
||||
Reference in New Issue
Block a user