Why Scroll?
Simple Syntax
Like Markdown, but more powerful. No parentheses needed.
Extendible
Build your own custom parsers.
Beautiful Output
Create stunning documents with minimal effort.
Fast & Light
Built on the efficient PPS Stack.
Prompt: website
Agent: claude
Model: claude-3-5-sonnet-20241022
Crée une application web inspiré de macOS Notes, avec : Volet gauche (Sidebar) : Style minimaliste Apple (bordures légères, coins arrondis, padding généreux). Liste verticale des snippets (nom + aperçu sur 2 lignes). Bouton + Nouveau snippet en haut (icône "+" avec libellé). États visuels : Hover, Selected (couleur d’accent type bleu macOS). Volet droit principal : Barre d'outils supérieure : Titre du snippet (éditable). Bouton Play (icône ▶️ style macOS, couleur verte au hover). Sélecteur de langage (JS/TS/Markdown). Éditeur de code : Style VS Code (thème sombre par défaut, numéros de ligne, highlight de syntaxe). Tabulation : 2 espaces, police MonoLisa ou Fira Code. Console de sortie : Section en bas avec onglets "Console" / "Résultat". Style terminal (fond noir, texte vert/rouge pour erreurs). Détails visuels : Palette de couleurs : Gris clair (#F5F5F7) / Noir (#1E1E1E), accent bleu (#007AFF). Espacements : 16px entre les volets, 8px entre les éléments. Typographie : SF Pro Display pour l'UI, monospace pour le code. Icônes : Style Apple (lignes fines, remplissage au hover).
You are an expert web developer. Create a website based on this request: "Crée une application web inspiré de macOS Notes, avec : Volet gauche (Sidebar) : Style minimaliste Apple (bordures légères, coins arrondis, padding généreux). Liste verticale des snippets (nom + aperçu sur 2 lignes). Bouton + Nouveau snippet en haut (icône "+" avec libellé). États visuels : Hover, Selected (couleur d’accent type bleu macOS). Volet droit principal : Barre d'outils supérieure : Titre du snippet (éditable). Bouton Play (icône ▶️ style macOS, couleur verte au hover). Sélecteur de langage (JS/TS/Markdown). Éditeur de code : Style VS Code (thème sombre par défaut, numéros de ligne, highlight de syntaxe). Tabulation : 2 espaces, police MonoLisa ou Fira Code. Console de sortie : Section en bas avec onglets "Console" / "Résultat". Style terminal (fond noir, texte vert/rouge pour erreurs). Détails visuels : Palette de couleurs : Gris clair (#F5F5F7) / Noir (#1E1E1E), accent bleu (#007AFF). Espacements : 16px entre les volets, 8px entre les éléments. Typographie : SF Pro Display pour l'UI, monospace pour le code. Icônes : Style Apple (lignes fines, remplissage au hover)."
Requirements:
As a refresher, for doing the html body, Scroll is a whitespace based language that uses a single indented space to mark a line (aka particle) as a subparticle of a parent line.
For example:
The extendible markup language that makes source beautiful and compiles to anything
Get StartedLike Markdown, but more powerful. No parentheses needed.
Build your own custom parsers.
Create stunning documents with minimal effort.
Built on the efficient PPS Stack.
First suggest a short, memorable domain name ending in scroll.pub that represents this website. Then provide the website files. Use this exact format:
---domain---
(domainscroll.pub here)
---index.scroll---
(body content here. no blank lines please.)
---style.css---
(CSS content here)
---script.js---
(JavaScript content here)
---end---