Leahnaya/aqua-viewer
1
0
Fork 0
mirror of https://github.com/samnyan/aqua-viewer.git synced 2026-04-24 23:28:29 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

[general] Fix styling issue due to some deprecated css

Browse Source
This commit is contained in:
samnyan 2020-03-21 21:31:04 +09:00
parent a3e9d93d28
commit 2887f09ab1
3 changed files with 44 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/app/sega/ongeki/ongeki-recent/ongeki-recent.component.css
View File

@ -34,8 +34,8 @@
}
.result-content .left {
min-width: 40%;
margin: auto;
min-width: 30%;
margin: auto 10px auto auto;
}
.result-content .right {
@ -43,16 +43,13 @@
}
.score-area {
display: flex;
display: grid;
width: 100%;
grid-template-columns: 2fr 1fr;
}
.score-area .score-element {
text-align: right;
}
.score-area .score-left {
width: 55%;
}
.score-area .score-right {
margin: auto;
}
@ -82,6 +79,10 @@
margin-bottom: 10px;
}
.player-card {
margin: 0 auto;
}
.player-card .player-card-header {
display: flex;
padding: 0 10px;
@ -94,3 +95,15 @@
.player-card-image img {
width: 100%;
}
@media screen and (max-width: 600px) {
.score-area {
text-align: center;
grid-template-columns: 1fr;
margin-bottom: 15px;
}
.score-area .score-element {
margin-bottom: 10px;
}
}

10
src/app/sega/ongeki/ongeki-recent/ongeki-recent.component.html
View File

@ -24,7 +24,7 @@
<div class="result-content">
<div class="left">
<div class="score-area">
<div class="score-left">
<div class="score-element">
<span class="score-label">BATTLE SCORE</span><br>
<span class="score-value">{{item.battleScore}}</span><br>
<span *ngIf="item.battleNewRecord">NEW RECORD<br></span>
@ -32,17 +32,17 @@
<span class="score-value">{{item.overDamage / 100}}%</span><br>
<span *ngIf="item.overDamageNewRecord">NEW RECORD<br></span>
</div>
<div class="score-right">
<div class="score-element">
<span class="achievement-value">{{battleRank[item.battleScoreRank]}}</span><br>
</div>
</div>
<div class="score-area">
<div class="score-left">
<div class="score-element">
<span class="score-label">TECHNICAL SCORE</span><br>
<span class="score-value">{{item.techScore}}</span><br>
<span *ngIf="item.techNewRecord">NEW RECORD<br></span>
</div>
<div class="score-right">
<div class="score-element">
<span class="achievement-value">{{technicalRank[item.techScoreRank]}}</span><br>
</div>
</div>
@ -87,7 +87,7 @@
<th>BELL</th>
<td>{{item.bellCount}} / {{item.totalBellCount}}</td>
<td>DAMAGE</td>
<td>{{item.damageCount}}%</td>
<td>{{item.damageCount}}</td>
</tr>
</table>
</div>

23
src/styles.css
View File

@ -31,7 +31,7 @@ mat-card {
table {
width: 100%;
border-spacing: 0;
word-break: break-all;
word-break: break-word;
}
.zebra tr:nth-child(odd) {
@ -51,16 +51,25 @@ table {
font-weight: normal;
}
.pagination /deep/ .ngx-pagination .current {
background: #424242;
pagination-template {
display: flex !important;
}
.pagination /deep/ .ngx-pagination a, .ngx-pagination button {
color: #fff;
.ngx-pagination {
margin: 0 auto 1rem auto !important;
padding: 0 !important;
}
.pagination /deep/ .ngx-pagination a:hover, .ngx-pagination button:hover {
background: #606060;
.ngx-pagination .current {
background: #424242 !important;
}
.ngx-pagination a, .ngx-pagination button {
color: #fff !important;
}
.ngx-pagination a:hover, .ngx-pagination button:hover {
background: #606060 !important;
}