Untitled

mail@pastecode.io avatar
unknown
html
2 years ago
39 kB
1
Indexable
Never
<!DOCTYPE html>
<html lang="en">
 
<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">
    <!-- Bootstrap CDN -->
    <link rel="stylesheet" href="./assets/css/bootstrap.css">
 
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
 
    <!-- Fonts -->
    <link href="https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,200;1,300;1,400;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
 
    <link rel="stylesheet" href="./assets/css/newStyle.css">
    <script src="https://code.jquery.com/jquery-3.5.1.js"></script>
    <script type="text/javascript">
        var BASE_URL = '#';
        $.ajaxSetup({
            converters: {
                "text json": function(x) {
                    return (x == "") ? null : JSON.parse(x);
                },
            },
        });
        $(document).ready(function() {
            $('#alertmodal').modal('show');
        });
    </script>
    <title>Deposit</title>
</head>
 
<body>
    <section id="dashboard-wrapper" class="d-flex">
 
        <!-- SIDEBAR -->
        <section id="left-sidebar">
            <div class="wrap-menu d-flex flex-column justify-content-between">
 
                <div class="main-menu">
                    <!-- LOGO BRAND -->
                    <span class="logo-brand mb-4">
        <a href="#" class=""><img src="./assets/images/icons/logo_doi_rji.png" alt=""></a>
        <span class="toggle-navbar">
          <span class="material-icons">
            menu
          </span>
                    </span>
                    </span>
 
                    <!-- LIST MENU SIDEBAR -->
                    <ul id="sidebar-list-menu" class="list-group">
                        <li class="list-group-item mb-3" aria-current="true"><a href="#home"><span class="ic-wrap"><span class="material-icons">dashboard</span> <span class="txt">dashboard</span></span></a></li>
 
                        <li class="list-group-item mb-3" aria-current="true"><a href="#doi"><span class="ic-wrap"><span class="material-icons">inventory</span> <span class="txt">DOI
                Prefik</span></span></a></li>
 
                        <li class="list-group-item mb-3" aria-current="true"><a href="#deposit"><span class="ic-wrap"><span class="material-icons">cloud_download</span> <span class="txt">Deposit</span></span></a></li>
 
                        <li class="list-group-item mb-3 position-relative" aria-current="true"><a href="#invoice"><span class="ic-wrap"><span class="material-icons">request_quote</span> <span class="txt">Invoice</span></span></a>
                            <span class="position-absolute top-50 start-100 translate-middle p-2 bg-info border border-light rounded-circle"></span>
                        </li>
 
                        <li class="list-group-item mb-3" aria-current="true"><a href="#historypay"><span class="ic-wrap"><span class="material-icons">request_page</span> <span class="txt">History
                Payment</span></span></a></li>
 
                        <li class="list-group-item mb-3" aria-current="true"><a href="#doi/changeaccount"><span class="ic-wrap"><span class="material-icons">manage_accounts</span> <span class="txt">Change
                Account</span></span></a></li>
                    </ul>
                </div>
 
                <!-- OTHER MENU SIDEBAR -->
                <div class="support-menu">
                    <ul class="list-group">
                        <li class="list-group-item mb-3 position-relative" aria-current="true"><a href="#messages"><span class="ic-wrap"><span class="material-icons">support_agent</span> <span class="txt">Support</span></span></a>
 
                            <span class="position-absolute top-50 start-100 translate-middle p-2 bg-info border border-light rounded-circle"></span>
                        </li>
                        <!--<li class="list-group-item mb-3" aria-current="true"><a class="dropdown-item" href="#" data-toggle="modal" data-target="#logoutModal"><span class="ic-wrap"><span class="material-icons">logout</span> <span class="txt">Logout</span></span></a>
        </li>-->
                    </ul>
                </div>
 
            </div>
        </section>
        <!-- END NAVBAR -->
 
        <!-- MAIN CONTENT -->
        <main id="main-content" class="flex-grow-1">
 
            <!-- MENU TOP BAR -->
            <div id="menu-bar" class="d-flex align-items-center justify-content-between">
 
                <div class="left-bar mb-2">
                    <div class="account-balance">
                        <span class="ic-wrap"><span class="material-icons">account_balance_wallet</span>Balance: IDR
                        <span class="total-balance">&nbsp;200,000</span></span>
                    </div>
                </div>
 
                <div class="right-bar d-flex align-items-center gap-3 flex-wrap flex-shrink-0">
                    <div class="menu-bar-item desk-info">
                        <a href="" class="desk-info-dropdown">
                            <span class="ic-wrap"><span class="material-icons">info</span><span class="sub-txt">desk information</span> <span class="material-icons rotate-arrow-down">expand_more</span></span>
                        </a>
                        <ul class="sub-menu d-flex flex-column">
                            <li><a target="_blank" href="https://forum.relawanjurnal.id/viewforum.php?f=22">Setting DOI</a></li>
                            <li><a target="_blank" href="https://t.me/joinchat/SBT0qeU0yemR28-d">Consultation</a></li>
                            <li><a target="_blank" href="https://www.crossref.org/education/similarity-check/participate/eligibility/">Similarity Check</a></li>
                        </ul>
                    </div>
 
                    <div class="menu-bar-item chat-notif position-relative">
                        <a href="#messages">
                            <span class="ic-wrap"><span class="material-icons">chat</span></span>
                        </a>
                        <span class="position-absolute top-0 start-100 translate-middle p-2 bg-info border border-light rounded-circle"></span>
                    </div>
 
                    <div class="menu-bar-item invoice-notif position-relative">
                        <a href="#invoice">
                            <span class="ic-wrap"><span class="material-icons">request_quote</span></span>
                        </a>
                        <span class="position-absolute top-0 start-100 translate-middle p-2 bg-info border border-light rounded-circle"></span>
                    </div>
 
                    <div class="menu-bar-item user-name">
                        <a href="" class="user-name-dropdown">
                            <span class="ic-wrap"><span class="sub-txt">USER PROFILE</span>
                            <div class="ic-profile">U</div>
                            <span class="material-icons rotate-arrow-down">expand_more</span>
                            </span>
                        </a>
 
                        <ul class="sub-menu d-flex flex-column">
                            <li><a href="#">Change Password</a></li>
                            <li style="border-bottom: 1px solid orange;"><a href="#">Change Account</a></li>
                            <li><a class="dropdown-item" href="#" data-bs-toggle="modal" data-bs-target="#logoutModal">Logout</a></li>
                        </ul>
                    </div>
                </div>
 
            </div>
 
            <!-- CONTENT BASE -->
            <div id="content-base">
                <div class="wrap-title">
                    <h3 class="content-title mb-0">deposit</h3>
                    <p style="color: var(--cc-primary); margin-left: .5rem;">Isi Balance Anda untuk mempermudah pre renew DOI Prefix beserta pembayaran Article.</p>
                </div>
 
                <div class="deposit-main d-flex flex-column">
                    <div class="deposit-main-item card px-3 flex-grow-1 pb-2 mt-4 flex-shrink-0 ">
                        <div class="card-header px-0 py-3 fw-normal">
                            <a href="./add_deposit.html" class="btn-custom text-capitalize"><span class="ic-wrap"><span
                            class="material-icons">upload</span>new deposit</span></a>
                        </div>
 
                        <div class="table-wrap flex-shrink-0">
                            <table id="" class="table table-bordered mb-0">
                                <thead>
                                    <tr>
                                        <th>Name</th>
                                        <th>Position</th>
                                        <th>Office</th>
                                        <th>Age</th>
                                        <th>Start date</th>
                                        <th>Salary</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr>
                                        <td>Tiger Nixon</td>
                                        <td>System Architect</td>
                                        <td>Edinburgh</td>
                                        <td>61</td>
                                        <td>2011/04/25</td>
                                        <td>$320,800</td>
                                    </tr>
                                    <tr>
                                        <td>Garrett Winters</td>
                                        <td>Accountant</td>
                                        <td>Tokyo</td>
                                        <td>63</td>
                                        <td>2011/07/25</td>
                                        <td>$170,750</td>
                                    </tr>
                                    <tr>
                                        <td>Ashton Cox</td>
                                        <td>Junior Technical Author</td>
                                        <td>San Francisco</td>
                                        <td>66</td>
                                        <td>2009/01/12</td>
                                        <td>$86,000</td>
                                    </tr>
                                    <tr>
                                        <td>Cedric Kelly</td>
                                        <td>Senior Javascript Developer</td>
                                        <td>Edinburgh</td>
                                        <td>22</td>
                                        <td>2012/03/29</td>
                                        <td>$433,060</td>
                                    </tr>
                                    <tr>
                                        <td>Airi Satou</td>
                                        <td>Accountant</td>
                                        <td>Tokyo</td>
                                        <td>33</td>
                                        <td>2008/11/28</td>
                                        <td>$162,700</td>
                                    </tr>
                                    <tr>
                                        <td>Brielle Williamson</td>
                                        <td>Integration Specialist</td>
                                        <td>New York</td>
                                        <td>61</td>
                                        <td>2012/12/02</td>
                                        <td>$372,000</td>
                                    </tr>
                                    <tr>
                                        <td>Herrod Chandler</td>
                                        <td>Sales Assistant</td>
                                        <td>San Francisco</td>
                                        <td>59</td>
                                        <td>2012/08/06</td>
                                        <td>$137,500</td>
                                    </tr>
                                    <tr>
                                        <td>Rhona Davidson</td>
                                        <td>Integration Specialist</td>
                                        <td>Tokyo</td>
                                        <td>55</td>
                                        <td>2010/10/14</td>
                                        <td>$327,900</td>
                                    </tr>
                                    <tr>
                                        <td>Colleen Hurst</td>
                                        <td>Javascript Developer</td>
                                        <td>San Francisco</td>
                                        <td>39</td>
                                        <td>2009/09/15</td>
                                        <td>$205,500</td>
                                    </tr>
                                    <tr>
                                        <td>Sonya Frost</td>
                                        <td>Software Engineer</td>
                                        <td>Edinburgh</td>
                                        <td>23</td>
                                        <td>2008/12/13</td>
                                        <td>$103,600</td>
                                    </tr>
                                    <tr>
                                        <td>Jena Gaines</td>
                                        <td>Office Manager</td>
                                        <td>London</td>
                                        <td>30</td>
                                        <td>2008/12/19</td>
                                        <td>$90,560</td>
                                    </tr>
                                    <tr>
                                        <td>Quinn Flynn</td>
                                        <td>Support Lead</td>
                                        <td>Edinburgh</td>
                                        <td>22</td>
                                        <td>2013/03/03</td>
                                        <td>$342,000</td>
                                    </tr>
                                    <tr>
                                        <td>Charde Marshall</td>
                                        <td>Regional Director</td>
                                        <td>San Francisco</td>
                                        <td>36</td>
                                        <td>2008/10/16</td>
                                        <td>$470,600</td>
                                    </tr>
                                    <tr>
                                        <td>Haley Kennedy</td>
                                        <td>Senior Marketing Designer</td>
                                        <td>London</td>
                                        <td>43</td>
                                        <td>2012/12/18</td>
                                        <td>$313,500</td>
                                    </tr>
                                    <tr>
                                        <td>Tatyana Fitzpatrick</td>
                                        <td>Regional Director</td>
                                        <td>London</td>
                                        <td>19</td>
                                        <td>2010/03/17</td>
                                        <td>$385,750</td>
                                    </tr>
                                    <tr>
                                        <td>Michael Silva</td>
                                        <td>Marketing Designer</td>
                                        <td>London</td>
                                        <td>66</td>
                                        <td>2012/11/27</td>
                                        <td>$198,500</td>
                                    </tr>
                                    <tr>
                                        <td>Paul Byrd</td>
                                        <td>Chief Financial Officer (CFO)</td>
                                        <td>New York</td>
                                        <td>64</td>
                                        <td>2010/06/09</td>
                                        <td>$725,000</td>
                                    </tr>
                                    <tr>
                                        <td>Gloria Little</td>
                                        <td>Systems Administrator</td>
                                        <td>New York</td>
                                        <td>59</td>
                                        <td>2009/04/10</td>
                                        <td>$237,500</td>
                                    </tr>
                                    <tr>
                                        <td>Bradley Greer</td>
                                        <td>Software Engineer</td>
                                        <td>London</td>
                                        <td>41</td>
                                        <td>2012/10/13</td>
                                        <td>$132,000</td>
                                    </tr>
                                    <tr>
                                        <td>Dai Rios</td>
                                        <td>Personnel Lead</td>
                                        <td>Edinburgh</td>
                                        <td>35</td>
                                        <td>2012/09/26</td>
                                        <td>$217,500</td>
                                    </tr>
                                    <tr>
                                        <td>Jenette Caldwell</td>
                                        <td>Development Lead</td>
                                        <td>New York</td>
                                        <td>30</td>
                                        <td>2011/09/03</td>
                                        <td>$345,000</td>
                                    </tr>
                                    <tr>
                                        <td>Yuri Berry</td>
                                        <td>Chief Marketing Officer (CMO)</td>
                                        <td>New York</td>
                                        <td>40</td>
                                        <td>2009/06/25</td>
                                        <td>$675,000</td>
                                    </tr>
                                    <tr>
                                        <td>Caesar Vance</td>
                                        <td>Pre-Sales Support</td>
                                        <td>New York</td>
                                        <td>21</td>
                                        <td>2011/12/12</td>
                                        <td>$106,450</td>
                                    </tr>
                                    <tr>
                                        <td>Doris Wilder</td>
                                        <td>Sales Assistant</td>
                                        <td>Sydney</td>
                                        <td>23</td>
                                        <td>2010/09/20</td>
                                        <td>$85,600</td>
                                    </tr>
                                    <tr>
                                        <td>Angelica Ramos</td>
                                        <td>Chief Executive Officer (CEO)</td>
                                        <td>London</td>
                                        <td>47</td>
                                        <td>2009/10/09</td>
                                        <td>$1,200,000</td>
                                    </tr>
                                    <tr>
                                        <td>Gavin Joyce</td>
                                        <td>Developer</td>
                                        <td>Edinburgh</td>
                                        <td>42</td>
                                        <td>2010/12/22</td>
                                        <td>$92,575</td>
                                    </tr>
                                    <tr>
                                        <td>Jennifer Chang</td>
                                        <td>Regional Director</td>
                                        <td>Singapore</td>
                                        <td>28</td>
                                        <td>2010/11/14</td>
                                        <td>$357,650</td>
                                    </tr>
                                    <tr>
                                        <td>Brenden Wagner</td>
                                        <td>Software Engineer</td>
                                        <td>San Francisco</td>
                                        <td>28</td>
                                        <td>2011/06/07</td>
                                        <td>$206,850</td>
                                    </tr>
                                    <tr>
                                        <td>Fiona Green</td>
                                        <td>Chief Operating Officer (COO)</td>
                                        <td>San Francisco</td>
                                        <td>48</td>
                                        <td>2010/03/11</td>
                                        <td>$850,000</td>
                                    </tr>
                                    <tr>
                                        <td>Shou Itou</td>
                                        <td>Regional Marketing</td>
                                        <td>Tokyo</td>
                                        <td>20</td>
                                        <td>2011/08/14</td>
                                        <td>$163,000</td>
                                    </tr>
                                    <tr>
                                        <td>Michelle House</td>
                                        <td>Integration Specialist</td>
                                        <td>Sydney</td>
                                        <td>37</td>
                                        <td>2011/06/02</td>
                                        <td>$95,400</td>
                                    </tr>
                                    <tr>
                                        <td>Suki Burks</td>
                                        <td>Developer</td>
                                        <td>London</td>
                                        <td>53</td>
                                        <td>2009/10/22</td>
                                        <td>$114,500</td>
                                    </tr>
                                    <tr>
                                        <td>Prescott Bartlett</td>
                                        <td>Technical Author</td>
                                        <td>London</td>
                                        <td>27</td>
                                        <td>2011/05/07</td>
                                        <td>$145,000</td>
                                    </tr>
                                    <tr>
                                        <td>Gavin Cortez</td>
                                        <td>Team Leader</td>
                                        <td>San Francisco</td>
                                        <td>22</td>
                                        <td>2008/10/26</td>
                                        <td>$235,500</td>
                                    </tr>
                                    <tr>
                                        <td>Martena Mccray</td>
                                        <td>Post-Sales support</td>
                                        <td>Edinburgh</td>
                                        <td>46</td>
                                        <td>2011/03/09</td>
                                        <td>$324,050</td>
                                    </tr>
                                    <tr>
                                        <td>Unity Butler</td>
                                        <td>Marketing Designer</td>
                                        <td>San Francisco</td>
                                        <td>47</td>
                                        <td>2009/12/09</td>
                                        <td>$85,675</td>
                                    </tr>
                                    <tr>
                                        <td>Howard Hatfield</td>
                                        <td>Office Manager</td>
                                        <td>San Francisco</td>
                                        <td>51</td>
                                        <td>2008/12/16</td>
                                        <td>$164,500</td>
                                    </tr>
                                    <tr>
                                        <td>Hope Fuentes</td>
                                        <td>Secretary</td>
                                        <td>San Francisco</td>
                                        <td>41</td>
                                        <td>2010/02/12</td>
                                        <td>$109,850</td>
                                    </tr>
                                    <tr>
                                        <td>Vivian Harrell</td>
                                        <td>Financial Controller</td>
                                        <td>San Francisco</td>
                                        <td>62</td>
                                        <td>2009/02/14</td>
                                        <td>$452,500</td>
                                    </tr>
                                    <tr>
                                        <td>Timothy Mooney</td>
                                        <td>Office Manager</td>
                                        <td>London</td>
                                        <td>37</td>
                                        <td>2008/12/11</td>
                                        <td>$136,200</td>
                                    </tr>
                                    <tr>
                                        <td>Jackson Bradshaw</td>
                                        <td>Director</td>
                                        <td>New York</td>
                                        <td>65</td>
                                        <td>2008/09/26</td>
                                        <td>$645,750</td>
                                    </tr>
                                    <tr>
                                        <td>Olivia Liang</td>
                                        <td>Support Engineer</td>
                                        <td>Singapore</td>
                                        <td>64</td>
                                        <td>2011/02/03</td>
                                        <td>$234,500</td>
                                    </tr>
                                    <tr>
                                        <td>Bruno Nash</td>
                                        <td>Software Engineer</td>
                                        <td>London</td>
                                        <td>38</td>
                                        <td>2011/05/03</td>
                                        <td>$163,500</td>
                                    </tr>
                                    <tr>
                                        <td>Sakura Yamamoto</td>
                                        <td>Support Engineer</td>
                                        <td>Tokyo</td>
                                        <td>37</td>
                                        <td>2009/08/19</td>
                                        <td>$139,575</td>
                                    </tr>
                                    <tr>
                                        <td>Thor Walton</td>
                                        <td>Developer</td>
                                        <td>New York</td>
                                        <td>61</td>
                                        <td>2013/08/11</td>
                                        <td>$98,540</td>
                                    </tr>
                                    <tr>
                                        <td>Finn Camacho</td>
                                        <td>Support Engineer</td>
                                        <td>San Francisco</td>
                                        <td>47</td>
                                        <td>2009/07/07</td>
                                        <td>$87,500</td>
                                    </tr>
                                    <tr>
                                        <td>Serge Baldwin</td>
                                        <td>Data Coordinator</td>
                                        <td>Singapore</td>
                                        <td>64</td>
                                        <td>2012/04/09</td>
                                        <td>$138,575</td>
                                    </tr>
                                    <tr>
                                        <td>Zenaida Frank</td>
                                        <td>Software Engineer</td>
                                        <td>New York</td>
                                        <td>63</td>
                                        <td>2010/01/04</td>
                                        <td>$125,250</td>
                                    </tr>
                                    <tr>
                                        <td>Zorita Serrano</td>
                                        <td>Software Engineer</td>
                                        <td>San Francisco</td>
                                        <td>56</td>
                                        <td>2012/06/01</td>
                                        <td>$115,000</td>
                                    </tr>
                                    <tr>
                                        <td>Jennifer Acosta</td>
                                        <td>Junior Javascript Developer</td>
                                        <td>Edinburgh</td>
                                        <td>43</td>
                                        <td>2013/02/01</td>
                                        <td>$75,650</td>
                                    </tr>
                                    <tr>
                                        <td>Cara Stevens</td>
                                        <td>Sales Assistant</td>
                                        <td>New York</td>
                                        <td>46</td>
                                        <td>2011/12/06</td>
                                        <td>$145,600</td>
                                    </tr>
                                    <tr>
                                        <td>Hermione Butler</td>
                                        <td>Regional Director</td>
                                        <td>London</td>
                                        <td>47</td>
                                        <td>2011/03/21</td>
                                        <td>$356,250</td>
                                    </tr>
                                    <tr>
                                        <td>Lael Greer</td>
                                        <td>Systems Administrator</td>
                                        <td>London</td>
                                        <td>21</td>
                                        <td>2009/02/27</td>
                                        <td>$103,500</td>
                                    </tr>
                                    <tr>
                                        <td>Jonas Alexander</td>
                                        <td>Developer</td>
                                        <td>San Francisco</td>
                                        <td>30</td>
                                        <td>2010/07/14</td>
                                        <td>$86,500</td>
                                    </tr>
                                    <tr>
                                        <td>Shad Decker</td>
                                        <td>Regional Director</td>
                                        <td>Edinburgh</td>
                                        <td>51</td>
                                        <td>2008/11/13</td>
                                        <td>$183,000</td>
                                    </tr>
                                    <tr>
                                        <td>Michael Bruce</td>
                                        <td>Javascript Developer</td>
                                        <td>Singapore</td>
                                        <td>29</td>
                                        <td>2011/06/27</td>
                                        <td>$183,000</td>
                                    </tr>
                                    <tr>
                                        <td>Donna Snider</td>
                                        <td>Customer Support</td>
                                        <td>New York</td>
                                        <td>27</td>
                                        <td>2011/01/25</td>
                                        <td>$112,000</td>
                                    </tr>
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
 
            </div>
            <a href="#" class="btn btn-custom mt-4" onclick="history.back();"><span class="ic-wrap"><span class="material-icons">arrow_back</span>Back</span></a>
        </main>
    </section>
 
    <!-- Scroll to Top Button-->
    <a class="scroll-to-top rounded" href="#page-top">
        <i class="fas fa-angle-up"></i>
    </a>
 
    <!-- Logout Modal-->
    <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
                    <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary mt-3" type="button" data-bs-dismiss="modal"><span class="ic-wrap"><span class="material-icons">cancel</span>Close</span></button>
                    <a href="#" class="btn btn-icon-split btn-danger mt-3"><span class="ic-wrap"><span class="material-icons">logout</span>Logout</span></a>
                </div>
            </div>
        </div>
    </div>
    <!-- Alert Modal Limit Deposit-->
    <div class="modal show fade" id="alertmodal" tabindex="-1" role="dialog" aria-labelledby="alertmodalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Reminder Alert!</h5>
                    <button class="btn-close" type="button" data-bs-dismiss="modal" aria-label="Close"></button>
                </div>
                <div class="modal-body">Your balance below the limit
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-sm btn-icon-split btn-primary mt-3" type="button" data-bs-dismiss="modal"><span class="ic-wrap"><span class="material-icons">cancel</span>Close</span></button>
                </div>
            </div>
        </div>
    </div>
 
    <div class="toast-container position-fixed bottom-0 end-0 p-4" style="z-index: 11">
        <!--<div class="position-fixed bottom-0 end-0 p-4" style="z-index: 11">-->
        <div class="toast show" role="alert" aria-live="assertive" aria-atomic="true" data-bs-autohide="false">
            <div class="toast-header" style="background-color: var(--cc-darkpurple);">
                <strong class="me-auto text-white">New Invoice Added!</strong>
                <span class="badge bg-secondary">2</span>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="toast" aria-label="Close"></button>
            </div>
            <div class="toast-body">
                <strong>Please make action payment for your invoice.</strong>
            </div>
        </div>
 
        <div class="toast show" role="alert" aria-live="assertive" aria-atomic="true" data-bs-autohide="false">
            <div class="toast-header" style="background-color: var(--cc-darkpurple);">
                <strong class="me-auto text-white">New Message!</strong>
                <span class="badge bg-secondary">1</span>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="toast" aria-label="Close"></button>
            </div>
            <div class="toast-body">
                <strong>You got new messages, please read the message.</strong>
            </div>
        </div>
    </div>
 
    <script src="./assets/js/bootstrap.js"></script>
    <script src="./assets/js/mainFunctions.js"></script>
    <script type="text/javascript">
        $('body').on('click', '.btn-close', function() {
            $(this).closest('.toast').toast('hide')
        })
    </script>
</body>
 
</html>