您的位置: jquery插件库 > jqueryhtml5→ 后台仪表盘,后台框架

后台仪表盘,后台框架

资源来源网络,如果需要授权,请大家更换源码,模块仅供学习,下载后请2小时内删除,如需商用请购买正版授权 后台仪表盘,后台框架演示图片

HTML代码

<main class="dashboard">
    <nav class="dashboard-sidenav">
        <a href="#" class="logo">CMPC</a>
        <ul class="nav-icon-list">
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716314757" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="2469" width="20" height="20">
                        <path
                            d="M372.2 347.6h329.1c15.1 0 27.4-12.3 27.4-27.4 0-15.1-12.3-27.4-27.4-27.4H372.2c-15.1 0-27.4 12.3-27.4 27.4 0 15.2 12.3 27.4 27.4 27.4zM235.1 457.3h493.6c90.9 0 164.5-73.7 164.5-164.5 0-90.9-73.7-164.5-164.5-164.5v54.8c77.4 14.6 109.7 49.1 109.7 109.7S775 402.5 696.7 402.5H235.1c-15.1 0-27.4 12.3-27.4 27.4 0 15.1 12.2 27.4 27.4 27.4z m274.3 164.6c-0.1 0-0.1 0 0 0H290c-15.1 0-27.4 12.3-27.4 27.4 0 15.1 12.3 27.4 27.4 27.4h219.4c30.3 0 54.8 24.6 54.8 54.8 0 30.3-24.6 54.8-54.8 54.8v54.8c60.6 0 109.7-49.1 109.7-109.7-0.1-60.4-49.2-109.5-109.7-109.5z m219.3-109.7H152.8c-15.1 0-27.4 12.3-27.4 27.4 0 15.1 12.3 27.4 27.4 27.4h543.9c78.3 0 141.7 49.1 141.7 109.7s-46.9 109.7-164.5 109.7v54.9h54.8c90.9 0 164.5-73.7 164.5-164.5 0-91-73.6-164.6-164.5-164.6z"
                            p-id="2470"></path>
                    </svg></a>
            </li>
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716413875" class="icon" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="5091" width="20" height="20" fill="white">
                        <path
                            d="M935.6192 68.266667 88.3808 68.266667C49.0592 68.266667 17.066667 100.8064 17.066667 140.8l0 554.666667c0 39.994667 31.991467 72.533333 71.314133 72.533333L473.6 768l0 112.424533L298.666667 880.424533c-20.795733 0-37.6544 16.858667-37.6544 37.6544S277.8688 955.733333 298.666667 955.733333l426.666667 0c20.795733 0 37.6544-16.858667 37.6544-37.6544S746.129067 880.424533 725.333333 880.424533L550.4 880.424533 550.4 768l385.2192 0C974.941867 768 1006.933333 735.461333 1006.933333 695.466667L1006.933333 140.8C1006.933333 100.8064 974.941867 68.266667 935.6192 68.266667zM930.133333 691.2 93.866667 691.2 93.866667 145.066667l836.266667 0L930.133333 691.2z"
                            p-id="5092"></path>
                    </svg></a>
            </li>
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716468220" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="7384" width="20" height="20">
                        <path
                            d="M904 875.9H120c-30.9 0-56-25.1-56-56V204.1c0-30.9 25.1-56 56-56h231.6c12.8 0 25.2 4.4 35.2 12.4L509.9 260H904c30.9 0 56 25.1 56 56v503.8c0 31-25.1 56.1-56 56.1z m0-56v28-28zM351.6 204.1H120v615.8h784l0.1-503.8H510c-12.8 0-25.3-4.4-35.3-12.5l-123.1-99.5z"
                            p-id="7385"></path>
                    </svg></a>
            </li>
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716626339" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="11970" width="20" height="20">
                        <path
                            d="M221.5 638.6V117.8c0-11.5-9.3-20.8-20.8-20.8s-20.8 9.3-20.8 20.8v520.8c-47.4 9.6-83 51.5-83 101.7s35.6 92 83 101.7v64.3c0 11.5 9.3 20.8 20.8 20.8s20.8-9.3 20.8-20.8V842c47.4-9.6 83-51.5 83-101.7s-35.6-92.1-83-101.7z m-20.7 163.9c-34.3 0-62.3-27.9-62.3-62.3s27.9-62.3 62.3-62.3c34.3 0 62.3 27.9 62.3 62.3s-28 62.3-62.3 62.3zM927 283.8c0-50.2-35.6-92-83-101.7v-64.3c0-11.5-9.3-20.8-20.8-20.8s-20.8 9.3-20.8 20.8v64.3c-47.4 9.6-83 51.5-83 101.7s35.6 92 83 101.7v520.8c0 11.5 9.3 20.8 20.8 20.8s20.8-9.3 20.8-20.8V385.4c47.4-9.6 83-51.5 83-101.6zM823.3 346c-34.3 0-62.3-27.9-62.3-62.3s27.9-62.3 62.3-62.3c34.3 0 62.3 27.9 62.3 62.3s-28 62.3-62.3 62.3zM532.8 410.3V117.8c0-11.5-9.3-20.8-20.8-20.8s-20.8 9.3-20.8 20.8v292.6c-47.4 9.6-83 51.5-83 101.7s35.6 92 83 101.7v292.6c0 11.5 9.3 20.8 20.8 20.8s20.8-9.3 20.8-20.8V613.7c47.4-9.6 83-51.5 83-101.7s-35.7-92-83-101.7z"
                            p-id="11971"></path>
                    </svg></a>
            </li>
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716675382" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="12846" width="20" height="20">
                        <path
                            d="M507.050667 170.666667c85.546667 0 155.178667 61.696 155.178666 137.514666v92.544H351.872V308.181333C351.872 232.362667 421.546667 170.666667 507.050667 170.666667m276.309333 407.978666a21.333333 21.333333 0 0 0 21.333333-21.333333V499.157333c0-52.010667-44.245333-94.293333-99.797333-97.792V308.181333C704.896 208.810667 616.149333 128 507.050667 128 397.952 128 309.205333 208.810667 309.205333 308.181333v93.013334C252.629333 403.669333 207.36 446.464 207.36 499.157333v255.701334C207.36 809.173333 255.317333 853.333333 314.24 853.333333h383.488C756.693333 853.333333 804.693333 809.173333 804.693333 754.858667v-69.546667a21.333333 21.333333 0 0 0-42.666666 0v69.546667c0 30.805333-28.842667 55.808-64.298667 55.808H314.24C278.826667 810.666667 250.026667 785.664 250.026667 754.858667V499.157333c0-30.762667 28.8-55.765333 64.213333-55.765333h383.488c35.456 0 64.298667 25.002667 64.298667 55.765333v58.154667a21.333333 21.333333 0 0 0 21.333333 21.333333"
                            p-id="12847"></path>
                    </svg></a>
            </li>
            <li class="nav-icon-list__item">
                <a href="#"><svg t="1585716717590" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                        xmlns="http://www.w3.org/2000/svg" p-id="13969" width="20" height="20">
                        <path
                            d="M893.842 217.557H130.159c-16.261 0-29.443 13.182-29.443 29.443v530c0 16.261 13.182 29.443 29.443 29.443h763.683c16.261 0 29.443-13.183 29.443-29.443V247c0-16.261-13.182-29.443-29.443-29.443z m-85.584 58.886L512 507.651 215.742 276.443h592.516zM159.602 747.557v-440.23l334.283 260.885A29.4 29.4 0 0 0 512 574.443a29.4 29.4 0 0 0 18.115-6.231l334.283-260.884v440.229H159.602z"
                            fill="" p-id="13970"></path>
                    </svg></a>
            </li>
        </ul>
        <a href="#" class="logout">
            <svg t="1585716806344" class="icon" fill="white" viewBox="0 0 1024 1024" version="1.1"
                xmlns="http://www.w3.org/2000/svg" p-id="18154" width="20" height="20">
                <path
                    d="M398.933333 896h-151.466666C181.333333 896 128 842.666667 128 776.533333V247.466667C128 181.333333 181.333333 128 247.466667 128h151.466666c23.466667 0 42.666667 19.2 42.666667 42.666667s-19.2 42.666667-42.666667 42.666666h-151.466666c-19.2 0-34.133333 14.933333-34.133334 34.133334v531.2c0 19.2 14.933333 34.133333 34.133334 34.133333h151.466666c23.466667 0 42.666667 19.2 42.666667 42.666667s-19.2 40.533333-42.666667 40.533333zM663.466667 744.533333c-10.666667 0-21.333333-4.266667-29.866667-12.8-17.066667-17.066667-17.066667-42.666667 0-59.733333l160-160-160-160c-17.066667-17.066667-17.066667-42.666667 0-59.733333 17.066667-17.066667 42.666667-17.066667 59.733333 0l189.866667 189.866666c17.066667 17.066667 17.066667 42.666667 0 59.733334l-189.866667 189.866666c-8.533333 8.533333-19.2 12.8-29.866666 12.8z"
                    p-id="18155"></path>
                <path
                    d="M853.333333 554.666667H398.933333c-23.466667 0-42.666667-19.2-42.666666-42.666667s19.2-42.666667 42.666666-42.666667H853.333333c23.466667 0 42.666667 19.2 42.666667 42.666667s-19.2 42.666667-42.666667 42.666667z"
                    p-id="18156"></path>
            </svg>
        </a>
    </nav>
    <article class="dashboard-content">
        <header class="welcome-banner">
            <h2>Hello, alphardex!</h2>
            <p>Welcome back to Clean My PC</p>
        </header>
        <section class="section">
            <div class="section-titles">
                <div class="section-title">
                    Mar 22-28
                    <div class="btn-group nav-btns">
                        <button class="btn btn-danger btn-round">
                            <svg t="1585663627827" class="arrow-left-icon" fill="currentColor" viewBox="0 0 1024 1024"
                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1157"
                                data-darkreader-inline-fill="" width="20" height="20">
                                <path
                                    d="M629.291 840.832l60.331-60.331-268.501-268.501 268.501-268.501-60.331-60.331-328.832 328.832z"
                                    p-id="1158"></path>
                            </svg></button><button class="btn btn-danger btn-round">
                            <svg t="1585663663731" class="arrow-right-icon" fill="currentColor" viewBox="0 0 1024 1024"
                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1391"
                                data-darkreader-inline-fill="" width="20" height="20">
                                <path
                                    d="M689.621 512l-328.832-328.832-60.331 60.331 268.501 268.501-268.501 268.501 60.331 60.331z"
                                    p-id="1392"></path>
                            </svg>
                        </button>
                    </div>
                </div>
                <div class="section-subtitle">
                    <button class="btn btn-secondary btn-round month">
                        <svg t="1585661389235" fill="currentColor" class="calender-icon" viewBox="0 0 1024 1024"
                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6514" width="14" height="14">
                            <path
                                d="M810.666667 981.333333H213.333333c-72.533333 0-128-55.466667-128-128V256c0-72.533333 55.466667-128 128-128h597.333334c72.533333 0 128 55.466667 128 128v597.333333c0 72.533333-55.466667 128-128 128zM213.333333 213.333333c-25.6 0-42.666667 17.066667-42.666666 42.666667v597.333333c0 25.6 17.066667 42.666667 42.666666 42.666667h597.333334c25.6 0 42.666667-17.066667 42.666666-42.666667V256c0-25.6-17.066667-42.666667-42.666666-42.666667H213.333333z"
                                p-id="6515"></path>
                            <path
                                d="M682.666667 298.666667c-25.6 0-42.666667-17.066667-42.666667-42.666667V85.333333c0-25.6 17.066667-42.666667 42.666667-42.666666s42.666667 17.066667 42.666666 42.666666v170.666667c0 25.6-17.066667 42.666667-42.666666 42.666667zM341.333333 298.666667c-25.6 0-42.666667-17.066667-42.666666-42.666667V85.333333c0-25.6 17.066667-42.666667 42.666666-42.666666s42.666667 17.066667 42.666667 42.666666v170.666667c0 25.6-17.066667 42.666667-42.666667 42.666667zM896 469.333333H128c-25.6 0-42.666667-17.066667-42.666667-42.666666s17.066667-42.666667 42.666667-42.666667h768c25.6 0 42.666667 17.066667 42.666667 42.666667s-17.066667 42.666667-42.666667 42.666666z"
                                p-id="6516"></path>
                        </svg>
                        Month
                    </button>
                </div>
            </div>
            <ul class="time-list">
                <li class="time-list__item" style="--dot-color: var(--warning-color);">
                    <div class="day">Mon</div>
                    <div class="day-number">22</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item" style="--dot-color: var(--primary-color);">
                    <div class="day">Tue</div>
                    <div class="day-number">23</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item" style="--dot-color: var(--danger-color);">
                    <div class="day">Wed</div>
                    <div class="day-number">24</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item active" style="--dot-color: var(--danger-color);">
                    <div class="day">Thu</div>
                    <div class="day-number">25</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item" style="--dot-color: var(--warning-color);">
                    <div class="day">Fri</div>
                    <div class="day-number">26</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item" style="--dot-color: var(--danger-color);">
                    <div class="day">Sat</div>
                    <div class="day-number">27</div>
                    <div class="day-dot"></div>
                </li>
                <li class="time-list__item" style="--dot-color: var(--primary-color);">
                    <div class="day">Sun</div>
                    <div class="day-number">28</div>
                    <div class="day-dot"></div>
                </li>
            </ul>
        </section>
        <section class="section">
            <div class="section-titles">
                <div class="section-title">Weekly Reports</div>
                <div class="section-subtitle">
                    <div class="weeks-option">
                        <a href="#" class="weeks-option__item">Today</a>
                        <a href="#" class="weeks-option__item active">Week</a>
                        <a href="#" class="weeks-option__item">Month</a>
                    </div>
                </div>
            </div>
            <ul class="junk-list">
                <li class="junk-list__item active" style="--junk-color: var(--warning-color-darker);">
                    <div class="junk-icon">
                        <svg t="1585662864272" class="icon" fill="var(--junk-color)" viewBox="0 0 1024 1024"
                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="9396" width="18" height="18">
                            <path
                                d="M949 173.6c0-40.5-32.9-73.4-73.4-73.4H148.4c-40.5 0-73.4 32.9-73.4 73.4v168.1c0 16.9 5.7 32.4 15.4 44.8-9.7 12.5-15.4 28-15.4 44.9v168.1c0 15.4 4.7 29.6 12.8 41.4-8.1 11.8-12.8 26-12.8 41.4v168.1c0 40.5 32.9 73.4 73.4 73.4h727.2c40.5 0 73.4-32.9 73.4-73.4V682.3c0-15.4-4.7-29.6-12.8-41.4 8.1-11.8 12.8-26.1 12.8-41.4V431.4c0-16.9-5.7-32.4-15.4-44.8 9.6-12.4 15.4-28 15.4-44.8V173.6z m-810 0c0-5.1 4.3-9.4 9.4-9.4h727.2c5.1 0 9.4 4.3 9.4 9.4v168.1c0 5.1-4.3 9.4-9.4 9.4H148.4c-5.1 0-9.4-4.3-9.4-9.4V173.6z m746 425.9c0 5.1-4.3 9.4-9.4 9.4H148.4c-5.1 0-9.4-4.3-9.4-9.4V431.4c0-5.1 4.3-9.4 9.4-9.4h727.2c5.1 0 9.4 4.3 9.4 9.4v168.1z m0 250.9c0 5.1-4.3 9.4-9.4 9.4H148.4c-5.1 0-9.4-4.3-9.4-9.4V682.3c0-5.1 4.3-9.4 9.4-9.4h727.2c5.1 0 9.4 4.3 9.4 9.4v168.1z"
                                p-id="9397"></path>
                            <path
                                d="M229.2 289.7h122c17.7 0 32-14.3 32-32s-14.3-32-32-32h-122c-17.7 0-32 14.3-32 32s14.3 32 32 32zM351.1 483.4h-122c-17.7 0-32 14.3-32 32s14.3 32 32 32h122c17.7 0 32-14.3 32-32 0-17.6-14.3-32-32-32zM351.1 734.3h-122c-17.7 0-32 14.3-32 32s14.3 32 32 32h122c17.7 0 32-14.3 32-32s-14.3-32-32-32z"
                                p-id="9398"></path>
                        </svg>
                    </div>
                    <div class="junk-name">System Junk</div>
                    <div class="junk-size">35 Gb</div>
                </li>
                <li class="junk-list__item" style="--junk-color: var(--danger-color-darker);">
                    <div class="junk-icon">
                        <svg t="1585663177457" class="icon" fill="var(--junk-color)" viewBox="0 0 1024 1024"
                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11402" width="18" height="18">
                            <path
                                d="M364 433.662V810c0 82.843-67.157 150-150 150S64 892.843 64 810s67.157-150 150-150c25.282 0 49.103 6.255 70 17.3V400.677a39.861 39.861 0 0 1 0-1.446V200c0-19.455 13.998-36.089 33.168-39.412l548-95C889.626 61.348 912 80.177 912 105v199.324c0.009 0.484 0.009 0.965 0 1.446V714c0 82.843-67.157 150-150 150s-150-67.157-150-150 67.157-150 150-150c25.282 0 49.103 6.255 70 17.3V352.53l-468 81.132z m0-81.193l468-81.131V152.53l-468 81.131V352.47zM214 880c38.66 0 70-31.34 70-70s-31.34-70-70-70-70 31.34-70 70 31.34 70 70 70z m548-96c38.66 0 70-31.34 70-70s-31.34-70-70-70-70 31.34-70 70 31.34 70 70 70z"
                                p-id="11403"></path>
                        </svg>
                    </div>
                    <div class="junk-name">iTunes Junk</div>
                    <div class="junk-size">1.25 Gb</div>
                </li>
                <li class="junk-list__item" style="--junk-color: var(--primary-color-darker);">
                    <div class="junk-icon">
                        <svg t="1585663224255" class="icon" fill="var(--junk-color)" viewBox="0 0 1024 1024"
                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1146" data-darkreader-inline-fill=""
                            width="18" height="18">
                            <path
                                d="M896 234.666667H725.333333v-42.666667c0-70.72-57.28-128-128-128H426.666667c-70.72 0-128 57.28-128 128v42.666667H128a42.666667 42.666667 0 0 0 0 85.333333h42.666667v512c0 70.72 57.28 128 128 128h426.666666c70.72 0 128-57.28 128-128V320h42.666667a42.666667 42.666667 0 0 0 0-85.333333z m-512-42.666667c0-23.573333 19.093333-42.666667 42.666667-42.666667h170.666666c23.573333 0 42.666667 19.093333 42.666667 42.666667v42.666667H384v-42.666667z m384 640c0 23.573333-19.093333 42.666667-42.666667 42.666667H298.666667c-23.573333 0-42.666667-19.093333-42.666667-42.666667V320h512v512z"
                                p-id="1147"></path>
                        </svg>
                    </div>
                    <div class="junk-name">Trash Bins</div>
                    <div class="junk-size">16.35 Gb</div>
                </li>
                <li class="junk-list__item" style="--junk-color: var(--info-color-darker);">
                    <div class="junk-icon">
                        <svg t="1585663289751" class="icon" fill="var(--junk-color)" viewBox="0 0 1024 1024"
                            version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13346" width="18" height="18">
                            <path
                                d="M725.333333 981.333333H298.666667c-140.8 0-256-115.2-256-256V298.666667c0-140.8 115.2-256 256-256h426.666666c140.8 0 256 115.2 256 256v426.666666c0 140.8-115.2 256-256 256zM298.666667 128C204.8 128 128 204.8 128 298.666667v426.666666c0 93.866667 76.8 170.666667 170.666667 170.666667h426.666666c93.866667 0 170.666667-76.8 170.666667-170.666667V298.666667c0-93.866667-76.8-170.666667-170.666667-170.666667H298.666667z"
                                p-id="13347"></path>
                            <path
                                d="M512 725.333333c-46.933333 0-89.6-12.8-128-42.666666-46.933333-34.133333-76.8-85.333333-85.333333-140.8C285.866667 426.666667 366.933333 315.733333 482.133333 298.666667c21.333333-4.266667 42.666667-4.266667 64 0 93.866667 12.8 166.4 85.333333 179.2 179.2 8.533333 55.466667-4.266667 110.933333-38.4 157.866666s-85.333333 76.8-140.8 85.333334c-12.8 0-21.333333 4.266667-34.133333 4.266666z m0-341.333333h-17.066667c-68.266667 8.533333-119.466667 76.8-106.666666 145.066667 8.533333 68.266667 76.8 119.466667 145.066666 106.666666 34.133333-4.266667 64-21.333333 85.333334-51.2s29.866667-59.733333 25.6-93.866666c-8.533333-55.466667-51.2-98.133333-106.666667-106.666667H512zM746.666667 320c-12.8 0-21.333333-4.266667-29.866667-12.8-4.266667-4.266667-8.533333-8.533333-8.533333-12.8-4.266667-4.266667-4.266667-12.8-4.266667-17.066667 0-12.8 4.266667-21.333333 12.8-29.866666 17.066667-17.066667 42.666667-17.066667 59.733333 0 8.533333 8.533333 12.8 17.066667 12.8 29.866666 0 4.266667 0 12.8-4.266666 17.066667s-4.266667 8.533333-8.533334 12.8c-8.533333 8.533333-17.066667 12.8-29.866666 12.8z"
                                p-id="13348"></path>
                        </svg>
                    </div>
                    <div class="junk-name">Photo Junk</div>
                    <div class="junk-size">12.10 Gb</div>
                </li>
            </ul>
        </section>
        <section class="section">
            <div class="section-titles">
                <div class="section-title">Updating Monitoring</div>
            </div>
            <ul class="monitor-list">
                <li class="monitor-list__item">
                    <div class="monitor-data">
                        <div class="monitor-type">System Files</div>
                        <div class="monitor-date">March 2020</div>
                    </div>
                    <div class="monitor-gauge">
                        <a href="#" class="gauge gauge-danger" style="--gauge-value: 25; --gauge-max-value: 100;"></a>
                    </div>
                </li>
                <li class="monitor-list__item active">
                    <div class="monitor-data">
                        <div class="monitor-type">Applications</div>
                        <div class="monitor-date">March 2020</div>
                    </div>
                    <div class="monitor-gauge">
                        <a href="#" class="gauge gauge-warning" style="--gauge-value: 50; --gauge-max-value: 100;"></a>
                    </div>
                </li>
            </ul>
        </section>
    </article>
    <article class="dashboard-others">
        <section class="section">
            <div class="section-titles">
                <div class="section-title">Other Functions</div>
            </div>
            <ul class="function-list">
                <li class="function-list__item" style="--function-color: var(--danger-color);">
                    <div class="function">
                        <div class="function-icon">
                            <svg t="1585710026874" class="icon" fill="currentColor" viewBox="0 0 1093 1024"
                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3269" width="18" height="18">
                                <path
                                    d="M682.666667 0 477.866667 0l0 819.2 204.8 0L682.666667 0zM341.333333 409.6 136.533333 409.6l0 409.6 204.8 0L341.333333 409.6zM1024 273.066667l-204.8 0 0 546.133333 204.8 0L1024 273.066667zM0 887.466667l0 136.533333 72.021333 0L1092.266667 1024l0-67.720533L1092.266667 887.466667 0 887.466667z"
                                    p-id="3270"></path>
                            </svg>
                        </div>
                        <div class="function-menu">
                            <svg t="1585710109292" class="icon" fill="currentColor" viewBox="0 0 1024 1024"
                                version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7280" width="18" height="18">
                                <path
                                    d="M512 305.7c-57.3 0-103.8-46.5-103.8-103.8S454.7 98.2 512 98.2 615.8 144.7 615.8 202 569.3 305.7 512 305.7z m0 311.3c-57.3 0-103.8-46.5-103.8-103.8S454.7 409.5 512 409.5 615.8 456 615.8 513.3 569.3 617 512 617z m0 311.3c-57.3 0-103.8-46.5-103.8-103.8S454.7 720.8 512 720.8s103.8 46.5 103.8 103.8S569.3 928.3 512 928.3z"
                                    p-id="7281"></path>
                            </svg>
                        </div>
                    </div>
                    <div class="function-data">
                        <div class="function-name">Optimization</div>
                        <div class="function-switch">
                            <input type="checkbox" name="optimization" id="optimization"
                                class="form-switch function-switch" />
                        </div>
                    </div>
                </li>
                <li class="function-list__item" style="--function-color: var(--warning-color);">
                    <div class="function">
                        <div class="function-icon">
                            <svg t="1585711252306" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                xmlns="http://www.w3.org/2000/svg" p-id="2969" fill="currentColor" width="18"
                                height="18">
                            &nb