templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Home PayeTonKawa{% endblock %}
  5. {% block stylesheets %}
  6. <style>
  7.     /* Custom CSS */
  8.     html, body {
  9.         color: #FFFFFF;
  10.         margin: auto 0;
  11.         min-height: 900px;
  12.         background: hsla(54, 100%, 50%, 1);
  13.         background: linear-gradient(90deg, hsla(54, 100%, 50%, 1) 0%, hsla(285, 100%, 32%, 1) 34%, hsla(261, 55%, 18%, 1) 72%, hsla(259, 58%, 9%, 1) 100%);
  14.         background: -moz-linear-gradient(90deg, hsla(54, 100%, 50%, 1) 0%, hsla(285, 100%, 32%, 1) 34%, hsla(261, 55%, 18%, 1) 72%, hsla(259, 58%, 9%, 1) 100%);
  15.         background: -webkit-linear-gradient(90deg, hsla(54, 100%, 50%, 1) 0%, hsla(285, 100%, 32%, 1) 34%, hsla(261, 55%, 18%, 1) 72%, hsla(259, 58%, 9%, 1) 100%);
  16.         filter: progid: DXImageTransform.Microsoft.gradient( startColorstr="#FFE500", endColorstr="#7B00A4", GradientType=1 );
  17.     }
  18.     button {
  19.         border-color: #020344;
  20.         background: hsla(239, 94%, 14%, 1);
  21.         background: linear-gradient(227deg, hsl(216deg 98% 53%) 0%, hsl(0deg 0% 51%) 100%);
  22.         background: -moz-linear-gradient(227deg, hsla(216deg 98% 53%) 0%, hsla(0deg 0% 51%) 100%);
  23.         background: -webkit-linear-gradient(227deg, hsla(216deg 98% 53%) 0%, hsla(0deg 0% 51%) 100%);
  24.     }
  25.     button:hover {
  26.         border-color: #020344;
  27.         background: hsla(239, 94%, 14%, 1);
  28.         background: linear-gradient(227deg, hsl(216deg 59% 54%) 0%, hsl(0deg 0% 51%) 100%);
  29.         background: -moz-linear-gradient(227deg, hsla(216deg 59% 54%) 0%, hsla(0deg 0% 51%) 100%);
  30.         background: -webkit-linear-gradient(227deg, hsla(216deg 59% 54%) 0%, hsla(0deg 0% 51%) 100%);
  31.         box-shadow: 0px 4px 0px yellow;
  32.     }
  33.     .shadow:hover {
  34.         text-shadow: 0px 2px 0px lawngreen;
  35.         transition-delay: 100ms;
  36.     }
  37.     p, label {
  38.         color: #FFFFFF;
  39.         text-shadow: 1px 2px 1px black;
  40.     }
  41.     small {
  42.         text-shadow: 1px 1px 1px black;
  43.     }
  44.     h2,h3,h4 {
  45.         color: #FFFFFF;
  46.         text-shadow: 2px 4px 2px black;
  47.     }
  48.     h1, .yellow {
  49.         color: yellow;
  50.         text-shadow: 2px 4px 2px black;
  51.     }
  52.     .yellowBackg {
  53.         background-color: yellow;
  54.     }
  55.     .violetBackg {
  56.         background-color: #130a26;
  57.     }
  58.     .logo {
  59.         text-align: center;
  60.     }
  61.     .social-icons {
  62.         margin-top: 2em;
  63.     }
  64.     .social-icons a {
  65.         padding: 0 0.5em;
  66.     }
  67.     .footer {
  68.         /*background-color: #130a26;
  69.         padding-top: 2em;
  70.         padding-bottom: 0.5em;*/
  71.     }
  72. </style>
  73. {% endblock %}
  75. {% block body %}
  77.     <div class="container w-50 mx-auto text-center">
  78.         <div class="container mx-auto my-3">
  79.             <h1 class="mx-auto">MSPR-MCA</h1>
  80.             <img class='logo my-3' src='https://mspr-mca.dev-integration-altman-69.fr/public/assets/img/payeTonKawa_logo.png'  alt='ptk_logo' style='width:300px;'/>
  81.             <h3 class="py-2 text-center"><a class="text-decoration-none shadow" href="{{ path('app_dataHome') }}">Interface DEV</a></h3>
  82.         </div>
  83.         <div class="container mx-auto my-3">
  84.             <div class='social-icons'>
  85.                 <a href='https://facebook.com/ptk'><img src='https://mspr-mca.dev-integration-altman-69.fr/public/assets/img/facebook.png'  alt='fb_logo' style='width:25px;'/></a>
  86.                 <a href='https://twitter.com/ptk'><img src='https://mspr-mca.dev-integration-altman-69.fr/public/assets/img/twitter.png'  alt='tw_logo' style='width:25px;'/></a>
  87.                 <a href='https://linkedin.com/ptk'><img src='https://mspr-mca.dev-integration-altman-69.fr/public/assets/img/linkedin.png'  alt='lk_logo' style='width:25px;'/></a>
  88.             </div>
  89.             <div class='footer'>
  90.                 <img class='logo my-3' src='https://mspr-mca.dev-integration-altman-69.fr/public/assets/img/epsi.png'  alt='ptk_logo' style='width:200px;'/>
  91.                 <p><small class=''>www.payeTonKawa.fr</small></p>
  92.                 <p><small class='' style='margin-bottom:0;'>Copyright @2022-2023  - PayeTonKawa - All Rights Reserved.</small></p>
  93.             </div>
  94.         </div>
  95.     </div>
  97. {% endblock %}