fic/server
2
0
Fork 0
Code Issues Pull Requests 6 Releases Wiki Activity

dashboard: perfect view

Browse Source
This commit is contained in:
nemunaire 2018-12-10 02:10:01 +01:00
parent 25b23e7ae0
commit d60e9264e3
2 changed files with 34 additions and 30 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

56
dashboard/static/index.html
View File

@ -271,7 +271,7 @@
<div class="col-4"> <div class="col-4">
<div ng-controller="EventsController" id="eventsList" style="position: fixed"> <div ng-controller="EventsController" id="eventsList" style="position:fixed;padding-right:10px">
<div ng-repeat="e in events track by e.id" class="swap-animation" ng-cloak> <div ng-repeat="e in events track by e.id" class="swap-animation" ng-cloak>
<div class="card card-sm niceborder" ng-class="e.kind"> <div class="card card-sm niceborder" ng-class="e.kind">
<div class="card-header text-right"> <div class="card-header text-right">
@ -283,8 +283,8 @@
</div> </div>
</div> </div>
<div class="bg-light" ng-controller="CountdownController" style="box-shadow: 0px -5px 5px 5px #e9ecef; position: fixed; bottom: 109px; right: 0; width: 33vw;" ng-cloak> <div ng-controller="CountdownController" style="position: fixed; bottom: 109px; right: 0; width: 33vw; overflow: hidden; padding-top: 25px;" ng-cloak>
<div class="text-center text-dark" ng-if="time.hours === 0 || time.hours" style="margin-top: -5px; width: inherit"> <div class="bg-light text-center text-dark" ng-if="time.hours === 0 || time.hours" style="margin-top: -5px; width: inherit; box-shadow: white 0px -10px 15px 0px;">
<div class="clock" ng-class="{expired: time.expired, end: time.end}" style="font-size: 50px"> <div class="clock" ng-class="{expired: time.expired, end: time.end}" style="font-size: 50px">
<span id="hours">{{ time.hours | time }}</span> <span id="hours">{{ time.hours | time }}</span>
<span class="point">:</span> <span class="point">:</span>
@ -292,7 +292,7 @@
<span class="point">:</span> <span class="point">:</span>
<span id="sec">{{ time.seconds | time }}</span> <span id="sec">{{ time.seconds | time }}</span>
</div> </div>
<div style="font-size: 18px; margin-top: -15px; text-shadow: 0 0 6px #446688;"> <div style="font-size: 18px; margin-top: -15px; text-shadow: 0 0 6px #4eaee6;">
<span ng-if="!time.end && !startIn">Temps restant du challenge forensic</span> <span ng-if="!time.end && !startIn">Temps restant du challenge forensic</span>
<span ng-if="!time.end && startIn">Le challenge forensic va bientôt commencer&nbsp;!</span> <span ng-if="!time.end && startIn">Le challenge forensic va bientôt commencer&nbsp;!</span>
<span ng-if="time.end">Le challenge forensic est terminé&nbsp;!</span> <span ng-if="time.end">Le challenge forensic est terminé&nbsp;!</span>
@ -303,55 +303,55 @@
</div> </div>
</div> </div>
<div style="position: fixed; bottom: 0; right: 0; width: 33vw; height: 110px" class="bg-dark"> <div style="position: fixed; bottom: 0; right: 0; width: 33vw; height: 110px;" class="bg-dark">
<div class="carousel slide" id="carousel-logos" data-ride="carousel" data-interval="10500"> <div class="carousel slide" id="carousel-logos" data-ride="carousel" data-interval="10500" style="height: inherit">
<div class="carousel-inner"> <div class="carousel-inner" style="height: inherit">
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption"> <div class="carousel-caption" style="display: table; width: 100%">
<a href="http://www.epita.fr/" class="mr-3"><img src="/img/epita.png" alt="Epita" style="max-height:110px"></a> <a href="http://www.epita.fr/" class="align-middle text-center" style="display: table-cell; width: 55%"><img src="/img/epita.png" alt="Epita" style="height:100px"></a>
<img src="/img/comcyber.png" alt="Réserves de cyberdéfense" style="height:110px"> <a href="http://www.epita.fr/" class="align-middle text-center" style="display: table-cell; width: 45%"><img src="/img/comcyber.png" alt="Réserves de cyberdéfense" style="height:100px"></a>
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption"> <div class="carousel-caption" style="padding: 15px; display: table;">
<h2 style="margin: 17px">Bienvenue au challenge forensic&nbsp;!</h2> <h2 class="align-middle" style="display: table-cell;">Bienvenue au challenge forensic&nbsp;!</h2>
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption"> <div class="carousel-caption text-indent" style="padding: 0 15px; display: table; line-height: 1.3">
<p class="text-justify text-bold" style="padding: 5px 16px; font-size: 111%"> <p class="text-justify text-bold align-middle" style="display: table-cell; font-size: 111%">
Ce challenge met en scène des scénarii d'attaques auxquels Ce challenge met en scène des scénarii d'attaques auxquels
nos systèmes d'information font face chaque jour. nos systèmes d'information font face chaque jour.
</p> </p>
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption"> <div class="carousel-caption text-indent" style="padding: 0 10px; display: table; line-height: 1.3">
<p class="text-justify text-bold" style="padding: 20px 16px; font-size: 111%"> <p class="text-justify text-bold align-middle" style="display: table-cell; font-size: 111%">
Les {{ teams | objectLength }} équipes doivent, en 4 heures, retracer les attaques à la Les {{ teams | objectLength }} équipes doivent, en 4 heures, retracer les attaques à la
recherche des données exfiltrées. recherche des données confidentielles exfiltrées.
</p> </p>
</div> </div>
</div> </div>
<div class="carousel-item active"> <div class="carousel-item active">
<div class="carousel-caption row" style="padding: 5px"> <div class="carousel-caption" style="padding: 5px; display: table;">
<div class="col-4" style="padding-top: 4px;"> <div class="align-middle" style="display: table-cell; width: 30%">
<a href="https://srs.epita.fr/"><img src="/img/srs.png" alt="Laboratoire SRS" style="max-width:100%; max-height:90px"></a> <a href="https://srs.epita.fr/"><img src="/img/srs.png" alt="Laboratoire SRS" style="max-width:100%; max-height:90px"></a>
</div> </div>
<p class="col-8 text-bold" style="font-size: 110%"> <p class="text-bold align-middle" style="font-size: 110%; display: table-cell; width: 70%;">
Les challenges ont été réalisés par les étudiants de la Les challenges ont été réalisés par les étudiants de la
spécialisation SRS de l'Épita. spécialisation SRS de l'Épita.
</p> </p>
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption row" style="padding: 14px"> <div class="carousel-caption" style="padding: 5px; display: table">
<div class="col-4"> <p class="text-bold align-middle" style="font-size: 111%; display: table-cell; width: 70%">
Avec le parrainage des réserves de cyberdéfense
</p>
<div class="align-middle" style="display: table-cell; width: 30%">
<img src="/img/comcyber.png" alt="Réserves de cyberdéfense" style="max-width:100%; max-height: 80px"> <img src="/img/comcyber.png" alt="Réserves de cyberdéfense" style="max-width:100%; max-height: 80px">
</div> </div>
<p class="col-8 text-bold" style="padding: 3px 5px 10px 0; font-size: 111%">
Avec le parrainage du commandement de la cyberdéfense française
</p>
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
@ -379,10 +379,10 @@
</div> </div>
</div> </div>
<div class="carousel-item"> <div class="carousel-item">
<div class="carousel-caption row" style="padding: 12px"> <div class="carousel-caption" style="display: table;">
<p class="text-bold" style="padding: 5px;"> <p class="text-bold align-middle" style="display: table-cell; padding: 5px">
Retrouvez les solutions des challenges dès demain sur : Retrouvez les solutions des challenges dès demain sur :
<span style="display: block; font-size: 150%" class="text-center"> <span style="display: block; font-size: 135%" class="text-center">
<a style="font-family: mono" href="https://fic.srs.epita.fr/"><span class="text-info">https://fic.srs.epita.fr/</span></a> <a style="font-family: mono" href="https://fic.srs.epita.fr/"><span class="text-info">https://fic.srs.epita.fr/</span></a>
</span> </span>
</p> </p>

8
frontend/static/css/fic.css
View File

@ -92,10 +92,10 @@ body {
color: #A94442; color: #A94442;
} }
.point { .point {
text-shadow: 0 0 20px #0055ff; text-shadow: 0 0 20px #4eaee6;
} }
.bg-dark .point { .bg-dark .point {
text-shadow: 0 0 12px #0055ff; text-shadow: 0 0 12px #4eaee6;
} }
.end .point { .end .point {
text-shadow: 0 0 20px #ff5500; text-shadow: 0 0 20px #ff5500;
@ -295,3 +295,7 @@ blockquote {
.card-sm .card-body.text-indent p { .card-sm .card-body.text-indent p {
text-indent: 0.4rem; text-indent: 0.4rem;
} }
.carousel-item, .carousel-caption {
height: inherit;
}