08-flexbox/05-flex-modal-2024-redo/index.html

<!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">
    <link rel="stylesheet" href="style.css">
    <title>Modal</title>
  </head>
  <body>
    <div class="modal">
      <div class="icon-container">
        <div class="icon">!</div>
      </div>
      <div class="content-container">
        <div class="top-container">
          <div class="header">Are you sure you want to do that?</div>
          <button class="close-button">✖</button>
        </div>
        <div class="text">Lorem ipsum dolor sit amet consectetur adipisicing elit. Pariatur excepturi id soluta, numquam minima rerum doloremque eveniet aspernatur beatae commodi. Cupiditate recusandae ad repellendus quidem consectetur sequi amet aspernatur cumque!</div>
        <button class="continue">Continue</button>
        <button class="cancel">Cancel</button>
      </div>
    </div>
  </body>
</html>