Old Codes

_data/contact.yml

#  The contact options.

- type: youtube
  icon: "fab fa-youtube"
  url: "https://youtube.com/@SoumyaK4"

- type: twitch
  icon: "fab fa-twitch"
  url: "https://twitch.tv/SoumyaK4"

- type: website
  icon: "fas fa-s"
  url: "https://soumyak4.in"
  noblank: true

- type: telegram
  icon: "fab fa-telegram"
  url: "https://t.me/SoumyaK4"

- type: instagram
  icon: "fab fa-instagram"
  url: "https://www.instagram.com/SoumyaK4/"

_includes

footer.html

<!-- The Footer -->

<footer
  aria-label="Site Info"
  class="
    d-flex flex-column justify-content-center text-muted
    flex-lg-row justify-content-lg-between align-items-lg-center pb-lg-3
  "
>
  <p>
    {{- '©' }}
    <time>2021 - {{ 'now' | date: '%Y' }}</time>

    {% if site.social.links %}
      <a href="{{ site.social.links[0] }}">{{ site.social.name }}</a>.
    {% else %}
      <em class="fst-normal">{{ site.social.name }}</em>.
    {% endif %}

    {% if site.data.locales[include.lang].copyright.brief %}
    <span
      data-bs-toggle="tooltip"
      data-bs-placement="top"
      title="{{ site.data.locales[include.lang].copyright.verbose }}"
    >
      {{- site.data.locales[include.lang].copyright.brief -}}
    </span>
    {% endif %}
  </p>

  <p>
    <a href="/acknowledgement">Acknowledgements</a>
  </p>
</footer>

about.html

<!-- about snippet -->

<hr>

<div style="text-align: center">
  <div style="font-size: 36px">
    Hello, I'm <a href="https://soumyak4.in/Experiences" style="color: #FF5733;"> Soumya</a> <br>
  </div>
  <u style="font-size: 18px; color: #FF5733;">
    A Student / Teacher from Kolkata, India 
  </u>
</div>
<hr>
<h5 style="text-align: center">
    I've created This Roadmap in 2021 from my experience of becoming an Intermediate Level Player, <br>
    With Just 1 Year of Self Studies, using online free resources.<br />
    I hope this helps you on Your Journey as well. <br>
    <b>Good Luck, Have Fun!!</b>
</h5>  
<hr>

sidebar.html

<!-- The Side Bar -->

<aside aria-label="Sidebar" id="sidebar" class="d-flex flex-column align-items-end">
  <header class="profile-wrapper">
    <a href="{{ '/' | relative_url }}" id="avatar" class="rounded-circle">
      {%- if site.avatar != empty and site.avatar -%}
        {%- capture avatar_url -%}
          {% include media-url.html src=site.avatar %}
        {%- endcapture -%}
        <img src="{{- avatar_url -}}" width="112" height="112" alt="avatar" onerror="this.style.display='none'">
      {%- endif -%}
    </a>

    <h1 class="site-title">
      <a href="{{ '/' | relative_url }}">{{ site.title }}</a>
    </h1>
    <p class="site-subtitle fst-italic mb-0">{{ site.tagline }}</p>
  </header>
  <!-- .profile-wrapper -->

  <nav class="flex-column flex-grow-1 w-100 ps-0">
    <ul class="nav">
      <!-- home -->
      <li class="nav-item{% if page.layout == 'home' %}{{ " active" }}{% endif %}">
        <a href="{{ '/' | relative_url }}" class="nav-link">
          <i class="fa-fw fas fa-home"></i>
          <span>{{ site.data.locales[include.lang].tabs.home | upcase }}</span>
        </a>
      </li>
      <!-- the real tabs -->
      {% for tab in site.tabs %}
        <li class="nav-item{% if tab.url == page.url %}{{ " active" }}{% endif %}">
          <a href="{{ tab.url | relative_url }}" class="nav-link">
            <i class="fa-fw {{ tab.icon }}"></i>
            {% capture tab_name %}{{ tab.url | split: '/' }}{% endcapture %}
            <span>{{ site.data.locales[include.lang].tabs.[tab_name] | default: tab.title | upcase }}</span>
          </a>
        </li>
        <!-- .nav-item -->
      {% endfor %}
        <!-- coffee -->
        <li class="nav-item{% if tab.url == page.url %}{{ " active" }}{% endif %}">
          <a href="{{'https://buymeacoffee.com/SoumyaK4'}}" target="_blank" class="nav-link">
            <i class="fas fa-coffee"></i>
            <span>BUY ME A COFFEE</span>
          </a>
        </li>
    </ul>
  </nav>

  <div class="sidebar-bottom d-flex flex-wrap  align-items-center w-100">
    {% unless site.theme_mode %}
      <button type="button" class="btn btn-link nav-link" aria-label="Switch Mode" id="mode-toggle">
        <i class="fas fa-adjust"></i>
      </button>

      {% if site.data.contact.size > 0 %}
        <span class="icon-border"></span>
      {% endif %}
    {% endunless %}

    {% for entry in site.data.contact %}
      {% assign url = entry.url %}

      {% if url %}
        <a
          href="{{ url }}"
          aria-label="{{ entry.type }}"
          {% assign link_types = '' %}

          {% unless entry.noblank %}
            target="_blank"
            {% assign link_types = 'noopener noreferrer' %}
          {% endunless %}

          {% unless link_types == empty %}
            rel="{{ link_types }}"
          {% endunless %}
        >
          <i class="{{ entry.icon }}"></i>
        </a>
      {% endif %}
    {% endfor %}
  </div>
  <!-- .sidebar-bottom -->
