apex-webdev/home-u.html at main · RiteshBorse/apex-webdev · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="stylesheets/features/expenses.css">
    <link rel="stylesheet" href="stylesheets/features/event-calender.css">
    <link rel="stylesheet" href="stylesheets/features/vistor-entry.css">
    <link rel="stylesheet" href="stylesheets/features/document-wallet.css">
    <link rel="stylesheet" href="stylesheets/features/ann-post.css">
    <link rel="stylesheet" href="stylesheets/features/complaint.css">
    <link rel="stylesheet" href="stylesheets/features/resident-details-c.css">
    <link rel="stylesheet" href="stylesheets/loader/home-animation.css">
    <link rel="stylesheet" href="stylesheets/loader/loader.css">
    <link rel="stylesheet" href="stylesheets/home-u.css">
    <title>Home</title>
</head>
<body>
    <nav class="sidebar">
        <div class="sidebar-child">
            <div class="sidebar-element-top apex-name-state">
                <div><img class="logo" src="assets/logo.png" alt=""></div>
                <p>Apex</p>
                <i class="bi bi-list"></i>
            </div>

            <div class="sidebar-element-mid">
                <div class="search-div">
                    <i class="bi bi-search js-search-icon"></i>
                    <input class="search-bar js-search-bar" type="text" placeholder="Search...">
                </div>

                <div class="mid-child js-document-wallet">
                    <div><img class="icons" src="assets/icons8-document-50.png" alt=""></div>
                     <div>Document Wallet</div>
                </div>
                <div class="mid-child js-complaint-track">
                    <div><img class="icons" src="assets/icons8-complaint-50.png" alt=""></div>
                     <div>Complaint Tracking</div>
                </div>
                <div class="mid-child js-ammenites-booking">
                    <div><img class="icons" src="assets/icons8-hall-48.png" alt=""></div>
                     <div>Ammenites Booking</div>
                </div>
                <div class="mid-child js-resident-details">
                    <div><img class="icons" src="assets/icons8-caretaker-60.png" alt=""></div>
                     <div>Resident Details</div>
                </div>
                <div class="mid-child js-vistor-entry">
                    <div><img class="icons" src="assets/icons8-guest-50.png" alt=""></div>
                     <div>Visitor Entry</div>
                </div>
                <div class="mid-child js-event-calender">
                    <div><img class="icons" src="assets/icons8-event-50.png" alt=""></div>
                     <div>Event Calender</div>
                </div>
                <div class="mid-child js-ann-post">
                    <div><img class="icons" src="assets/icons8-46-66.png" alt=""></div>
                     <div>Announcement Post</div>
                </div>
                <div class="mid-child js-expenses">
                    <div><img class="icons" src="assets/icons8-people-50.png" alt=""></div>
                     <div>Expenses</div>
                </div>

            </div>
        </div>


        <div class="sidebar-element-bottom">
            <div class="user-element">
                <div>
                    <img src="assets/icons8-verified-user-96.png" alt="">
                    <div class="user-name js-profile-user">Ritesh Borse <br> <span>Chairman</span></div>
                    <button class="logout-button">Logout</button>
                </div>
                <div>
                    <img src="assets/icons8-tick-50.png" alt="">
                    <p>Apex Verified User</p>
                </div>
            </div>
            <div class="modes">
                <div class="bottom-child light js-light">
                    <div><img class="icons" src="assets/icons8-light-mode-78.png" alt=""></div>
                    <div>Light</div>
                </div>
                <div class="bottom-child dark js-dark">
                    <div><img class="icons" src="assets/icons8-dark-mode-50.png" alt=""></div>
                    <div>Dark</div>
                </div>
            </div>
        </div>
    </nav>
    <div class="main">
       <div class="features js-features">
            <h1 class="typed"><center>Welcome to Apex</center></h1>
        </div>


       </div>
    </div>
    <script src="https://unpkg.com/typed.js@2.1.0/dist/typed.umd.js"></script>
    <script src="scripts/home-u.js" type="module"></script>
    <script>
        const darkmode = document.querySelector('.js-dark');
        darkmode.addEventListener(('click') , () => {
            document.querySelector('.main').classList.add('main-dark');
        });

        const lightmode = document.querySelector('.js-light');
        lightmode.addEventListener(('click') , () => {
            document.querySelector('.main').classList.remove('main-dark');
        });

        const hamburger = document.querySelector('.bi-list');
        hamburger.addEventListener('click' , () => {
            document.querySelector('.sidebar').classList.toggle('sidebar-show');
            document.querySelector('.bi-list').classList.toggle('bi-list-with-sidebar');
            document.querySelector('.sidebar-element-top').classList.toggle('apex-name-state');
        });

        var typed = new Typed('.typed', {
  strings: [
    "Welcome to Apex",
    "Apex is here for you.",
    "Manage your Apartment with ease",
    "Streamline operations with modern technology",
    "Convenient online payment portal",
    "Effortlessly organize community events",
    "Centralized communication hub for residents",
    "Quickly submit and track maintenance requests",
    "Secure document management system",
    "Connect with neighbors via resident directory",
    "Enhance security with visitor management tools",
    "Access community management on the go with mobile app",
    "Customize to fit your community's unique needs",
    "Gain insights with analytics and reporting",
    "Seamless integration with other software",
    "Comprehensive support and training available",
    "Ensure data security and privacy compliance"
  ],
  typeSpeed: 50
});

    </script>
      <script>
        window.embeddedChatbotConfig = {
        chatbotId: "yhgt4Yew7_xY4vC8RQ7Fl",
        domain: "www.chatbase.co"
        }
        </script>
        <script
        src="https://www.chatbase.co/embed.min.js"
        chatbotId="yhgt4Yew7_xY4vC8RQ7Fl"
        domain="www.chatbase.co"
        defer>
        </script>
</body>
</html>