Merge pull request #10 from JLBarbie/master

Ajout de reponsivité
master
Philippe Pittoli 2017-09-24 15:37:00 +02:00 committed by GitHub
commit 1516a5dcb5
5 changed files with 176 additions and 137 deletions

12
public/css/dnsmanager.css Normal file
View File

@ -0,0 +1,12 @@
.input-menu-mobile {
width: 200px;
margin: 0 0 10px 10px;
}
.sidebar-group {
width: 100%;
}
.sidebar-group > a > button {
margin-bottom: 10px !important;
}

View File

@ -1,17 +1,46 @@
<!-- Fixed navbar --> <!-- Fixed navbar -->
<div class="navbar navbar-inverse navbar-fixed-top" role="navigation"> <nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container"> <div class="container-fluid">
<div class="navbar-header"> <!-- Brand and toggle get grouped for better mobile display -->
<a class="navbar-brand" href="/">NetLib.re</a> <div class="navbar-header">
<p class="navbar-brand"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#mobile-menu" aria-expanded="false">
Un nom de domaine gratuit, administrable facilement. <span class="sr-only">Toggle navigation</span>
</p> <span class="icon-bar"></span>
</div> <span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">NetLib.re</a>
<span class="navbar-brand hidden-xs">Un nom de domaine gratuit, administrable facilement.</span>
</div> </div>
</div>
<br />
<br />
<br />
<br />
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="mobile-menu">
<ul class="nav navbar-nav navbar-right visible-xs">
<% IF login.defined %>
<li><a href="/user/home">Ma page</a></li>
<% IF admin == 1 %>
<li><a href="/admin">Administration</a></li>
<% END %>
<li><a href="/user/logout">Déconnexion</a></li>
<% ELSE %>
<form class="navbar-form" role="form" action="/user/login" method="post" accept-charset="utf-8">
<div class="form-group">
<input type="text" name="login" class="form-control input-menu-mobile" id="login" placeholder="Votre identifiant" />
<input type="password" name="password" class="form-control input-menu-mobile" id="password" placeholder="Mot de passe" />
</div>
<button type="submit" class="btn btn-default input-menu-mobile">Connexion &rarr;</button>
</form>
<% END %>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<br />
<br />
<br />
<br />

View File

