<head>

<meta property="og:title"
  content="{% if page.title %}{{ page.title }} - {{ site.SEOTitle }}{% else %}{{ site.SEOTitle }}{% endif %}">
{% case page.layout %}
{% when 'post' %}
<meta property="og:type" content="article">
<meta property="og:description" content="{{ page.excerpt | strip_html | truncate:200 }}">
{% if page.date %}
<meta property="article:published_time" content="{{ page.date | date: "%Y-%m-%dT%H:%M:%SZ" }}">
{% endif %}
{% if page.author %}
<meta property="article:author" content="{{ page.author }}">
{% endif %}
{% for tag in page.tags %}
<meta property="article:tag" content="{{ tag }}">
{% endfor %}
{% else %}
<meta property="og:type" content="website">
<meta property="og:description"
  content="{% if page.description %}{{ page.description }}{% else %}{{ site.description }}{% endif %}">
{% endcase %}
<meta property="og:image" content="{{ site.url }}{{ site.sidebar-avatar }}">
<meta property="og:url" content="{{ site.url }}{{ page.url }}">
<meta property="og:site_name" content="{{ site.SEOTitle }}">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<title>{% if page.title %}{{ page.title }} - {{ site.SEOTitle }}{% else %}{{ site.SEOTitle }}{% endif %}</title>
<!-- preload -->
<!--CSS inside-->
<link rel="preload"
      as="style" 
      href="{{ "/assets/css/styles.css" | prepend: site.baseurl }}" >
<link rel="stylesheet"
      href="{{ "/assets/css/styles.css" | prepend: site.baseurl }}" >
<link rel="stylesheet" 
      media="none" 
      onload="this.media='print,screen'" 
      href="{{ "/assets/css/font-awesome.min.css" | prepend: site.baseurl }}">
<link rel="stylesheet" 
      media="none" 
      onload="this.media='print,screen'" 
      href="{{ "/assets/css/bootstrap.min.css" | prepend: site.baseurl }}">
<link rel="prefetch" as="style" media="print,screen" href="{{ "/assets/fonts/amarillo/amarillo-font.css" | prepend: site.baseurl }}">
<!--Js inside-->
<script defer type="text/javascript" src='{{ "/assets/js/jquery-ui-1.8.5.min.js" | prepend: site.baseurl }}'></script>
<script type="text/javascript" src='{{ "/assets/js/jquery-3.5.1.min.js" | prepend: site.baseurl }}'></script>
<script async type="text/javascript" src='{{ "/assets/js/imagesLoaded-4.1.4.js" | prepend: site.baseurl }}'></script>
<script async
        type="text/javascript" 
        src='{{ "/assets/js/mermaid.min.js" | prepend: site.baseurl }}'
        onload="mermaid.init(undefined, $('.language-mermaid'));"></script>
<!-- <script type="text/javascript" src='{{ "/assets/js/skrollr-0.6.3.js" | prepend: site.baseurl }}'></script> -->
<!-- slick plugin -->
<script defer type="text/javascript" src='{{ "/assets/js/slick.min.js" | prepend: site.baseurl }}'></script>
<link rel="stylesheet"
      media="none" 
      onload="this.media='print,screen'" 
      type="text/css" 
      href="{{ "/assets/css/slick.css" | prepend: site.baseurl }}">
<link rel="stylesheet"
      media="none" 
      onload="this.media='print,screen'" 
      type="text/css" 
      href="{{ "/assets/css/slick-theme.css" | prepend: site.baseurl }}">
<!-- main script -->
<script defer type="text/javascript" src='{{ "/assets/js/script.js" | prepend: site.baseurl }}'></script>

<!– only useful for wp content –> <!– <link rel='dns-prefetch' href='//s.w.org' /> –> <script type=“text/javascript”>

function loadCSS() {
          if ((navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|wOSBrowser|BrowserNG|WebOS)/i))) {
            $('.pc').css('display','none !important');
            $('.sp').css('display',"inline !important");
            //alert('pc is hidden!')
          }
          else {
              $('.sp').css('display','none !important');
              $('.pc').css('display','inline !important');
              //alert('plz hide the sp nav')
          }
      }
      $(function () {
      loadCSS();
      console.log('[↑]END');
    });

</script>

</head>