Changes to twitwrap.scroll.pub

root
root
26 days ago
Initial commit
body.html
Changed around line 1
+
+

Your Twitter Wrapped 2024

+

Discover your year on Twitter in a beautiful, interactive way.

+
+
+
+
+

Connect Your Twitter

+
+

We only read your public data. Your privacy is important to us.

+
+
+
+

Your 2024 Twitter Stats

+
+
+

Tweets

+

0

+
+
+

Likes

+

0

+
+
+

Retweets

+

0

+
+
+

Top Hashtag

+

#none

+
+
+
+
+
+
+
+
+
+

Made with ❤️ by TwitWrap

+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://twitwrap.scroll.pub
+ metaTags
+ editButton /edit.html
+ title Twitter Wrapped 2024
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "dc74e216-975a-4d26-975d-390cdb00bc13",
+ "object": "chat.completion",
+ "created": 1735323277,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\ntwitwrap.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://twitwrap.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Twitter Wrapped 2024\nstyle.css\nbody.html\nscript.js\n---body.html---\n
\n

Your Twitter Wrapped 2024

\n

Discover your year on Twitter in a beautiful, interactive way.

\n
\n\n
\n
\n

Connect Your Twitter

\n \n

We only read your public data. Your privacy is important to us.

\n
\n\n
\n

Your 2024 Twitter Stats

\n
\n
\n

Tweets

\n

0

\n
\n
\n

Likes

\n

0

\n
\n
\n

Retweets

\n

0

\n
\n
\n

Top Hashtag

\n

#none

\n
\n
\n
\n \n
\n
\n
\n\n
\n

Made with ❤️ by TwitWrap

