1
Fork 0
mirror of https://github.com/RYGhub/royalnet.git synced 2024-11-24 03:54:20 +00:00

Display minis in inline-block

This commit is contained in:
Steffo 2018-06-04 17:09:56 +02:00
parent 413b14cf54
commit 0dadd714e6
3 changed files with 73 additions and 68 deletions

View file

@ -38,12 +38,16 @@ input[type="text"], input[type="password"] {
} }
.game-panel { .game-panel {
display: inline-block;
}
.game-grid {
display: grid; display: grid;
max-width: 400px; width: 400px;
position: relative;
border-radius: 10px;
height: 100px; height: 100px;
border-radius: 10px;
margin: 4px; margin: 4px;
position: relative;
} }
.osu { .osu {

View file

@ -1,37 +1,39 @@
<style> <style>
@import url('https://fonts.googleapis.com/css?family=Exo+2'); @import url('https://fonts.googleapis.com/css?family=Exo+2');
</style> </style>
<div class="game-panel osu"> <div class="game-panel">
<div class="background-image"></div> <div class="game-grid osu">
<div class="background-color"></div> <div class="background-image"></div>
<div class="player"> <div class="background-color"></div>
<a href="https://osu.ppy.sh/users/{{ osu.osu_id }}"> <div class="player">
<img src="https://a.ppy.sh/{{ osu.osu_id }}" class="player-image"> <a href="https://osu.ppy.sh/users/{{ osu.osu_id }}">
<span class="player-name">{{ osu.osu_name }}</span> <img src="https://a.ppy.sh/{{ osu.osu_id }}" class="player-image">
</a> <span class="player-name">{{ osu.osu_name }}</span>
</div> </a>
<div class="game-title standard"> </div>
osu! <div class="game-title standard">
</div> osu!
<div class="game-score standard"> </div>
<span class="number">{{ osu.std_pp | int }}</span><span class="pp">pp</span> <div class="game-score standard">
</div> <span class="number">{{ osu.std_pp | int }}</span><span class="pp">pp</span>
<div class="game-title taiko"> </div>
osu!taiko <div class="game-title taiko">
</div> osu!taiko
<div class="game-score taiko"> </div>
<span class="number">{{ osu.taiko_pp | int }}</span><span class="pp">pp</span> <div class="game-score taiko">
</div> <span class="number">{{ osu.taiko_pp | int }}</span><span class="pp">pp</span>
<div class="game-title catch"> </div>
osu!catch <div class="game-title catch">
</div> osu!catch
<div class="game-score catch"> </div>
<span class="number">{{ osu.catch_pp | int }}</span><span class="pp">pp</span> <div class="game-score catch">
</div> <span class="number">{{ osu.catch_pp | int }}</span><span class="pp">pp</span>
<div class="game-title mania"> </div>
osu!mania <div class="game-title mania">
</div> osu!mania
<div class="game-score mania"> </div>
<span class="number">{{ osu.mania_pp | int }}</span><span class="pp">pp</span> <div class="game-score mania">
<span class="number">{{ osu.mania_pp | int }}</span><span class="pp">pp</span>
</div>
</div> </div>
</div> </div>

View file

@ -1,35 +1,34 @@
<style> <div class="game-panel">
@import url('https://fonts.googleapis.com/css?family=Exo+2'); <div class="game-grid rl">
</style> <div class="player">
<div class="game-panel rl"> <a href="http://steamcommunity.com/profiles/{{ rl.steam.steam_id }}">
<div class="player"> <img src="{{ rl.steam.avatar_url() }}" class="player-image">
<a href="http://steamcommunity.com/profiles/{{ rl.steam.steam_id }}"> <span class="player-name">{{ rl.steam.persona_name }}</span>
<img src="{{ rl.steam.avatar_url() }}" class="player-image"> </a>
<span class="player-name">{{ rl.steam.persona_name }}</span> </div>
</a> <div class="game-title duel">
</div> DUELLO
<div class="game-title duel"> </div>
DUELLO <div class="game-score duel">
</div> <img src="{{ rl.solo_rank_image() }}" title="{{ rl.single_mmr }} MMR">
<div class="game-score duel"> </div>
<img src="{{ rl.solo_rank_image() }}"> <div class="game-title doubles">
</div> DOPPIO
<div class="game-title doubles"> </div>
DOPPIO <div class="game-score doubles">
</div> <img src="{{ rl.doubles_rank_image() }}" title="{{ rl.doubles_mmr }} MMR">
<div class="game-score doubles"> </div>
<img src="{{ rl.doubles_rank_image() }}"> <div class="game-title standard">
</div> STANDARD
<div class="game-title standard"> </div>
STANDARD <div class="game-score standard">
</div> <img src="{{ rl.standard_rank_image() }}" title="{{ rl.standard_mmr }} MMR">
<div class="game-score standard"> </div>
<img src="{{ rl.standard_rank_image() }}"> <div class="game-title solostd">
</div> SOLO STD
<div class="game-title solostd"> </div>
SOLO STD <div class="game-score solostd">
</div> <img src="{{ rl.solo_std_rank_image() }}" title="{{ rl.solo_std_mmr }} MMR">
<div class="game-score solostd"> </div>
<img src="{{ rl.solo_std_rank_image() }}">
</div> </div>
</div> </div>