Gitlab CSE Unil

Skip to content
GitLab
Commit fda5812c authored by Julien Furrer's avatar Julien Furrer
Browse files

Adjust home page

parent 72ecece9
Hide whitespace changes
Inline Side-by-side
adim_app/static/_src/less/adim.css
View file @ fda5812c
......@@ -612,11 +612,21 @@ body.home {
body.home #main-navbar {
display: none;
}
body.home #home-container {
padding: 40px 0 60px;
@media (min-width: 1200px) {
body.home #home-container {
padding: 40px 0 60px;
}
body.home #home-image {
padding-top: 20px;
}
}
body.home #home-image {
padding-top: 20px;
@media (min-width: 992px) and (max-width: 1199px) {
body.home #home-container {
padding: 20px 0 40px;
}
body.home #home-image {
padding-top: 0px;
}
}
#home-container {
background: #424242;
......@@ -631,38 +641,60 @@ body.home #home-image {
color: #efefef;
font-weight: 300;
}
#home-container #home-action-box.well {
#home-container #home-action-box .well {
background: rgba(255, 255, 255, 0.1);
border-radius: 5px;
border-color: rgba(220, 220, 220, 0.1);
padding: 7px 15px;
}
#home-image {
padding-top: 20px;
margin-bottom: 40px;
}
#home-image img {
border-radius: 6px;
background: url("../img/image-home.jpg") 0% 50% no-repeat;
}
@media (min-width: 1200px) {
#home-image img {
background: url("../img/image-home-lg.jpg") 0% 50% no-repeat;
width: 1140px;
height: 761px;
}
}
@media (min-width: 992px) and (max-width: 1199px) {
#home-image img {
background: url("../img/image-home-md.jpg") 0% 50% no-repeat;
width: 940px;
height: 628px;
}
}
#home-content {
color: #f2f2f2;
}
#main-home {
background-color: #eeeeee;
border-radius: 6px;
padding: 48px 60px;
color: #444444;
color: #f2f2f2;
}
#main-home .intro h1 {
color: #444444;
color: #f2f2f2;
font-size: 32px;
margin-top: 0px;
text-shadow: 0 1px 0 #FFF;
}
#main-home .intro .lead {
font-size: 18px;
color: #5e5e5e;
color: #ffffff;
}
#login-mode {
margin-bottom: 0px;
}
#login-mode .local-login-head {
position: absolute;
right: 0;
bottom: -18px;
right: 15px;
bottom: 0px;
}
#login-mode .local-login-head a,
#login-mode .local-login-head a:link,
......
adim_app/static/_src/less/adim.less
View file @ fda5812c
......@@ -11,7 +11,7 @@
// ----- Home page -----
@home-mainBg: #EEE;
@home-mainColor: #444;
@home-color: #f2f2f2;
// ----- Exercise -----
......@@ -176,11 +176,26 @@ input[type=number]::-webkit-outer-spin-button {
// ===== Home page ========================================
.home-variante(@v) when (@v > 0) {
#main-navbar { display: none }
#home-container {
padding: 40px 0 60px;
// Large
@media (min-width: @screen-lg-min) {
#home-container {
padding: 40px 0 60px;
}
#home-image {
padding-top: 20px;
}
}
#home-image {
padding-top: 20px;
// Medium
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
#home-container {
padding: 20px 0 40px;
}
#home-image {
padding-top: 0px;
}
}
}
......@@ -208,7 +223,7 @@ body.home {
}
#home-action-box {
&.well {
.well {
// background: transparent linear-gradient(to bottom, fadeOut(darken(@well-bg, 10%), 80%) 0%, fadeOut(@well-bg, 80%) 100%);
// background: rgba(0, 0, 0, 0.1);
background: rgba(255, 255, 255, 0.1);
......@@ -222,30 +237,51 @@ body.home {
}
#home-image {
// background: url("../img/image-home.jpg") 0% 50% no-repeat;
padding-top: 20px;
margin-bottom: 40px;
img {
// visibility: hidden;
border-radius: 6px;
background: url("../img/image-home.jpg") 0% 50% no-repeat;
// Large
@media (min-width: @screen-lg-min) {
background: url("../img/image-home-lg.jpg") 0% 50% no-repeat;
width: 1140px; //992px;
height: 761px; //663px;
}
// Medium
@media (min-width: @screen-md-min) and (max-width: @screen-md-max) {
background: url("../img/image-home-md.jpg") 0% 50% no-repeat;
width: 940px;
height: 628px;
}
}
}
#home-content {
color: @home-color;
}
#main-home {
background-color: @home-mainBg;
border-radius: 6px;
padding: 48px 60px;
color: @home-mainColor;
color: @home-color;
.intro {
h1 {
color: @home-mainColor;
color: @home-color;
font-size: 32px;
margin-top: 0px;
text-shadow: 0 1px 0 #FFF;
}
.lead {
font-size: 18px;
color: lighten(@home-mainColor, 10%);
color: lighten(@home-color, 10%);
}
}
......@@ -260,8 +296,8 @@ body.home {
.local-login-head {
// .clearfix();
position: absolute;
right: 0;
bottom: -18px;
right: 15px;
bottom: 0px;
a, a:link, a:active, a:visited, a:hover {
font-size: 12px;
font-weight: 300;
......
adim_app/templates/adim_app/home.html
View file @ fda5812c
......@@ -20,16 +20,18 @@
<div class="col-sm-9">
<h1>ADIM &nbsp;&nbsp;<small>Un outil d'annotation d'images pour l'enseignement</small></h1>
</div>
<div class="col-sm-3 well well-sm" id="home-action-box">
{% if user.is_anonymous %}
{% include "adim_app/login.inc.html" %}
{% else %}
<a href="{% url "adim.app:annotate-new" %}"
class="btn btn-lg btn-success btn-block">
<span class="glyphicon glyphicon-pencil"></span>&nbsp;
Annoter &blacktriangleright;
</a>
{% endif %}
<div class="col-sm-3" id="home-action-box">
<div class="well well-sm">
{% if user.is_anonymous %}
{% include "adim_app/login.inc.html" %}
{% else %}
<a href="{% url "adim.app:annotate-new" %}"
class="btn btn-lg btn-success btn-block">
<span class="glyphicon glyphicon-pencil"></span>&nbsp;
Annoter &blacktriangleright;
</a>
{% endif %}
</div>
</div>
</div>
......@@ -37,13 +39,46 @@
<div class="row">
<div class="col-sm-12">
<div id="home-image">
<img src="{% static "img/image-home.jpg" %}">
{# <img src="{% static "img/image-home.jpg" %}">#}
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==">
</div>
</div>
</div>
<div class="row">
<div class="col-sm-12">
<div id="home-content"></div>
<div id="home-content">
<div class="col-sm-6">
<p>
L'analyse d'images ou de représentations par l’annotation est un type d'activité d'enseignement très variés comme une simple analyse documentée de la représentation jusqu'à des activités de résolution de problème complet.
</p>
<p>ADIM est un environnement global et flexible d'étude d'images qui rend possible ce type
d’activité d’enseignement ou de recherche.
</p>
</div>
<div class="col-sm-6">
<h5>Le scénation pédagogique en 4 étapes</h5>
<dl>
<dt>1. Créer et proposer une activité d’annotation</dt>
<dd>Elle peut se faire via les options de partage du système ADIM ou par une activité moodle
associée.
</dd>
<dt>2. Période de travail individuel d’annotation</dt>
<dd>Les participants réalisent leur travail d’annotation selon les consignes données et partage
leurs
annotions à la fin de leur travail.
</dd>
<dt>3. Comparaison et analyse des résulats</dt>
<dd>L’enseignant, ou directement les participants selon le scénario choisi, peut comparer les
résultats
des participants regroupés sous la forme de calques séparés dans l’interface.
</dd>
<dt>4 Elaboration d’un feedback constructif pour une discussion</dt>
</dl>
</div>
</div>
</div>
</div>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment