Changes to red-flags.scroll.pub

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

¿Amor Verdadero?

+

Your Spanish Romance Reality Check

+
+
+
+
+

Red Flag Calculator

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

Analysis Result

+
+
+
+

+
+
+
+
+
+

Made with tough love and data science

+
+
+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://red-flags.scroll.pub
+ metaTags
+ editButton /edit.html
+ title Spanish Love Calculator - Red Flag Analysis
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "msg_015Tzq9KgKfijJ68hUR6BYku",
+ "type": "message",
+ "role": "assistant",
+ "model": "claude-3-5-sonnet-20241022",
+ "content": [
+ {
+ "type": "text",
+ "text": "---domain---\nred-flags.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://red-flags.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Spanish Love Calculator - Red Flag Analysis\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n
\n

¿Amor Verdadero?

\n

Your Spanish Romance Reality Check

\n
\n\n
\n
\n

Red Flag Calculator

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

Analysis Result

\n
\n
\n
\n

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

Made with tough love and data science

\n \n
\n\n---style.css---\n:root {\n --primary: #ff4757;\n --secondary: #2f3542;\n --accent: #ffa502;\n --background: #f1f2f6;\n --text: #2f3542;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n background: var(--background);\n color: var(--text);\n line-height: 1.6;\n}\n\nheader {\n background: linear-gradient(135deg, var(--primary), var(--accent));\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: 3rem;\n margin-bottom: 0.5rem;\n text-shadow: 2px 2px 4px rgba(0,0,0,0.2);\n}\n\n.tagline {\n font-size: 1.2rem;\n opacity: 0.9;\n}\n\nmain {\n max-width: 800px;\n margin: 2rem auto;\n padding: 0 1rem;\n}\n\n.calculator {\n background: white;\n padding: 2rem;\n border-radius: 1rem;\n box-shadow: 0 10px 20px rgba(0,0,0,0.1);\n}\n\n.question-container {\n display: grid;\n gap: 1.5rem;\n margin: 2rem 0;\n}\n\n.question {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\ninput {\n padding: 0.8rem;\n border: 2px solid #dfe4ea;\n border-radius: 0.5rem;\n font-size: 1rem;\n transition: border-color 0.3s;\n}\n\ninput:focus {\n border-color: var(--accent);\n outline: none;\n}\n\nbutton {\n width: 100%;\n padding: 1rem;\n background: var(--primary);\n color: white;\n border: none;\n border-radius: 0.5rem;\n font-size: 1.1rem;\n cursor: pointer;\n transition: transform 0.3s, background-color 0.3s;\n}\n\nbutton:hover {\n background: #ff6b81;\n transform: translateY(-2px);\n}\n\n.meter {\n height: 20px;\n background: #dfe4ea;\n border-radius: 10px;\n margin: 1rem 0;\n overflow: hidden;\n}\n\n.meter-fill {\n height: 100%;\n background: linear-gradient(90deg, #ff4757, #ff6b81);\n width: 0;\n transition: width 1s ease-in-out;\n}\n\n.result {\n margin-top: 2rem;\n padding-top: 2rem;\n border-top: 2px solid #dfe4ea;\n}\n\n.hidden {\n display: none;\n}\n\n.pulse {\n animation: pulse 2s infinite;\n}\n\n@keyframes pulse {\n 0% {\n box-shadow: 0 0 0 0 rgba(255, 71, 87, 0.4);\n }\n 70% {\n box-shadow: 0 0 0 10px rgba(255, 71, 87, 0);\n }\n 100% {\n box-shadow: 0 0 0 0 rgba(255, 71, 87, 0);\n }\n}\n\nfooter {\n text-align: center;\n padding: 2rem;\n background: var(--secondary);\n color: white;\n}\n\nfooter nav {\n margin-top: 1rem;\n}\n\nfooter a {\n color: white;\n text-decoration: none;\n margin: 0 1rem;\n}\n\nfooter a:hover {\n color: var(--accent);\n}\n\n@media (max-width: 600px) {\n h1 {\n font-size: 2rem;\n }\n \n .calculator {\n padding: 1rem;\n }\n \n .question-container {\n gap: 1rem;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const calculateBtn = document.getElementById('calculate');\n const resultDiv = document.getElementById('result');\n const meterFill = document.getElementById('meter-fill');\n const verdictText = document.getElementById('verdict');\n\n calculateBtn.addEventListener('click', () => {\n const lies = parseInt(document.getElementById('lies').value) || 0;\n const money = parseInt(document.getElementById('money').value) || 0;\n const excuses = parseInt(document.getElementById('excuses').value) || 0;\n const time = parseInt(document.getElementById('time').value) || 0;\n\n // Calculate risk score (0-100)\n let score = 0;\n score += lies * 15;\n score += money > 0 ? 40 : 0;\n score += excuses * 10;\n score -= time * 5; // Longer relationships might be more legitimate\n\n // Normalize score between 0 and 100\n score = Math.min(Math.max(score, 0), 100);\n\n // Show result\n resultDiv.classList.remove('hidden');\n meterFill.style.width = `${score}%`;\n\n // Determine verdict\n let verdict = '';\n if (score < 30) {\n verdict = \"Low risk - but stay vigilant! 🤔\";\n } else if (score < 60) {\n verdict = \"Medium risk - proceed with caution! ⚠️\";\n } else if (score < 80) {\n verdict = \"High risk - time to reconsider! 🚩\";\n } else {\n verdict = \"¡Dios mío! Run for the hills! 🏃‍♀️💨\";\n }\n\n verdictText.textContent = verdict;\n\n // Add animation\n resultDiv.style.animation = 'fadeIn 0.5s ease-in';\n \n // Scroll to result\n resultDiv.scrollIntoView({ behavior: 'smooth' });\n });\n\n // Add input validation\n document.querySelectorAll('input').forEach(input => {\n input.addEventListener('input', () => {\n if (input.value < 0) input.value = 0;\n });\n });\n});\n\n---end---"
+ }
+ ],
+ "stop_reason": "end_turn",
+ "stop_sequence": null,
+ "usage": {
+ "input_tokens": 303,
+ "cache_creation_input_tokens": 0,
+ "cache_read_input_tokens": 0,
+ "output_tokens": 2236
+ }
+ }
readme.scroll
Changed around line 1
+ # red-flags.scroll.pub
+ Website generated by Claude from prompt: Make a website helps me decide if I should continute an online relationship with an untrustworthy Spanish man. It should have some numerical tools. Be creative.
script.js
Changed around line 1
+ document.addEventListener('DOMContentLoaded', () => {
+ const calculateBtn = document.getElementById('calculate');
+ const resultDiv = document.getElementById('result');
+ const meterFill = document.getElementById('meter-fill');
+ const verdictText = document.getElementById('verdict');
+
+ calculateBtn.addEventListener('click', () => {
+ const lies = parseInt(document.getElementById('lies').value) || 0;
+ const money = parseInt(document.getElementById('money').value) || 0;
+ const excuses = parseInt(document.getElementById('excuses').value) || 0;
+ const time = parseInt(document.getElementById('time').value) || 0;
+
+ // Calculate risk score (0-100)
+ let score = 0;
+ score += lies * 15;
+ score += money > 0 ? 40 : 0;
+ score += excuses * 10;
+ score -= time * 5; // Longer relationships might be more legitimate
+
+ // Normalize score between 0 and 100
+ score = Math.min(Math.max(score, 0), 100);
+
+ // Show result
+ resultDiv.classList.remove('hidden');
+ meterFill.style.width = `${score}%`;
+
+ // Determine verdict
+ let verdict = '';
+ if (score < 30) {
+ verdict = "Low risk - but stay vigilant! 🤔";
+ } else if (score < 60) {
+ verdict = "Medium risk - proceed with caution! ⚠️";
+ } else if (score < 80) {
+ verdict = "High risk - time to reconsider! 🚩";
+ } else {
+ verdict = "¡Dios mío! Run for the hills! 🏃‍♀️💨";
+ }
+
+ verdictText.textContent = verdict;
+
+ // Add animation
+ resultDiv.style.animation = 'fadeIn 0.5s ease-in';
+
+ // Scroll to result
+ resultDiv.scrollIntoView({ behavior: 'smooth' });
+ });
+
+ // Add input validation
+ document.querySelectorAll('input').forEach(input => {
+ input.addEventListener('input', () => {
+ if (input.value < 0) input.value = 0;
+ });
+ });
+ });
style.css
Changed around line 1
+ :root {
+ --primary: #ff4757;
+ --secondary: #2f3542;
+ --accent: #ffa502;
+ --background: #f1f2f6;
+ --text: #2f3542;
+ }
+
+ * {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+ }
+
+ body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ background: var(--background);
+ color: var(--text);
+ line-height: 1.6;
+ }
+
+ header {
+ background: linear-gradient(135deg, var(--primary), var(--accent));
+ color: white;
+ padding: 2rem;
+ text-align: center;
+ box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+ }
+
+ h1 {
+ font-size: 3rem;
+ margin-bottom: 0.5rem;
+ text-shadow: 2px 2px 4px rgba(0,0,0,0.2);
+ }
+
+ .tagline {
+ font-size: 1.2rem;
+ opacity: 0.9;
+ }
+
+ main {
+ max-width: 800px;
+ margin: 2rem auto;
+ padding: 0 1rem;
+ }
+
+ .calculator {
+ background: white;
+ padding: 2rem;
+ border-radius: 1rem;
+ box-shadow: 0 10px 20px rgba(0,0,0,0.1);
+ }
+
+ .question-container {
+ display: grid;
+ gap: 1.5rem;
+ margin: 2rem 0;
+ }
+
+ .question {
+ display: flex;
+ flex-direction: column;
+ gap: 0.5rem;
+ }
+
+ input {
+ padding: 0.8rem;
+ border: 2px solid #dfe4ea;
+ border-radius: 0.5rem;
+ font-size: 1rem;
+ transition: border-color 0.3s;
+ }
+
+ input:focus {
+ border-color: var(--accent);
+ outline: none;
+ }
+
+ button {
+ width: 100%;
+ padding: 1rem;
+ background: var(--primary);
+ color: white;
+ border: none;
+ border-radius: 0.5rem;
+ font-size: 1.1rem;
+ cursor: pointer;
+ transition: transform 0.3s, background-color 0.3s;
+ }
+
+ button:hover {
+ background: #ff6b81;
+ transform: translateY(-2px);
+ }
+
+ .meter {
+ height: 20px;
+ background: #dfe4ea;
+ border-radius: 10px;
+ margin: 1rem 0;
+ overflow: hidden;
+ }
+
+ .meter-fill {
+ height: 100%;
+ background: linear-gradient(90deg, #ff4757, #ff6b81);
+ width: 0;
+ transition: width 1s ease-in-out;
+ }
+
+ .result {
+ margin-top: 2rem;
+ padding-top: 2rem;
+ border-top: 2px solid #dfe4ea;
+ }
+
+ .hidden {
+ display: none;
+ }
+
+ .pulse {
+ animation: pulse 2s infinite;
+ }
+
+ @keyframes pulse {
+ 0% {
+ box-shadow: 0 0 0 0 rgba(255, 71, 87, 0.4);
+ }
+ 70% {
+ box-shadow: 0 0 0 10px rgba(255, 71, 87, 0);
+ }
+ 100% {
+ box-shadow: 0 0 0 0 rgba(255, 71, 87, 0);
+ }
+ }
+
+ footer {
+ text-align: center;
+ padding: 2rem;
+ background: var(--secondary);
+ color: white;
+ }
+
+ footer nav {
+ margin-top: 1rem;
+ }
+
+ footer a {
+ color: white;
+ text-decoration: none;
+ margin: 0 1rem;
+ }
+
+ footer a:hover {
+ color: var(--accent);
+ }
+
+ @media (max-width: 600px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ .calculator {
+ padding: 1rem;
+ }
+
+ .question-container {
+ gap: 1rem;
+ }
+ }