Changes to salaryratio1.scroll.pub

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

Israeli Salary Ratio Calculator

+

Visualize the ratio between gross and net salary in Israel

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

Net to Gross Ratio: 0.00

+
+
+
+
+

How it works

+

This calculator shows the relationship between your gross salary and net salary in Israel. The ratio is calculated based on standard Israeli tax brackets and social security deductions.

+
+
+
+
+

Disclaimer: This is an estimation tool. Actual net salary may vary based on individual circumstances.

+
index.scroll
Changed around line 1
+ buildHtml
+ baseUrl https://salaryratio.scroll.pub
+ metaTags
+ editButton /edit.html
+ title Israeli Salary Ratio Calculator
+ style.css
+ body.html
+ script.js
prompt.json
Changed around line 1
+ {
+ "id": "890ee2a4-794f-4233-bbf6-4c3d03d7febc",
+ "object": "chat.completion",
+ "created": 1735376049,
+ "model": "deepseek-chat",
+ "choices": [
+ {
+ "index": 0,
+ "message": {
+ "role": "assistant",
+ "content": "---domain---\nsalaryratio.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://salaryratio.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Israeli Salary Ratio Calculator\nstyle.css\nbody.html\nscript.js\n---body.html---\n
\n

Israeli Salary Ratio Calculator

\n

Visualize the ratio between gross and net salary in Israel

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

Net to Gross Ratio: 0.00

\n
\n
\n\n
\n

How it works

\n

This calculator shows the relationship between your gross salary and net salary in Israel. The ratio is calculated based on standard Israeli tax brackets and social security deductions.

\n
\n
\n\n
\n

Disclaimer: This is an estimation tool. Actual net salary may vary based on individual circumstances.

\n
\n---style.css---\n:root {\n --primary-color: #2c3e50;\n --secondary-color: #3498db;\n --background-color: #f5f6fa;\n --text-color: #2c3e50;\n --chart-color-1: #3498db;\n --chart-color-2: #2ecc71;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n background-color: var(--background-color);\n color: var(--text-color);\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n}\n\nheader {\n background: var(--primary-color);\n color: white;\n padding: 2rem 1rem;\n text-align: center;\n}\n\nh1 {\n margin: 0;\n font-size: 2.5rem;\n}\n\nmain {\n flex: 1;\n padding: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n width: 100%;\n}\n\n.input-section {\n display: flex;\n flex-wrap: wrap;\n gap: 1rem;\n justify-content: center;\n margin-bottom: 2rem;\n}\n\ninput[type=\"number\"] {\n padding: 0.8rem;\n border: 2px solid var(--secondary-color);\n border-radius: 8px;\n font-size: 1rem;\n width: 200px;\n}\n\nbutton {\n background: var(--secondary-color);\n color: white;\n border: none;\n padding: 0.8rem 1.5rem;\n border-radius: 8px;\n cursor: pointer;\n font-size: 1rem;\n transition: background 0.3s ease;\n}\n\nbutton:hover {\n background: #2980b9;\n}\n\n.chart-section {\n background: white;\n padding: 2rem;\n border-radius: 12px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n margin-bottom: 2rem;\n}\n\n.chart-container {\n max-width: 800px;\n margin: 0 auto;\n}\n\n.ratio-display {\n text-align: center;\n margin-top: 2rem;\n}\n\n.ratio-display h2 {\n color: var(--primary-color);\n}\n\n#ratioValue {\n color: var(--chart-color-2);\n font-weight: bold;\n}\n\n.explanation {\n background: white;\n padding: 2rem;\n border-radius: 12px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\nfooter {\n background: var(--primary-color);\n color: white;\n text-align: center;\n padding: 1rem;\n margin-top: auto;\n}\n\n@media (max-width: 768px) {\n h1 {\n font-size: 2rem;\n }\n \n .input-section {\n flex-direction: column;\n align-items: center;\n }\n \n .chart-container {\n max-width: 100%;\n }\n}\n---script.js---\nfunction calculateNetSalary(gross) {\n // Simplified Israeli tax calculation\n const taxBrackets = [\n { min: 0, max: 6790, rate: 0.10 },\n { min: 6791, max: 9730, rate: 0.14 },\n { min: 9731, max: 15620, rate: 0.20 },\n { min: 15621, max: 21710, rate: 0.31 },\n { min: 21711, max: 45180, rate: 0.35 },\n { min: 45181, max: Infinity, rate: 0.47 }\n ];\n \n let tax = 0;\n for (const bracket of taxBrackets) {\n if (gross > bracket.min) {\n const taxableAmount = Math.min(gross, bracket.max) - bracket.min;\n tax += taxableAmount * bracket.rate;\n }\n }\n \n // Social security and health tax (12%)\n const socialTax = gross * 0.12;\n \n const net = gross - tax - socialTax;\n return Math.max(0, net);\n}\n\nfunction updateChart(gross, net) {\n const ctx = document.getElementById('salaryChart').getContext('2d');\n \n if (window.myChart) {\n window.myChart.destroy();\n }\n \n window.myChart = new Chart(ctx, {\n type: 'doughnut',\n data: {\n labels: ['Gross Salary', 'Net Salary'],\n datasets: [{\n data: [gross, net],\n backgroundColor: [\n 'rgba(52, 152, 219, 0.8)',\n 'rgba(46, 204, 113, 0.8)'\n ],\n borderWidth: 0\n }]\n },\n options: {\n responsive: true,\n maintainAspectRatio: false,\n plugins: {\n legend: {\n position: 'bottom',\n labels: {\n font: {\n size: 14\n }\n }\n },\n tooltip: {\n callbacks: {\n label: function(context) {\n return `${context.label}: ₪${context.raw.toLocaleString()}`;\n }\n }\n }\n }\n }\n });\n}\n\ndocument.getElementById('calculateBtn').addEventListener('click', function() {\n const gross = parseFloat(document.getElementById('grossSalary').value);\n if (isNaN(gross) || gross <= 0) {\n alert('Please enter a valid gross salary');\n return;\n }\n \n const net = calculateNetSalary(gross);\n const ratio = (net / gross).toFixed(2);\n \n document.getElementById('ratioValue').textContent = ratio;\n updateChart(gross, net);\n});\n---end---"
+ },
+ "logprobs": null,
+ "finish_reason": "stop"
+ }
+ ],
+ "usage": {
+ "prompt_tokens": 275,
+ "completion_tokens": 1633,
+ "total_tokens": 1908,
+ "prompt_cache_hit_tokens": 0,
+ "prompt_cache_miss_tokens": 275
+ },
+ "system_fingerprint": "fp_f1afce2943"
+ }
readme.scroll
Changed around line 1
+ # salaryratio1.scroll.pub
+ Website generated by DeepSeek from prompt: I want a website that will show me the ratio between Israeli gross salary and net salary using charts and nice graphics, please use numerical tools and be creative please design the website to look very freshy and clear.
script.js
Changed around line 1
+ function calculateNetSalary(gross) {
+ // Simplified Israeli tax calculation
+ const taxBrackets = [
+ { min: 0, max: 6790, rate: 0.10 },
+ { min: 6791, max: 9730, rate: 0.14 },
+ { min: 9731, max: 15620, rate: 0.20 },
+ { min: 15621, max: 21710, rate: 0.31 },
+ { min: 21711, max: 45180, rate: 0.35 },
+ { min: 45181, max: Infinity, rate: 0.47 }
+ ];
+
+ let tax = 0;
+ for (const bracket of taxBrackets) {
+ if (gross > bracket.min) {
+ const taxableAmount = Math.min(gross, bracket.max) - bracket.min;
+ tax += taxableAmount * bracket.rate;
+ }
+ }
+
+ // Social security and health tax (12%)
+ const socialTax = gross * 0.12;
+
+ const net = gross - tax - socialTax;
+ return Math.max(0, net);
+ }
+
+ function updateChart(gross, net) {
+ const ctx = document.getElementById('salaryChart').getContext('2d');
+
+ if (window.myChart) {
+ window.myChart.destroy();
+ }
+
+ window.myChart = new Chart(ctx, {
+ type: 'doughnut',
+ data: {
+ labels: ['Gross Salary', 'Net Salary'],
+ datasets: [{
+ data: [gross, net],
+ backgroundColor: [
+ 'rgba(52, 152, 219, 0.8)',
+ 'rgba(46, 204, 113, 0.8)'
+ ],
+ borderWidth: 0
+ }]
+ },
+ options: {
+ responsive: true,
+ maintainAspectRatio: false,
+ plugins: {
+ legend: {
+ position: 'bottom',
+ labels: {
+ font: {
+ size: 14
+ }
+ }
+ },
+ tooltip: {
+ callbacks: {
+ label: function(context) {
+ return `${context.label}: ₪${context.raw.toLocaleString()}`;
+ }
+ }
+ }
+ }
+ }
+ });
+ }
+
+ document.getElementById('calculateBtn').addEventListener('click', function() {
+ const gross = parseFloat(document.getElementById('grossSalary').value);
+ if (isNaN(gross) || gross <= 0) {
+ alert('Please enter a valid gross salary');
+ return;
+ }
+
+ const net = calculateNetSalary(gross);
+ const ratio = (net / gross).toFixed(2);
+
+ document.getElementById('ratioValue').textContent = ratio;
+ updateChart(gross, net);
+ });
style.css
Changed around line 1
+ :root {
+ --primary-color: #2c3e50;
+ --secondary-color: #3498db;
+ --background-color: #f5f6fa;
+ --text-color: #2c3e50;
+ --chart-color-1: #3498db;
+ --chart-color-2: #2ecc71;
+ }
+
+ body {
+ font-family: 'Segoe UI', system-ui, sans-serif;
+ line-height: 1.6;
+ margin: 0;
+ padding: 0;
+ background-color: var(--background-color);
+ color: var(--text-color);
+ min-height: 100vh;
+ display: flex;
+ flex-direction: column;
+ }
+
+ header {
+ background: var(--primary-color);
+ color: white;
+ padding: 2rem 1rem;
+ text-align: center;
+ }
+
+ h1 {
+ margin: 0;
+ font-size: 2.5rem;
+ }
+
+ main {
+ flex: 1;
+ padding: 2rem;
+ max-width: 1200px;
+ margin: 0 auto;
+ width: 100%;
+ }
+
+ .input-section {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 1rem;
+ justify-content: center;
+ margin-bottom: 2rem;
+ }
+
+ input[type="number"] {
+ padding: 0.8rem;
+ border: 2px solid var(--secondary-color);
+ border-radius: 8px;
+ font-size: 1rem;
+ width: 200px;
+ }
+
+ button {
+ background: var(--secondary-color);
+ color: white;
+ border: none;
+ padding: 0.8rem 1.5rem;
+ border-radius: 8px;
+ cursor: pointer;
+ font-size: 1rem;
+ transition: background 0.3s ease;
+ }
+
+ button:hover {
+ background: #2980b9;
+ }
+
+ .chart-section {
+ background: white;
+ padding: 2rem;
+ border-radius: 12px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+ margin-bottom: 2rem;
+ }
+
+ .chart-container {
+ max-width: 800px;
+ margin: 0 auto;
+ }
+
+ .ratio-display {
+ text-align: center;
+ margin-top: 2rem;
+ }
+
+ .ratio-display h2 {
+ color: var(--primary-color);
+ }
+
+ #ratioValue {
+ color: var(--chart-color-2);
+ font-weight: bold;
+ }
+
+ .explanation {
+ background: white;
+ padding: 2rem;
+ border-radius: 12px;
+ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+ }
+
+ footer {
+ background: var(--primary-color);
+ color: white;
+ text-align: center;
+ padding: 1rem;
+ margin-top: auto;
+ }
+
+ @media (max-width: 768px) {
+ h1 {
+ font-size: 2rem;
+ }
+
+ .input-section {
+ flex-direction: column;
+ align-items: center;
+ }
+
+ .chart-container {
+ max-width: 100%;
+ }
+ }