@ -6,7 +6,7 @@
<div class="row"> <div class="row">
<div class="col-sm-5"> <div class="col-md-12">
<% IF domains && domains.size %> <% IF domains && domains.size %>
<h3>Vos domaines</h3> <h3>Vos domaines</h3>
<table class="table"> <table class="table">
@ -35,20 +35,21 @@
<p class="text-danger">Pas encore de nom de domaine ?</p> <p class="text-danger">Pas encore de nom de domaine ?</p>
<p>Réservez-en un ! \o/</p> <p>Réservez-en un ! \o/</p>
<% END %> <% END %>
</div>
</div>
<div class="row">
<div class="col-md-12">
<h3>Nouveau domaine</h3> <h3>Nouveau domaine</h3>
<hr /> <hr />
<form class="form-inline" role="form" action='/domain/add/' method="post"> <form class="form-inline" role="form" action='/domain/add/' method="post">
<div class="input-group">
<div class="form-group"> <div class="form-group">
<% IF domainName.defined %> <% IF domainName.defined %>
<input size="15" class="form-control" type='text' name='domain' value="<% domainName %>" /> <input size="15" class="form-control" type='text' name='domain' value="<% domainName %>" />
<% ELSE %> <% ELSE %>
<input size="15" class="form-control" type='text' name='domain' placeholder='domaine' /> <input size="15" class="form-control" type='text' name='domain' placeholder='domaine' />
<% END %> <% END %>
</div>
<div class="form-group">
<select name='tld' class='form-control' > <select name='tld' class='form-control' >
<% FOREACH dom in provideddomains %> <% FOREACH dom in provideddomains %>
<option><% dom %></option> <option><% dom %></option>
@ -57,22 +58,31 @@
</div> </div>
<input type='submit' name='submit' value="Créer mon domaine!" <input type='submit' name='submit' value="Créer mon domaine!"
class='btn btn-primary' /> class='btn btn-primary' />
</div>
</form> </form>
</div>
</div>
<br/> <br/>
<!-- Mot de passe -->
<div class="row">
<div class="col-md-12">
<h3>Nouveau mot de passe</h3> <h3>Nouveau mot de passe</h3>
<hr /> <hr />
<form class="form" action='/user/changepasswd' method="post" > <form class="form-inline" action='/user/changepasswd' method="post" >
<input type='password' name='password'/> <div class="form-group">
<input class="form-control" type='password' name='password'/>
<input type='submit' name='submit' value="Changer mon mot de passe" <input type='submit' name='submit' value="Changer mon mot de passe"
class='btn btn-primary' /> class='btn btn-primary' />
</div>
</form> </form>
</div> </div>
</div>
<div class="col-sm-5 col-sm-offset-1"> <br/>
<div class="row">
<div class="col-md-5 col-xs-12">
<h3>Rappels sur l'administration d'un domaine</h3> <h3>Rappels sur l'administration d'un domaine</h3>
<ul> <ul>
<li> <li>
@ -87,7 +97,9 @@
</ul> </ul>
</li> </li>
</ul> </ul>
</div>
<div class="col-md-5 col-sm-offset-1 col-xs-12">
<h3>Les mises à jour automatiques</h3> <h3>Les mises à jour automatiques</h3>
<p>Si vous souhaitez une mise à jour de l'adresse IP indiquée dans votre zone, aucun problème ! <p>Si vous souhaitez une mise à jour de l'adresse IP indiquée dans votre zone, aucun problème !
<a href='https://git.karchnu.fr/Karchnu/dnsmanager/raw/0c0cedddb0aea0cfe2fb546b01e5862b4d613fe5/cli/daemon/daemon.pl' >Téléchargez l'application</a> (clic droit, enregistrer sous), modifiez le fichier pour y mettre vos informations puis appelez ce programme régulièrement. <a href='https://git.karchnu.fr/Karchnu/dnsmanager/raw/0c0cedddb0aea0cfe2fb546b01e5862b4d613fe5/cli/daemon/daemon.pl' >Téléchargez l'application</a> (clic droit, enregistrer sous), modifiez le fichier pour y mettre vos informations puis appelez ce programme régulièrement.

View File

@ -10,6 +10,7 @@
<link rel="stylesheet" href="/css/bootstrap-theme.min.css"> <link rel="stylesheet" href="/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="/css/bootstrap.min.css"> <link rel="stylesheet" href="/css/bootstrap.min.css">
<link rel="stylesheet" href="/css/dnsmanager.css">
<script src="/js/bootstrap.min.js"></script> <script src="/js/bootstrap.min.js"></script>
<script src="/js/npm.js"></script> <script src="/js/npm.js"></script>
@ -17,16 +18,19 @@
<body> <body>
<% content %> <div class="container">
<% content %>
<div class="row"> <div class="row">
<div class="col-sm-8 col-sm-offset-3"> <div class="col-md-12">
<div class="well" id="footer"> <div class="well" id="footer">
Fièrement aidé par <a href="http://perldancer.org/">Dancer</a> <% dancer_version %> ♥<br/> Fièrement aidé par <a href="http://perldancer.org/">Dancer</a> <% dancer_version %> ♥<br/>
Le code est disponible <a href="https://github.com/KaneRoot/dnsmanager">ici</a> ! \o/ Le code est disponible <a href="https://github.com/KaneRoot/dnsmanager">ici</a> ! \o/
</div>
</div> </div>
</div> </div>
</div> </div> <!-- Fin du container footer -->
</body> </body>
</html> </html>

View File

