lgm-task/index.html at main · SwayamDeveloper/lgm-task · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="/style.css">
    <title>Frontend Mentor | Order summary card</title>
  </head>
  <body>
    <main class="container">
      <div class="card">
        <div class="card__content">
          <h1 class="card__title">Order Summary</h1>
          <p class="card__paragraph">You can now listen to millions of songs, audiobooks, and podcasts on any device anywhere you like!</p>
          <div class="card__offer">
            <img class="card__picto" src="https://image.freepik.com/free-vector/elegant-musical-notes-music-chord-background_1017-20759.jpg " width="50px"  alt="Music picto" />
            <p class="card__plan">Annual Plan <span>500rs/year</span></p>
            <a href="#" class="card__link">Change</a>
          </div>
          <button class="card__button card__button--primary">Proceed to Payment</button>
          <button class="card__button card__button--secondary">Cancel Order</button>
        </div>
      </div>
    </main>
  </body>
</html>