\n
\n---style.css---\n:root {\n --primary: #1da1f2;\n --background: #f5f8fa;\n --text: #14171a;\n --card-bg: #ffffff;\n --shadow: 0 2px 4px rgba(0,0,0,0.1);\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n background: var(--background);\n color: var(--text);\n margin: 0;\n padding: 2rem;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n align-items: center;\n}\n\nheader {\n text-align: center;\n margin-bottom: 2rem;\n}\n\nh1 {\n color: var(--primary);\n font-size: 2.5rem;\n margin-bottom: 0.5rem;\n}\n\n#connect {\n background: var(--card-bg);\n padding: 2rem;\n border-radius: 1rem;\n box-shadow: var(--shadow);\n text-align: center;\n max-width: 400px;\n width: 100%;\n}\n\n#connectButton {\n background: var(--primary);\n color: white;\n border: none;\n padding: 1rem 2rem;\n border-radius: 2rem;\n font-size: 1rem;\n cursor: pointer;\n transition: transform 0.2s ease;\n}\n\n#connectButton:hover {\n transform: scale(1.05);\n}\n\n.disclaimer {\n font-size: 0.8rem;\n color: #657786;\n margin-top: 1rem;\n}\n\n#results {\n width: 100%;\n max-width: 800px;\n margin-top: 2rem;\n}\n\n.stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n gap: 1rem;\n margin-bottom: 2rem;\n}\n\n.stat {\n background: var(--card-bg);\n padding: 1rem;\n border-radius: 0.5rem;\n box-shadow: var(--shadow);\n text-align: center;\n}\n\n.stat h3 {\n color: var(--primary);\n margin-bottom: 0.5rem;\n}\n\n.stat p {\n font-size: 1.5rem;\n font-weight: bold;\n}\n\n.chart-container {\n background: var(--card-bg);\n padding: 1rem;\n border-radius: 0.5rem;\n box-shadow: var(--shadow);\n}\n\nfooter {\n margin-top: auto;\n padding: 2rem 0;\n color: #657786;\n}\n\n.hidden {\n display: none;\n}\n\n@media (max-width: 600px) {\n h1 {\n font-size: 2rem;\n }\n \n .stats-grid {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const connectButton = document.getElementById('connectButton');\n const resultsSection = document.getElementById('results');\n \n // Mock data for demonstration\n const mockData = {\n tweets: 1245,\n likes: 5678,\n retweets: 1234,\n topHashtag: '#TwitterWrapped'\n };\n\n connectButton.addEventListener('click', () => {\n // Simulate API call\n setTimeout(() => {\n // Update stats\n document.getElementById('tweetCount').textContent = mockData.tweets;\n document.getElementById('likeCount').textContent = mockData.likes;\n document.getElementById('retweetCount').textContent = mockData.retweets;\n document.getElementById('topHashtag').textContent = mockData.topHashtag;\n\n // Show results\n resultsSection.classList.remove('hidden');\n\n // Initialize chart\n const ctx = document.getElementById('activityChart').getContext('2d');\n new Chart(ctx, {\n type: 'line',\n data: {\n labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n datasets: [{\n label: 'Tweets',\n data: [120, 150, 130, 140, 160, 170, 180, 190, 200, 210, 220, 230],\n borderColor: '#1da1f2',\n fill: false\n }]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n beginAtZero: true\n }\n }\n }\n });\n }, 1000);\n });\n});\n---end---"
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 250,
+ "completion_tokens": 1427,
+ "total_tokens": 1677,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 250
+ },
+ "system_fingerprint": "fp_f1afce2943"
+ }
readme.scroll
Changed around line 1
+ # twitwrap.scroll.pub
+ Website generated by DeepSeek from prompt: make a website which can give me my twitter wrapped for the year 2024
script.js
Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const connectButton = document.getElementById('connectButton');
+ const resultsSection = document.getElementById('results');
+
+ // Mock data for demonstration
+ const mockData = {
+ tweets: 1245,
+ likes: 5678,
+ retweets: 1234,
+ topHashtag: '#TwitterWrapped'
+ };
+
+ connectButton.addEventListener('click', () => {
+ // Simulate API call
+ setTimeout(() => {
+ // Update stats
+ document.getElementById('tweetCount').textContent = mockData.tweets;
+ document.getElementById('likeCount').textContent = mockData.likes;
+ document.getElementById('retweetCount').textContent = mockData.retweets;
+ document.getElementById('topHashtag').textContent = mockData.topHashtag;
+
+ // Show results
+ resultsSection.classList.remove('hidden');
+
+ // Initialize chart
+ const ctx = document.getElementById('activityChart').getContext('2d');
+ new Chart(ctx, {
+ type: 'line',
+ data: {
+ labels: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],
+ datasets: [{
+ label: 'Tweets',
+ data: [120, 150, 130, 140, 160, 170, 180, 190, 200, 210, 220, 230],
+ borderColor: '#1da1f2',
+ fill: false
+ }]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ scales: {
+ y: {
+ beginAtZero: true
+ }
+ }
+ }
+ });
+ }, 1000);
+ });
+ });
style.css
Changed around line 1
+ :root {
+ --primary: #1da1f2;
+ --background: #f5f8fa;
+ --text: #14171a;
+ --card-bg: #ffffff;
+ --shadow: 0 2px 4px rgba(0,0,0,0.1);
+ }
+
+ body {
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+ background: var(--background);
+ color: var(--text);
+ margin: 0;
+ padding: 2rem;
+ min-height: 100vh;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ }
+
+ header {
+ text-align: center;
+ margin-bottom: 2rem;
+ }
+
+ h1 {
+ color: var(--primary);
+ font-size: 2.5rem;
+ margin-bottom: 0.5rem;
+ }
+
+ #connect {
+ background: var(--card-bg);
+ padding: 2rem;
+ border-radius: 1rem;
+ box-shadow: var(--shadow);
+ text-align: center;
+ max-width: 400px;
+ width: 100%;
+ }
+
+ #connectButton {
+ background: var(--primary);
+ color: white;
+ border: none;
+ padding: 1rem 2rem;
+ border-radius: 2rem;
+ font-size: 1rem;
+ cursor: pointer;
+ transition: transform 0.2s ease;
+ }
+
+ #connectButton:hover {
+ transform: scale(1.05);
+ }
+
+ .disclaimer {
+ font-size: 0.8rem;
+ color: #657786;
+ margin-top: 1rem;
+ }
+
+ #results {
+ width: 100%;
+ max-width: 800px;
+ margin-top: 2rem;
+ }
+
+ .stats-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
+ gap: 1rem;
+ margin-bottom: 2rem;
+ }
+
+ .stat {
+ background: var(--card-bg);
+ padding: 1rem;
+ border-radius: 0.5rem;
+ box-shadow: var(--shadow);
+ text-align: center;
+ }
+
+ .stat h3 {
+ color: var(--primary);
+ margin-bottom: 0.5rem;
+ }
+
+ .stat p {
+ font-size: 1.5rem;
+ font-weight: bold;
+ }
+
+ .chart-container {
+ background: var(--card-bg);
+ padding: 1rem;
+ border-radius: 0.5rem;
+ box-shadow: var(--shadow);
+ }
+
+ footer {
+ margin-top: auto;
+ padding: 2rem 0;
+ color: #657786;
+ }
+
+ .hidden {
+ display: none;
+ }
+
+ @media (max-width: 600px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ .stats-grid {
+ grid-template-columns: repeat(2, 1fr);
+ }
+ }