demoPage.html.twig 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8" />
  5. <title>Welcome!</title>
  6. <style>
  7. body { background: #F5F5F5; font: 18px/1.5 sans-serif; }
  8. h1, h2 { line-height: 1.2; margin: 0 0 .5em; }
  9. h1 { font-size: 36px; }
  10. h2 { font-size: 21px; margin-bottom: 1em; }
  11. p { margin: 0 0 1em 0; }
  12. a { color: #0000F0; }
  13. a:hover { text-decoration: none; }
  14. code { background: #F5F5F5; max-width: 100px; padding: 2px 6px; word-wrap: break-word; }
  15. #wrapper { background: #FFF; margin: 1em auto; max-width: 800px; width: 95%; }
  16. #container { padding: 2em; }
  17. #welcome, #status { margin-bottom: 2em; }
  18. #welcome h1 span { display: block; font-size: 75%; }
  19. #comment p { margin-bottom: 0; }
  20. #icon-status { float: left; height: 64px; margin-right: 1em; margin-top: -4px; width: 64px; }
  21. @media (min-width: 768px) {
  22. #wrapper { width: 80%; margin: 2em auto; }
  23. #status a, #next a { display: block; }
  24. @-webkit-keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }
  25. @keyframes fade-in { 0% { opacity: 0; } 100% { opacity: 1; } }
  26. .sf-toolbar { opacity: 0; -webkit-animation: fade-in 1s .2s forwards; animation: fade-in 1s .2s forwards;}
  27. }
  28. </style>
  29. </head>
  30. <body>
  31. <div id="wrapper">
  32. <div id="container">
  33. <div id="welcome">
  34. <h1><span>Un nouveau contrôleur!</span></h1>
  35. </div>
  36. <div id="status">
  37. <p>
  38. <svg id="icon-status" width="1792" height="1792" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1671 566q0 40-28 68l-724 724-136 136q-28 28-68 28t-68-28l-136-136-362-362q-28-28-28-68t28-68l136-136q28-28 68-28t68 28l294 295 656-657q28-28 68-28t68 28l136 136q28 28 28 68z" fill="#759E1A"/></svg>
  39. Now, modify it at<br>
  40. <code>{{ path }}</code>
  41. </p>
  42. </div>
  43. </div>
  44. </div>
  45. </body>
  46. </html>