Update bootstrap to 4.0-beta

This commit is contained in:
nemunaire 2017-12-14 04:08:43 +01:00
commit 73080d7d0d
23 changed files with 608 additions and 641 deletions

View file

@ -1,5 +1,8 @@
<div class="well well-lg" style="text-indent: 1em">
<h3 style="text-indent: 0">Bienvenue <span ng-repeat="member in my.members"><span ng-if="$last && !$first"> et </span><span ng-if="$middle">, </span>{{ member.firstname | capitalize }} {{ member.lastname | capitalize }}</span> !</h3>
<div class="row">
<div class="col text-justify">
<div class="jumbotron" style="text-indent: 1em">
<h2 style="text-indent: 0">Bienvenue <span ng-repeat="member in my.members"><span ng-if="$last && !$first"> et </span><span ng-if="$middle">, </span>{{ member.firstname | capitalize }} {{ member.lastname | capitalize }}</span> !</h2>
<hr>
<p ng-if="(my.team_id)">
Félicitations ! vous êtes maintenant connecté à l'espace de votre
équipe <em>{{ teams[my.team_id].name }}</em>. Vous pouvez changer ce nom
@ -27,17 +30,20 @@
<strong>Attention :</strong> puisqu'il s'agit de captures effectuées dans le
but de découvrir si des actes malveillants ont été commis sur différents
systèmes d'information, les contenus qui sont
téléchargeables <em>peuvent</em> contenir du contenu malveillant !
téléchargeables <em>peuvent</em> contenir du contenu malveillant&nbsp;!
</div>
<div class="panel panel-default" ng-if="(my.team_id)">
<div class="panel-heading">
<h3 class="panel-title">Progression</h3>
</div>
<div class="panel-body">
</div>
<div class="col-md-3" ng-if="(my.team_id)">
<div class="card text-white bg-primary">
<div class="card-header">
Progression
</div>
<div class="card-body">
<strong>Vous</strong>
<div class="progress progress-striped">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="60"
<div class="progress-bar bg-success" role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100" style="width: {{ my.score * 100 / max_gain }}%;">
<span class="sr-only">{{ my.score * 100 / max_gain }}% Complete</span>
</div>
@ -45,7 +51,7 @@
<strong>Le temps</strong>
<div class="progress">
<div class="progress-bar progress-bar-info" role="progressbar" aria-valuenow="60"
<div class="progress-bar bg-info" role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100" style="width: {{ 100 - time.remaining / time.duration * 100 }}%;">
<span class="sr-only">{{ time.remaining }} secondes restantes</span>
</div>
@ -54,7 +60,7 @@
<div ng-if="rank.length && rank[0].id != my.team_id">
<strong>La meilleure équipe ({{ rank[0].name }})</strong>
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="60"
<div class="progress-bar bg-success" role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100" style="width: {{ rank[0].score * 100 / max_gain }}%;">
<span class="sr-only">{{ rank[0].score * 100 / max_gain }}% Complete</span>
</div>
@ -64,7 +70,7 @@
<div ng-if="rank[0].id == my.team_id && rank.length > 1">
<strong>La seconde équipe ({{ rank[1].name }})</strong>
<div class="progress">
<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="60"
<div class="progress-bar bg-success" role="progressbar" aria-valuenow="60"
aria-valuemin="0" aria-valuemax="100" style="width: {{ rank[1].score * 100 / max_gain }}%;">
<span class="sr-only">{{ rank[1].score * 100 / max_gain }}% Complete</span>
</div>

View file

@ -1,5 +1,5 @@
<div class="panel panel-success">
<div class="panel-body">
<div class="card bg-primary text-light">
<div class="card-body">
<input type="search" class="form-control" placeholder="Rechercher" ng-model="query">
</div>
<table class="table table-hover table-striped">

View file

