index.scroll
Changed around line 1
+ title Memecoins: From Doge to Moon 🚀
+ description A visual journey through the wild world of meme cryptocurrencies
+ scrollstyle
+ scrollscript
+
+ slideshow
+ # Memecoins 101 🪙
+ From jokes to billions
+ ***
+ # What are Memecoins? 🤔
+ Digital currencies inspired by memes, jokes, and internet culture
+ ***
+ # The OG: Dogecoin 🐕
+ Started as a joke in 2013
+ Now worth billions
+ Much wow!
+ ***
+ # The Memecoin Explosion 💥
+ - Shiba Inu
+ - Pepe
+ - Floki
+ And hundreds more...
+ ***
+ # Why Do People Buy Them? 🎯
+ - FOMO
+ - Community
+ - Potential gains
+ - The memes!
+ ***
+ # The Risks ⚠️
+ - High volatility
+ - Many fail
+ - Limited use cases
+ - DYOR!
+ ***
+ # The Future 🔮
+ Will memecoins change finance
+ or remain internet culture artifacts?
+ ***
+ # Remember 🧠
+ Never invest more than
+ you can afford to lose!
+ ****
prompt.json
Changed around line 1
+ {
+ "id": "msg_01T6y3inX1ZbsK9ngbdESAYM",
+ "type": "message",
+ "role": "assistant",
+ "model": "claude-3-5-sonnet-20241022",
+ "content": [
+ {
+ "type": "text",
+ "text": "I'll create a fun and informative slideshow about memecoins with modern design elements.\n\n---domain---\nmemecoin.scroll.pub\n---index.scroll---\ntitle Memecoins: From Doge to Moon 🚀\ndescription A visual journey through the wild world of meme cryptocurrencies\nscrollstyle\nscrollscript\n\nslideshow\n# Memecoins 101 🪙\nFrom jokes to billions\n***\n# What are Memecoins? 🤔\nDigital currencies inspired by memes, jokes, and internet culture\n***\n# The OG: Dogecoin 🐕\nStarted as a joke in 2013\nNow worth billions\nMuch wow!\n***\n# The Memecoin Explosion 💥\n- Shiba Inu\n- Pepe\n- Floki\nAnd hundreds more...\n***\n# Why Do People Buy Them? 🎯\n- FOMO\n- Community\n- Potential gains\n- The memes!\n***\n# The Risks ⚠️\n- High volatility\n- Many fail\n- Limited use cases\n- DYOR!\n***\n# The Future 🔮\nWill memecoins change finance\nor remain internet culture artifacts?\n***\n# Remember 🧠\nNever invest more than\nyou can afford to lose!\n****\n---style.css---\n:root {\n --primary: #FF6B6B;\n --secondary: #4ECDC4;\n --dark: #2C3E50;\n --light: #ECF0F1;\n}\n\nbody {\n background: linear-gradient(135deg, var(--dark), #1a1a1a);\n color: var(--light);\n font-family: 'Segoe UI', system-ui, sans-serif;\n margin: 0;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n\n.slideshowSlide {\n text-align: center;\n padding: 2rem;\n background: rgba(255, 255, 255, 0.1);\n border-radius: 20px;\n backdrop-filter: blur(10px);\n box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);\n margin: 2rem;\n max-width: 90vw;\n min-height: 60vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n transform: translateZ(0);\n transition: all 0.3s ease;\n}\n\n.slideshowSlide:hover {\n transform: translateY(-5px);\n box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);\n}\n\nh1 {\n font-size: 2.5rem;\n margin-bottom: 1.5rem;\n background: linear-gradient(45deg, var(--primary), var(--secondary));\n -webkit-background-clip: text;\n background-clip: text;\n color: transparent;\n font-weight: 800;\n}\n\nul {\n list-style: none;\n padding: 0;\n font-size: 1.5rem;\n line-height: 2;\n}\n\n.slideshowNav {\n position: fixed;\n bottom: 2rem;\n left: 0;\n right: 0;\n display: flex;\n justify-content: center;\n gap: 1rem;\n z-index: 100;\n}\n\n.slideshowNav a {\n color: var(--light);\n font-size: 2rem;\n padding: 0.5rem 1rem;\n border-radius: 50px;\n background: rgba(255, 255, 255, 0.1);\n backdrop-filter: blur(5px);\n transition: all 0.3s ease;\n}\n\n.slideshowNav a:hover {\n background: var(--primary);\n transform: scale(1.1);\n}\n\n@media (max-width: 768px) {\n .slideshowSlide {\n padding: 1rem;\n margin: 1rem;\n min-height: 70vh;\n }\n\n h1 {\n font-size: 1.8rem;\n }\n\n ul {\n font-size: 1.2rem;\n }\n}\n\n@keyframes fadeIn {\n from { opacity: 0; transform: translateY(20px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n.slideshowSlide {\n animation: fadeIn 0.5s ease-out;\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const slides = document.querySelectorAll('.slideshowSlide');\n \n slides.forEach(slide => {\n slide.addEventListener('touchstart', handleTouchStart, false);\n slide.addEventListener('touchmove', handleTouchMove, false);\n });\n\n let xDown = null;\n let yDown = null;\n\n function handleTouchStart(evt) {\n xDown = evt.touches[0].clientX;\n yDown = evt.touches[0].clientY;\n }\n\n function handleTouchMove(evt) {\n if (!xDown || !yDown) return;\n\n let xUp = evt.touches[0].clientX;\n let yUp = evt.touches[0].clientY;\n\n let xDiff = xDown - xUp;\n let yDiff = yDown - yUp;\n\n if (Math.abs(xDiff) > Math.abs(yDiff)) {\n if (xDiff > 0) {\n document.querySelector('.slideshowNav .next')?.click();\n } else {\n document.querySelector('.slideshowNav .prev')?.click();\n }\n }\n\n xDown = null;\n yDown = null;\n }\n});\n---end---\n\nThis slideshow features:\n- Modern glassmorphism design\n- Smooth animations and transitions\n- Mobile-responsive layout\n- Touch swipe support for mobile devices\n- Gradient text effects\n- Interactive hover states\n- Accessibility-friendly contrast and text sizes\n- Clean, professional aesthetic with a crypto/tech feel\n- Engaging visual hierarchy\n- Smooth performance with hardware acceleration\n\nThe content is concise yet informative, with a touch of humor while maintaining professionalism. The design uses a dark theme with vibrant accents that's easy on the eyes and creates visual interest."
+ }
+ ],
+ "stop_reason": "end_turn",
+ "stop_sequence": null,
+ "usage": {
+ "input_tokens": 639,
+ "cache_creation_input_tokens": 0,
+ "cache_read_input_tokens": 0,
+ "output_tokens": 1639
+ }
+ }
readme.scroll
Changed around line 1
+ # memecoin.scroll.pub
+
+ slideshow generated by Claude from prompt: a slideshow about memecoins
script.js
Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const slides = document.querySelectorAll('.slideshowSlide');
+
+ slides.forEach(slide => {
+ slide.addEventListener('touchstart', handleTouchStart, false);
+ slide.addEventListener('touchmove', handleTouchMove, false);
+ });
+
+ let xDown = null;
+ let yDown = null;
+
+ function handleTouchStart(evt) {
+ xDown = evt.touches[0].clientX;
+ yDown = evt.touches[0].clientY;
+ }
+
+ function handleTouchMove(evt) {
+ if (!xDown || !yDown) return;
+
+ let xUp = evt.touches[0].clientX;
+ let yUp = evt.touches[0].clientY;
+
+ let xDiff = xDown - xUp;
+ let yDiff = yDown - yUp;
+
+ if (Math.abs(xDiff) > Math.abs(yDiff)) {
+ if (xDiff > 0) {
+ document.querySelector('.slideshowNav .next')?.click();
+ } else {
+ document.querySelector('.slideshowNav .prev')?.click();
+ }
+ }
+
+ xDown = null;
+ yDown = null;
+ }
+ });
style.css
Changed around line 1
+ :root {
+ --primary: #FF6B6B;
+ --secondary: #4ECDC4;
+ --dark: #2C3E50;
+ --light: #ECF0F1;
+ }
+
+ body {
+ background: linear-gradient(135deg, var(--dark), #1a1a1a);
+ color: var(--light);
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ margin: 0;
+ min-height: 100vh;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .slideshowSlide {
+ text-align: center;
+ padding: 2rem;
+ background: rgba(255, 255, 255, 0.1);
+ border-radius: 20px;
+ backdrop-filter: blur(10px);
+ box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
+ margin: 2rem;
+ max-width: 90vw;
+ min-height: 60vh;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ transform: translateZ(0);
+ transition: all 0.3s ease;
+ }
+
+ .slideshowSlide:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.2);
+ }
+
+ h1 {
+ font-size: 2.5rem;
+ margin-bottom: 1.5rem;
+ background: linear-gradient(45deg, var(--primary), var(--secondary));
+ -webkit-background-clip: text;
+ background-clip: text;
+ color: transparent;
+ font-weight: 800;
+ }
+
+ ul {
+ list-style: none;
+ padding: 0;
+ font-size: 1.5rem;
+ line-height: 2;
+ }
+
+ .slideshowNav {
+ position: fixed;
+ bottom: 2rem;
+ left: 0;
+ right: 0;
+ display: flex;
+ justify-content: center;
+ gap: 1rem;
+ z-index: 100;
+ }
+
+ .slideshowNav a {
+ color: var(--light);
+ font-size: 2rem;
+ padding: 0.5rem 1rem;
+ border-radius: 50px;
+ background: rgba(255, 255, 255, 0.1);
+ backdrop-filter: blur(5px);
+ transition: all 0.3s ease;
+ }
+
+ .slideshowNav a:hover {
+ background: var(--primary);
+ transform: scale(1.1);
+ }
+
+ @media (max-width: 768px) {
+ .slideshowSlide {
+ padding: 1rem;
+ margin: 1rem;
+ min-height: 70vh;
+ }
+
+ h1 {
+ font-size: 1.8rem;
+ }
+
+ ul {
+ font-size: 1.2rem;
+ }
+ }
+
+ @keyframes fadeIn {
+ from { opacity: 0; transform: translateY(20px); }
+ to { opacity: 1; transform: translateY(0); }
+ }
+
+ .slideshowSlide {
+ animation: fadeIn 0.5s ease-out;
+ }