Latest changes

v 1.03

Athena

Thrilled to announce the launch of Athena!

logspot-banner

Athena is a lightweight, educational platform for your school made with Flutter, Dart and Flutterflow. It features powerful useful integrations, and was created by the students for the students.

Features

  • Dark mode
  • Markdown support
  • TCC Integration
  • Educational Hub
  • UAE Pass & Microsoft 365 Login
  • GPA Real-time
  • Easy to use
  • IB Tools, and Resources
  • Completely static
  • Use your own logo
  • Use your own favicon
  • Frontmatter support (Dates, Authors and other metadata)
v 1.02

Code Block Syntax highlighting

Logspot also supports code syntax highlighting as well

codeblocks

// Javascriptconst url = "https://jsonplaceholder.typicode.com/posts/";async function fetchPosts() {  const response = await fetch(url);  console.log(response);}

Currently this is only supported for the following languages, to keep the bundle small for this demo.

  • JavaScript
  • CSS
  • HTML
  • Markdown
  • TypeScript
  • Vue
  • Python
  • Ruby

You can always add your own languages to the highlight array in the nuxt.config.js file.

Support for inline code blocks is also available example const name = "John Doe"

Shiki also supports different themes for codeblocks, you can learn mode about them here

v 1.00

Built in UI Components

This template also supports a few ui components that I have designed, which you can directly use within markdown.

The Icon component

Internally it uses the Iconify icons library. You can copy the icon key and just pass it as a prop like this :icon{name="ph:user-circle-duotone"}, which results in rendering the icon

Examples

  • Fluent Icons
  • Hero Icons Solid
  • Google Material Icons

The Alert component

You can also an alert component, which accepts an icon, title and description.

The alert component accepts three props, the icon(optional, defaults to the exclaimation icon), title and description.

::alert---icon: fluent:error-circle-24-regulartitle: This is alert with default variant colors.description: This will pick up colors from your primary color set in the tailwind config file. You can use this to show some kind of message to your users.---::

This is alert with default variant colors.

This will pick up colors from your primary color set in the tailwind config file. You can use this to show some kind of message to your users.

This is a simple alert with variant set as `success`.

A simple green colored alert, with a different icon.

This is an alert with variant set to `danger`.

Something aweful has happened

v 1.0.4

Widgets - Floating and overlay

widgets

Logspot provides a built in widget page, which is responsive, lightweight, minimal and easily customizable. Embed it in your website, blog, or any other website, using it as an iframe. Here is an example page which has both the floating and overlay widgets.