concepts.scroll
Changed around line 1
+ measures.parsers
+
+ id Gypsum
+ temperature 1200
+ duration 120
+ costScore 3
+ toxicity false
+ application Building walls and ceilings
+
+ id Intumescent
+ temperature 650
+ duration 180
+ costScore 6
+ toxicity false
+ application Structural steel protection
+
+ id Mineral_Wool
+ temperature 1000
+ duration 240
+ costScore 4
+ toxicity false
+ application Insulation and cavity barriers
+
+ id Vermiculite
+ temperature 1100
+ duration 180
+ costScore 5
+ toxicity false
+ application Spray-applied fireproofing
+
+ id Fireproof_Glass
+ temperature 900
+ duration 120
+ costScore 8
+ toxicity false
+ application Windows and doors
index.scroll
Changed around line 1
+ title Fireproofing Materials Database
+ header.scroll
+
+ # Fireproofing Materials Knowledge Base
+
+ Welcome to the comprehensive database of fireproofing materials and their properties. This resource provides detailed information about various fire-resistant materials used in construction and industry.
+
+ ## Understanding the Metrics
+
+ - Temperature: Maximum temperature resistance (°C)
+ - Duration: Fire resistance period (minutes)
+ - Cost Score: Relative cost rating (1-10)
+ - Toxicity: Presence of toxic fumes when heated
+ - Application: Primary use case
+
+ concepts.scroll
+ concepts
+ printTable
+
+ footer.scroll
measures.parsers
Changed around line 1
+ idParser
+ extends abstractIdParser
+ temperatureParser
+ extends abstractIntegerMeasureParser
+ description Maximum temperature resistance in degrees Celsius
+ durationParser
+ extends abstractIntegerMeasureParser
+ description How long the material maintains fire resistance in minutes
+ costScoreParser
+ extends abstractIntegerMeasureParser
+ description Cost rating from 1-10 (1 being least expensive, 10 being most expensive)
+ toxicityParser
+ extends abstractBooleanMeasureParser
+ description Whether the material produces toxic fumes when heated
+ applicationParser
+ extends abstractStringMeasureParser
+ description Primary application or use case
prompt.json
Changed around line 1
+ {
+ "id": "msg_01C719ubEKBz2pwN8J6ZXghz",
+ "type": "message",
+ "role": "assistant",
+ "model": "claude-3-5-sonnet-20241022",
+ "content": [
+ {
+ "type": "text",
+ "text": "I'll help create a knowledge base about fireproofing materials and techniques.\n\n---domain---\nfireproof.scroll.pub\n\n---measures.parsers---\nidParser\n extends abstractIdParser\ntemperatureParser\n extends abstractIntegerMeasureParser\n description Maximum temperature resistance in degrees Celsius\ndurationParser\n extends abstractIntegerMeasureParser\n description How long the material maintains fire resistance in minutes\ncostScoreParser\n extends abstractIntegerMeasureParser\n description Cost rating from 1-10 (1 being least expensive, 10 being most expensive)\ntoxicityParser\n extends abstractBooleanMeasureParser\n description Whether the material produces toxic fumes when heated\napplicationParser\n extends abstractStringMeasureParser\n description Primary application or use case\n\n---concepts.scroll---\nmeasures.parsers\n\nid Gypsum\ntemperature 1200\nduration 120\ncostScore 3\ntoxicity false\napplication Building walls and ceilings\n\nid Intumescent\ntemperature 650\nduration 180\ncostScore 6\ntoxicity false\napplication Structural steel protection\n\nid Mineral_Wool\ntemperature 1000\nduration 240\ncostScore 4\ntoxicity false\napplication Insulation and cavity barriers\n\nid Vermiculite\ntemperature 1100\nduration 180\ncostScore 5\ntoxicity false\napplication Spray-applied fireproofing\n\nid Fireproof_Glass\ntemperature 900\nduration 120\ncostScore 8\ntoxicity false\napplication Windows and doors\n\n---index.scroll---\ntitle Fireproofing Materials Database\nheader.scroll\n\n# Fireproofing Materials Knowledge Base\n\nWelcome to the comprehensive database of fireproofing materials and their properties. This resource provides detailed information about various fire-resistant materials used in construction and industry.\n\n## Understanding the Metrics\n\n- Temperature: Maximum temperature resistance (°C)\n- Duration: Fire resistance period (minutes)\n- Cost Score: Relative cost rating (1-10)\n- Toxicity: Presence of toxic fumes when heated\n- Application: Primary use case\n\nconcepts.scroll\nconcepts\n printTable\n\nfooter.scroll\n\n---style.css---\n:root {\n --primary: #d64545;\n --secondary: #2b2d42;\n --background: #f8f9fa;\n --text: #2b2d42;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background: var(--background);\n color: var(--text);\n}\n\n.header {\n background: linear-gradient(135deg, var(--primary), var(--secondary));\n color: white;\n padding: 2rem;\n text-align: center;\n box-shadow: 0 4px 6px rgba(0,0,0,0.1);\n}\n\nh1 {\n font-size: 2.5rem;\n margin: 0;\n background: linear-gradient(45deg, #fff, #f0f0f0);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n margin: 2rem 0;\n background: white;\n border-radius: 10px;\n overflow: hidden;\n box-shadow: 0 0 20px rgba(0,0,0,0.1);\n}\n\nth, td {\n padding: 1rem;\n text-align: left;\n border-bottom: 1px solid #eee;\n}\n\nth {\n background: var(--secondary);\n color: white;\n}\n\ntr:hover {\n background: #f5f5f5;\n}\n\n@media (max-width: 768px) {\n table {\n display: block;\n overflow-x: auto;\n }\n \n th, td {\n padding: 0.5rem;\n }\n \n h1 {\n font-size: 1.8rem;\n }\n}\n\n.container {\n max-width: 1200px;\n margin: 0 auto;\n padding: 2rem;\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n // Add smooth scrolling\n document.querySelectorAll('a[href^=\"#\"]').forEach(anchor => {\n anchor.addEventListener('click', function (e) {\n e.preventDefault();\n document.querySelector(this.getAttribute('href')).scrollIntoView({\n behavior: 'smooth'\n });\n });\n });\n \n // Add table row hover effect\n const tableRows = document.querySelectorAll('tr');\n tableRows.forEach(row => {\n row.addEventListener('mouseenter', () => {\n row.style.transform = 'scale(1.01)';\n row.style.transition = 'transform 0.2s ease';\n });\n row.addEventListener('mouseleave', () => {\n row.style.transform = 'scale(1)';\n });\n });\n});\n\n---end---"
+ }
+ ],
+ "stop_reason": "end_turn",
+ "stop_sequence": null,
+ "usage": {
+ "input_tokens": 696,
+ "cache_creation_input_tokens": 0,
+ "cache_read_input_tokens": 0,
+ "output_tokens": 1260
+ }
+ }
readme.scroll
Changed around line 1
+ # fireproof1.scroll.pub
+
+ Prompt: database
+ Agent: claude
+ Model: claude-3-5-sonnet-20241022
+
+ ## User prompt
+ fireproof
+
+ ## System prompt
+ You are an expert web, scroll, and knowledge base developer. Create a knowledge base using ScrollSets based on this request: "fireproof"
+
+ ScrollSets use the Particles, Parsers, and Scroll stack to define measures, and then encode concepts using those measures.
+
+ For example:
+
+ ---measures.parsers---
+ idParser
+ extends abstractIdParser
+ organismParser
+ extends abstractStringMeasureParser
+ description The organism name mainly associated with the organelle such as human, plant, whale, etc.
+ diameterParser
+ extends abstractIntegerMeasureParser
+ description The diameter of the organelle in nanometers
+ lowParser
+ extends abstractIntegerMeasureParser
+ description For cells that have this kind of organelle, how many are usually found on the low end?
+ medianParser
+ extends abstractIntegerMeasureParser
+ description For cells that have this kind of organelle, how many are usually found in the median?
+ highParser
+ extends abstractIntegerMeasureParser
+ description For cells that have this kind of organelle, how many are usually found on the high end?
+
+ ---concepts.scroll---
+ measures.parsers
+
+ id Mitochondria
+ organism human
+ diameter 1000
+ low 200
+ median 500
+ high 2000
+
+ id Chloroplast
+ organism plant
+ diameter 6000
+ low 20
+ median 40
+ high 100
+
+ id Nucleus
+ organism human
+ diameter 6000
+ low 1
+ median 1
+ high 2
+
+ ---
+
+ Requirements:
+ - Create 5 - 7 measures. The most important things about this topic.
+ - Write 5 concepts. The most important concepts in this topic.
+ - Build a nice homepage iterating over the data.
+ - Use only Scroll, CSS, and JavaScript (NO frameworks, NO external dependencies)
+ - Create clean, semantic HTML5
+ - Make it mobile-responsive
+ - Follow modern best practices and accessibility guidelines
+ - Keep it simple but professional
+ - Use only relative links and no external resources
+ - Do not put a copyright symbol or all rights reserved in the footer.
+ - Make it beautiful. Dazzling. Advanced used of CSS.
+
+ 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)
+ ---measures.parsers---
+ (put measures here)
+ ---concepts.scroll---
+ (put concepts here)
+ ---index.scroll---
+ title (database title here)
+ header.scroll
+ (content here)
+ concepts.scroll
+ concepts
+ printTable
+ footer.scroll
+ ---header.scroll---
+ importOnly
+ buildHtml
+ homeButton
+ metaTags
+ editButton
+ editBaseUrl /edit.html?folderName=(domainscroll.pub here)&fileName=
+ metaTags
+ style.css
+ script.js
+ ---footer.scroll---
+ importOnly
+ center
+ scrollVersionLink
+ ---style.css---
+ (CSS content here)
+ ---script.js---
+ (JavaScript content here)
+ ---end---
script.js
Changed around line 1
+ document.addEventListener('DOMContentLoaded', function() {
+ // Add smooth scrolling
+ document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+ anchor.addEventListener('click', function (e) {
+ e.preventDefault();
+ document.querySelector(this.getAttribute('href')).scrollIntoView({
+ behavior: 'smooth'
+ });
+ });
+ });
+
+ // Add table row hover effect
+ const tableRows = document.querySelectorAll('tr');
+ tableRows.forEach(row => {
+ row.addEventListener('mouseenter', () => {
+ row.style.transform = 'scale(1.01)';
+ row.style.transition = 'transform 0.2s ease';
+ });
+ row.addEventListener('mouseleave', () => {
+ row.style.transform = 'scale(1)';
+ });
+ });
+ });
style.css
Changed around line 1
+ :root {
+ --primary: #d64545;
+ --secondary: #2b2d42;
+ --background: #f8f9fa;
+ --text: #2b2d42;
+ }
+
+ body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ line-height: 1.6;
+ margin: 0;
+ padding: 0;
+ background: var(--background);
+ color: var(--text);
+ }
+
+ .header {
+ background: linear-gradient(135deg, var(--primary), var(--secondary));
+ color: white;
+ padding: 2rem;
+ text-align: center;
+ box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+ }
+
+ h1 {
+ font-size: 2.5rem;
+ margin: 0;
+ background: linear-gradient(45deg, #fff, #f0f0f0);
+ -webkit-background-clip: text;
+ -webkit-text-fill-color: transparent;
+ }
+
+ table {
+ width: 100%;
+ border-collapse: collapse;
+ margin: 2rem 0;
+ background: white;
+ border-radius: 10px;
+ overflow: hidden;
+ box-shadow: 0 0 20px rgba(0,0,0,0.1);
+ }
+
+ th, td {
+ padding: 1rem;
+ text-align: left;
+ border-bottom: 1px solid #eee;
+ }
+
+ th {
+ background: var(--secondary);
+ color: white;
+ }
+
+ tr:hover {
+ background: #f5f5f5;
+ }
+
+ @media (max-width: 768px) {
+ table {
+ display: block;
+ overflow-x: auto;
+ }
+
+ th, td {
+ padding: 0.5rem;
+ }
+
+ h1 {
+ font-size: 1.8rem;
+ }
+ }
+
+ .container {
+ max-width: 1200px;
+ margin: 0 auto;
+ padding: 2rem;
+ }