Project-1/blog.html at main · karanmistry007/Project-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
<html>
    <head>
        <title>Karan's Page</title>
        <link rel="stylesheet" href="styles.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css"
        integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
    </head>
    <body id="about">
        <section id="about_section_1">
            <div id="header_1">
                <div id="logo">
                <h1>RD</h1>
                </div>
                <div id="nav">
                    <ul id="nav_1">
                         <li id="list_1"><a href="home.html" id="a_1">HOME</a></li>
                        <li id="list_1"><a href="about.html" id="a_1">ABOUT</a></li>
                        <li id="list_1"><a href="activities.html" id="a_1">ACTIVITIES</a></li>
                        <li id="home_1"><a href="blog.html" id="a_1">BLOG</a></li>
                        <li id="list_1"><a href="project.html" id="a_1">PROJECT</a></li>
                        <li id="list_1"><a href="contact.html" id="a_1">CONTACT</a></li>
                    </ul>
                </div>
            </div>
                <div id="ul_2"></div>
        </section>
        <div id="blog1">
            <h1>BLOG POST ONE</h1>
            <p><i class="fa-solid fa-user"></i>Posted by <b>John Doe | </b><span id="date"></span></p>
            <p>Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minima harum magnam adipisci deserunt dolor quaerat. Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores, accusantium natus eius ullam odit suscipit recusandae, temporibus deserunt ratione, mollitia eveniet ducimus. Quibusdam, veritatis.
                <span class="show1 hide1">Architecto nulla tempora, laboriosam eaque enim libero veritatis autem illum beatae cupiditate odio quae accusantium! Officiis ad quidem quas cum, doloribus reprehenderit aperiam amet, beatae at voluptate perferendis obcaecati qui expedita ipsa aperiam ab esse rem, recusandae nostrum eaque aliquid eos optio magni quia corrupti consequuntur similique. Doloribus quibusdam numquam fugit beatae perspiciatis cumque magnam dolorum odit ratione cum, deserunt inventore sed delectus eligendi?
                </span>
            </p>
            <button id="btn1" class="btn">Read More</button><br><br>
        </div>
        <div id="blog2">
            <h1>BLOG POST TWO</h1>
            <p><i class="fa-solid fa-user"></i>Posted by <b>John Doe | </b><span id="date">29/6/2022</span></p>
            <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Porro voluptatem, assumenda magnam iste expedita architecto eaque quidem ipsam non deserunt perferendis. Tempore molestiae quo architecto debitis aliquam sunt ducimus quibusdam.Lorem ipsum dolor, sit amet consectetur adipisicing elit. Minima harum magnam adipisci deserunt dolor quaerat.
                <span class="show2 hide2">Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores, accusantium natus eius ullam odit suscipit recusandae, temporibus deserunt ratione, mollitia eveniet ducimus. Quibusdam, veritatis. Architecto nulla tempora, laboriosam eaque enim libero ad, beatae quo amet officiis iste eveniet, illo cumque obcaecati! At molestias repudiandae accusamus labore ratione!
                    Delectus quidem suscipit id aliquid voluptatibus voluptas, quod optio est culpa cum minima voluptate consequuntur dolore omnis ab similique ipsum esse tempore dignissimos sed quas harum, quia quasi. Molestiae sapiente dolorem facilis veritatis autem illum beatae cupiditate odio quae accusantium! Officiis ad quidem quas cum, doloribus reprehenderit aperiam amet, beatae at voluptate perferendis obcaecati qui expedita ipsa voluptatum amet! Numquam ea ad cupiditate architecto temporibus, sit earum aut similique esse aliquid commodi error optio obcaecati distinctio nobis cum explicabo hic.
                </span>
            </p>
            <button id="btn2" class="btn">Read More</button><br><br>
        </div>


        <div id="bg_color">
            <footer id="footer">
               <div>
                   <h3>Company</h3>
                   <div id="ul_1"></div>
                   <p> Near, 204 Copper Leaf,Opp. Parshwanath Jain Mandir,AEC Char Rasta, Bhuyangdev, Ahmedabad, Gujarat 380061</p>
               </div>
               <div>
                   <center><h3>Navigate</h3>
                   <div id="ul_1"></div></center>
                   <ul id="list_2">
                       <li id="list_2_1">Home</li><br>
                       <li id="list_2_1">About</li><br>
                       <li id="list_2_1">Activities</li><br>
                       <li id="list_2_1">Blog</li><br>
                       <li id="list_2_1">Project</li><br>
                       <li id="list_2_1">Contact</li><br>
                   </ul>
               </div>
               <div>
                   <h3>Follow Me</h3>
                   <div id="ul_1"></div>
                   <div>
                       <a href="#"><i class="fab fa-facebook-f fa-2"  id="social"></i></a>
                       <a href="#"><i class="fab fa-twitter fa-2"  id="social"></i></a>
                       <a href="#"><i class="fab fa-instagram fa-2"  id="social"></i></a>
                       <a href="#"><i class="fab fa-linkedin-in fa-2"  id="social"></i></a>
                   </div>
                   <i class="fas fa-envelope fa-2x" id="social_1"></i>
                   <h3>EMAIL</h3>
                   <p id="bg_color_2">[email protected]</p>
                   <i class="fas fa-phone fa-2x" id="social_1"></i>
                   <h3>PHONE</h3>
                   <p id="bg_color_2">+91 5555566655</p>
               </div>
           </footer>
           <p id="copy">Copyright © 2022 Reserved</p>
           </div>
           <script src="blog.js"></script>


    </body>
</html>