</aside>
<!-- #sidebar -->

catogories in trending-tags.html

<!-- The trending tags list -->

{% assign MAX = 10 %}

{% assign size_list = '' | split: '' %}
{% assign tag_list = '' | split: '' %}

{% for tag in site.categories %}
  {% assign size = tag | last | size %}
  {% assign size_list = size_list | push: size %}

  {% assign tag_str = tag | first | append: '::' | append: size %}
  {% assign tag_list = tag_list | push: tag_str %}
{% endfor %}

{% assign size_list = size_list | sort | reverse %}

{% assign tag_list = tag_list | sort_natural %}

{% assign trending_tags = '' | split: '' %}

{% for size in size_list limit: MAX %}
  {% for tag_str in tag_list %}
    {% assign tag = tag_str | split: '::' %}
    {% assign tag_name = tag | first %}
    {% assign tag_size = tag | last | plus: 0 %}
    {% if tag_size == size %}
      {% unless trending_tags contains tag_name %}
        {% assign trending_tags = trending_tags | push: tag_name %}
        {% break %}
      {% endunless %}
    {% endif %}
  {% endfor %}
{% endfor %}

{% if trending_tags.size > 0 %}
  <section>
    <h2 class="panel-heading">Trending</h2>
    <div class="d-flex flex-wrap mt-3 mb-1 me-3">
      {% for tag_name in trending_tags %}
        {% assign url = tag_name | slugify | url_encode | prepend: '/categories/' | append: '/' %}
        <a class="post-tag btn btn-outline-primary" href="{{ url | relative_url }}">{{ tag_name }}</a>
      {% endfor %}
    </div>
  </section>
{% endif %}

_layouts

archives.html

---
layout: page
# The Archives of posts.
---
{% include lang.html %}

{% include pre-timeline.html %}

{% assign df_strftime_m = site.data.locales[lang].df.archives.strftime | default: '/ %m' %}
{% assign df_dayjs_m = site.data.locales[lang].df.archives.dayjs | default: '/ MM' %}

<div id="archives" class="pl-xl-3">
  {% assign posts = site.posts | sort: 'date' %}
  {% for post in posts %}
    {% assign cur_year = post.date | date: '%Y' %}

    {% if cur_year != last_year %}
      {% unless forloop.first %}</ul>{% endunless %}

      <time class="year lead d-block">{{ cur_year }}</time>
      {{ '<ul class="list-unstyled">' }}

      {% assign last_year = cur_year %}
    {% endif %}

    <li>
      {% assign ts = post.date | date: '%s' %}
      <span class="date day" data-ts="{{ ts }}" data-df="DD">{{ post.date | date: '%d' }}</span>
      <span class="date month small text-muted ms-1" data-ts="{{ ts }}" data-df="{{ df_dayjs_m }}">
        {{ post.date | date: df_strftime_m }}
      </span>
      <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
    </li>

    {% if forloop.last %}</ul>{% endif %}
  {% endfor %}
</div>

default.html

---
layout: compress
---

<!doctype html>

{% include origin-type.html %}

{% include lang.html %}

{% if site.theme_mode %}
  {% capture prefer_mode %}data-mode="{{ site.theme_mode }}"{% endcapture %}
{% endif %}

