Group-Project/index-fr.html at master · Angus-Feng/Group-Project · 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
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!DOCTYPE html>
<html lang="fr">

<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" />
  <meta name="description" content="With a location in John Abbott College campas, Chez Feng is the place to be for breads, desserts, cakes, and baked goods. " />
  <meta name="keyword" content="cake, pastry, birthday cake, custom cake, pastry recipe, bread, cookie" />
  <meta name="author" content="Nari Roh, Chris L, Feng Han" />
  <title>Chez Feng | Accueil</title>
  <!-- main css link -->
  <link rel="stylesheet" href="styles/main.css" />
  <!-- font awesome cdn link -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css" rel="stylesheet" />
  <!-- favicon -->
  <link rel="shourtcut icon" type="image/png" href="images/cupcake.png" />
</head>

<body>
  <div class="container">
    <div id="info-panel">
      <p>275 Rue Lakeshore Road, Sainte-Anne-de-Bellevue, QC H9X 3L9</p>
      <p><span class="hidden">|</span>Chaque Jour 7AM - 6PM</p>
    </div>
    <!-- nav starts -->
    <nav id="nav">
        <div id="main-nav" class="hidden">
          <p><a href="index.html" class="logo-left">CHEZ FENG.</a></p>
          <ul class="uppercase" id="menu">
            <li><a href="shop-fr.html">Achetez maintenant</a></li>
            <li><a href="create-your-cake-fr.html">créez votre gâteau</a></li>
            <li><a href="recipe-fr.html">recette de la semaine</a></li>
            <li><a href="about-fr.html">à propos</a></li>
            <li><a href="contact-fr.html">nous contacter</a></li>
          </ul>
          <ul id="languages">
            <li><a href="index.html">EN</a></li>
            <li>|</li>
            <li><a href="index-fr.html">FR</a></li>
          </ul>
        </div>
        <div id="mobile-nav">
          <p><a href="index.html" class="logo-right">CHEZ FENG.</a></p>
          <i class="fas fa-bars"></i>
        </div>
      </nav>
    <!-- nav ends -->
    <header class="index-header">
      <img class="index-header-img" src="images/main-cake.png" alt="Cake with chocolate toppings." title="Cake with chocolate toppings." />
      <div class="index-header-text">
        <h1 class="uppercase">Votre pâtisserie de tous les jours</h1>
        <p>Notre nourriture est d'origine locale, <br />
          fabriqués à la main et cuits au four frais du jour <br />
          sans l'utilisation d'additifs ou de conservateurs.
        </p>
      </div>
    </header>
    <img class="zigzag-line" src="images/black-zig-zag.png" alt="Black zigzag." title="Black zigzag.">
    <img class="zigzag-line" src="images/black-zig-zag.png" alt="Black zigzag." title="Black zigzag.">
    <!-- main start -->
    <main>
      <section>
        <article class="index-article">
            <div class="index-article-column">
              <h2 class="index-article-header uppercase" id="index-article-header-1">Magasiner des pâtisseries</h2>
              <p class="index-article-paragraph">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat, et a? Repudiandae reprehenderit vitae ad minima sapiente quibusdam, doloremque maiores sequi excepturi iste distinctio sunt exercitationem deleniti assumenda nulla voluptatum!</p>
              <a class="index-article-button uppercase" href="shop.html">Achetez Maintenant</a>
            </div>
            <div class="index-article-column">
              <img src="images/tarte.jpeg" alt="Image of a tarte" title="Image of a tarte" />
            </div>
          </article>

          <article class="index-article">
            <div class="index-article-column" id="index-article-image-2">
              <img src="images/cake-with-deco.jpeg" alt="Image of a cake" title="Image of a cake" />
            </div>
            <div class="index-article-column">
              <h2 class="index-article-header uppercase" id="index-article-header-2">Créez votre gâteau</h2>
              <p class="index-article-paragraph">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat, et a? Repudiandae reprehenderit vitae ad minima sapiente quibusdam, doloremque maiores sequi excepturi iste distinctio sunt exercitationem deleniti assumenda nulla voluptatum!</p>
              <a class="index-article-button uppercase" href="create-your-cake-fr.html">Apprendre encore plus</a> </div>
          </article>
          <article class="index-article">
            <div class="index-article-column">
              <h2 class="index-article-header uppercase" id="index-article-header-3">Recette de la Semaine</h2>
              <p class="index-article-paragraph">Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat, et a? Repudiandae reprehenderit vitae ad minima sapiente quibusdam, doloremque maiores sequi excepturi iste distinctio sunt exercitationem deleniti assumenda nulla voluptatum!</p>
              <a class="index-article-button uppercase" href="recipe-fr.html">Lire la Suite</a>
            </div>
            <div class="index-article-column">
              <img src="images/home-baking.jpeg" alt="Image of home baking" title="Image of home baking" />
            </div>
          </article>
      </section>
      <img class="zigzag-line" src="images/black-zig-zag.png" alt="Black zigzag." title="Black zigzag.">
      <section>
        <h2 class="index-chezfeng-header uppercase">#ChezFeng</h2>
        <div class="index-chezfang-flex">
          <div class="index-chezfang-img1 index-flex-25"></div>
          <div class="index-chezfang-img2 index-flex-25"></div>
          <div class="index-chezfang-img3 index-flex-25"></div>
          <div class="index-chezfang-img4 index-flex-25"></div>
        </div>
        <div class="index-chezfang-flex">
          <div class="index-chezfang-img5 index-flex-25"></div>
          <div class="index-chezfang-img6 index-flex-25"></div>
          <div class="index-chezfang-img7 index-flex-25"></div>
          <div class="index-chezfang-img8 index-flex-25"></div>
        </div>
      </section>
    </main>
    <!-- main ends -->
    <!-- footer starts -->
    <footer id="footer">
        <div id="footer-wrapper">
          <div id="address">
            <span>Adresse</span>
            <address>
              <p>
                275 Rue Lakeshore Road<br />
                Sainte-Anne-de-Bellevue<br />
                QC H9X 3L9<br />
              </p>
            </address>
          </div>
          <div id="hours">
            <span>Les heures</span>
            <p>
              Lundi - Samedi : 7AM - 6PM<br />
              Dimanche : 7AM - 4PM
            </p>
          </div>
          <div id=contact>
            <span>Contact</span>
            <p>
              ActuallyIAmWebDev@ChezFeng.com<br />
              514 123 1234
            </p>
          </div>
          <div id="subscribe">
            <span>Recevez notre recette de la semaine!</span>
            <input type="text" placeholder="Enter your email" />
            <input class="uppercase button" type="submit" value="subscribe" />
            <div id="social-icons">
              <i class="fab fa-facebook-square">
                <a href="#"></a>
              </i>
              <i class="fab fa-instagram-square">
                <a href="#"></a>
              </i>
              <i class="fab fa-twitter-square"></i>
              <a href="#"></a>
            </div>
          </div>
        </div>
        <div id="copyright">
          <p>Copyright 2021 &copy; Créé par l'équipe FEBM avec amour ❤️</p>
        </div>
      </footer>
    <!-- footer ends -->
  </div>
</body>
</html>