hexo/themes/Klise/layout/partials/header.ejs

<div class="navbar" role="navigation">
    <nav class="menu">
      <input type="checkbox" id="menu-trigger" class="menu-trigger" />
      <label for="menu-trigger">
        <span class="menu-icon">
          <svg
            xmlns="http://www.w3.org/2000/svg"
            width="24"
            height="24"
            viewBox="0 0 512 512"
          >
            <path
              d="M64,384H448V341.33H64Zm0-106.67H448V234.67H64ZM64,128v42.67H448V128Z"
            />
          </svg>
        </span>
      </label>
      <a id="mode">
        <svg
          class="mode-sunny"
          xmlns="http://www.w3.org/2000/svg"
          width="24"
          height="24"
          viewBox="0 0 512 512"
        >
          <title>LIGHT</title>
          <line
            x1="256"
            y1="48"
            x2="256"
            y2="96"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="256"
            y1="416"
            x2="256"
            y2="464"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="403.08"
            y1="108.92"
            x2="369.14"
            y2="142.86"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="142.86"
            y1="369.14"
            x2="108.92"
            y2="403.08"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="464"
            y1="256"
            x2="416"
            y2="256"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="96"
            y1="256"
            x2="48"
            y2="256"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="403.08"
            y1="403.08"
            x2="369.14"
            y2="369.14"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="142.86"
            y1="142.86"
            x2="108.92"
            y2="108.92"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <circle
            cx="256"
            cy="256"
            r="80"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
        </svg>
        <svg
          class="mode-moon"
          xmlns="http://www.w3.org/2000/svg"
          width="24"
          height="24"
          viewBox="0 0 512 512"
        >
          <title>DARK</title>
          <line
            x1="256"
            y1="48"
            x2="256"
            y2="96"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="256"
            y1="416"
            x2="256"
            y2="464"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="403.08"
            y1="108.92"
            x2="369.14"
            y2="142.86"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="142.86"
            y1="369.14"
            x2="108.92"
            y2="403.08"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="464"
            y1="256"
            x2="416"
            y2="256"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="96"
            y1="256"
            x2="48"
            y2="256"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="403.08"
            y1="403.08"
            x2="369.14"
            y2="369.14"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <line
            x1="142.86"
            y1="142.86"
            x2="108.92"
            y2="108.92"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
          <circle
            cx="256"
            cy="256"
            r="80"
            style="stroke-linecap:round;stroke-miterlimit:10;stroke-width:32px"
          />
        </svg>
      </a>
      <div class="trigger">
        <div class="trigger-container">
          <% Object.keys(theme.menu).forEach(key => { %>
            <% var path1 = ('/'+path.slice(0,path.indexOf('index.html')-1)).replace('index.htm','') %>
            <% var path2 = '/'+ path.replace('/index.html','') %>
            <% var item = theme.menu[key].split('||'); %>
            <% var url = trim(item[0]); %>
            <% var name = item[1]; %>
            <% var paths = '/'+path.replace('index.html','') %>
            <a class="menu-link <%=url===paths?'active':''%>" href="<%- url%>"><%=name%></a>
          <% }); %>
        </div>
      </div>
    </nav>
  </div>