sandygrandy.github.io/index.html at main · sandygrandy/sandygrandy.github.io · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="icon" href="/Favicon/favicon-16x16.png" type="image/x-icon">
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Rainydays home page</title>
    <link rel="stylesheet" href="styles.css">
</head>
<body class="rainydays-body">

    <div id="background-home"></div>

    <header>
        <div class="header">
            <a href="/">
                <img src="main-logo.png" id="logo" alt="Rainydays logo">
            </a>
            <div class="nav">
                <a href="./jacktets.html">Shop</a>
                <a href="./contact.html">Contact us</a>
                <a href="./about-us.html">About us</a>
                <a href="./checkout.html" id="menu-cart">Cart</a>
            </div>
                <input type="checkbox" id="hamburger-input" class="hamburger-show" >
                <label id="hamburger-menu" for="hamburger-input" >
                    <nav id="sidebar-menu">
                        <h3>Menu</h3>
                        <ul>
                            <li><a href="./jacktets.html">Shop</a></li>
                            <li><a href="./contact.html">Contact us</a></li>
                            <li><a href="./about-us.html">About us</a></li>
                            <li><a href="./checkout.html">Cart</a></li>
                        </ul>
                    </nav>
                </label>
                <div class="overlay"></div>
        </div>
    <section class="hero-section">
        <div>
            <h1>
                Unleash your adventure
                <br>
                Embrace every raindrop
            </h1>
        </div>
    </section>
    </header>

    <section class="explore">

        <div class="explore-text">
            <h3> Explore by activities</h3>
        </div>

        <div class="explore-grid">
            <div class="activity">
                <img src="Images/hiking-img.jpg" alt="Hiking">
                <br>
                <a href="#">Hiking</a>
            </div>
            <div class="activity">
                <img src="Images/camping-img.jpg" alt="Camping">
                <br>
                <a href="#">Camping</a>
            </div>
            <div class="activity">
                <img src="Images/trail-run-img.jpg" alt="Trail run">
                <br>
                <a href="#">Trail run</a>
            </div>
            <div class="activity">
                <img src="Images/climbing-img.jpg" alt="Camping">
                <br>
                <a href="#">Climbing</a>
            </div>
            <div class="activity">
                <img src="Images/skiing-img.jpg" alt="Skiing">
                <br>
                <a href="#">Skiing</a>
            </div>
        </div>
    </section>

    <section class="quote-section">
        <h3>
            Lorem ipsum dolor sit amet consectetur adipisicing elit.
            Est aut ducimus cupiditate beatae itaque molestias, dolores
            quae neque provident quasi molestiae fugiat eveniet iure enim
            natus, deserunt ullam totam explicabo.
        </h3>
    </section>

    <section class="reviews-section">

        <div class="reviews-text">
            <h3>What some of our lovely customers say:</h3>
        </div>

        <div class="reviews-grid">

             <div class="reviews">
               <h5>Great rain jacket!</h5>
               <p>I'm thrilled with my rainydays rain jacket. It is durable, comfortable and looks stylish. It is my go-to for any weather adventure!</p>
         </div>

         <div class="reviews">
             <h5>Perfect style and protection!</h5>
             <p>Rainydays jackets exceeded my expectations. It kept me dry during unexpected showers while maintaining a sleek look. A must have for urban and outdoor escapades.</p>
            </div>

         <div class="reviews">
                <h5>Stylish and reliable</h5>
                <p>Rainydays jacket is my ultimate companion for wet days! Its durability and trendy design make rainy adventures enjoyable. Highly recommend!</p>
        </div>
    </div>
    </section>

    <footer class="footer-rainydays">
        <img src="/main-logo.png" alt="Main Logo for Rainyday">

        <div>
            <h5>Support</h5>
                <a href="#">Contact us</a>
                <br>
                <a href="#">FAQ</a>
                <br>
                <a href="#">Returns</a>
                <br>
                <a href="#">Shipping</a>
                <br>
                <a href="#">Payment</a>
        </div>

        <div>
            <h5>Rainydays</h5>
                <a href="#">About us</a>
                <br>
                <a href="#">Career</a>
                <br>
                <a href="#">Locate us</a>
        </div>

        <div>
            <h5>Policies</h5>
                <a href="#">Privacy policy</a>
                <br>
                <a href="#">Cookies</a>
                <br>
                <a href="#">Integrity policy</a>
        </div>
    </footer>

¨</body>
</html>