Untitled

<!DOCTYPE html>
<html lang="pl" xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<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="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
  <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet" />
  <style style="display: none">
    * {
      padding: 0;
      margin: 0;
      box-sizing: border-box;
      display: block;
    }
  </style>
  <style style="display: none">
    @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap');
  </style>
</head>
<body>
<div style="width: 100%; font-family: 'Poppins', sans-serif; background-color: #e5e5e5">
  <img src="https://i.imgur.com/ZSq5qftl.png" alt="Zdjęcie w banerze" style="margin: 0 auto; width: 600px; height: 245px; object-fit: cover" />
  <div style="max-width: 600px; margin: 0 auto; padding: 30px 40px; background-color: #fff">
    <h1 style="width: 100%; line-height: 36px; font-size: 24px; font-weight: 700; padding: 40px 0">
      <span th:text="${userWithMessage.name}">Oskar Kowalski </span>wysłał nową wiadomość poprzez stronę DTH!
    </h1>
    <p th:text="${userWithMessage.message}" style="font-weight: 400; font-size: 18px; line-height: 27px; margin-bottom: 60px; width: 100%">
      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc vulputate libero et velit interdum, ac aliquet odio mattis.
    </p>
    <div style="padding: 40px 30px; margin-bottom: 70px; width: 100%; background: #474f5a; font-size: 18px">
      <h2 style="font-weight: 700; font-size: 18px; text-transform: capitalize; width: 100%; margin-bottom: 40px; color: #fff">
        Dane kontaktowe:
      </h2>
      <p style="width: 100%; margin-bottom: 20px">
        <span style="color: #85bd4b; font-weight: 600; width: 100%">Imię i nazwisko</span>
        <span th:text="${userWithMessage.name}" style="color: #fff; width: 100%">Oskar Kowalski</span>
      </p>
      <p style="width: 100%; color: #85bd4b; margin-bottom: 20px">
        <span style="color: #85bd4b; font-weight: 600; width: 100%">Email</span>
        <span th:text="${userWithMessage.email}" style="color: #fff; width: 100%">oskarkowalski@poczta.onet.pl</span>

      </p>
    </div>
    <p  style="font-weight: 400; font-size: 14px; line-height: 27px; margin-block: 25px 40px; width: 100%; color: #919191">
      Lorem ipsum dolor sit amet consectetur adipisicing elit. A porro aliquam laudantium vero nisi eveniet hic iusto laborum dolore ad, veniam
      quo ducimus consectetur in libero?
    </p>
  </div>
</div>
</body>
</html>