farfetch/men.html at first · Abdullah-FSWD/farfetch · 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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
<!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" />
    <script
      src="https://kit.fontawesome.com/ef15a76fa0.js"
      crossorigin="anonymous"
    ></script>
    <link
      href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
      rel="stylesheet"
      integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
      crossorigin="anonymous"
    />
    <title>Document</title>
    <link rel="stylesheet" href="./style/nav.css" />
    <link rel="stylesheet" href="./style/footer.css" />
    <link rel="stylesheet" href="./style/men.css" />
  </head>
  <body>
    <div id="navbar"></div>
    <div id="showProducts">
      <div class="row">
        <div class="col my-3">
          <img
            src="https://cdn-static.farfetch-contents.com/cms-cm/in/media/3130232/data/6224681530f8b25e4767fc2b0d0b0e03.png?ratio=1x1_messaging-side&minWidth=637"
            alt=""
          />
        </div>
        <div class="col text-center my-3">
          <h1 class="display-1">GET AN EXTRA 20% OFF SALE: FINAL REDUCTIONS</h1>
          <p class="lead">
            Don't miss out on the world's greatest designers in the FARFETCH
            sale, now with an extra 20% off. Selected items for a limited time
            only; discount automatically applied at checkout
          </p>

          <button>Shop Now</button>
        </div>
      </div>
      <div class="row">
        <div class="col text-center my-3">
          <h1 class="display-1">GET AN EXTRA 20% OFF SALE: FINAL REDUCTIONS</h1>
          <p class="lead">
            Don't miss out on the world's greatest designers in the FARFETCH
            sale, now with an extra 20% off. Selected items for a limited time
            only; discount automatically applied at checkout
          </p>

          <button>Shop Now</button>
        </div>
        <div class="col my-3">
          <img
            src="https://cdn-static.farfetch-contents.com/cms-cm/in/media/3133854/data/32f94d6210b12cec8b5386742ba44169.jpg?ratio=1x1_messaging-side&minWidth=637"
            alt=""
          />
        </div>
      </div>

      <div class="row">
        <div class="col">
          <img
            src="https://cdn-static.farfetch-contents.com/cms-cm/in/media/3133970/data/2f6d4612b02d28ab7e672052d853ac76.jpg?ratio=1x1_two-columns&minWidth=637"
            alt=""
          />
          <p>
            THE VALENTINE'S DAY GIFTS YOU DESERVE Forget the subtle hints — meet
            the fine watches, cult sneakers and home comforts you should ask
            them for immediately
          </p>
        </div>
        <div class="col text-center my-3">
            <h1 class="display-1">GET AN EXTRA 20% OFF SALE: FINAL REDUCTIONS</h1>
            <p class="lead">
              Don't miss out on the world's greatest designers in the FARFETCH
              sale, now with an extra 20% off. Selected items for a limited time
              only; discount automatically applied at checkout
            </p>

            <button>Shop Now</button>
          </div>
      </div>

    <div id="display-flex" class="flex-layout">

    </div>

    <div class="row">
      <div class="col">
        <h4 class="display-4 text-center mt-5">ONLY FOR FATFETCH : THE CASA COLLECTION</h4>
          <a href=""><p class="lead text-center mt-5">Shop Dolce and Gabbana</p></a>

        </div>
        <div class="col my-3">
          <img
            src="https://cdn-images.farfetch-contents.com/17/69/17/70/17691770_36980061_480.jpg"
            alt=""
          />
        </div>
      </div>

      <h3 class="display-7 text-center">This week’s highlights</h3>
      <div id="display-flex1" class="flex-layout"></div>

      <h3 class="display-7 text-center mt-5">Trending now: most-wanted pieces</h3>
      <div id="display-flex2" class="flex-layout"></div>

      <div id="less">
        <button type="button" class="btn btn-outline-dark mt-5">Shop Now</button>
      </div>
    </div>
    <div id="footer"></div>
  </body>
</html>
<script type="module">
  import { navbar, footer } from "./components/secondpage.js";

  let nav = document.getElementById("navbar");
  let foot = document.getElementById("footer");
  nav.innerHTML = navbar();
  foot.innerHTML = footer();


</script>\
<script src="./script/men.js"></script>