API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Mar 27th, 2018
426
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 5 27.05 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.  
  6.     <meta charset="utf-8">
  7.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  8.     <meta name="viewport" content="width=device-width, initial-scale=1">
  9.     <meta name="description" content="">
  10.     <meta name="author" content="">
  11.     <!--favicon-->
  12.     <link rel="icon" href="">
  13.  
  14.     <title>Gestob</title>
  15.  
  16.     <!-- Bootstrap Core CSS -->
  17.     <!-- <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet"> -->
  18.     <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet">
  19.     <link href="https://cdn.rawgit.com/tonystar/bootstrap-float-label/v4.0.1/dist/bootstrap-float-label.min.css" rel="stylesheet">
  20.     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js"></script>
  21.  
  22.     <!-- Liens pour la datatables -->
  23.     <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0/css/bootstrap.css" rel="stylesheet">
  24.     <link href="https://cdn.datatables.net/1.10.16/css/dataTables.bootstrap4.min.css" rel="stylesheet">
  25.  
  26.     <!-- Google icons from material.io -->
  27.     <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
  28.     <!-- Custom CSS -->
  29.     <link href="css/gestob_style.css" rel="stylesheet">
  30.     <!-- <link href="../css/floating-labels.css" rel="stylesheet"> -->
  31.  
  32.     <!-- Custom Fonts -->
  33.     <!-- <link href="../vendor/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> -->
  34.  
  35.     <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  36.     <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  37.     <!--[if lt IE 9]>
  38.        <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
  39.        <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
  40.    <![endif]-->
  41.  
  42. </head>
  43.  
  44. <body>
  45.     <!-- Barre de navigation -->
  46.     <nav id="page_main_navigation" class="navbar navbar-expand-lg fixed-top navbar-dark bg-dark">
  47.         <div class="navbar-collapse collapse w-100 order-1 order-lg-0 dual-collapse2">
  48.             <ul id="nav-tabs" class="navbar-nav mr-auto">
  49.                 <li id="nav-mes-entreprises" class="nav-item active">
  50.                     <!-- Mes Entreprises btn btn-primary -->
  51.                     <a class="nav-link " href="#"></a>
  52.                 </li>
  53.                 <li id="nav-mon-stage" class="nav-item">
  54.                     <!-- Mon Stage -->
  55.                     <a class="nav-link" href="#"></a>
  56.                 </li>
  57.             </ul>
  58.         </div>
  59.         <div id="brand-name" class="mx-auto order-0">
  60.             <a class="navbar-brand mx-auto" href="#">Gestob</a>
  61.         </div>
  62.         <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".dual-collapse2">
  63.             <span class="navbar-toggler-icon"></span>
  64.         </button>
  65.         <div class="navbar-collapse collapse w-100 order-3 dual-collapse2">
  66.             <ul id="nav-info-user" class="navbar-nav ml-auto">
  67.                 <li class="nav-item">
  68.                     <button class="btn btn-info" data-toggle="tooltip" data-placement="bottom" title="Informations sur l'application">
  69.                         <img alt="modalites" src="/assets/icons/ic_help_outline_white_24px.svg">
  70.                     </button>
  71.                 </li>
  72.                 <li class="nav-item">
  73.                     <button id="user-button" class="btn btn-secondary ml-lg-1 mr-lg-1" data-toggle="tooltip" data-placement="bottom" title="Mon profil"
  74.                        disabled>
  75.                         <img src="assets/icons/ic_person_white_24px.svg" alt="userLogo">
  76.                         <i>Non connect&eacute;</i>
  77.                     </button>
  78.  
  79.                 </li>
  80.  
  81.                 <li class="nav-item">
  82.                     <!-- my-2 my-sm-0 -->
  83.                     <button style="display: none;" type="button" id="logout-button" class=" btn btn-danger " data-toggle="tooltip" data-placement="left"
  84.                        title="Se d&eacute;connecter">
  85.                         <img src="assets/icons/ic_power_settings_new_white_24px.svg" alt="logoutLogo">
  86.                     </button>
  87.                 </li>
  88.             </ul>
  89.         </div>
  90.     </nav>
  91.     <!-- Fin barre de navigation -->
  92.  
  93.     <!-- <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalCenter">
  94.            Launch demo modal
  95.          </button> -->
  96.  
  97.     <!-- Modal : pop-up pour disconnect-->
  98.     <div class="modal fade" id="modal-logout" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
  99.         <div class="modal-dialog modal-dialog-centered" role="document">
  100.             <div class="modal-content">
  101.                 <div class="modal-header">
  102.                     <h5 class="modal-title" id="exampleModalLongTitle">D&eacute;connexion</h5>
  103.                     <button type="button" class="close" data-dismiss="modal" aria-label="Close">
  104.                         <span aria-hidden="true">&times;</span>
  105.                     </button>
  106.                 </div>
  107.  
  108.                 <div class="modal-footer text-center">
  109.                     <button type="button" class="btn btn-success" data-dismiss="modal">Annuler</button>
  110.                     <button type="button" id="btn-logout" data-dismiss="modal" class="btn btn-danger">Se d&eacute;connecter</button>
  111.                 </div>
  112.             </div>
  113.         </div>
  114.     </div>
  115.     <!-- /modal -->
  116.  
  117.  
  118.  
  119.  
  120.     <!-- main container -->
  121.     <div class="container">
  122.         <div id="page_login_register" style="display: none;">
  123.             <div class="row">
  124.                 <!-- Form login -->
  125.                 <div class="col-md-6">
  126.                     <div class="card">
  127.                         <h2 class="card-header text-center">Se connecter</h2>
  128.                         <!-- <hr class="my-4"> -->
  129.                         <div class="card-body">
  130.                             <form role="form" id="formLogin" class="form-signin needs-validation" novalidate>
  131.                                 <fieldset>
  132.                                     <!-- @emailOrPseudo -->
  133.  
  134.                                     <div class="form-group has-float-label">
  135.                                         <input class="form-control" id="email-pseudo-login" type="email" placeholder="Ex: totodumoulin@mail.com" required autofocus/>
  136.                                         <label for="email-pseudo-login">E-mail ou pseudo</label>
  137.                                     </div>
  138.                                     <div style="display: none;" class="alert alert-danger text-center">
  139.                                         <small id="passwordHelp" class="text-danger "></small>
  140.                                     </div>
  141.  
  142.                                     <!-- @passLogin -->
  143.                                     <div class="form-group has-float-label">
  144.                                         <input class="form-control" id="password-login" type="password" placeholder="••••••••" required />
  145.                                         <label for="password-login">Mot de passe</label>
  146.                                     </div>
  147.                                     <div style="display: none;" class="alert alert-danger text-center">
  148.                                         <small id="passwordHelp" class="text-danger "></small>
  149.                                     </div>
  150.                                     <!-- @remember -->
  151.                                     <div class="checkbox mb-3 text-center">
  152.                                         <label>
  153.                                             <input name="remember" id="remember" type="checkbox" value="Remember Me"> Rester connect&eacute;
  154.                                         </label>
  155.                                     </div>
  156.  
  157.                                     <!-- <hr class="my-4"> -->
  158.                                     <!-- @loginButton -->
  159.                                     <input id="loginInput" type="submit" class="btn btn-lg btn-success btn-block" value="Connexion">
  160.  
  161.                                 </fieldset>
  162.                             </form>
  163.                         </div>
  164.                     </div>
  165.                 </div>
  166.                 <div id="infoPannel" class="alert alert-success " style="display: none;">
  167.                     <strong>Success!</strong> Indicates a successful or positive action.
  168.                 </div>
  169.                 <!-- /jumbotron -->
  170.                 <!-- </div> -->
  171.                 <!-- /form login -->
  172.  
  173.  
  174.                 <!-- Form register -->
  175.                 <div class="col-md-6">
  176.                     <div class="card">
  177.  
  178.                         <h2 class="card-header text-center">S'inscrire</h2>
  179.                         <!-- <hr class="my-4"> -->
  180.                         <div class="card-body">
  181.                             <form role="form" id="formRegister" class="form-signin needs-validation" novalidate>
  182.                                 <fieldset>
  183.                                     <!-- @nom -->
  184.                                     <div class="form-group has-float-label">
  185.                                         <input class="form-control" id="nom" type="text" placeholder="Dujardin " required />
  186.                                         <label for="nom">Nom</label>
  187.                                     </div>
  188.                                     <div style="display: none;" class="alert alert-danger text-center">
  189.                                         <small id="passwordHelp" class="text-danger "></small>
  190.                                     </div>
  191.                                     <!-- @prenom -->
  192.                                     <div class="form-group has-float-label">
  193.                                         <input class="form-control" id="prenom" type="text" placeholder="Jerome" required />
  194.                                         <label for="prenom">Pr&eacute;nom</label>
  195.                                     </div>
  196.                                     <div style="display: none;" class="alert alert-danger text-center">
  197.                                         <small id="passwordHelp" class="text-danger "></small>
  198.                                     </div>
  199.                                     <!-- @pseudo -->
  200.                                     <div class="form-group has-float-label">
  201.                                         <input class="form-control" id="pseudo" type="text" placeholder="ElJeromus78" required />
  202.                                         <label for="pseudo">Pseudo</label>
  203.                                     </div>
  204.                                     <div style="display: none;" class="alert alert-danger text-center">
  205.                                         <small id="passwordHelp" class="text-danger "></small>
  206.                                     </div>
  207.                                     <!-- @tel -->
  208.                                     <div class="form-group has-float-label">
  209.                                         <input class="form-control" id="tel" type="tel" placeholder="0478 55 47 58" required />
  210.                                         <label for="tel">T&eacute;l&eacute;phone</label>
  211.                                     </div>
  212.                                     <div style="display: none;" class="alert alert-danger text-center">
  213.                                         <small id="passwordHelp" class="text-danger "></small>
  214.                                     </div>
  215.                                     <!-- @mail -->
  216.                                     <div class="form-group has-float-label">
  217.                                         <input class="form-control" id="email" type="email" placeholder="toto@mail.com" required />
  218.                                         <label for="email">E-mail</label>
  219.                                     </div>
  220.                                     <div style="display: none;" class="alert alert-danger text-center">
  221.                                         <small id="passwordHelp" class="text-danger "></small>
  222.                                     </div>
  223.                                     <!-- @mdp -->
  224.                                     <div class="form-group has-float-label">
  225.                                         <input class="form-control" id="passRegister" type="password" placeholder="••••••••" required />
  226.                                         <label for="passRegister">Mot de passe</label>
  227.                                     </div>
  228.                                     <div style="display: none;" class="alert alert-danger text-center">
  229.                                         <small id="passwordHelp" class="text-danger "></small>
  230.                                     </div>
  231.                                     <!-- @mdp-conf -->
  232.                                     <div class="form-group has-float-label">
  233.                                         <input class="form-control" id="passConf" type="password" placeholder="••••••••" required/>
  234.                                         <label for="passConf">Confirmation mot de passe</label>
  235.                                     </div>
  236.                                     <div style="display: none;" class="alert alert-danger text-center">
  237.                                         <small id="passwordHelp" class="text-danger "></small>
  238.                                     </div>
  239.                                     <!-- @birthdate -->
  240.                                     <div class="form-group has-float-label">
  241.                                         <input class="form-control" id="birthdate" type="date" required />
  242.                                         <label for="birthdate">Date de naissance</label>
  243.                                     </div>
  244.                                     <div style="display: none;" class="alert alert-danger text-center">
  245.                                         <small id="passwordHelp" class="text-danger "></small>
  246.                                     </div>
  247.                                     <!-- @inscription_date -->
  248.                                     <!-- <div class="form-group has-float-label">
  249.                                    <input class="form-control" id="inscription-date" type="date" required />
  250.                                    <label for="inscription-date">Date d'inscription</label>
  251.                                </div>
  252.                                <div style="display: none;" class="alert alert-danger text-center">
  253.                                    <small id="passwordHelp" class="text-danger "></small>
  254.                                </div> -->
  255.                                     <!-- @registerInput -->
  256.                                     <input id="registerInput" type="submit" class="btn btn-lg btn-primary btn-block" value="Inscription">
  257.                                 </fieldset>
  258.  
  259.                             </form>
  260.                         </div>
  261.                     </div>
  262.  
  263.                 </div>
  264.                 <!-- /jumbotron -->
  265.             </div>
  266.             <!-- /form register -->
  267.  
  268.         </div>
  269.         <!-- /row -->
  270.  
  271.  
  272.         <div id="page_entreprises" style="display: none;">
  273.             <div class="row">
  274.                 <div id="display_entreprises" class="col-md-6" >
  275.                     <div class="card">
  276.                         <h2 class="card-header text-center">Mes Entreprises</h2>
  277.  
  278.                         <div>
  279.                             <table id="table-entreprises" class="table table-bordered table-hover" style="width:100%">
  280.                                 <thead>
  281.                                     <tr>
  282.                                         <th>Nom</th>
  283.                                         <th>Ville</th>
  284.                                         <th>Statut du Contact</th>
  285.  
  286.                                     </tr>
  287.                                 </thead>
  288.                                 <tbody>
  289.                                     <tr>
  290.                                         <td>Entreprise 1</td>
  291.                                         <td>Ville 1</td>
  292.                                         <td class="bg-success">Accepté</td>
  293.                                     </tr>
  294.                                     <tr>
  295.                                         <td>Entreprise 2</td>
  296.                                         <td>Ville 2</td>
  297.                                         <td></td>
  298.  
  299.                                     </tr>
  300.                                     <tr>
  301.                                         <td>Entreprise 3</td>
  302.                                         <td>Ville 3</td>
  303.                                         <td>Initié</td>
  304.  
  305.                                     </tr>
  306.                                     <tr>
  307.                                         <td>Entreprise 4</td>
  308.                                         <td>Ville 4</td>
  309.                                         <td>Initié</td>
  310.  
  311.                                     </tr>
  312.                                 </tbody>
  313.  
  314.                             </table>
  315.                         </div>
  316.                         <!-- /card-body -->
  317.                     </div>
  318.                     <!-- /card -->
  319.                 </div>
  320.                 <!-- /col-md-6 -->
  321.                 <div id="display_infos" class="col-md-6" style="display: none;">
  322.                     <div class="card">
  323.                         <h2 class="card-header text-center">Accueil</h2>
  324.                         <!-- <hr class="my-4"> -->
  325.                         <div class="card-body">
  326.                             <p>
  327.                                 Il vous reste encore x jours pour trouver un stage.
  328.                             </p>
  329.                             <p>
  330.                                 Cliquez sur une entreprise pour acc&eacute;der à ses informations.
  331.                             </p>
  332.                             <hr class="my-4">
  333.                             <p id="links-infos" class="text-center">
  334.                                 <a class="btn btn-info">
  335.                                     Modalit&eacute;s pratiques
  336.                                     <img alt="modalites" src="/assets/icons/ic_link_white_24px.svg">
  337.                                 </a>
  338.                                 <!-- <a class="btn btn-info" data-toggle="tooltip" data-placement="bottom" title="Informations sur l'application">
  339.                                    <img alt="modalites" src="/assets/icons/ic_help_outline_white_24px.svg">
  340.                                </a> -->
  341.                             </p>
  342.  
  343.                         </div>
  344.                     </div>
  345.                 </div>
  346.                
  347.                 <div id="display_details" class="col-md-6">
  348.                     <div class="card">
  349.                         <h2 class="card-header text-center">Entreprise1</h2>
  350.                         <!-- <hr class="my-4"> -->
  351.                         <div class="card-body">
  352.                             <form role="form" id="formEntreprise" class="form-signin needs-validation" novalidate>
  353.                                 <fieldset>
  354.                                     <!-- @nomEntreprise -->
  355.                                     <div class="form-group has-float-label">
  356.                                         <input class="form-control" id="nomEntreprise" type="text" value="Entreprise1" readonly/>
  357.                                     </div>
  358.                                     <!-- @adresseEntreprise -->
  359.                                     <div class="form-group has-float-label">
  360.                                         <input class="form-control" id="adresseEntreprise" type="text" value="Rue du Peuplier" readonly/>
  361.                                     </div>
  362.                                         <div class="row">
  363.                                             <!-- @numEntreprise -->
  364.                                             <div class="form-group has-float-label col md-6">
  365.                                                 <input class="form-control" id="numEntreprise" type="text" value="76" readonly/>
  366.                                             </div>
  367.                                             <!-- @boiteEntreprise -->
  368.                                             <div class="form-group has-float-label col md-6">
  369.                                                 <input class="form-control" id="boiteEntreprise" type="text" value="A" readonly/>
  370.                                                 <label for="boiteEntreprise">boîte</label>
  371.                                             </div>
  372.                                         </div>
  373.                                         <div class="row">
  374.                                             <!-- @villeEntreprise -->
  375.                                             <div class="form-group has-float-label col md-6">
  376.                                                 <input class="form-control" id="villeEntreprise" type="text" value="Bruxelles" readonly/>
  377.                                             </div>
  378.                                             <!-- @cpEntreprise -->
  379.                                             <div class="form-group has-float-label col md-6">
  380.                                                 <input class="form-control" id="cpEntreprise" type="number" value="1000" readonly/>
  381.                                                 <label for="boiteEntreprise">cp</label>
  382.                                             </div>
  383.                                         </div>
  384.                                         <div class="row">
  385.                                             <!-- @telEntreprise -->
  386.                                             <div class="form-group has-float-label col md-5">
  387.                                                 <input class="form-control" id="telEntreprise" type="tel" value="02 640 36 52" readonly/>
  388.                                             </div>
  389.                                             <!-- @emailEntreprise -->
  390.                                             <div class="form-group has-float-label col md-5">
  391.                                                 <input class="form-control" id="emailEntreprise" type="email" value="entreprise1@skynet.be" readonly/>
  392.                                             </div>
  393.                                         </div>
  394.                                      <!-- @contact-->
  395.                                      <div class="form-group has-float-label">
  396.                                         <label for="statutContact">Statut du contact:</label>
  397.                                         <select class="form-control" id="statutContact">
  398.                                             <option>Accepté</option>
  399.                                             <option>Initié</option>
  400.                                             <option>Pris</option>
  401.                                             <option>Stage en ordre</option>
  402.                                         </select>
  403.                                     </div>
  404.                                 </fieldset>
  405.                             </form>
  406.                             <h4 class="text-center">Personnes de Contacts</h4>
  407.                             <div>
  408.                                 <table id="table-contacts" class="table table-bordered table-hover" style="width:100%">
  409.                                     <thead>
  410.                                         <tr>
  411.                                             <th>Nom</th>
  412.                                             <th>Prénom</th>
  413.                                             <th>Email</th>
  414.                                             <th>Téléphone</th>
  415.                                         </tr>
  416.                                     </thead>
  417.                                     <tbody>
  418.                                         <tr>
  419.                                             <td>Dumoulin</td>
  420.                                             <td>Marc</td>
  421.                                             <td>marc.dumoulin@gmail.com</td>
  422.                                             <td>02/351.967</td>
  423.                                         </tr>
  424.                                         <tr>
  425.                                             <td>Follet</td>
  426.                                             <td>Ken</td>
  427.                                             <td>ken.follet@gmail.com</td>
  428.                                             <td>02/594.852</td>
  429.                                         </tr>
  430.                                         <tr>
  431.                                             <td>Stieg</td>
  432.                                             <td>Larson</td>
  433.                                             <td>stieg.larson@skynet.com</td>
  434.                                             <td>010/759.564</td>
  435.                                         </tr>
  436.                                     </tbody>
  437.  
  438.                                 </table>
  439.                             </div>
  440.                         </div>
  441.                     </div>
  442.                 </div>
  443.             </div>
  444.             <div id="page_mon_stage" style="display: none;">
  445.                 <div class="card">
  446.                     <h2 class="card-title text-center">Mon stage</h2>
  447.                 </div>
  448.             </div>
  449.             <div id="page_mon_profil" style="display: none;">
  450.                 <div class="card">
  451.                     <h1 class="text-center">Mon Profil</h1>
  452.                 </div>
  453.             </div>
  454.         </div>
  455.         <!-- /main container -->
  456.  
  457.  
  458.  
  459.         <!-- <footer class="footer text-center">
  460.        <div class="container">
  461.            <span class="panel panel-default text-muted">&copy; Gestob 2017-2018</span>
  462.            <ul class="list-inline">
  463.                <li class="list-inline-item">
  464.                    <a href="#">Privacy</a>
  465.                </li>
  466.                <li class="list-inline-item">
  467.                    <a href="#">Terms</a>
  468.                </li>
  469.                <li class="list-inline-item">
  470.                    <a href="#">Support</a>
  471.                </li>
  472.            </ul>
  473.        </div>
  474.    </footer> -->
  475.  
  476.         <footer class="my-5 pt-5 text-muted text-center text-small">
  477.             <p class="mb-1">&copy; 2017-2018 Gestob</p>
  478.             <ul class="list-inline">
  479.                 <li class="list-inline-item">
  480.                     <a href="#">Privacy</a>
  481.                 </li>
  482.                 <li class="list-inline-item">
  483.                     <a href="#">Terms</a>
  484.                 </li>
  485.                 <li class="list-inline-item">
  486.                     <a href="#">Contact</a>
  487.                 </li>
  488.             </ul>
  489.         </footer>
  490.  
  491.         <!-- jQuery -->
  492.         <script src="vendor/jquery/jquery.min.js"></script>
  493.  
  494.         <!-- Bootstrap Core JavaScript -->
  495.         <!-- <script src="../vendor/bootstrap/js/bootstrap.min.js"></script> -->
  496.         <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>
  497.         <script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
  498.         <script src="https://cdn.datatables.net/1.10.16/js/dataTables.bootstrap4.min.js"></script>
  499.  
  500.         <!-- Custom Theme JavaScript -->
  501.         <!-- Custom scripts for page -->
  502.         <script src="js/js_pages/login_register.js"></script>
  503.         <script src="js/js_pages/main_navigation.js"></script>
  504.         <script src="js/js_pages/entreprises.js"></script>
  505.         <script src="js/js_pages/mon_stage.js"></script>
  506.         <script src="js/js_pages/mon_profil.js"></script>
  507.  
  508.         <!-- Main scripts -->
  509.         <script src="js/tools.js"></script>
  510.         <script src="js/frontend.js"></script>
  511.         <script src="js/index.js"></script>
  512.  
  513.  
  514. </body>
  515.  
  516. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!