Halyul/hexo-theme-mdui

View on GitHub
layout/layout.ejs

Summary

Maintainability
Test Coverage
<%
  var layout;

  function is_customLayout() {
    if (page.layout === "gallery" || page.layout === "galleries") {
      return true
    }
  }

  if (is_home()) layout = 'posts';
  if (is_post()) layout = 'post';
  if (is_archive() && !is_year()) layout = 'archive';
  if (is_year() || is_tag() || is_category()) layout = 'archives';
  if (!is_home() && !is_year() && !is_tag() && !is_category() && !is_post() && !is_archive() && !is_customLayout()) layout = 'post';
  if (page.path === 'search.html') layout = 'search';
  if (is_customLayout()) layout = page.layout
%>
<!DOCTYPE html>
<html <% if(config.language !== null) { %>lang="<%- config.language.substring(0,2) %>"<% } %>>

<%-partial('_partials/head')%>

<body class="mdui-drawer-body-left mdui-theme-primary-<%= theme.style.primary_color %> mdui-theme-accent-<%= theme.style.accent_color %>">

  <style>
    #spinner {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
          opacity: 1;
      -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
          transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
    }
    main {
      opacity: 0;
      -webkit-transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
      transition: opacity 0.3s cubic-bezier(0, 0, 0.2, 1);
      display: none;
    }
  </style>
  <div id="spinner">
    <style>
      .spinner {

      -webkit-animation: rotator 1.4s linear infinite;
              animation: rotator 1.4s linear infinite;
      }

      @-webkit-keyframes rotator {
      0% {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
      }
      100% {
        -webkit-transform: rotate(270deg);
                transform: rotate(270deg);
      }
      }

      @keyframes rotator {
      0% {
        -webkit-transform: rotate(0deg);
                transform: rotate(0deg);
      }
      100% {
        -webkit-transform: rotate(270deg);
                transform: rotate(270deg);
      }
      }

      .path {
      stroke-dasharray: 187;
      stroke-dashoffset: 0;
      -webkit-transform-origin: center;
              transform-origin: center;
      -webkit-animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
              animation: dash 1.4s ease-in-out infinite, colors 5.6s ease-in-out infinite;
      }

      @-webkit-keyframes colors {
      0% {
        stroke: #4285F4;
      }
      25% {
        stroke: #DE3E35;
      }
      50% {
        stroke: #F7C223;
      }
      75% {
        stroke: #1B9A59;
      }
      100% {
        stroke: #4285F4;
      }
      }

      @keyframes colors {
      0% {
        stroke: #4285F4;
      }
      25% {
        stroke: #DE3E35;
      }
      50% {
        stroke: #F7C223;
      }
      75% {
        stroke: #1B9A59;
      }
      100% {
        stroke: #4285F4;
      }
      }

      @-webkit-keyframes dash {
      0% {
        stroke-dashoffset: 187;
      }
      50% {
        stroke-dashoffset: 46.75;
        -webkit-transform: rotate(135deg);
                transform: rotate(135deg);
      }
      100% {
        stroke-dashoffset: 187;
        -webkit-transform: rotate(450deg);
                transform: rotate(450deg);
      }
      }

      @keyframes dash {
      0% {
        stroke-dashoffset: 187;
      }
      50% {
        stroke-dashoffset: 46.75;
        -webkit-transform: rotate(135deg);
                transform: rotate(135deg);
      }
      100% {
        stroke-dashoffset: 187;
        -webkit-transform: rotate(450deg);
                transform: rotate(450deg);
      }
      }
    </style>
    <svg class="spinner" width="65px" height="65px" viewBox="0 0 66 66" xmlns="http://www.w3.org/2000/svg">
      <circle class="path" fill="none" stroke-width="6" stroke-linecap="round" cx="33" cy="33" r="30"></circle>
    </svg>
  </div>

  <main>
    <%-partial('_partials/appbar')%>
    <%-partial('_partials/drawer')%>
    <div id="top"></div>

    <%- js("js/lightgallery.min") %>

    <div id="barba-wrapper">
      <div class="barba-container"  data-namespace="<%= layout %>">
        <%- body %>
      </div>
    </div>
  </main>

  <div id="outdated" style="z-index: 9999;">
    <h6><%= __('outdated_browser.title')  %></h6>
    <p><%= __('outdated_browser.line_one') %><a id="btnUpdateBrowser" href="http://outdatedbrowser.com/"><%= __('outdated_browser.link') %></a></p>
    <p class="last"><a href="#" id="btnCloseUpdateBrowser" title="<%= __('outdated_browser.close') %>">&times;</a></p>
  </div>
  <%-partial('_partials/import_js.ejs')%>

</body>
</html>