dashboard: improve overall design

This commit is contained in:
nemunaire 2019-03-26 02:23:04 +01:00
commit 25183e2248
2 changed files with 23 additions and 14 deletions

View file

@ -8,7 +8,7 @@
.login {
overflow-x: hidden;
text-overflow: ellipsis;
max-width: 52%;
max-width: 84%;
display: inline-block;
vertical-align: middle;
white-space: nowrap;
@ -22,12 +22,15 @@
background-position: center;
background-repeat: no-repeat;
background-size: cover;
height: 8rem;
margin-bottom: -70px
height: 8.5rem;
margin-bottom: -60px;
}
.card-title {
margin-bottom: 0;
}
.student {
margin-left: 3px;
width: 250px;
margin-left: 0.3%;
width: 16.3%;
}
</style>
<base href="/">
@ -35,21 +38,17 @@
<body>
<div ng-controller="StudentsController" ng-cloak>
<div class="card float-left mt-1 student" ng-repeat="student in students">
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/{{ student.login | lowercase }}')"></div>
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/{{ student.login | lowercase }}')" ng-if="student.login != 'nemunaire'"></div>
<div class="card-img-top" style="background-image: url('https://photos.cri.epita.fr/thumb/mercie_d')" ng-if="student.login == 'nemunaire'"></div>
<div class="card-body">
<h5 class="card-title" ng-controller="PingController">
<span class="login" title="{{ student.login }}">{{ student.login }}</span>
<span class="badge badge-success float-right" ng-if="PING">
Reachable
</span>
<span class="badge badge-danger float-right" ng-if="!PING">
Unreachable
<span class="badge float-right" ng-class="{'badge-success': PING, 'badge-danger': !PING}">
&#x1f4bb;
</span>
</h5>
<div ng-controller="ProgressionController">
<span class="badge ml-1" ng-repeat="(ch,t) in tuto_progress[1]" ng-class="{'badge-success': mychallenges[ch], 'badge-danger': !mychallenges[ch]}">
<span title="{{ t.title }}" ng-bind="t.label"></span>
</span>
<span class="badge ml-1" ng-repeat="(ch,t) in tuto_progress[tutoid]" ng-class="{'badge-success': mychallenges[ch] && mychallenges[ch].recent, 'badge-warning': mychallenges[ch] && !mychallenges[ch].recent, 'badge-danger': !mychallenges[ch]}" title="{{ t.title }} @ {{ mychallenges[ch].time | date: 'medium' }}" ng-bind="t.label"></span>
</div>
</div>
</div>