Update README.md

README.md

@@ -46,11 +46,15 @@ model-index:
       type: code-generation
 ---
 
-# Hugging Face Research
+# Science Timeline
 
-The science team at Hugging Face is dedicated to advancing machine learning research in ways that maximize value for the whole community. Our work focuses on three core areas of tooling, datasets and open models.
+The org card can't display JS HTML embedded in the markdown. So the workaround is to render it in a model card (here) and export the rendered HTML. Steps:
 
-This is the release timeline so far (you can click on each element!):
+- Edit the `const releases` section in embedded HTML here with the new release data
+- Export the static HTML with the buttons below
+- If you are nice, prettify the resulting HTML
+- Copy-paste the result into the Org [README](https://huggingface.co/spaces/science/README/blob/main/README.md)
+- Tada!
 
 <style>
 body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
@@ -67,6 +71,14 @@ body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; }
 .month-box { z-index: 2; background: white; }
 </style>
 
+<!-- ADD THESE BUTTONS WHEREVER YOU WANT THEM -->
+<div style="margin: 20px 0;">
+    <button onclick="exportStaticHTML()" style="background: #007bff; color: white; border: none; padding: 10px 20px; border-radius: 6px; cursor: pointer; margin-right: 10px;">📋 Export Static HTML</button>
+    <button onclick="copyToClipboard()" style="background: #28a745; color: white; border: none; padding: 10px 20px; border-radius: 6px; cursor: pointer;">📋 Copy to Clipboard</button>
+</div>
+
+<div id="static-output" style="display: none;"></div>
+
 <div id="snake-timeline-container" style="max-width: 1000px; margin: 20px auto; padding: 20px; background: white; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);">
 Loading timeline...
 </div>
@@ -240,6 +252,35 @@ function createSnakeTimeline() {
     if (container) {
         container.innerHTML = html;
     }
+    return html;
+}
+
+// Export functions - ADD THESE TO YOUR EXISTING SCRIPT
+function exportStaticHTML() {
+    const staticHTML = createSnakeTimeline();
+    const output = document.getElementById('static-output');
+    if (!output) {
+        // Create output div if it doesn't exist
+        const outputDiv = document.createElement('div');
+        outputDiv.id = 'static-output';
+        outputDiv.style.cssText = 'background: #f8f9fa; border: 1px solid #ddd; padding: 15px; border-radius: 6px; font-family: monospace; font-size: 12px; max-height: 300px; overflow-y: auto; white-space: pre-wrap; word-break: break-all; margin-top: 15px;';
+        document.body.appendChild(outputDiv);
+    }
+    output.style.display = 'block';
+    output.textContent = `<div id="snake-timeline-container" style="max-width: 1000px; margin: 20px auto; padding: 20px; background: white; border-radius: 12px; box-shadow: 0 2px 10px rgba(0,0,0,0.1);">
+${staticHTML}
+</div>`;
+}
+
+function copyToClipboard() {
+    const output = document.getElementById('static-output');
+    if (output && output.textContent) {
+        navigator.clipboard.writeText(output.textContent).then(() => {
+            alert('✅ Static HTML copied to clipboard!');
+        });
+    } else {
+        alert('⚠️ Please export first!');
+    }
 }
 
 // Run with multiple fallbacks
@@ -251,32 +292,3 @@ if (document.readyState === 'loading') {
     createSnakeTimeline();
 }
 </script>
-
-### 🛠️ Tooling & Infrastructure
-
-The foundation of ML research is tooling and infrastructure and we are working on a range of tools such as [datatrove](www.github.com/huggingface/datatrove), [nanotron](www.github.com/huggingface/nanotron), [TRL](www.github.com/huggingface/trl), [LeRobot](www.github.com/huggingface/lerobot), and [lighteval](www.github.com/huggingface/lighteval).
-
-### 📑 Datasets
-
-High quality datasets are the powerhouse of LLMs and require special care and skills to build. We focus on building high-quality datasets such as [no-robots](https://huggingface.co/datasets/HuggingFaceH4/no_robots), [FineWeb](https://huggingface.co/datasets/HuggingFaceFW/fineweb), [The Stack](https://huggingface.co/datasets/bigcode/the-stack-v2), and [FineVideo](https://huggingface.co/datasets/HuggingFaceFV/finevideo).
-
-### 🤖 Open Models
-
-The datatsets and training recipes of most state-of-the-art models are not released. We build cutting-edge models and release the full training pipeline as well fostering more innovation and reproducibility, such as [Zephyr](https://huggingface.co/HuggingFaceH4/zephyr-7b-beta), [StarCoder2](https://huggingface.co/bigcode/starcoder2-15b), or [SmolLM2](https://huggingface.co/HuggingFaceTB/SmolLM2-1.7B-Instruct).
-
-### 🌸 Collaborations
-
-Research and collaboration go hand in hand. That's why we like to organize and participate in large open collaborations such as [BigScience](https://bigscience.huggingface.co) and [BigCode](https://www.bigcode-project.org), as well as lots of smaller partnerships such as [Leaderboards on the Hub](https://huggingface.co/blog?tag=leaderboard). 
-
-### ⚙️ Infrastructre
-
-The research team is organized in small teams with typically <4 people and the science cluster consists of 96 x 8xH100 nodes as well as an auto-scalable CPU cluster for dataset processing. In this setup, even a small research team can build and push out impactful artifacts.
-
-### 📖 Educational material
-
-Besides writing tech reports of research projects we also like to write more educational content to help newcomers get started to the field or practitioners. We built for example the [alignment handbook](https://github.com/huggingface/alignment-handbook), the [evaluation guidebook](https://github.com/huggingface/evaluation-guidebook), the [pretraining tutorial](https://www.youtube.com/watch?v=2-SPH9hIKT8), or the [FineWeb blog](https://huggingface.co/spaces/HuggingFaceFW/blogpost-fineweb-v1).
-
-### 🤗 Join us! 
-
-We are actively hiring for both full-time and internships. Check out [hf.co/jobs](https://hf.co/jobs)
-