Changes to teatra4.scroll.pub

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

Teatra

+

Dynamic Tea Inventory Management for Frankfurt am Main

+
+
+
+
    +
    +
    +
    +
    +
    +

    Dashboard

    +
    +
    +

    Total Stock

    +

    Loading...

    +
    +
    +

    Low Stock Items

    +

    Loading...

    +
    +
    +

    Expiring Soon

    +

    Loading...

    +
    +
    +
    +
    +
    +

    Inventory Details

    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    +
    NameQuantityExpiry DateActions
    +
    +
    +
    +

    Expiry Forecast

    +
    +
    +
    +
    +
    +
    +
    +

    Teatra - Frankfurt am Main

    +
    index.scroll
    Changed around line 1
    + buildHtml
    + baseUrl https://teatra.scroll.pub
    + metaTags
    + editButton /edit.html
    + title Teatra - Dynamic Tea Inventory Management
    + style.css
    + body.html
    + script.js
    prompt.json
    Changed around line 1
    + {
    + "id": "6bc38f74-4315-46cf-9e4e-936afde32ed7",
    + "object": "chat.completion",
    + "created": 1736784762,
    + "model": "deepseek-chat",
    + "choices": [
    + {
    + "index": 0,
    + "message": {
    + "role": "assistant",
    + "content": "---domain---\nteatra.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://teatra.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Teatra - Dynamic Tea Inventory Management\nstyle.css\nbody.html\nscript.js\n---body.html---\n
    \n

    Teatra

    \n

    Dynamic Tea Inventory Management for Frankfurt am Main

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

    Dashboard

    \n
    \n
    \n

    Total Stock

    \n

    Loading...

    \n
    \n
    \n

    Low Stock Items

    \n

    Loading...

    \n
    \n
    \n

    Expiring Soon

    \n

    Loading...

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

    Inventory Details

    \n
    \n \n
    \n \n \n \n \n \n \n \n \n \n \n \n \n
    NameQuantityExpiry DateActions
    \n
    \n\n
    \n

    Expiry Forecast

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

    Teatra - Frankfurt am Main

    \n
    \n---style.css---\n:root {\n --primary-color: #4CAF50;\n --secondary-color: #388E3C;\n --background-color: #F1F8E9;\n --text-color: #2E7D32;\n --card-bg: #FFFFFF;\n --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\nbody {\n font-family: 'Segoe UI', sans-serif;\n margin: 0;\n padding: 0;\n background-color: var(--background-color);\n color: var(--text-color);\n line-height: 1.6;\n}\n\nheader {\n background: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nnav {\n background: var(--secondary-color);\n padding: 1rem;\n}\n\nnav ul {\n list-style: none;\n padding: 0;\n display: flex;\n justify-content: center;\n gap: 2rem;\n}\n\nnav a {\n color: white;\n text-decoration: none;\n font-weight: bold;\n}\n\nmain {\n padding: 2rem;\n}\n\n.stats-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));\n gap: 1rem;\n margin-bottom: 2rem;\n}\n\n.stat-card {\n background: var(--card-bg);\n padding: 1.5rem;\n border-radius: 8px;\n box-shadow: var(--shadow);\n text-align: center;\n}\n\n.search-bar {\n margin-bottom: 1rem;\n}\n\n.search-bar input {\n width: 100%;\n padding: 0.5rem;\n border: 1px solid #ddd;\n border-radius: 4px;\n}\n\ntable {\n width: 100%;\n border-collapse: collapse;\n margin-top: 1rem;\n}\n\nth, td {\n padding: 0.75rem;\n text-align: left;\n border-bottom: 1px solid #ddd;\n}\n\nth {\n background-color: var(--primary-color);\n color: white;\n}\n\n.expiry-chart {\n margin-top: 2rem;\n}\n\nfooter {\n text-align: center;\n padding: 1rem;\n background: var(--secondary-color);\n color: white;\n margin-top: 2rem;\n}\n\n@media (max-width: 768px) {\n nav ul {\n flex-direction: column;\n gap: 0.5rem;\n }\n\n .stats-grid {\n grid-template-columns: 1fr;\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n // Mock data for demonstration\n const inventoryData = [\n { name: 'Green Tea', quantity: 50, expiry: '2023-12-01' },\n { name: 'Black Tea', quantity: 30, expiry: '2023-11-15' },\n { name: 'Herbal Tea', quantity: 20, expiry: '2023-10-20' },\n { name: 'Oolong Tea', quantity: 10, expiry: '2023-09-25' }\n ];\n\n // Dashboard Stats\n const totalStock = inventoryData.reduce((sum, item) => sum + item.quantity, 0);\n const lowStockItems = inventoryData.filter(item => item.quantity < 25).length;\n const expiringSoon = inventoryData.filter(item => new Date(item.expiry) < new Date('2023-12-01')).length;\n\n document.getElementById('total-stock').textContent = totalStock;\n document.getElementById('low-stock').textContent = lowStockItems;\n document.getElementById('expiring-soon').textContent = expiringSoon;\n\n // Populate Inventory Table\n const tableBody = document.querySelector('#inventory-table tbody');\n inventoryData.forEach(item => {\n const row = document.createElement('tr');\n row.innerHTML = `\n ${item.name}\n ${item.quantity}\n ${item.expiry}\n \n `;\n tableBody.appendChild(row);\n });\n\n // Expiry Chart\n const ctx = document.getElementById('expiryChart').getContext('2d');\n new Chart(ctx, {\n type: 'line',\n data: {\n labels: inventoryData.map(item => item.name),\n datasets: [{\n label: 'Days Until Expiry',\n data: inventoryData.map(item => Math.floor((new Date(item.expiry) - new Date()) / (1000 * 60 * 60 * 24))),\n backgroundColor: 'rgba(76, 175, 80, 0.2)',\n borderColor: 'rgba(76, 175, 80, 1)',\n borderWidth: 2\n }]\n },\n options: {\n scales: {\n y: {\n beginAtZero: true\n }\n }\n }\n });\n\n // Search Functionality\n document.getElementById('search').addEventListener('input', function() {\n const searchTerm = this.value.toLowerCase();\n const rows = tableBody.querySelectorAll('tr');\n rows.forEach(row => {\n const name = row.querySelector('td').textContent.toLowerCase();\n row.style.display = name.includes(searchTerm) ? '' : 'none';\n });\n });\n});\n---end---"
    + },
    + "logprobs": null,
    + "finish_reason": "stop"
    + }
    + ],
    + "usage": {
    + "prompt_tokens": 291,
    + "completion_tokens": 1684,
    + "total_tokens": 1975,
    + "prompt_cache_hit_tokens": 0,
    + "prompt_cache_miss_tokens": 291
    + },
    + "system_fingerprint": "fp_3a5770e1b4"
    + }
    readme.scroll
    Changed around line 1
    + # teatra4.scroll.pub
    +
    + website generated by DeepSeek from prompt: I want to create a website to manage the dynamic inventory of a store that selling tea drinks in Frankfurt am Main. I want to have a dashboard and detailed information when I want to see details and change inputs, plus a section for expiry forecast, do show content for this section as well
    script.js
    Changed around line 1
    + document.addEventListener('DOMContentLoaded', function() {
    + // Mock data for demonstration
    + const inventoryData = [
    + { name: 'Green Tea', quantity: 50, expiry: '2023-12-01' },
    + { name: 'Black Tea', quantity: 30, expiry: '2023-11-15' },
    + { name: 'Herbal Tea', quantity: 20, expiry: '2023-10-20' },
    + { name: 'Oolong Tea', quantity: 10, expiry: '2023-09-25' }
    + ];
    +
    + // Dashboard Stats
    + const totalStock = inventoryData.reduce((sum, item) => sum + item.quantity, 0);
    + const lowStockItems = inventoryData.filter(item => item.quantity < 25).length;
    + const expiringSoon = inventoryData.filter(item => new Date(item.expiry) < new Date('2023-12-01')).length;
    +
    + document.getElementById('total-stock').textContent = totalStock;
    + document.getElementById('low-stock').textContent = lowStockItems;
    + document.getElementById('expiring-soon').textContent = expiringSoon;
    +
    + // Populate Inventory Table
    + const tableBody = document.querySelector('#inventory-table tbody');
    + inventoryData.forEach(item => {
    + const row = document.createElement('tr');
    + row.innerHTML = `
    + ${item.name}
    + ${item.quantity}
    + ${item.expiry}
    +
    + `;
    + tableBody.appendChild(row);
    + });
    +
    + // Expiry Chart
    + const ctx = document.getElementById('expiryChart').getContext('2d');
    + new Chart(ctx, {
    + type: 'line',
    + data: {
    + labels: inventoryData.map(item => item.name),
    + datasets: [{
    + label: 'Days Until Expiry',
    + data: inventoryData.map(item => Math.floor((new Date(item.expiry) - new Date()) / (1000 * 60 * 60 * 24))),
    + backgroundColor: 'rgba(76, 175, 80, 0.2)',
    + borderColor: 'rgba(76, 175, 80, 1)',
    + borderWidth: 2
    + }]
    + },
    + options: {
    + scales: {
    + y: {
    + beginAtZero: true
    + }
    + }
    + }
    + });
    +
    + // Search Functionality
    + document.getElementById('search').addEventListener('input', function() {
    + const searchTerm = this.value.toLowerCase();
    + const rows = tableBody.querySelectorAll('tr');
    + rows.forEach(row => {
    + const name = row.querySelector('td').textContent.toLowerCase();
    + row.style.display = name.includes(searchTerm) ? '' : 'none';
    + });
    + });
    + });
    style.css
    Changed around line 1
    + :root {
    + --primary-color: #4CAF50;
    + --secondary-color: #388E3C;
    + --background-color: #F1F8E9;
    + --text-color: #2E7D32;
    + --card-bg: #FFFFFF;
    + --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    + }
    +
    + body {
    + font-family: 'Segoe UI', sans-serif;
    + margin: 0;
    + padding: 0;
    + background-color: var(--background-color);
    + color: var(--text-color);
    + line-height: 1.6;
    + }
    +
    + header {
    + background: var(--primary-color);
    + color: white;
    + padding: 2rem;
    + text-align: center;
    + }
    +
    + nav {
    + background: var(--secondary-color);
    + padding: 1rem;
    + }
    +
    + nav ul {
    + list-style: none;
    + padding: 0;
    + display: flex;
    + justify-content: center;
    + gap: 2rem;
    + }
    +
    + nav a {
    + color: white;
    + text-decoration: none;
    + font-weight: bold;
    + }
    +
    + main {
    + padding: 2rem;
    + }
    +
    + .stats-grid {
    + display: grid;
    + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    + gap: 1rem;
    + margin-bottom: 2rem;
    + }
    +
    + .stat-card {
    + background: var(--card-bg);
    + padding: 1.5rem;
    + border-radius: 8px;
    + box-shadow: var(--shadow);
    + text-align: center;
    + }
    +
    + .search-bar {
    + margin-bottom: 1rem;
    + }
    +
    + .search-bar input {
    + width: 100%;
    + padding: 0.5rem;
    + border: 1px solid #ddd;
    + border-radius: 4px;
    + }
    +
    + table {
    + width: 100%;
    + border-collapse: collapse;
    + margin-top: 1rem;
    + }
    +
    + th, td {
    + padding: 0.75rem;
    + text-align: left;
    + border-bottom: 1px solid #ddd;
    + }
    +
    + th {
    + background-color: var(--primary-color);
    + color: white;
    + }
    +
    + .expiry-chart {
    + margin-top: 2rem;
    + }
    +
    + footer {
    + text-align: center;
    + padding: 1rem;
    + background: var(--secondary-color);
    + color: white;
    + margin-top: 2rem;
    + }
    +
    + @media (max-width: 768px) {
    + nav ul {
    + flex-direction: column;
    + gap: 0.5rem;
    + }
    +
    + .stats-grid {
    + grid-template-columns: 1fr;
    + }
    + }