@ -1,121 +1,103 @@
<div class="row"> <div class="row">
<div class="col-sm-2 col-sm-offset-1"> <div class="col-md-3 col-sm-4 hidden-xs">
<div class="panel panel-primary"> <div class="panel panel-primary">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Navigation</h3> <h3 class="panel-title">Navigation</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<% IF login.defined %> <% IF login.defined %>
Salut <% login %> ! Salut
<hr /> <% login %> !
<hr />
<div class="btn-group-vertical" role="group"> <div class="btn-group-vertical sidebar-group" role="group">
<a href="/user/logout"> <a href="/user/logout">
<button type="button" <button type="button" class="btn btn-default btn-lg list-group-item">Déconnexion</button>
class="btn btn-default btn-lg list-group-item"> </a>
Déconnexion <a href='/user/home'>
</button> <button type="button" class="btn btn-default btn-lg list-group-item">Ma page</button>
</a> </a>
<a href='/user/home'>
<button type="button"
class="btn btn-default btn-lg list-group-item">
Ma page
</button>
</a>
<% IF admin == 1 %> <% IF admin == 1 %>
<a href='/admin'> <a href='/admin'>
<button type="button" <button type="button" class="btn btn-default btn-lg list-group-item">Administration</button>
class="btn btn-default btn-lg list-group-item"> </a>
Administration <% END %>
</button>
</a>
<% END %>
<% IF domain.defined %> <% IF domain.defined %>
<!-- Button trigger modal --> <!-- Button trigger modal -->
<button type="button" <button type="button" class="btn btn-danger btn-lg" data-toggle="modal" data-target="#suppressionZoneModal">Supprimer</button>
class="btn btn-danger btn-lg"
data-toggle="modal"
data-target="#suppressionZoneModal">
Supprimer
</button>
<!-- Modal --> <!-- Modal -->
<div class="modal fade" id="suppressionZoneModal" <div class="modal fade" id="suppressionZoneModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
tabindex="-1" <div class="modal-dialog" role="document">
role="dialog" <div class="modal-content">
aria-labelledby="myModalLabel"> <div class="modal-header">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" <button type="button" class="close" data-dismiss="modal" aria-label="Close">
data-dismiss="modal" <span aria-hidden="true">&times;</span>
aria-label="Close"> </button>
<span aria-hidden="true">&times;</span>
</button>
<h4 class="modal-title" <h4 class="modal-title" id="suppressionZoneModalLabel">
id="suppressionZoneModalLabel"> Voulez-vous vraiment supprimer la zone ?
Voulez-vous vraiment supprimer la zone ? </h4>
</h4> </div>
</div>
<div class="modal-body"> <div class="modal-body">
Supprimer sa zone est irréversible. Supprimer sa zone est irréversible.
</div> </div>
<div class="modal-footer"> <div class="modal-footer">
<button type="button" class="btn btn-default" <button type="button" class="btn btn-default" data-dismiss="modal">
data-dismiss="modal"> Non j'aime ma zone !
Non j'aime ma zone ! </button>
</button> <a href="/domain/del/<% domain %>">
<a href="/domain/del/<% domain %>"> <button type="button" class="btn btn-danger">
<button type="button" Supprimer la zone
class="btn btn-danger"> </button>
Supprimer la zone </a>
</button> </div>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>
<% END %> <% END %>
</div> </div>
<% IF domains.defined && domains.size > 0 %> <% IF domains.defined && domains.size > 0 %>
<hr /> <hr />
<p>Mes domaines</p> <p>Mes domaines</p>
<% FOREACH domain IN domains %> <% FOREACH domain IN domains %>
<a href="/domain/details/<% domain.domain %>"><% domain.domain %></a><br /> <a href="/domain/details/<% domain.domain %>">
<% END %> <% domain.domain %>
<% END %> </a><br />
<% END %>
<% END %>
<% ELSE %> <% ELSE %>
<form class="form" role="form" action="/user/login" method="post" accept-charset="utf-8"> <form class="form" role="form" action="/user/login" method="post" accept-charset="utf-8">
<div class="form-group"> <div class="form-group">
<fieldset> <fieldset>
<legend>Se connecter :</legend> <legend>Se connecter :</legend>
<label for="login">Votre identifiant : </label> <label for="login">Votre identifiant : </label>
<input type="text" name="login" class="form-control" id="login" placeholder="Votre identifiant" /> <input type="text" name="login" class="form-control" id="login" placeholder="Votre identifiant" />
<label for="password">Votre mot de passe : </label> <label for="password">Votre mot de passe : </label>
<input type="password" name="password" class="form-control" id="password" placeholder="Mot de passe" /> <input type="password" name="password" class="form-control" id="password" placeholder="Mot de passe" />
<br /> <br />
<button type="submit" class="btn btn-default">Connexion &rarr;</button> <button type="submit" class="btn btn-default">Connexion &rarr;</button>
</fieldset> </fieldset>
</div> </div>
</form> </form>
<% END %> <% END %>
</div> </div>
</div> </div>
</div><!-- /.col-sm-2 --> </div>
<div class="col-sm-8"> <!-- /.col-sm-2 -->
<div class="col-sm-8">