From ef26e46ac90ba3f54d2798e5ae3ba89a7a9afd03 Mon Sep 17 00:00:00 2001
From: Pierre-Olivier Mercier <nemunaire@nemunai.re>
Date: Tue, 27 Nov 2018 20:00:44 +0100
Subject: [PATCH] frontend: improve theme page, with icons

---
 frontend/static/views/theme.html | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/frontend/static/views/theme.html b/frontend/static/views/theme.html
index 801e0d69..6ae7e72d 100644
--- a/frontend/static/views/theme.html
+++ b/frontend/static/views/theme.html
@@ -1,21 +1,22 @@
-<div class="card text-indent mt-2 mb-4">
-  <div class="card-body">
-    <p class="card-text text-justify" ng-bind-html="themes[current_theme].intro"></p>
-  </div>
+<div class="jumbotron text-indent mt-2 mb-4">
+  <p class="lead text-justify" ng-bind-html="themes[current_theme].intro"></p>
 </div>
 
 <div class="card-group mb-5">
   <div class="card" ng-repeat="(k,exercice) in themes[current_theme].exercices">
     <div class="card-body">
-      <h6 class="card-title">
+      <h5 class="card-title">
 	<a ng-href="/{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" ng-if="my.exercices[k]">
 	  {{ exercice.title }}
 	</a>
-	<a ng-href="#" ng-if="!my.exercices[k]">
+	<span ng-if="!my.exercices[k]">
 	  {{ exercice.title }}
-	</a>
+	  <span class="glyphicon glyphicon-lock" aria-hidden="true" title="Vous n'avez pas encore accès à ce défi"></span>
+	</span>
 	<a ng-href="/tags/{{tag}}" class="badge badge-pill badge-secondary ml-1 float-right" ng-repeat="tag in themes[current_theme].exercices[k].tags">#{{tag}}</a>
-      </h6>
+	<span class="glyphicon glyphicon-ok" aria-hidden="true" ng-if="(my.team_id && my.exercices[k].solved)"></span>
+	<span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0" title="Un bonus est actuellement appliqué lors de la résolution de ce défi"></span>
+      </h5>
       <p style="clear: both" class="card-text text-justify">Sunt omnis est quibusdam aperiam quos minima numquam.</p>
   </div>
 </div>