article-1/index.html at main · Simon-FOS/article-1 · 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
<!DOCTYPE html>
<html>

    <!--HEAD SECTION BEGINS-->
    <head>
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="description" content="This is a blog web app">
        <meta name="keywords" content="travel, sport">
        <meta name="author" content="Nathaiel">

        <title>Home | Pixt article</title>

        <!--==EXTERNAL CSS==-->
        <link rel="stylesheet" href="static/css/style.css">

    </head>
    <!--HEAD SECTION END-->


    <!--BODY SECTION BEGINS-->
    <body>

        <!--HEADER SECTION BEGINS-->
        <header >
            <nav>
                <div style="text-align: center;">
                    <h2>Pixt Blog</h2>
                </div>

                <ul>
                    <li><a id="nav-home-link" class="nav-link" href="index.html">Home</a></li>
                    <li><a href="contact.html">Contact</a></li>
                    <li><a href="#">About</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a class="nav-link" href="#">Product</a></li>
                    <li><a href="#">Services</a></li>
                </ul>

                <ul style="display: flex; justify-content: space-evenly; ">
                    <li><button>Sign up</button></li>
                    <li><button>Sign in</button></li>
                </ul>
            </nav>
        </header>
        <!--HEADER SECTION END-->

        <!--======MAIN BODY=====-->
        <main>
            <!---====INTRODUCTION SECTION====-->
            <section class="intro section bg-white text-black" id="section" style="display: flex; justify-content: space-evenly; align-items: center;">
                <div class="intro-title">
                    <h1>
                        Transforming Ideas into Immersive Experiences through Innovative Programming
                    </h1>
                    <p>
                        At our company, our vision is to be a leading provider of innovative and transformative technology solutions that enhance the way people experience and engage with ideas.
                    </p>
                </div>

                <div class="intro-img">
                    <img src="static/img/intro.png" alt="introductory image">
                </div>
            </section>
            <!---====INTRODUCTION SECTION END====-->

            <!---====PRODUCT SECTION BEGIN====-->
            <section class="product">
                <div class="product-title">
                    <h2>Product Listing</h2>
                </div>

                <div class="product-content">

                    <div class="product-image">
                        <img src="https://pixtinfinity-node-js-integration-nathius262-projects.vercel.app/images/p2.jpg" alt="product image">
                    </div>

                    <div class="product-image">
                        <img src="https://pixtinfinity-node-js-integration-nathius262-projects.vercel.app/images/p2.jpg" alt="product image">
                    </div>

                    <div class="product-image">
                        <img src="https://pixtinfinity-node-js-integration-nathius262-projects.vercel.app/images/p2.jpg" alt="product image">
                    </div>

                </div>
            </section>
            <!---====PRODUCT SECTION END====-->

        </main>
        <!--======MAIN BODY END=====-->

        <!--===FOOTER SECTION====-->
        <footer>
            <nav>
                <div>
                    <h2>Pixt Blog</h2>
                </div>

                <ul style="margin: 0; padding: 0;">
                    <h2>Resources</h2>
                    <li><a href="index.html">Home</a></li>
                    <li><a href="contact.html">Contact</a></li>
                    <li><a href="#">About</a></li>
                    <li><a href="#">Blog</a></li>
                    <li><a href="#">Product</a></li>
                    <li><a href="#">Services</a></li>
                </ul>

                <ul style="margin: 0; padding: 0;">
                    <h2>Connect With Us</h2>
                    <li><a href="#">Facbook</a></li>
                    <li><a href="#">Instagram</a></li>
                    <li><a href="#">Twitter</a></li>
                    <li><a href="#">GitHub</a></li>
                </ul>

                <div>
                    <h2>Newsletter</h2>
                    <p>input your email to subscribe to our newsletter</p>
                </div>
            </nav>
        </footer>
        <!--===FOOTER SECTION END====-->

    </body>
    <!--BODY SECTION END-->

</html>