templates/time/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Überzeitrechner{% endblock %}
  5. {% block main %}
  6.     <div class="container">
  7.         <main>
  8.             {{ form_start(form) }}
  9.                 <div class="py-5 text-center">
  10.                     <h2>Überzeit-Rechner</h2>
  11.                     <p class="lead">Mal schauen, wie wir hier zu einem Ziel kommen...</p>
  12.                 </div>
  13.                 <div class="my-custom-class-for-errors">
  14.                     {{ form_errors(form) }}
  15.                 </div>
  16.                 <div class="row g-5">
  17.                     <div class="col-5 col-lg-4 order-md-last">
  18.                         <h2 class="mb-3">Ergebnis</h2>
  19.                         <button class="w-100 btn btn-primary btn-lg" type="submit">Berechnen</button>
  20.                         <hr class="my-4">
  21.                         <h4 class="d-flex justify-content-between align-items-center mb-3">
  22.                             <span class="text-primary">Zeit zu arbeiten</span>
  23.                             <span class="badge bg-primary rounded-pill">{{ 3 }}</span>
  24.                         </h4>
  25.                     </div>
  26.                     <div class="col-7 col-lg-8">
  27.                         <h2 class="mb-3">Eingabe</h2>
  28.                         <div class="row g-3">
  29.                             <div class="col-md-6">
  30.                                 <div class="row">
  31.                                     <h4 class="mb-3">Aktuelle Überzeit</h4>
  32.                                     <div class="col-sm-6">
  33.                                         <div class="form-error">
  34.                                             {{ form_errors(form.currentHr) }}
  35.                                             {{ form_errors(form.currentMin) }}
  36.                                         </div>
  37.                                         <div class="input-group mb-3">
  38.                                             {{ form_widget(form.currentHr) }}
  39.                                             {{ form_label(form.currentHr) }}
  40.                                         </div>
  41.                                     </div>
  42.                                     <div class="col-sm-6">
  43.                                         <div class="input-group mb-3">
  44.                                             {{ form_widget(form.currentMin) }}
  45.                                             {{ form_label(form.currentMin) }}
  46.                                         </div>
  47.                                     </div>
  48.                                 </div>
  49.                             </div>
  50.                             <div class="col-md-6">
  51.                                 <div class="row">
  52.                                     <h4 class="mb-3">Gewünschte Überzeit</h4>
  53.                                     <div class="col-sm-6">
  54.                                         <div class="input-group mb-3">
  55.                                             <input type="number" class="form-control" name="targetHr" id="targetHr" placeholder="" value="" required="">
  56.                                             <label for="targetHr" class="input-group-text">Std.</label>
  57.                                         </div>
  58.                                     </div>
  59.                                     <div class="col-sm-6">
  60.                                         <div class="input-group mb-3">
  61.                                             <input type="number" class="form-control" name="targetMin" id="targetMin" placeholder="" value="" required="">
  62.                                             <label for="targetMin" class="input-group-text">Min.</label>
  63.                                         </div>
  64.                                     </div>
  65.                                 </div>
  66.                             </div>
  67.                         </div>
  68.                         <hr class="my-4">
  69.                         <h4 class="mb-3">Vorgaben</h4>
  70.                         <div class="row gy-3">
  71.                             <div class="col-md-6">
  72.                                 <label for="cc-name" class="form-label">Name on card</label>
  73.                                 <input type="text" class="form-control" id="cc-name" placeholder="" required="">
  74.                                 <small class="text-muted">Full name as displayed on card</small>
  75.                                 <div class="invalid-feedback">
  76.                                     Name on card is required
  77.                                 </div>
  78.                             </div>
  79.                             <div class="col-md-6">
  80.                                 <label for="cc-number" class="form-label">Credit card number</label>
  81.                                 <input type="text" class="form-control" id="cc-number" placeholder="" required="">
  82.                                 <div class="invalid-feedback">
  83.                                     Credit card number is required
  84.                                 </div>
  85.                             </div>
  86.                             <div class="col-md-3">
  87.                                 <label for="cc-expiration" class="form-label">Expiration</label>
  88.                                 <input type="text" class="form-control" id="cc-expiration" placeholder="" required="">
  89.                                 <div class="invalid-feedback">
  90.                                     Expiration date required
  91.                                 </div>
  92.                             </div>
  93.                             <div class="col-md-3">
  94.                                 <label for="cc-cvv" class="form-label">CVV</label>
  95.                                 <input type="text" class="form-control" id="cc-cvv" placeholder="" required="">
  96.                                 <div class="invalid-feedback">
  97.                                     Security code required
  98.                                 </div>
  99.                             </div>
  100.                         </div>
  101.                     </div>
  102.                 </div>
  103.             {{ form_end(form) }}
  104.         </main>
  105.     </div>
  106. {% endblock %}