auto
3babde5513
This commit introduces a new `DetailsComponent` for displaying detailed punishment data and establishes a route to view punishment history by ID and type. It also updates the API to support fetching individual punishment records and refines database mappings for improved data handling.
114 lines
1.7 KiB
SCSS
114 lines
1.7 KiB
SCSS
table {
|
|
width: 100%;
|
|
table-layout: fixed;
|
|
border-collapse: collapse;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
thead {
|
|
height: 25px;
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
tbody {
|
|
font-size: 0.9em;
|
|
}
|
|
|
|
td {
|
|
padding: 5px 0 5px 0;
|
|
height: 55px;
|
|
}
|
|
|
|
th {
|
|
padding: 5px 0 5px 0;
|
|
}
|
|
|
|
th, td {
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
padding: 5px 0 8px 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
th.historyType, td.historyType {
|
|
width: 100px !important;
|
|
min-width: 100px;
|
|
max-width: 100px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
th.historyPlayer, td.historyPlayer {
|
|
width: 180px !important;
|
|
min-width: 180px;
|
|
max-width: 180px;
|
|
}
|
|
|
|
th.historyReason, td.historyReason {
|
|
width: 540px !important;
|
|
min-width: 540px;
|
|
max-width: 540px;
|
|
}
|
|
|
|
th.historyDate, td.historyDate {
|
|
width: 150px !important;
|
|
min-width: 150px;
|
|
max-width: 150px;
|
|
}
|
|
|
|
table tr td {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.historyPlayerRow:hover {
|
|
background-color: var(--history-table-row-color);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.historyTableHead {
|
|
width: 1300px;
|
|
background-color: var(--history-table-head-color);
|
|
transition: all 100ms cubic-bezier(0.55, 0.085, 0.68, 0.53), 0.5s background ease;
|
|
border-radius: 5px;
|
|
box-shadow: 0 4px 8px -4px rgba(0, 0, 0, 0.2), 0 6px 20px -8px rgba(0, 0, 0, 0.19);
|
|
}
|
|
|
|
.historyType {
|
|
max-width: 100%;
|
|
width: 80px;
|
|
}
|
|
|
|
.historyPlayer {
|
|
max-width: 100%;
|
|
width: 200px;
|
|
text-overflow: clip;
|
|
}
|
|
|
|
.playerContainer {
|
|
display: inline-flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
}
|
|
|
|
.username {
|
|
text-align: center;
|
|
}
|
|
|
|
img {
|
|
vertical-align: middle;
|
|
border-style: none;
|
|
}
|
|
|
|
.avatar {
|
|
margin-bottom: 5px;
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.historyReason {
|
|
width: 650px;
|
|
}
|
|
|
|
.historyDate {
|
|
width: 170px;
|
|
}
|