Improve bootstrap 4 support
This commit is contained in:
parent
6329f44d42
commit
e630bc3d75
17 changed files with 181 additions and 139 deletions
|
|
@ -68,15 +68,12 @@ body {
|
|||
.point {
|
||||
text-shadow: 0 0 20px #0055ff;
|
||||
}
|
||||
.navbar-inverse .point {
|
||||
.bg-dark .point {
|
||||
text-shadow: 0 0 12px #0055ff;
|
||||
}
|
||||
.end .point {
|
||||
text-shadow: 0 0 20px #ff5500;
|
||||
}
|
||||
.navbar-inverse .end .point {
|
||||
text-shadow: 0 0 12px #ff5500;
|
||||
}
|
||||
@-webkit-keyframes clockanim {
|
||||
0% { opacity: 1.0; }
|
||||
50% { opacity: 0; }
|
||||
|
|
@ -96,7 +93,7 @@ keyframes clockanim {
|
|||
samp.cksum {
|
||||
overflow-x: hidden;
|
||||
text-overflow: ellipsis;
|
||||
max-width: 20vw;
|
||||
max-width: 16vw;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
|
@ -111,10 +108,16 @@ h1 small.authors {
|
|||
font-style: italic;
|
||||
}
|
||||
|
||||
a.badge:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.teamname {
|
||||
-webkit-filter: invert(100%);
|
||||
filter: invert(100%);
|
||||
}
|
||||
a:hover .teamname {
|
||||
text-shadow: 0px 0px 10px #888888;
|
||||
}
|
||||
|
||||
.heading {
|
||||
font-style: italic;
|
||||
|
|
@ -162,7 +165,7 @@ h1 small.authors {
|
|||
.carousel .table {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.carousel .table-condensed td {
|
||||
.carousel .table-sm td {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -74,12 +74,12 @@
|
|||
</button>
|
||||
<div class="collapse navbar-collapse" id="themesMenu">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li ng-repeat="(k,theme) in themes"><a ng-class="{active: k == current_theme}" class="nav-link" ng-href="/{{ k }}" data-toggle="tab">{{ theme.name }} <span class="badge badge-light"><span class="glyphicon glyphicon-fire" aria-hidden="true" ng-if="max_solved > 1 && theme.solved == max_solved" alt="Déjà {{ theme.solved }} challenges résolus dans ce thème"></span> <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="theme.exercice_coeff_max > 1" alt="Des bonus existent pour au moins un challenge de ce thème"></span> <span ng-if="(my.team_id)">{{ theme.exercice_solved }}/</span>{{ theme.exercice_count }}</span></a></li>
|
||||
<li ng-repeat="(k,theme) in themes" ng-class="{active: k == current_theme}" class="nav-item"><a class="nav-link" ng-href="/{{ k }}" data-toggle="tab">{{ theme.name }} <span class="badge badge-light"><span class="glyphicon glyphicon-fire" aria-hidden="true" ng-if="max_solved > 1 && theme.solved == max_solved" alt="Déjà {{ theme.solved }} challenges résolus dans ce thème"></span> <span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="theme.exercice_coeff_max > 1" alt="Des bonus existent pour au moins un challenge de ce thème"></span> <span ng-if="(my.team_id)">{{ theme.exercice_solved }}/</span>{{ theme.exercice_count }}</span></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<span class="navbar-text text-light" ng-show="(my.team_id)" ng-cloak>
|
||||
<a tabindex="0" class="badge" role="button" style="background-color: {{ teams[my.team_id].color }}; color: {{ teams[my.team_id].color }};" data-toggle="popover" data-trigger="focus" data-template="<div class='popover' role='tooltip'><div class='arrow'></div><h3 class='popover-header bg-light text-dark'></h3><div class='popover-body bg-secondary text-dark'></div></div>" title="{{ my.name }}<a class='btn btn-sm btn-info float-right' href='/edit'>Édit.</a>" data-html="true" data-content="{{ teams[my.team_id].rank }}<sup>e</sup> sur {{ teams_count }} – {{ my.score }} points<br><div class='btn-group'><a class='btn btn-sm btn-primary' href='/rules'>Règles</a><a class='btn btn-sm btn-primary' href='/rank'>Classement</a></div>">
|
||||
{{ my.name }}
|
||||
<a tabindex="0" href="#" class="badge" role="button" style="background-color: {{ teams[my.team_id].color }}; color: {{ teams[my.team_id].color }};" data-toggle="popover" data-trigger="focus" data-template="<div class='popover' role='tooltip'><div class='arrow'></div><h3 class='popover-header bg-light text-dark'></h3><div class='popover-body bg-secondary text-dark'></div></div>" title="{{ my.name }}<a class='badge badge-info float-right' href='/edit'>Édit.</a>" data-html="true" data-content="{{ teams[my.team_id].rank }}<sup>e</sup> sur {{ teams_count }} – {{ my.score }} points<br><div class='btn-group'><a class='btn btn-sm btn-primary' href='/rules'>Règles</a><a class='btn btn-sm btn-primary' href='/rank'>Classement</a></div>">
|
||||
<span class="teamname">{{ my.name }}</span>
|
||||
</a>
|
||||
</span>
|
||||
</nav>
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
</div>
|
||||
</noscript>
|
||||
|
||||
<div ng-repeat="(k,s) in scene" class="repeatedd-item">
|
||||
<div ng-repeat="(k,s) in scene" class="repeatedd-item" style="margin-bottom: 15px;">
|
||||
|
||||
<div class="card" ng-if="s.type == 'welcome' && !s.params.hide && s.params.kind == 'init'">
|
||||
<div class="card-body">
|
||||
|
|
@ -105,7 +105,7 @@
|
|||
</div>
|
||||
|
||||
<div class="card" ng-if="s.type == 'table' && !s.params.hide">
|
||||
<table class="table table-bordered table-striped table-condensed">
|
||||
<table class="table table-bordered table-striped table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="frotated"></th>
|
||||
|
|
@ -149,7 +149,7 @@
|
|||
</div>
|
||||
|
||||
<div class="card" ng-if="s.type == 'rank' && !s.params.hide">
|
||||
<table class="table table-bordered table-striped table-condensed">
|
||||
<table class="table table-bordered table-striped table-sm">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-right">Place</th>
|
||||
|
|
@ -180,7 +180,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div style="box-shadow: 0px -5px 5px 5px #e9ecef; position: fixed; bottom: calc(14vh - 1px); right: 0; width: 33vw;" class="navbar navbar-inverse" ng-controller="TimeController">
|
||||
<div style="box-shadow: 0px -5px 5px 5px #e9ecef; position: fixed; bottom: calc(14vh - 1px); right: 0; width: 33vw;" class="navbar bg-light" ng-controller="TimeController">
|
||||
<div class="text-center" ng-if="time.hours === 0 || time.hours" style="margin-top: -5px;">
|
||||
<div id="clock" ng-class="{expired: time.expired, end: time.end}" style="font-size: 50px" ng-cloak>
|
||||
<span id="hours">{{ time.hours | time }}</span>
|
||||
|
|
@ -253,7 +253,7 @@
|
|||
</div>
|
||||
<div class="carousel-item">
|
||||
<div class="carousel-caption" style="padding: 3px 25px; width: 32vw;">
|
||||
<table class="table table-bordered table-condensed table-striped">
|
||||
<table class="table table-bordered table-sm table-striped">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>11 h</td>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,16 @@
|
|||
<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>
|
||||
<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="(k != current_exercice && !my.exercices[k])">{{ exercice.title }}</a><a ng-href="/{{ current_theme }}/{{ k }}" ng-if="(k != current_exercice && 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><em ng-if="k == current_exercice">{{ exercice.title }}</em></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 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>
|
||||
<div class="jumbotron text-indent" style="margin-top: 15px" class="well well-lg" ng-if="(my.exercices[current_exercice])">
|
||||
<h3 class="display-4">{{ themes[current_theme].exercices[current_exercice].title }}</h3>
|
||||
<p class="lead text-justify" ng-bind-html="my.exercices[current_exercice].statement"></p>
|
||||
<hr class="my-3">
|
||||
<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>
|
||||
|
|
@ -62,9 +64,9 @@
|
|||
</ul>
|
||||
<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}">
|
||||
<div class="form-group" ng-repeat="key in flags">
|
||||
<label for="sol_{{ key.id }}">{{ key.name }} :</label>
|
||||
<input type="text" class="form-control" id="sol_{{ key.id }}" name="sol_{{ key.id }}" ng-model="key.value" ng-disabled="key.found">
|
||||
<input type="text" class="form-control" id="sol_{{ key.id }}" name="sol_{{ key.id }}" ng-model="key.value" ng-disabled="key.found" ng-class="{'is-valid': key.found}">
|
||||
<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true" ng-if="key.found"></span>
|
||||
</div>
|
||||
|
||||
|
|
@ -90,7 +92,9 @@
|
|||
<span class="glyphicon glyphicon-flag" aria-hidden="true"></span> Challenge réussi !
|
||||
</div>
|
||||
<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> !
|
||||
<p class="card-text">
|
||||
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> !
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Reference in a new issue