Merge remote-tracking branch 'origin/master'
This commit is contained in:
commit
5e10fdd95b
10 changed files with 157 additions and 31 deletions
|
|
@ -21,3 +21,4 @@
|
|||
//= require bootstrap
|
||||
//= require_tree .
|
||||
//= require turbolinks
|
||||
//= require jquery.jtruncate
|
||||
|
|
|
|||
|
|
@ -12,10 +12,9 @@
|
|||
|
||||
body {
|
||||
padding-top: 60px;
|
||||
font-family: 'Gotham-Book';
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
|
||||
section {
|
||||
overflow: auto;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,8 +9,10 @@ footer {
|
|||
|
||||
a {
|
||||
color: #555;
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
&:hover {
|
||||
color: #222;
|
||||
color: #222;
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,33 +1,53 @@
|
|||
/* typography */
|
||||
|
||||
@import "variables";
|
||||
@import url(https://fonts.googleapis.com/css?family=Montserrat:400,700);
|
||||
@font-face {
|
||||
font-family: 'Gotham-Book';
|
||||
src:font-url('Gotham-Book.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 3em;
|
||||
letter-spacing: -2px;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
color: #f21e40;
|
||||
&:active {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 1.2em;
|
||||
letter-spacing: -1px;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
color: $light-gray;
|
||||
text-transform: uppercase;
|
||||
color: #f21e40;
|
||||
&:active {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: 'Montserrat', sans-serif;
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
||||
#last-statements {
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 1.0em;
|
||||
line-height: 1.1em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,17 +3,43 @@
|
|||
// You can use Sass (SCSS) here: http://sass-lang.com/
|
||||
#public_figure div {
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
width: 100px;
|
||||
-webkit-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
background-size:cover;
|
||||
background-repeat:no-repeat;
|
||||
}
|
||||
|
||||
p.public-figures-index {
|
||||
margin: 10px;
|
||||
text-align: justify;
|
||||
font-family: 'Gotham-Book',"Helvetica Neue",Helvetica,Arial,sans-serif;
|
||||
font-size: 12px;
|
||||
h1 {
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 3em;
|
||||
letter-spacing: -2px;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
color: #f21e40;
|
||||
&:active {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
h2 {
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 1.2em;
|
||||
letter-spacing: -1px;
|
||||
margin-bottom: 30px;
|
||||
text-align: center;
|
||||
font-weight: normal;
|
||||
color: lightgray;
|
||||
text-transform: uppercase;
|
||||
color: #f21e40;
|
||||
&:active {
|
||||
color: #222;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: 'Gotham-Book', sans-serif;
|
||||
font-size: 1.1em;
|
||||
line-height: 1.7em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,9 +16,6 @@ img.subject-main-image {
|
|||
p.subject-presentation-text {
|
||||
margin: 10px;
|
||||
text-align: justify;
|
||||
font-family: 'Gotham-Book',"Helvetica Neue",Helvetica,Arial,sans-serif;
|
||||
font-size: 12px;
|
||||
|
||||
}
|
||||
|
||||
div.subjects-index {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<div id="last-statements">
|
||||
<h2>Les dernières prises de positions</h2>
|
||||
<ul id="last-statements">
|
||||
<ul class="statement" id="last-statements">
|
||||
<% # render @latest_statements %>
|
||||
<% @latest_statements.each do |statement| %>
|
||||
<li id="statement-<%= statement.id %>">
|
||||
|
|
|
|||
|
|
@ -1,11 +1,25 @@
|
|||
<% provide(:title,"À propos") %>
|
||||
<div class="center jumbotron">
|
||||
<h1>Pourquoi Débats.fr ?</h1>
|
||||
<p>
|
||||
<strong>Débats</strong> est un projet francophone et participatif, ayant pour objectif d’offrir une
|
||||
synthèse ouverte, objective et vérifiable, des sujets clivants de notre société.
|
||||
</p>
|
||||
<p>
|
||||
<%= link_to "Créer un compte", new_user_path, class: "btn btn-lg btn-primary" %>
|
||||
</p>
|
||||
</div>
|
||||
<p align="center">
|
||||
<br /><br><i>Débats</i> est un projet francophone et participatif, ayant pour objectif d’offrir une synthèse ouverte, impartiale et vérifiable, des sujets clivants de notre société.</p>
|
||||
<div align="center"><a href="#manifeste" class="btn btn-default btn-lg page-scroll" id="bouton-manifeste"><i class="fa fa-angle-down animated"></i> Pourquoi Débats ? <i class="fa fa-angle-down animated"></i></a></div>
|
||||
<div id="manifeste" style="display:none; text-align:justify;"><br /><br /><br /><br />
|
||||
|
||||
|
||||
<p>
|
||||
|
||||
Dans un monde de plus en plus complexe, les discours simplistes sont légion. Régulièrement, des controverses se construisent sur la base d'arguments à peine vérifiés, ou simplement invérifiables.
|
||||
C’est ainsi que semblent se développer des idées confuses et des discussions stériles.
|
||||
</p><p>
|
||||
L'intelligibilité du débat public et son accessibilité par tous ceux qui aspirent à y participer déterminent la qualité de notre système démocratique. Or, aujourd’hui, aucun outil, simple d’utilisation, ne permet d’accéder à la pluralité des idées de celles et ceux qui font le choix de s’exprimer publiquement. Prendre connaissance de leurs arguments, comprendre ce qu’ils prétendent ou ce qu’ils laissent entendre est un véritable parcours du combattant. Nous cédons ainsi régulièrement à la facilité, en accordant une valeur démesurée à des postures démagogiques ou en laissant à d’autres le soin de les produire.
|
||||
</p><p>
|
||||
Pourtant, les ressources sont là, sous nos yeux, elles existent ! Les blogs, les tweets, les journaux télévisés, les discours ou les livres sont un trésor démocratique laissé en jachère, une réserve politique fertile jusqu’ici largement sous-exploitée. Ces traces essaimées tout autour de nous constituent une des clés pour y voir plus clair.
|
||||
</p><p>
|
||||
L’ambition de <i>Débats</i> est simple : recenser, sur chaque grand thème qui fait débat, les prises de position de celles et ceux qui décident de s’engager. Cartographier l’évolution de leur pensée, de leurs opinions, des combats qu’ils ont menés. Donner à voir la constance, la progression ou l’incohérence d’un engagement dans le temps.
|
||||
</p><p>
|
||||
Rédigé par des volontaires sur une plateforme en ligne, et fonctionnant sur le principe du wiki, <i>Débats</i> a pour objectif d'offrir un contenu libre, impartial et vérifiable des prises de position de celles et ceux qui participent aux débats publics.
|
||||
</p><p>
|
||||
Face à ce que nous considérons comme un dévoiement démocratique, nous partageons une conviction : l’information est notre première arme. Redonner à l’engagement la crédibilité et la valeur qui doivent être les siennes : voilà la raison d’être de <i>Débats</i>.
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,12 @@
|
|||
<div class="row">
|
||||
<%= image_tag subject.picture.url, class:"subject-main-image", alt:"#{subject.title}" if subject.picture? %>
|
||||
<h2 class="subject-title"><%= link_to subject.title, subject %></h2>
|
||||
<p class="subject-presentation-text"><%= subject.presentation %></p>
|
||||
</div>
|
||||
<div class="row">
|
||||
<%= image_tag subject.picture.url, class:"subject-main-image", alt:"#{subject.title}" if subject.picture? %>
|
||||
<h2 class="subject-title"><%= link_to subject.title, subject %></h2>
|
||||
<p class="subject-presentation-text"><%= subject.presentation %></p>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function() {
|
||||
|
||||
$(".subject-presentation-text").shorten();
|
||||
|
||||
});
|
||||
</script>
|
||||
|
|
|
|||
60
vendor/assets/javascripts/jquery.jtruncate.js
vendored
Normal file
60
vendor/assets/javascripts/jquery.jtruncate.js
vendored
Normal file
|
|
@ -0,0 +1,60 @@
|
|||
/*
|
||||
* jQuery Shorten plugin 1.0.0
|
||||
*
|
||||
* Copyright (c) 2013 Viral Patel
|
||||
* http://viralpatel.net
|
||||
*
|
||||
* Dual licensed under the MIT license:
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*/
|
||||
|
||||
(function($) {
|
||||
$.fn.shorten = function (settings) {
|
||||
|
||||
var config = {
|
||||
showChars: 300,
|
||||
ellipsesText: "...",
|
||||
moreText: "Lire Plus →",
|
||||
lessText: "Réduire"
|
||||
};
|
||||
|
||||
if (settings) {
|
||||
$.extend(config, settings);
|
||||
}
|
||||
|
||||
$(document).off("click", '.morelink');
|
||||
|
||||
$(document).on({click: function () {
|
||||
|
||||
var $this = $(this);
|
||||
if ($this.hasClass('less')) {
|
||||
$this.removeClass('less');
|
||||
$this.html(config.moreText);
|
||||
} else {
|
||||
$this.addClass('less');
|
||||
$this.html(config.lessText);
|
||||
}
|
||||
$this.parent().prev().toggle();
|
||||
$this.prev().toggle();
|
||||
return false;
|
||||
}
|
||||
}, '.morelink');
|
||||
|
||||
return this.each(function () {
|
||||
var $this = $(this);
|
||||
if($this.hasClass("shortened")) return;
|
||||
|
||||
$this.addClass("shortened");
|
||||
var content = $this.html();
|
||||
if (content.length > config.showChars) {
|
||||
var c = content.substr(0, config.showChars);
|
||||
var h = content.substr(config.showChars, content.length - config.showChars);
|
||||
var html = c + '<span class="moreellipses">' + config.ellipsesText + ' </span><span class="morecontent"><span>' + h + '</span> <a href="#" class="morelink">' + config.moreText + '</a></span>';
|
||||
$this.html(html);
|
||||
$(".morecontent span").hide();
|
||||
}
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
Loading…
Add table
Reference in a new issue