frontend: redisign some elements
This commit is contained in:
parent
22c4835875
commit
08aa7d278c
|
@ -324,3 +324,38 @@ img {
|
|||
.carousel-item, .carousel-caption {
|
||||
height: inherit;
|
||||
}
|
||||
|
||||
.page-header {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
margin-bottom: -15rem;
|
||||
}
|
||||
.page-header h1 {
|
||||
text-shadow: 0 0 5px rgba(255,255,255,0.9)
|
||||
}
|
||||
.page-header h1, .page-header h1 a {
|
||||
color: black;
|
||||
}
|
||||
.page-header h1 a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.page-header h2 {
|
||||
font-size: 100%;
|
||||
text-shadow: 1px 1px 1px rgba(0,0,0,0.9)
|
||||
}
|
||||
.page-header h2, .page-header h2 a {
|
||||
color: #4eaee6;
|
||||
}
|
||||
.page-header h1 {
|
||||
padding-top: 4rem;
|
||||
text-align: center;
|
||||
}
|
||||
.page-header h2 {
|
||||
padding-bottom: 14rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.page-header .headerfade {
|
||||
background: linear-gradient(transparent 0%, rgb(233,236,239) 100%);
|
||||
height: 3rem;
|
||||
}
|
||||
|
|
|
@ -123,10 +123,17 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container page-header text-primary clearfix" ng-cloak>
|
||||
<h1 ng-if="(current_theme)">{{ themes[current_theme].name }} <small class="authors" ng-if="themes[current_theme].authors" ng-bind-html="themes[current_theme].authors"></small></h1>
|
||||
<h1 ng-if="(!current_theme && title)" ng-cloak>{{ title }} <small class="authors" ng-if="authors">{{ authors }}</small></h1>
|
||||
<h1 ng-if="(!current_theme && !title)">{{ settings.title }} <small class="authors">{{ settings.authors }}</small></h1>
|
||||
<div style="background-image: url({{ themes[current_theme].image }})" ng-if="(current_theme)" class="page-header">
|
||||
<div class="container text-primary" ng-cloak>
|
||||
<h1><a ng-href="{{ themes[current_theme].urlid }}" ng-bind="themes[current_theme].name"></a></h1>
|
||||
<h2 ng-bind-html="themes[current_theme].authors"></h2>
|
||||
</div>
|
||||
<div class="headerfade"></div>
|
||||
</div>
|
||||
|
||||
<div class="container text-primary clearfix" ng-if="!current_theme" ng-cloak>
|
||||
<h1 ng-if="title" ng-cloak>{{ title }} <small class="authors" ng-if="authors">{{ authors }}</small></h1>
|
||||
<h1 ng-if="!title">{{ settings.title }} <small class="authors">{{ settings.authors }}</small></h1>
|
||||
</div>
|
||||
|
||||
<div class="container" ng-view>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<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="(k != current_exercice && !my.exercices[k])">{{ exercice.title }}</a>
|
||||
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" class="breadcrumb-item" ng-class="{active: k == current_exercice}">
|
||||
<a class="text-muted" ng-if="(k != current_exercice && !my.exercices[k])">{{ exercice.title }}</a>
|
||||
<a ng-href="{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" ng-if="(k != current_exercice && my.exercices[k])" ng-class="{'text-success': my.exercices[k].solved}">
|
||||
{{ exercice.title }}
|
||||
<span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0"></span>
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
<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="(k != current_exercice && !my.exercices[k])">{{ exercice.title }}</a>
|
||||
<li ng-repeat="(k,exercice) in themes[current_theme].exercices" class="breadcrumb-item" ng-class="{active: k == current_exercice}">
|
||||
<a class="text-muted" ng-if="(k != current_exercice && !my.exercices[k])">{{ exercice.title }}</a>
|
||||
<a ng-href="{{ themes[current_theme].urlid }}/{{ themes[current_theme].exercices[k].urlid }}" ng-if="(k != current_exercice && my.exercices[k])" ng-class="{'text-success': my.exercices[k].solved}">
|
||||
{{ exercice.title }}
|
||||
<span class="glyphicon glyphicon-gift" aria-hidden="true" ng-if="themes[current_theme].exercices[k].curcoeff > 1.0"></span>
|
||||
|
@ -38,8 +38,8 @@
|
|||
|
||||
<div class="row">
|
||||
|
||||
<div class="col-xl mb-5" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].files.length)">
|
||||
<div class="card">
|
||||
<div class="col-xl mb-5" ng-if="(my.exercices[current_exercice] && (my.exercices[current_exercice].files.length || my.exercices[current_exercice].hints.length))">
|
||||
<div class="card mb-2" ng-if="my.exercices[current_exercice].files.length">
|
||||
<div class="card-header text-white">
|
||||
<span class="glyphicon glyphicon-download-alt" aria-hidden="true"></span> Téléchargements
|
||||
</div>
|
||||
|
@ -56,10 +56,8 @@
|
|||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-xl mb-5" ng-if="(my.exercices[current_exercice] && my.exercices[current_exercice].hints.length)">
|
||||
<div class="card border-info">
|
||||
<div class="card border-info mb-2" ng-if="my.exercices[current_exercice].hints.length">
|
||||
<div class="card-header bg-info text-white">
|
||||
<span class="glyphicon glyphicon-lamp" aria-hidden="true"></span> Indices
|
||||
</div>
|
||||
|
|
|
@ -3,10 +3,11 @@
|
|||
<p class="text-justify" ng-bind-html="themes[current_theme].intro"></p>
|
||||
</div>
|
||||
|
||||
<div class="card-group mb-5">
|
||||
<div class="card niceborder" ng-repeat="(k,exercice) in themes[current_theme].exercices">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title clearfix">
|
||||
<div class="card niceborder mb-5">
|
||||
<ul class="list-group" ng-repeat="(k,exercice) in themes[current_theme].exercices">
|
||||
<li class="list-group-item">
|
||||
<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>
|
||||
<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>
|
||||
|
@ -14,10 +15,10 @@
|
|||
<span class="glyphicon glyphicon-lock" aria-hidden="true" title="Vous n'avez pas encore accès à ce défi"></span>
|
||||
{{ exercice.title }}
|
||||
</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>
|
||||
<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 class="card-text" ng-bind-html="exercice.headline"></p>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue
Block a user