BetterLectio

A browser extension that modernizes Lectio, the Danish school management system.

Features • Installation • Development • Tech Stack

---

Features

• Modern Sidebar — Clean navigation with collapsible sections for schedules and changes
• Fast Search — Quickly find students, teachers, rooms, and classes with keyboard shortcuts (Cmd/Ctrl+K)
• Smart Prefetching — Pages load instantly using Speculation Rules API and hover prefetching
• Improved Messages — Two-column layout with folder tree, auto-redirects to newest messages
• Profile Pictures — Click to enlarge any profile picture to full size
• Skeleton Loading — Smooth transitions with no flash of unstyled content
• Cross-Page Profiles — Your profile stays visible when viewing other students' schedules

Installation

  

From Source

1. Clone this repository
2. Run bun install to install dependencies
3. Run bun run build for Chrome or bun run build:firefox for Firefox
4. Load the extension:
   • Chrome: Go to chrome://extensions, enable Developer mode, click "Load unpacked" and select .output/chrome-mv3
   • Firefox: Go to about:debugging, click "This Firefox", click "Load Temporary Add-on" and select any file in .output/firefox-mv2

Development

Prerequisites

• Bun (recommended) or Node.js

Commands

# Install dependencies
bun install

# Start development server
bun run dev          # Chrome
bun run dev:firefox  # Firefox

# Build for production
bun run build          # Chrome
bun run build:firefox  # Firefox

# Package for distribution
bun run zip          # Chrome
bun run zip:firefox  # Firefox

Tech Stack

Technology	Purpose
WXT	Browser extension framework
Preact	Lightweight React alternative (3KB)
TypeScript	Type safety
Tailwind CSS	Utility-first styling
shadcn/ui	UI component system
Radix UI	Accessible primitives

Browser Support

Browser	Status
Chrome	Supported (Manifest V3)
Firefox	Supported (Manifest V2)
Edge	Should work (untested)

Acknowledgements

Name inspired by BetterLectio.

License

MIT