website: initial ooknet website commit

This commit is contained in:
ooks-io 2024-10-31 17:27:08 +11:00
parent 97be7a19c6
commit a9280b78cd
55 changed files with 2424 additions and 2 deletions

View file

@ -0,0 +1,5 @@
<a
class="zola-anchor icon icon--medium icon__link"
href="#{{ id }}"
aria-label="Anchor link for: {{ id }}"
></a>

View file

@ -0,0 +1,44 @@
<!doctype html>
<html lang="en">
<head>
{%- include "partials/head.html" %}
</head>
{% block body %} {% set page_class="home" %} {% endblock body %}
<body class="{{ page_class }}">
<header class="navbar-wrapper">
<nav class="navbar">
<div>{% block navbar_extras %} {% endblock navbar_extras %}</div>
<ul class="navbar__tab">
<li class="navbar__tab-item">
<a class="navbar__link navbar__link--home" href="{{ config.base_url }}"
>home</a
>
</li>
<li class="navbar__tab-item">
<a
class="navbar__link navbar__link--notes"
href="{{ get_url(path='notes') }}"
>notes</a
>
</li>
<li class="navbar__tab-item">
<a class="navbar__link navbar__link--contact" href="#">contact</a>
</li>
</ul>
<label class="switch">
<input class="switch__input" type="checkbox" name="theme-switch" />
<span class="icon icon--medium icon__moon switch__icon"></span>
<span class="icon icon--medium icon__sun switch__icon"></span>
</label>
</nav>
</header>
{% block home %} {% endblock home %}
{% block notebook %}{% endblock notebook %}
{% block js_body %}
<script type="text/javascript" src="{{ get_url(path="notebook_menu.js") | safe }}"></script>
<script type="text/javascript" src="{{ get_url(path="theme_switch.js") | safe }}"></script>
<script type="text/javascript" src="{{ get_url(path="callouts.js") | safe }}"></script>
{% endblock js_body %}
</body>
</html>

View file

@ -0,0 +1,15 @@
{% extends "base.html" %}
{% block main_navbar %}
<header>
<div class="site-header">
<nav>
<ul class="nav-links">
<li><a href="{{ config.base_url }}"> ooknet</a></li>
<li><a href="{{ get_url(path='library') }}"> notes</a></li>
<li><a href="{{ get_url(path='resume') }}">󰇮 contact</a></li>
</ul>
</nav>
</div>
</header>
{% endblock main_navbar %}

View file

@ -0,0 +1,40 @@
{% extends "base.html" %}
<section class="info-box-container">
<article class="info-box-wrapper">
<div class="info-box">
<header class="info-box__title">
<span aria-hidden="true" class="icon icon--medium icon__info"></span>
<h2 class="info-box__title-text" "info-box__title-text--about">about</h2>
</header>
<div class="info-box__content">
<p>ooknet is a monorepo, a personal website and a collection of my notes</p>
</div>
</div>
</article>
<article class="info-box-wrapper">
<div class="info-box">
<header class="info-box__title">
<span aria-hidden="true" class="icon icon--medium icon__contact"></span>
<h2 class="info-box__title-text" "info-box__title-text--contact">contact</h2>
</header>
<div class="info-box__content">
<p>ooknet is a monorepo, a personal website and a collection of my notes</p>
</div>
</div>
</article>
<article class="info-box-wrapper">
<div class="info-box">
<header class="info-box__title">
<span aria-hidden="true" class="icon icon--medium icon__notes"></span>
<h2 class="info-box__title-text" "info-box__title-text--notes">notes</h2>
</header>
<div class="info-box__content">
<p>ooknet is a monorepo, a personal website and a collection of my notes</p>
</div>
</div>
</article>
</section>
{% block home %}
{{ section.content | safe }}
{% endblock home %}

View file

@ -0,0 +1,35 @@
{% extends "base.html" %}
{% block notebook %}
<h1 class="content__title">{{ section.title }}</h1>
{{ section.content | safe }}
<div class="notebook-grid">
{% set library = get_section(path="notes/_index.md") %}
{% for book in library.subsections %}
{% set book_section = get_section(path=book) %}
<div class="notebook-card">
<h2 class="notebook-card__title">
<a href="{{ book_section.permalink | safe }}" class="notebook-card__link">
{{ book_section.title }}
</a>
</h2>
{% if book_section.description %}
<p class="notebook-card__description">{{ book_section.description }}</p>
{% endif %}
{% if book_section.subsections %}
<ul class="notebook-card__chapters">
{% for chapter in book_section.subsections %}
{% set chapter_section = get_section(path=chapter) %}
<li class="notebook-card__chapter">
<a href="{{ chapter_section.permalink | safe }}" class="notebook-card__chapter-link">
{{ chapter_section.title }}
</a>
</li>
{% endfor %}
</ul>
{% endif %}
</div>
{% endfor %}
</div>
{% endblock notebook %}

View file

