Commit b57b03af authored by Ag3m's avatar Ag3m

Upload html file - front design template

parent c3c2b86b
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Respect My Net</title>
<!-- Bootstrap -->
<link href="css/bootstrap.paper.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/customfront.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Respect My Net</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li class=""><a href="#">Cas signalés</a></li>
<li class=""><a href="#">À propos</a></li>
<li class=""><a href="#">Outils</a></li>
</ul>
<ul class="nav navbar-nav navbar-right">
<li><a href="#">Admin</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="container">
<div class="page-header">
<h1>Respect My Net <br><small>Signalements de violations de la Neutralité du Net.</small></h1>
</div>
<div class="row">
<div class="col-md-7 text-justify">
<p class="lead">
Sur Internet, <b>vous</b> décidez de ce que vous faites, n'est-ce pas ? <i>Ou pas...</i>
</p>
<p>Les opérateurs de télécommunication et les entreprises d'Internet essaient de contrôler ce que vous faites en ligne. Ils veulent bloquer et brider certaines de vos communication, et vous facturer l'utilisation de certains services, contenus ou applications. Le but principal de RespectMyNet est de porter l'attention du public sur ces violations de la Neutralité du Net et demander que les régulateurs agissent pour les arrêter.</p>
<p>La loi sur la Neutralité du Net récemment adoptée par l'UE est ambigüe et les régulateurs européens doivent décider de la façon dont ils vont l'appliquer.</p>
<p>Vous pouvez aider. Vous pouvez signaler les violations à la Neutralité du Net et aider les régulateurs à protéger l'Internet ouvert en Europe&nbsp;!</p>
<p>Aidez-nous à conserver une trace de toutes les violations de nos libertés sur Internetopérées par les opérateurs Internet. Dites-nous comment votre connexion à Internet, fixeou mobile, est limitée par votre opérateur Internet. Ça prend moins de 2 minutes !</p>
<p>N'hésitez pas à nous faire part de vos remarques sur cette application, ou de toutproblème rencontré sur RespectMyNet.eu ici : <a>Pad des Remarques</a></p>
<p class="lead">Statistiques</p>
<dl class="dl-horizontal">
<dt>Total confirmed reports</dt><dd>89</dd>
<dt>Countries with some confirmed reports</dt><dd>20</dd>
<dt>Operators with some confirmed reports</dt><dd>52</dd>
</dl>
</div>
<div class="hidden-sm hidden-xs col-md-4 col-md-offset-1">
<div class="panel panel-default">
<div class="panel-heading">
<p class="lead">Ajouter un nouveau cas</p>
</div>
<div class="panel-body">
<p class="text-justify">Veuillez signaler les cas de Zero-rating (les services dont l'utilisation ne consomme pas votre forfait data), de services spécialisés ou le blocage, le bridage ou la priorisation de services en ligne. Pour une description plus détaillée des cas à reporter, voir <a>notre guide</a>.</p>
<form>
<div class="form-group">
<label for="country">
Country&nbsp;
<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="right" title="EU member state where the discrimination is reported."></span>
</label>
<select class="form-control" id="country">
<option>Country</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</div>
<div class="form-group">
<label for="operator">
Operator&nbsp;
<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="right" title="The ISP or operator providing the Internet service."></span>
</label>
<input type="text" class="form-control" id="operator" placeholder="Operator">
</div>
<div class="form-group">
<label for="contract">
Contract&nbsp;
<span class="glyphicon glyphicon-info-sign" data-toggle="tooltip" data-placement="right" title="The specific contract at the ISP provider (please be as specific as possible)."></span>
</label>
<input type="text" class="form-control" id="contract" placeholder="Contract">
</div>
<div class="form-group">
<label for="connection">
Is the Internet connection over mobile or fixed line?
</label>
<select class="form-control" id="connection">
<option>Fixed</option>
<option>Mobile</option>
</select>
</div>
<div class="form-group">
<label for="discrimination">
How would you describe the discrimination?
</label>
<select class="form-control" id="discrimination">
<option>Zero rating</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select>
</div>
<button type="submit" class="btn btn-default center-block btn-lg">Continuer</button>
</form>
</div><!-- /.panel-body -->
</div><!-- /.panel -->
</div><!-- /.col -->
</div><!-- /.row -->
<div class="row" style="padding-top:3em; padding-bottom:3em;">
<button class="visible-xs visible-sm btn btn-lg btn-primary center-block">Ajouter un nouveau cas</button>
</div>
<div class="row hidden-xs">
<div class="col-sm-12">
<p class="lead">Cas en rapport</p>
<table class="table table-bordered">
<thead>
<tr class="active">
<th>Offre transgressive</th>
<th>Cas</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>Deutsche Telekom (Germany) MagentaMobil Friends</td>
<td>5</td>
<td><button class="btn btn-sm btn-default">Me too !</button></td>
</tr>
<tr>
<td colspan="3"><b>Description</b>: Zero rating for Spotify traffic.<br>
All audio streams from Spotify are zero rated. Other streaming services are rated regularly.<br>
Mr. M - 15 mars 2016</td>
</tr>
<tr>
<td>Tre (Sweden) All mobile subscriptions</td>
<td>2</td>
<td><button class="btn btn-sm btn-default">Me too !</button></td>
</tr>
<tr>
<td colspan="3"><b>Description</b>: Streaming music from certain music streaming services (Spotify, Tidal, Deezer) up to 70 GB per month is free and does not decrease the regular data volume.<br>
Streaming music from certain music streaming services (Spotify, Tidal, Deezer) up to 70 GB per month is free and does not decrease the regular data volume.<br>
Mikael Ståldal - 19 mars 2016</td>
</tr>
<tr>
<td>Deutsche Telekom (Germany) MagentaMobil Friends</td>
<td>5</td>
<td><button class="btn btn-sm btn-default">Me too !</button></td>
</tr>
<tr>
<td colspan="3"><b>Description</b>: Zero rating for Spotify traffic.<br>
All audio streams from Spotify are zero rated. Other streaming services are rated regularly.<br>
Mr. M - 15 mars 2016</td>
</tr>
</tbody>
</table>
</div>
</div>
</div><!-- /.container-fluid -->
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>
<!-- Custom JS -->
<script>
$(function () {
$('[data-toggle="tooltip"]').tooltip()
})
</script>
</body>
</html>
\ No newline at end of file
Markdown is supported
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