<!-- `site.alt_lang` can specify a language different from the UI -->
<html lang="{{ page.lang | default: site.alt_lang | default: site.lang }}" {{ prefer_mode }}>
  {% include head.html %}

  <body>
    {% include sidebar.html lang=lang %}

    <div id="main-wrapper" class="d-flex justify-content-center">
      <div class="container d-flex flex-column px-xxl-5">
        {% include topbar.html lang=lang %}

        <div class="row flex-grow-1">
          <main aria-label="Main Content" class="col-12 col-lg-11 col-xl-9 px-md-4">
            {% if layout.refactor or layout.layout == 'default' %}
              {% include refactor-content.html content=content lang=lang %}
            {% else %}
              {{ content }}
            {% endif %}
          </main>

          <!-- panel -->
          <aside aria-label="Panel" id="panel-wrapper" class="col-xl-3 ps-2 mb-5 text-muted">
            <div class="access">
              {% include_cached update-list.html lang=lang %}
              {% include_cached trending-tags.html lang=lang %}
            </div>

            {% for _include in layout.panel_includes %}
              {% assign _include_path = _include | append: '.html' %}
              {% include {{ _include_path }} lang=lang %}
            {% endfor %}
          </aside>
        </div>

        <div class="row">
          <!-- tail -->
          <div id="tail-wrapper" class="col-12 col-lg-11 col-xl-9 px-md-4">
            {% for _include in layout.tail_includes %}
              {% assign _include_path = _include | append: '.html' %}
              {% include {{ _include_path }} lang=lang %}
            {% endfor %}

            {% include_cached footer.html lang=lang %}
          </div>
        </div>

        {% include_cached search-results.html lang=lang %}
      </div>

      <aside aria-label="Scroll to Top">
        <button id="back-to-top" type="button" class="btn btn-lg btn-box-shadow">
          <i class="fas fa-angle-up"></i>
        </button>
      </aside>
    </div>

    <div id="mask"></div>

    {% if site.pwa.enabled %}
      {% include_cached notification.html lang=lang %}
    {% endif %}

    <!-- JavaScripts -->
    {% include js-selector.html lang=lang %}

    {% include_cached search-loader.html lang=lang %}
  </body>
</html>

home.html

---
layout: default
refactor: true
---

{% include lang.html %}

{% assign pinned = site.posts | where: 'pin', 'true' %}
{% assign posts = '' | split: '' %}

<!-- Get pinned posts -->

{% assign offset = paginator.page | minus: 1 | times: paginator.per_page %}
{% assign pinned_num = pinned.size | minus: offset %}
{% if pinned_num > 0 %}
{% for i in (offset..pinned.size) limit: pinned_num %}
{% assign posts = posts | push: pinned[i] %}
{% endfor %}
{% else %}
{% assign pinned_num = 0 %}
{% endif %}

<!-- Get default posts -->

<div id="post-list" class="flex-grow-1 px-xl-1">
  {% for post in posts %}
  <article class="card-wrapper card">
    <a href="{{ post.url | relative_url }}" class="post-preview row g-0 flex-md-row-reverse">
      {% assign card_body_col = '12' %}
      {% if post.image %}
      {% assign src = post.image.path | default: post.image %}
      {% unless src contains '//' %}
      {% assign src = post.media_subpath | append: '/' | append: src | replace: '//', '/' %}
      {% endunless %}
      {% assign alt = post.image.alt | xml_escape | default: 'Preview Image' %}
      {% assign lqip = null %}
      {% if post.image.lqip %}
      {% capture lqip %}
      lqip="{{ post.image.lqip }}"
      {% endcapture %}
      {% endif %}

      <div class="col-md-5">
        <img src="{{ src }}" alt="{{ alt }}" {{ lqip }} />
      </div>

      {% assign card_body_col = '7' %} {% endif %}

      <div class="col-md-{{ card_body_col }}">
        <div class="card-body d-flex flex-column">
          <h1 class="card-title my-2 mt-md-0">{{ post.title }}</h1>

          <div class="card-text content mt-0 mb-3">
            <p>{% include post-description.html %}</p>
          </div>

          <div class="post-meta flex-grow-1 d-flex align-items-end">
            <div class="me-auto">
              <!-- posted date -->
              <i class="far fa-calendar fa-fw me-1"></i>
              {% include datetime.html date=post.date lang=lang %}

              <!-- categories -->
              {% if post.categories.size > 0 %}
              <i class="far fa-folder-open fa-fw me-1"></i>
              <span class="categories">
                {% for category in post.categories %} {{ category }} {%- unless
                forloop.last -%},{%- endunless -%} {% endfor %}
              </span>
              {% endif %}
            </div>

            {% if post.pin %}
            <div class="pin ms-1">
              <span>{{ site.data.locales[lang].post.pin_prompt }}</span>
            </div>
            {% endif %}
          </div>
          <!-- .post-meta -->
        </div>
        <!-- .card-body -->
      </div>
    </a>
  </article>
  {% endfor %}
</div>
<!-- #post-list -->

{% if paginator.total_pages > 1 %} {% include post-paginator.html %} {% endif %}

page.html

---
layout: default
---

{% include lang.html %}

<article class="px-1">
  {% if page.layout == 'page' or page.collection == 'tabs' %}
    {% assign tab_key = page.title | downcase %}
    {% assign title = site.data.locales[lang].tabs[tab_key] | default: page.title %}

    <div class="content">
      {{ content }}
    </div>
  {% else %}
    {{ content }}
  {% endif %}
</article>