@ -1,12 +1,14 @@
<div class="well well-lg text-indent">
<div class="card-group">
<div class="card">
<div class="card-body text-indent">
<h2>Débloquage des challenges</h2>
<p>
Au début, seul le premier challenge de chaque thème est
accessible. Les challenges de niveau supérieur sont débloqués en
validant le challenge du niveau qui les précéde.
</p>
<hr>
<h2>Le classement</h2>
<p>
Pour figurer dans le classement, il faut avoir réalisé au moins une action :
@ -23,8 +25,6 @@
Pour gagner des points, vous devez résoudre les challenges qui vous sont
proposés. Plus l'exercice est compliqué, plus il rapporte de points.
</p>
<div class="row">
<div class="col-sm-offset-3 col-sm-6">
<table class="table table-condensed table-striped">
<thead>
<tr>
@ -55,8 +55,6 @@
</tr>
</tbody>
</table>
</div>
</div>
<h3>Coût des indices</h3>
<p>
@ -65,14 +63,16 @@
points, la valeur de points perdue est indiquée pour chaque indice.
</p>
</div>
</div>
<div class="card">
<div class="card-body text-indent">
<h3>Coût de soumission</h3>
<p>
Vous disposez de 9 tentatives pour trouver la/les solutions d'un
challenge. Au delà, chaque tentative vous fait perdre une petite quantité
de points comme suit :
</p>
<div class="row">
<div class="col-sm-offset-2 col-sm-8">
<table class="table table-condensed table-striped">
<thead>
<tr>
@ -107,8 +107,6 @@
</tr>
</tbody>
</table>
</div>
</div>
<p>
Par exemple :
</p>
@ -122,6 +120,7 @@
La dernière soumission (lorsque tous les flags sont bons) est comptabilisée
parmi ce nombre de tentatives.
</p>
<hr>
<h3>Bonus</h3>
<p>
@ -146,3 +145,5 @@
thème"></span>
</p>
</div>
</div>
</div>

View file

@ -1,6 +1,6 @@
<div class="panel panel-default">
<div class="panel-heading">Votre équipe est composée de :</div>
<div class="panel-body" ng-if="!my.members.length">
<div class="card">
<div class="card-header">Votre équipe est composée de :</div>
<div class="card-body" ng-if="!my.members.length">
Passez voir l'équipe serveur pour compléter ces informations.
</div>
<ul class="list-group" ng-if="my.members.length">
@ -13,22 +13,20 @@
</ul>
</div>
<div class="panel panel-info">
<div class="panel-heading">Changer de nom d'équipe</div>
<div class="panel-body">
<div class="card border-info" style="margin-top: 10px">
<div class="card-header bg-info text-light">Changer de nom d'équipe</div>
<div class="card-body">
<p ng-class="messageClass" ng-if="message || sberr"><strong ng-if="!sberr">Votre demande a bien été envoyée !</strong><strong ng-if="sberr">{{ sberr }}</strong> {{ message }}</p>
<form class="form-horizontal" ng-submit="tsubmit()">
<div class="form-group">
<label for="newName" class="col-sm-2 control-label">Nouveau nom</label>
<form ng-submit="tsubmit()">
<div class="form-group row">
<label for="newName" class="col col-form-label">Nouveau nom</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="newName" ng-model="newName" placeholder="{{ my.name }}">
</div>
</div>
<div class="row form-group">
<div class="col-sm-offset-3">
<button class="btn btn-info">Valider</button>
<div class="input-group">
<input type="text" class="form-control" id="newName" ng-model="newName" placeholder="{{ my.name }}">
<span class="input-group-btn">
<button class="btn btn-info">Valider</button>
</span>
</div>
</div>
</div>

View file

