I'm LeGDieS, developer of this project and writer in the same time.
Idea born literally from nothing, waken up with words: "Why the hell I cant write something" and so im here...
This website designated to serve as Lore for my character and initially planned as just fancy background...
But now it's serving lore, with style which I like.

"Keep moving forward; never look back. The best lies ahead. Not today, not tomorrow - but one day, you will meet what fate has prepared for you"

1. Static Asset CDN (CORS Enabled)

All core stylesheets, scripts, audio assets, and custom typography are served from the high-performance subdomain https://assets.legdies.xyz/. This CDN is configured with CORS headers (Access-Control-Allow-Origin: *) to enable range queries for media (e.g., audio files) and pixel-level operations (e.g., canvas filters).

Production CDN Integration Links:

Copy

Usage Example:

<!-- Core UI Design System CSS -->
<link rel="stylesheet" href="https://assets.legdies.xyz/css/base.css">
<link rel="stylesheet" href="https://assets.legdies.xyz/css/index.css">

<!-- Avali Scratch Typography -->
<link rel="stylesheet" href="https://assets.legdies.xyz/css/avali-scratch.css">

<!-- Interactive Components Script -->
<script src="https://assets.legdies.xyz/js/ui.js" defer></script>
      Copy

2. Global & Scoped Font Control

The system supports toggling between standard cyberpunk sans-serif (Orbitron) and the alien script representation (Avali Scratch). The active choice is automatically persisted in localStorage.

Global Toggle Function (JS API):

To apply font preference programmatically (such as during client-side SPA routing), call the globally exposed function:

// Applies active class (avali-font / orbitron-font) to all body child nodes
window.applyFontToggle();
      Copy

3. Holographic Status Blocks

Holographic blocks are the core structural elements of the layout. Applying status modifier classes adjusts the borders, text tints, and hover shadow glow properties.

HTML Implementation Structure:

<div class="holographic-block status-fine">
  <h3>Log Title</h3>
  <p>System indicators report optimal functionality.</p>
</div>
      Copy

4. Interactive Log Lists

Used to represent logs, database rows, or lists of files. They have dynamic hover transitions and scale properties.

• Log Example Item 2026-08-11 fine

HTML Implementation Structure:

<ul class="log-list">
  <li class="log-item status-error">
    <a href="#">
      <span class="log-title">Log Title</span>
      <span class="log-meta">
        <span class="log-date">2026-08-11</span>
        <span class="log-status">error</span>
      </span>
    </a>
  </li>
</ul>
      Copy

5. Guestbook Comments API Integration

The guestbook comments are served via a JSON REST API. Developers can pull logs or submit entries using the unified endpoints.

Comments Retrieval Endpoint:

GET /api/comments?page={page}

// Example GET query
fetch('/api/comments?page=1')
  .then(res => res.json())
  .then(data => {
    console.log("Current page:", data.page);
    console.log("Total pages:", data.total_pages);
    console.log("Transmissions:", data.entries);
  });
      Copy

Comment Submission Endpoint:

POST /api/comments

// Example POST query (JSON content-type)
fetch('/api/comments', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify({
    name: "Commander Nekumi",
    message: "This is a custom API transmission."
  })
})
.then(res => res.json())
.then(data => {
  if (data.success) {
    console.log("Successfully submitted:", data.entry);
  }
});
      Copy