The Language of flowers

I used HTML, CSS, and Javascript, and VS studio code software for this project. The full code I wrote is included below.

Full Code

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <style>
    @import url("https://fonts.googleapis.com/css2?family=Dancing+Script:wght@700&family=Source+Code+Pro:wght@300&display=swap");
    @import url("https://fonts.googleapis.com/css2?family=Dongle:wght@300&display=swap");
    a {
      text-decoration: none;
      text-align: center;
      display: block;
      padding-bottom: 30px;
      color: #ca2f3a;
    }
    a:hover {
      cursor: pointer;
      text-decoration: underline;
    }
    h3 {
      text-align: center;
      font-size: 15px;
      color: white;
    }

    p {
      font-family: "Dongle", sans-serif;
      font-size: 20px;
      line-height: 25px;
      width: 400px;
      display: block;
      margin: 0 auto;
      margin-top: 0;
      padding: 10px;
      text-align: center;
      color: #5c6044;
    }

    img {
      width: 400px;
      display: block;
      margin: 0 auto;
      padding: 10px;
      border-radius: 25px;
    }

    button {
      display: block;
      margin: 0 auto;
      background-color: #f1b0be;
      border-color: #f1b0be;
      color: white;
      padding: 20px;
      border-width: 1px;
      border-radius: 15px;
    }
    button:hover {
      cursor: pointer;
      background-color: white;
      border-color: #f1b0be;
      color: #f1b0be;
    }

    .author {
      font-family: "Dongle", sans-serif;
      font-size: 20px;
      text-align: center;
      color: #f1b0be;
      margin-top: 0px;
    }

    .title {
      font-family: "Dancing Script", cursive;
      font-size: 40px;
      text-align: center;
      padding-bottom: 0px;
      width: 400px;
      margin: 0 auto;
      color: #ca2f3a;
    }
    .container {
      background: linear-gradient(#f1d8e7, #fef4fc, #fef4fc, #fef4fc);
      padding: 50px;
      width: 470px;
      margin: 0 auto;
      border-radius: 40px;
    }
  </style>
  <body>
    <div class="container">
      <h3>BOOK PUBLISHER</h3>
      <h1 class="title">The Language of Flowers</h1>
      <h1 class="author">by Vanessa Diffenbaugh</h1>

      <img
        src="https://s3.amazonaws.com/shecodesio-production/uploads/files/000/020/544/original/JPEG.jpg?1636175346"
      />
      <p>
        This title comes from the Victorian Era’s literal language of flowers,
        which they relied on to convey feelings rarely spoken of: ardor and
        friendship, jealousy and envy, infidelity and grief. We meet Victoria
        Jones on her eighteenth birthday: the day she is emancipated from foster
        care. Though fluent in the language of flowers, Victoria uses her
        flowers to communicate distrust and discord. But as she strikes out on
        her own, she comes to learn that the language of flowers is more
        complicated than she was taught to believe. This beautiful debut is
        easy-reading, yet has depth and feeling. Ultimately, it’s a redemption
        story. And who doesn't love a good redemption story?
      </p>
      <a
        href="https://www.goodreads.com/book/show/10032672-the-language-of-flowers"
        target="_blank"
        >learn more</a
      >

      <button>Preorder Book Now</button>
      <h1 class="author">Coded by Jenny Matiga</h1>
    </div>
    <script>
      function preOrder() {
        let name = prompt("What is your Name");
        let emailAddress = prompt("What is your Email Address?");
        alert(
          "Thank you " +
            name +
            ", We will email you from the email address you provided. if theres any questions feel free to email us at SampleOnly@gmail.com "
        );
      }
      let orderButton = document.querySelector("button");
      orderButton.addEventListener("click", preOrder);
    </script>
  </body>
</html>
Previous

Code - Working Weather App
Next

Code - Fake Weather app