tweet-post-htmlcss/index.html at main · acelest/tweet-post-htmlcss · 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
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Twitter</title>
    <link rel="stylesheet" href="src/style.css" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
    />
  </head>
  <body>
    <div class="container">
      <img src="https://picsum.photos/200/300" alt="" />
      <div class="name">aubin djou</div>
      <div class="username">@aubindjou</div>
      <p class="tweet">
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque, quia?
        Error nemo dolores quo velit quia earum unde, totam excepturi atque
        asperiores tempora rem
        <a href="https://twitter.com/acelestdev" target="_blank"
          ><span class="tag">@html</span></a
        >
        facere molestias provident cum aperiam! asperiores tempora rem numquam
        facere molestias provident cum aperiam! asperiores tempora rem numquam
        facere molestias provident cum aperiam! asperiores tempora rem numquam
        facere molestias provident cum aperiam!
      </p>
      <div class="date">
        2024-12-25 <span class="tweet-for">Tweet for iphone</span>
      </div>
      <div class="action">
        <button class="action-btn" value="reply">
          <i class="far fa-comment"></i>
        </button>
        <button class="action-btn" value="retweet">
          <i class="fas fa-retweet"></i>
        </button>
        <button class="action-btn" style="color: red" value="like">
          <i class="fas fa-heart"></i><span> 10k</span>
        </button>
        <button class="action-btn" value="share">
          <i class="fas fa-share"></i>
        </button>
      </div>
    </div>
  </body>
</html>