commit c95479d5abc46faa85a1572b78def67924777fab
Author: root <root@hub.scroll.pub> Date: 2024-12-29 06:13:23 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..83520a0 --- /dev/null +++ b/body.html @@ -0,0 +1,70 @@ +<header> + <h1>Academic to Adult Content Career Calculator</h1> + <p class="tagline">Make an informed decision about your career path</p> +</header> + +<main> + <section class="calculator"> + <h2>Financial Comparison Calculator</h2> + <div class="input-group"> + <div class="input-field"> + <label for="stipend">Current PhD Stipend ($/year)</label> + <input type="number" id="stipend" value="30000"> + </div> + <div class="input-field"> + <label for="subscribers">Estimated OnlyFans Subscribers</label> + <input type="number" id="subscribers" value="100"> + </div> + <div class="input-field"> + <label for="subscription">Monthly Subscription Price ($)</label> + <input type="number" id="subscription" value="9.99"> + </div> + </div> + <button id="calculate">Calculate Potential Earnings</button> + <div id="result" class="result"></div> + </section> + + <section class="pros-cons"> + <h2>Decision Matrix</h2> + <div class="matrix-container"> + <div class="matrix-column phd"> + <h3>PhD Career</h3> + <ul> + <li>Academic prestige</li> + <li>Research impact</li> + <li>Job security</li> + <li>Teaching opportunities</li> + </ul> + </div> + <div class="matrix-column of"> + <h3>OnlyFans Career</h3> + <ul> + <li>Flexible schedule</li> + <li>Location independence</li> + <li>Creative control</li> + <li>Immediate income</li> + </ul> + </div> + </div> + </section> + + <section class="decision-meter"> + <h2>Career Satisfaction Predictor</h2> + <div class="slider-container"> + <label for="work-life">Work-Life Balance Importance</label> + <input type="range" id="work-life" min="0" max="100" value="50"> + + <label for="income">Income Priority</label> + <input type="range" id="income" min="0" max="100" value="50"> + + <label for="prestige">Professional Prestige Importance</label> + <input type="range" id="prestige" min="0" max="100" value="50"> + </div> + <div id="recommendation" class="recommendation"></div> + </section> +</main> + +<footer> + <p>Made with humor and data-driven decisions</p> + <p>This is a satirical tool. Please make career decisions wisely.</p> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..08398d6 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://phdonlyfans.scroll.pub +metaTags +editButton /edit.html +title PhD vs OnlyFans Career Calculator +style.css +body.html +script.js diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..8a93d65 --- /dev/null +++ b/prompt.json @@ -0,0 +1,20 @@ +{ + "id": "msg_01PHk46ygbW9SuaDiPPmFDR9", + "type": "message", + "role": "assistant", + "model": "claude-3-5-sonnet-20241022", + "content": [ + { + "type": "text", + "text": "I'll help create a website for this unique career decision calculator. Here's a playful but professional domain name that captures the essence:\n\n---domain---\nphdonlyfans.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://phdonlyfans.scroll.pub\nmetaTags\neditButton /edit.html\ntitle PhD vs OnlyFans Career Calculator\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header>\n <h1>Academic to Adult Content Career Calculator</h1>\n <p class=\"tagline\">Make an informed decision about your career path</p>\n</header>\n\n<main>\n <section class=\"calculator\">\n <h2>Financial Comparison Calculator</h2>\n <div class=\"input-group\">\n <div class=\"input-field\">\n <label for=\"stipend\">Current PhD Stipend ($/year)</label>\n <input type=\"number\" id=\"stipend\" value=\"30000\">\n </div>\n <div class=\"input-field\">\n <label for=\"subscribers\">Estimated OnlyFans Subscribers</label>\n <input type=\"number\" id=\"subscribers\" value=\"100\">\n </div>\n <div class=\"input-field\">\n <label for=\"subscription\">Monthly Subscription Price ($)</label>\n <input type=\"number\" id=\"subscription\" value=\"9.99\">\n </div>\n </div>\n <button id=\"calculate\">Calculate Potential Earnings</button>\n <div id=\"result\" class=\"result\"></div>\n </section>\n\n <section class=\"pros-cons\">\n <h2>Decision Matrix</h2>\n <div class=\"matrix-container\">\n <div class=\"matrix-column phd\">\n <h3>PhD Career</h3>\n <ul>\n <li>Academic prestige</li>\n <li>Research impact</li>\n <li>Job security</li>\n <li>Teaching opportunities</li>\n </ul>\n </div>\n <div class=\"matrix-column of\">\n <h3>OnlyFans Career</h3>\n <ul>\n <li>Flexible schedule</li>\n <li>Location independence</li>\n <li>Creative control</li>\n <li>Immediate income</li>\n </ul>\n </div>\n </div>\n </section>\n\n <section class=\"decision-meter\">\n <h2>Career Satisfaction Predictor</h2>\n <div class=\"slider-container\">\n <label for=\"work-life\">Work-Life Balance Importance</label>\n <input type=\"range\" id=\"work-life\" min=\"0\" max=\"100\" value=\"50\">\n \n <label for=\"income\">Income Priority</label>\n <input type=\"range\" id=\"income\" min=\"0\" max=\"100\" value=\"50\">\n \n <label for=\"prestige\">Professional Prestige Importance</label>\n <input type=\"range\" id=\"prestige\" min=\"0\" max=\"100\" value=\"50\">\n </div>\n <div id=\"recommendation\" class=\"recommendation\"></div>\n </section>\n</main>\n\n<footer>\n <p>Made with humor and data-driven decisions</p>\n <p>This is a satirical tool. Please make career decisions wisely.</p>\n</footer>\n\n---style.css---\n:root {\n --primary: #6b48ff;\n --secondary: #ff4898;\n --background: #fafafa;\n --text: #2c2c2c;\n --gradient: linear-gradient(135deg, var(--primary), var(--secondary));\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif;\n line-height: 1.6;\n color: var(--text);\n background: var(--background);\n}\n\nheader {\n background: var(--gradient);\n color: white;\n padding: 3rem 1rem;\n text-align: center;\n box-shadow: 0 4px 12px rgba(0,0,0,0.1);\n}\n\nmain {\n max-width: 1200px;\n margin: 0 auto;\n padding: 2rem;\n}\n\nsection {\n background: white;\n border-radius: 12px;\n padding: 2rem;\n margin-bottom: 2rem;\n box-shadow: 0 2px 8px rgba(0,0,0,0.05);\n transition: transform 0.3s ease;\n}\n\nsection:hover {\n transform: translateY(-2px);\n}\n\nh1, h2, h3 {\n line-height: 1.2;\n}\n\n.input-group {\n display: grid;\n gap: 1.5rem;\n margin: 1.5rem 0;\n}\n\n.input-field {\n display: flex;\n flex-direction: column;\n gap: 0.5rem;\n}\n\ninput[type=\"number\"] {\n padding: 0.8rem;\n border: 2px solid #eee;\n border-radius: 6px;\n font-size: 1rem;\n}\n\nbutton {\n background: var(--gradient);\n color: white;\n border: none;\n padding: 1rem 2rem;\n border-radius: 6px;\n cursor: pointer;\n font-size: 1rem;\n width: 100%;\n transition: opacity 0.3s ease;\n}\n\nbutton:hover {\n opacity: 0.9;\n}\n\n.result, .recommendation {\n margin-top: 1.5rem;\n padding: 1rem;\n border-radius: 6px;\n background: #f0f0f0;\n}\n\n.matrix-container {\n display: grid;\n grid-template-columns: 1fr 1fr;\n gap: 2rem;\n margin-top: 1.5rem;\n}\n\n.matrix-column ul {\n list-style: none;\n margin-top: 1rem;\n}\n\n.matrix-column li {\n padding: 0.5rem 0;\n border-bottom: 1px solid #eee;\n}\n\n.slider-container {\n display: grid;\n gap: 1.5rem;\n margin: 1.5rem 0;\n}\n\ninput[type=\"range\"] {\n width: 100%;\n height: 8px;\n border-radius: 4px;\n background: #eee;\n outline: none;\n}\n\nfooter {\n text-align: center;\n padding: 2rem;\n background: #f0f0f0;\n margin-top: 3rem;\n}\n\n@media (max-width: 768px) {\n .matrix-container {\n grid-template-columns: 1fr;\n }\n \n .input-group {\n grid-template-columns: 1fr;\n }\n \n section {\n padding: 1.5rem;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n const calculateBtn = document.getElementById('calculate');\n const sliders = document.querySelectorAll('input[type=\"range\"]');\n \n calculateBtn.addEventListener('click', calculateEarnings);\n sliders.forEach(slider => slider.addEventListener('input', updateRecommendation));\n \n function calculateEarnings() {\n const stipend = parseFloat(document.getElementById('stipend').value);\n const subscribers = parseFloat(document.getElementById('subscribers').value);\n const subscription = parseFloat(document.getElementById('subscription').value);\n \n const yearlyOnlyFans = subscribers * subscription * 12 * 0.8; // 80% after platform fees\n const resultDiv = document.getElementById('result');\n \n resultDiv.innerHTML = `\n <h3>Annual Earnings Comparison</h3>\n <p>PhD Stipend: $${stipend.toLocaleString()}</p>\n <p>Potential OnlyFans: $${yearlyOnlyFans.toLocaleString()}</p>\n <p>Difference: $${(yearlyOnlyFans - stipend).toLocaleString()}</p>\n `;\n \n resultDiv.style.animation = 'fadeIn 0.5s ease';\n }\n \n function updateRecommendation() {\n const workLife = parseInt(document.getElementById('work-life').value);\n const income = parseInt(document.getElementById('income').value);\n const prestige = parseInt(document.getElementById('prestige').value);\n \n const phdScore = (prestige * 0.4) + (workLife * 0.3) + (income * 0.3);\n const ofScore = (income * 0.5) + (workLife * 0.4) + (prestige * 0.1);\n \n const recommendationDiv = document.getElementById('recommendation');\n const phdPercentage = (phdScore / (phdScore + ofScore) * 100).toFixed(1);\n const ofPercentage = (ofScore / (phdScore + ofScore) * 100).toFixed(1);\n \n recommendationDiv.innerHTML = `\n <h3>Career Match Analysis</h3>\n <p>PhD Compatibility: ${phdPercentage}%</p>\n <p>OnlyFans Compatibility: ${ofPercentage}%</p>\n <p><strong>${phdScore > ofScore ? 'Stick with your PhD!' : 'Consider the career change!'}</strong></p>\n `;\n }\n});\n\n@keyframes fadeIn {\n from { opacity: 0; transform: translateY(10px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n---end---\n\nThis website features:\n- A financial comparison calculator\n- A decision matrix comparing both careers\n- An interactive career satisfaction predictor with sliders\n- Responsive design with beautiful gradients and animations\n- Professional yet playful tone\n- Clear and accessible UI elements\n- Smooth transitions and hover effects\n- Data-driven decision making tools\n- Mobile-friendly layout\n- Modern glassmorphism-inspired design elements\n\nThe site maintains professionalism while addressing a potentially controversial topic with humor and practical tools for decision-making." + } + ], + "stop_reason": "end_turn", + "stop_sequence": null, + "usage": { + "input_tokens": 308, + "cache_creation_input_tokens": 0, + "cache_read_input_tokens": 0, + "output_tokens": 2599 + } +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..6d1d927 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# phdonlyfans2.scroll.pub +Website generated by Claude from prompt: I want a website that will help me decide if I should drop out of my PhD program to do Only Fans. So it should have Some numerical tools and interactivity. Be creative. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..d76111d --- /dev/null +++ b/script.js @@ -0,0 +1,50 @@ +document.addEventListener('DOMContentLoaded', function() { + const calculateBtn = document.getElementById('calculate'); + const sliders = document.querySelectorAll('input[type="range"]'); + + calculateBtn.addEventListener('click', calculateEarnings); + sliders.forEach(slider => slider.addEventListener('input', updateRecommendation)); + + function calculateEarnings() { + const stipend = parseFloat(document.getElementById('stipend').value); + const subscribers = parseFloat(document.getElementById('subscribers').value); + const subscription = parseFloat(document.getElementById('subscription').value); + + const yearlyOnlyFans = subscribers * subscription * 12 * 0.8; // 80% after platform fees + const resultDiv = document.getElementById('result'); + + resultDiv.innerHTML = ` + <h3>Annual Earnings Comparison</h3> + <p>PhD Stipend: $${stipend.toLocaleString()}</p> + <p>Potential OnlyFans: $${yearlyOnlyFans.toLocaleString()}</p> + <p>Difference: $${(yearlyOnlyFans - stipend).toLocaleString()}</p> + `; + + resultDiv.style.animation = 'fadeIn 0.5s ease'; + } + + function updateRecommendation() { + const workLife = parseInt(document.getElementById('work-life').value); + const income = parseInt(document.getElementById('income').value); + const prestige = parseInt(document.getElementById('prestige').value); + + const phdScore = (prestige * 0.4) + (workLife * 0.3) + (income * 0.3); + const ofScore = (income * 0.5) + (workLife * 0.4) + (prestige * 0.1); + + const recommendationDiv = document.getElementById('recommendation'); + const phdPercentage = (phdScore / (phdScore + ofScore) * 100).toFixed(1); + const ofPercentage = (ofScore / (phdScore + ofScore) * 100).toFixed(1); + + recommendationDiv.innerHTML = ` + <h3>Career Match Analysis</h3> + <p>PhD Compatibility: ${phdPercentage}%</p> + <p>OnlyFans Compatibility: ${ofPercentage}%</p> + <p><strong>${phdScore > ofScore ? 'Stick with your PhD!' : 'Consider the career change!'}</strong></p> + `; + } +}); + +@keyframes fadeIn { + from { opacity: 0; transform: translateY(10px); } + to { opacity: 1; transform: translateY(0); } +} diff --git a/style.css b/style.css new file mode 100644 index 0000000..79050d4 --- /dev/null +++ b/style.css @@ -0,0 +1,145 @@ +:root { + --primary: #6b48ff; + --secondary: #ff4898; + --background: #fafafa; + --text: #2c2c2c; + --gradient: linear-gradient(135deg, var(--primary), var(--secondary)); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif; + line-height: 1.6; + color: var(--text); + background: var(--background); +} + +header { + background: var(--gradient); + color: white; + padding: 3rem 1rem; + text-align: center; + box-shadow: 0 4px 12px rgba(0,0,0,0.1); +} + +main { + max-width: 1200px; + margin: 0 auto; + padding: 2rem; +} + +section { + background: white; + border-radius: 12px; + padding: 2rem; + margin-bottom: 2rem; + box-shadow: 0 2px 8px rgba(0,0,0,0.05); + transition: transform 0.3s ease; +} + +section:hover { + transform: translateY(-2px); +} + +h1, h2, h3 { + line-height: 1.2; +} + +.input-group { + display: grid; + gap: 1.5rem; + margin: 1.5rem 0; +} + +.input-field { + display: flex; + flex-direction: column; + gap: 0.5rem; +} + +input[type="number"] { + padding: 0.8rem; + border: 2px solid #eee; + border-radius: 6px; + font-size: 1rem; +} + +button { + background: var(--gradient); + color: white; + border: none; + padding: 1rem 2rem; + border-radius: 6px; + cursor: pointer; + font-size: 1rem; + width: 100%; + transition: opacity 0.3s ease; +} + +button:hover { + opacity: 0.9; +} + +.result, .recommendation { + margin-top: 1.5rem; + padding: 1rem; + border-radius: 6px; + background: #f0f0f0; +} + +.matrix-container { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 2rem; + margin-top: 1.5rem; +} + +.matrix-column ul { + list-style: none; + margin-top: 1rem; +} + +.matrix-column li { + padding: 0.5rem 0; + border-bottom: 1px solid #eee; +} + +.slider-container { + display: grid; + gap: 1.5rem; + margin: 1.5rem 0; +} + +input[type="range"] { + width: 100%; + height: 8px; + border-radius: 4px; + background: #eee; + outline: none; +} + +footer { + text-align: center; + padding: 2rem; + background: #f0f0f0; + margin-top: 3rem; +} + +@media (max-width: 768px) { + .matrix-container { + grid-template-columns: 1fr; + } + + .input-group { + grid-template-columns: 1fr; + } + + section { + padding: 1.5rem; + } +}