@ -1,38 +1,45 @@
<ul class="nav nav-tabs nav-justified">
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" ng-class="{active: k == current_exercice, disabled: !my.exercices[k]}"><a ng-if="(!my.exercices[k])">{{ exercice.title }}</a><a ng-href="/{{ current_theme }}/{{ k }}" ng-if="(my.exercices[k])">{{ exercice.title }} <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0"></span> <span class="glyphicon glyphicon-ok" aria-hidden="true" ng-if="(my.team_id && my.exercices[k].solved)"></span></a></li>
</ul>
<nav role="navigation">
<ol class="breadcrumb">
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" class="breadcrumb-item" ng-class="{active: k == current_exercice, disabled: !my.exercices[k]}"><a ng-if="(!my.exercices[k])">{{ exercice.title }}</a><a ng-href="/{{ current_theme }}/{{ k }}" ng-if="(my.exercices[k])">{{ exercice.title }} <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0"></span> <span class="glyphicon glyphicon-ok" aria-hidden="true" ng-if="(my.team_id && my.exercices[k].solved)"></span></a></li>
</ol>
</nav>
<div class="alert alert-warning" style="margin-top:15px;" ng-if="!(my.exercices[current_exercice])">
Vous n'avez pas encore accès à cet exercice.
</div>
<div style="margin-top: 15px" class="well well-lg" ng-if="(my.exercices[current_exercice])">
<div class="jumbotron" style="margin-top: 15px" class="well well-lg" ng-if="(my.exercices[current_exercice])">
<p ng-bind-html="my.exercices[current_exercice].statement"></p>
<ul>
<li><strong>Gain :</strong> <ng-pluralize count="themes[current_theme].exercices[current_exercice].gain" when="{'one': '{} point', 'other': '{} points'}"></ng-pluralize> <em ng-if="themes[current_theme].exercices[current_exercice].solved < 1">{{ 1 + settings.firstBlood | coeff }} prem's</em> <em ng-if="themes[current_theme].exercices[current_exercice].curcoeff != 1.0">{{ themes[current_theme].exercices[current_exercice].curcoeff | coeff }} bonus</em></li>
<li><strong>Résolu par :</strong> <ng-pluralize count="themes[current_theme].exercices[current_exercice].solved" when="{'0': 'aucune équipe', 'one': '{} équipe', 'other': '{} équipes'}"></ng-pluralize>.</li>
<li><strong>Gain&nbsp;:</strong> <ng-pluralize count="themes[current_theme].exercices[current_exercice].gain" when="{'one': '{} point', 'other': '{} points'}"></ng-pluralize> <em ng-if="themes[current_theme].exercices[current_exercice].solved < 1">{{ 1 + settings.firstBlood | coeff }} prem's</em> <em ng-if="themes[current_theme].exercices[current_exercice].curcoeff != 1.0">{{ themes[current_theme].exercices[current_exercice].curcoeff | coeff }} bonus</em></li>
<li><strong>Résolu par&nbsp;:</strong> <ng-pluralize count="themes[current_theme].exercices[current_exercice].solved" when="{'0': 'aucune équipe', 'one': '{} équipe', 'other': '{} équipes'}"></ng-pluralize>.</li>
</ul>
</div>
<div class="panel panel-default" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].files.length)">
<div class="panel-heading">
<div class="panel-title"><span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Téléchargements</div>
<div class="row">
<div class="col-xl" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].files.length)">
<div class="card" style="margin-bottom: 15px">
<div class="card-header text-white">
<span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Téléchargements
</div>
<div class="list-group">
<a ng-href="{{ file.path }}" target="_self" class="list-group-item" ng-repeat="file in my.exercices[current_exercice].files">
<h1 class="pull-left" style="margin: 7px 7px 5px -5px"><span class="glyphicon glyphicon-download" aria-hidden="true"></span></h1>
<h4 class="list-group-item-heading"><strong><samp>{{ file.name }}</samp></strong></h4>
<p class="list-group-item-text">Taille : <span title="{{ file.size }} octets">{{ file.size | size }}</span> &ndash; <a href="https://blake2.net/">b2sum</a> : <samp>{{ file.checksum }}</samp></p>
<p class="list-group-item-text"><nobr>Taille&nbsp;: <span title="{{ file.size }} octets">{{ file.size | size }}</span></nobr> &ndash; <nobr><span title="blake2.net">b2sum</span>&nbsp;: <samp class="cksum" title="{{ file.checksum }}">{{ file.checksum }}</samp></nobr></p>
</a>
</div>
</div>
</div>
<div class="panel panel-info" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].hints.length)">
<div class="panel-heading">
<div class="panel-title"><span class="glyphicon glyphicon-lamp" aria-hidden="true"></span> Indices</div>
<div class="col-xl" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].hints.length)">
<div class="card border-info">
<div class="card-header bg-info text-white">
<span class="glyphicon glyphicon-lamp" aria-hidden="true"></span> Indices
</div>
<div class="list-group">
<a target="_self" class="list-group-item" ng-repeat="hint in my.exercices[current_exercice].hints" ng-href="{{ hint.file }}">
<button ng-click="hsubmit(hint)" class="pull-right btn btn-info" ng-if="!(hint.content || hint.file)" ng-class="{disabled: hint.submitted}"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span> Débloquer</button>
<button ng-click="hsubmit(hint)" class="float-right btn btn-info" ng-if="!(hint.content || hint.file)" ng-class="{disabled: hint.submitted}"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span> Débloquer</button>
<button ng-click="hint.hidden = false;" class="pull-right btn btn-info" ng-if="hint.content && hint.hidden"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span> Afficher</button>
<h1 class="pull-left" style="margin: 5px 7px 5px -5px" ng-if="hint.file"><span class="glyphicon glyphicon-download" aria-hidden="true"></span></h1>
<h4 class="list-group-item-heading">{{ hint.title }}</h4>
@ -42,19 +49,21 @@
</a>
</div>
</div>
</div>
<div class="panel panel-danger" ng-if="my.team_id && my.exercices[current_exercice] && !(my.exercices[current_exercice].solved)">
<div class="panel-heading">
<div class="panel-title"><span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Soumettre une solution</div>
<div class="col-xl" style="margin-bottom: 25px">
<div class="card border-danger" ng-if="my.team_id && my.exercices[current_exercice] && !(my.exercices[current_exercice].solved)" style="margin-bottom: 15px">
<div class="card-header bg-danger text-white">
<span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Soumettre une solution
</div>
<ul class="list-group" ng-if="(my.exercices[current_exercice].tries || my.exercices[current_exercice].submitted || sberr)">
<li class="list-group-item text-warning" ng-if="my.exercices[current_exercice].tries"><ng-pluralize count="my.exercices[current_exercice].tries" when="{'one': '{} tentative effectuée', 'other': '{} tentatives effectuées'}"></ng-pluralize>. Dernière solution envoyée à {{ my.exercices[current_exercice].solved_time | date:"mediumTime" }}.</li>
<li class="list-group-item" ng-class="messageClass" ng-if="my.exercices[current_exercice].submitted || sberr"><strong ng-if="!sberr">Votre solution a bien été envoyée !</strong><strong ng-if="sberr">{{ sberr }}</strong> {{ message }}</li>
</ul>
<div class="panel-body" ng-if="!my.exercices[current_exercice].submitted || sberr">
<div class="card-body" ng-if="!my.exercices[current_exercice].submitted || sberr">
<form ng-controller="SubmissionController" ng-submit="ssubmit()">
<div class="form-group" ng-repeat="key in flags" ng-class="{'has-success': key.found, 'has-feedback': key.found}">
<label for="sol_{{ key.id }}">{{ key.name }} :</label>
<label for="sol_{{ key.id }}">{{ key.name }}&nbsp;:</label>
<input type="text" class="form-control" id="sol_{{ key.id }}" name="sol_{{ key.id }}" ng-model="key.value" ng-disabled="key.found">
<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true" ng-if="key.found"></span>
</div>
@ -65,22 +74,22 @@
</div>
</div>
<div class="panel panel-success" ng-if="(my.team_id && my.exercices[current_exercice].solved)">
<div class="panel-heading">
<div class="panel-title"><span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Challenge réussi !</div>
<div class="card border-success" ng-if="(my.team_id && my.exercices[current_exercice].solved)">
<div class="card-header bg-success text-white">
<span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Challenge réussi !
</div>
<div class="panel-body">
<div class="card-body">
Vous êtes la {{ my.exercices[current_exercice].solved_rank }}<sup><ng-pluralize count="my.exercices[current_exercice].solved_rank" when="{'one': 're', 'other': 'e'}"></ng-pluralize></sup> équipe à avoir résolu ce challenge à {{ my.exercices[current_exercice].solved_time | date:"mediumTime" }}. Vous avez marqué <ng-pluralize count="my.exercices[current_exercice].gain" when="{'one': '{} point', 'other': '{} points'}"></ng-pluralize> !
</div>
</div>
<div class="panel panel-success" ng-if="(!my.team_id && my.exercices[current_exercice].keys)">
<div class="panel-heading">
<div class="panel-title"><span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Solution du challenge</div>
<div class="card border-success" ng-if="(!my.team_id && my.exercices[current_exercice].keys)">
<div class="card-heading bg-success text-white">
<span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Solution du challenge
</div>
<div class="panel-body">
<div class="card-body">
<p>
Vérifiez les clefs que vous trouvez en comparant leur <a href="https://blake2.net/">BLAKE2b</a> :
Vérifiez les clefs que vous trouvez en comparant leur <a href="https://blake2.net/">BLAKE2b</a>&nbsp;:
</p>
<dl class="dl-horizontal" ng-repeat="key in my.exercices[current_exercice].keys">
<dt title="{{ key.slice(128) }}">{{ key.slice(128) }}</dt>
@ -88,8 +97,10 @@
</dl>
<div class="embed-responsive">
<iframe type="text/html" ng-if="my.exercices[current_exercice].video_uri" ng-src="{{ my.exercices[current_exercice].video_uri }}" class="embed-responsive-item">
Regardez la vidéo de résolution de cet exercice : <a ng-href="{{ my.exercices[current_exercice].video_uri }}">{{ my.exercices[current_exercice].video_uri }}</a>.
Regardez la vidéo de résolution de cet exercice&nbsp;: <a ng-href="{{ my.exercices[current_exercice].video_uri }}">{{ my.exercices[current_exercice].video_uri }}</a>.
</iframe>
</div>
</div>
</div>
</div>
</div>