---
layout: layouts/base.njk
title: TELOS
withSidebar: true
permalink: /telos/
---
<div class="h-feed">

  <h1 class="text-2xl sm:text-3xl font-bold text-surface-900 dark:text-surface-100 mb-2">TELOS</h1>
  <p class="text-surface-600 dark:text-surface-400 mb-6 sm:mb-8">
    Life-OS: Orientierung, Werte, Rahmungen, Reflexionen.
  </p>

  {% set telosPosts = [] %}
  {% for post in collections.posts %}
    {% if post.data.category | categoryMatches("telos") %}
      {% set telosPosts = (telosPosts.push(post), telosPosts) %}
    {% endif %}
  {% endfor %}

  {% if telosPosts.length > 0 %}
  <p class="text-sm text-surface-600 dark:text-surface-400 mb-4">{{ telosPosts.length }} post{% if telosPosts.length != 1 %}s{% endif %}</p>
  <ul class="post-list">
    {% for post in telosPosts %}
    {% set postType = post.inputPath | replace("./content/", "") %}
    {% set postType = postType.split("/")[0] %}
    {% if postType == "likes" %}
      {% set borderClass = "border-l-[3px] border-l-red-400 dark:border-l-red-500" %}
    {% elif postType == "bookmarks" %}
      {% set borderClass = "border-l-[3px] border-l-amber-400 dark:border-l-amber-500" %}
    {% elif postType == "replies" %}
      {% set borderClass = "border-l-[3px] border-l-accent-400 dark:border-l-accent-500" %}
    {% else %}
      {% set borderClass = "border-l-[3px] border-l-surface-300 dark:border-l-surface-600" %}
    {% endif %}
    <li class="h-entry post-card {{ borderClass }}">
      <div class="post-header">
        <h2 class="text-xl font-semibold mb-1 flex-1">
          <a class="p-name u-url text-surface-900 dark:text-surface-100 hover:text-accent-700 dark:hover:text-accent-300" href="{{ post.url }}">
            {{ post.data.title or post.templateContent | striptags | truncate(60) or "Untitled" }}
          </a>
        </h2>
      </div>
      <div class="post-meta mt-2">
        <time class="dt-published font-mono text-sm" datetime="{{ post.date | isoDate }}">
          {{ post.date | dateDisplay }}
        </time>
        <span class="post-type">{{ postType }}</span>
      </div>
      <p class="p-summary text-surface-700 dark:text-surface-300 mt-3">
        {{ post.templateContent | striptags | truncate(250) }}
      </p>
      <a href="{{ post.url }}" class="text-sm text-accent-700 dark:text-accent-300 hover:underline mt-3 inline-block">
        View &rarr;
      </a>
    </li>
    {% endfor %}
  </ul>
  {% else %}
  <div class="p-4 bg-surface-100 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700">
    <p class="text-surface-600 dark:text-surface-400 text-sm">
      Noch keine Posts mit der Kategorie <code>telos</code>. Posts über Indiekit mit <code>category: telos</code> veröffentlichen.
    </p>
  </div>
  {% endif %}

</div>