call-to-action.html 1.1 KB

123456789101112131415161718192021222324252627282930313233343536
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  7. <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css">
  8. <link rel="stylesheet" href="normalize.css">
  9. <link rel="stylesheet" href="style.css">
  10. <title>Document</title>
  11. </head>
  12. <body class="body-- nodebug">
  13. <h1>Call to action (small container)</h1>
  14. <div class="show-case">
  15. <div class="cta">
  16. <i class="cta__icon fa fa-exclamation-circle fa-2x"></i>
  17. <h1 class="cta__title">The title</h1>
  18. <p class="cta__text">The short text to convince you !</p>
  19. <button class="cta__button">The button !</button>
  20. </div>
  21. </div>
  22. <h1>Call to action</h1>
  23. <div class="show-case show-case--big">
  24. <div class="cta">
  25. <i class="cta__icon fa fa-exclamation-circle fa-3x"></i>
  26. <h1 class="cta__title">The title</h1>
  27. <p class="cta__text">The short text to convince you !</p>
  28. <button class="cta__button">The button !</button>
  29. </div>
  30. </div>
  31. </body>
  32. </html>