@ -0,0 +1,14 @@
{% extends "base.html" %}
{% block navbar_extras %}
<button class="menu-toggle icon icon--large icon__menu"></button>
{% endblock navbar_extras %} {% block notebook %}
<div class="notebook">
{% block notebook_menu %} {% include "partials/notebook-menu.html" %} {%
endblock notebook_menu %}
<main class="content">
{% block content %}
<h1 class="content__title">{{ page.title | safe }}</h1>
{{ page.content | safe }} {% endblock content %}
</main>
</div>
{% endblock notebook %}

View file

@ -0,0 +1,27 @@
{% block head %}
<meta charset="utf-8" />
<meta content="width=device-width, initial-scale=1" name="viewport" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta content="#ffffff" name="theme-color" />
<meta content="#da532c" name="msapplication-TileColor" />
<meta name="base" content={{ config.base_url | safe }} />
<meta name="HandheldFriendly" content="True" />
<meta name="mobule-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="default" />
{% if page %} {% if page.description %}
<meta name="description" content="{{ page.description }}" />
{% elif config.description %}
<meta name="description" content="{{ config.description }}" />
{% endif %} {% elif config.description %}
<meta name="description" content="{{ config.description }}" />
{% endif %}
<title>{% block title %}{{ config.title }}{% endblock title %}</title>
<!-- main css style sheet -->
{% block css %}
<link rel="stylesheet" href="{{ get_url(path="main.css") | safe }}">
{% endblock css %}
{% endblock head %}

View file

@ -0,0 +1,68 @@
<aside class="sidebar">
<nav role="navigation" class="s-menu tree-view">
<ul class="s-menu__list tree-root">
{% block menu -%}
{% set library = get_section(path="notes/_index.md") -%}
{% for book in library.subsections -%}
{% set book_section = get_section(path=book) -%}
{% set is_book_active = current_path is starting_with(book_section.path) %}
<li class="s-menu__item tree-node">
<div class="s-menu__link-wrapper">
<button class="s-menu__toggle{% if is_book_active %} s-menu__toggle--active{% else %} collapsed{% endif %}"
data-toggle="collapse"
data-target="#book-{{ loop.index }}"
aria-expanded="{% if is_book_active %}true{% else %}false{% endif %}">
<span class="sr-only">Toggle {{ book_section.title }}</span>
</button>
<a href="{{ book_section.permalink | safe }}"
class="s-menu__link s-menu__link--book{% if is_book_active %} s-menu__link--active{% endif %}">
{{ book_section.title }}
</a>
</div>
{%- if book_section.subsections %}
<ul id="book-{{ loop.index }}"
class="s-menu__sublist tree-children collapse{% if is_book_active %} show{% endif %}">
{%- for chapter in book_section.subsections %}
{% set chapter_section = get_section(path=chapter) -%}
{% set is_chapter_active = current_path is starting_with(chapter_section.path) %}
<li class="s-menu__item tree-node">
<span class="tree-branch"></span>
<div class="s-menu__link-wrapper">
{% if chapter_section.pages %}
<button class="s-menu__toggle{% if is_chapter_active %} s-menu__toggle--active{% else %} collapsed{% endif %}"
data-toggle="collapse"
data-target="#chapter-{{ book_section.path | slugify }}-{{ loop.index }}"
aria-expanded="{% if is_chapter_active %}true{% else %}false{% endif %}">
<span class="sr-only">Toggle {{ chapter_section.title }}</span>
</button>
{% endif %}
<a href="{{ chapter_section.permalink | safe }}"
class="s-menu__link s-menu__link--chapter{% if is_chapter_active %} s-menu__link--active{% endif %}">
{{ chapter_section.title }}
</a>
</div>
{%- if chapter_section.pages %}
<ul id="chapter-{{ book_section.path | slugify }}-{{ loop.index }}"
class="s-menu__sublist tree-children collapse{% if is_chapter_active %} show{% endif %}">
{%- for page in chapter_section.pages %}
<li class="s-menu__item tree-node">
<span class="tree-branch"></span>
<a href="{{ page.permalink | safe }}"
class="s-menu__link s-menu__link--page{% if current_path == page.path %} s-menu__link--active{% endif %}">
{{ page.title }}
</a>
</li>
{%- endfor %}
</ul>
{%- endif %}
</li>
{%- endfor %}
</ul>
{%- endif %}
</li>
{%- endfor %}
{%- endblock menu %}
</ul>
</nav>
</aside>

View file

@ -0,0 +1,20 @@
{% extends "base.html" %}
{% block body %} {% set page_class="notebook-layout" %} {% endblock body %}
{% block navbar_extras %}
<button class="menu-toggle icon icon--large icon__menu"></button>
{% endblock navbar_extras %}
{% block notebook %}
<div class="notebook">
{% block notebook_menu %}
{% include "partials/notebook-menu.html" %}
{% endblock notebook_menu %}
{% block content %}
<article class="content">
<h1 class=content__title>{{ section.title | safe }}</h1>
{{ section.content | safe }}
{% endblock content %}
</article>
</div>
{% endblock notebook %}