commit efc0c2f2c7a9f4bbe03cec3cc97b6ca92af767c8 Author: Fabio Date: Sun Dec 28 11:38:21 2025 +0100 first commit diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..7677172 --- /dev/null +++ b/.gitignore @@ -0,0 +1,41 @@ +# Node +node_modules/ +npm-debug.log* +yarn-debug.log* +yarn-error.log* +pnpm-debug.log* + +# Build output +dist/ +build/ +out/ +.tmp/ +.temp/ + +# Capacitor / Cordova +android/ +ios/ +www/ + +# Environment files +.env +.env.* +!.env.example + +# System files +.DS_Store +Thumbs.db + +# Editor folders +.vscode/ +.idea/ + +# Logs +*.log + +# Cache +.cache/ +.parcel-cache/ +.next/ +.nuxt/ +.svelte-kit/ diff --git a/README.md b/README.md new file mode 100644 index 0000000..edf8a8a --- /dev/null +++ b/README.md @@ -0,0 +1,2 @@ + +npx http-server . diff --git a/app.js b/app.js new file mode 100644 index 0000000..109599c --- /dev/null +++ b/app.js @@ -0,0 +1,19 @@ +async function loadApps() { + const container = document.getElementById("folder"); + const apps = await fetch("apps.json").then(r => r.json()); + + apps.forEach(app => { + const div = document.createElement("div"); + div.className = "app-icon"; + div.onclick = () => window.open(app.url, "_blank", "noopener,noreferrer"); + + div.innerHTML = ` + ${app.name} + ${app.name} + `; + + container.appendChild(div); + }); +} + +loadApps(); diff --git a/apps.json b/apps.json new file mode 100644 index 0000000..7839add --- /dev/null +++ b/apps.json @@ -0,0 +1,12 @@ +[ + { + "name": "Google", + "icon": "icons/google.png", + "url": "https://google.com" + }, + { + "name": "GitHub", + "icon": "icons/github.png", + "url": "https://github.com" + } +] diff --git a/icons/github.png b/icons/github.png new file mode 100644 index 0000000..bc37b5c Binary files /dev/null and b/icons/github.png differ diff --git a/icons/google.png b/icons/google.png new file mode 100644 index 0000000..1f90b36 Binary files /dev/null and b/icons/google.png differ diff --git a/index.html b/index.html new file mode 100644 index 0000000..2b77246 --- /dev/null +++ b/index.html @@ -0,0 +1,12 @@ + + + + + Folder style macOS + + + +
+ + + diff --git a/style.css b/style.css new file mode 100644 index 0000000..fd874c4 --- /dev/null +++ b/style.css @@ -0,0 +1,42 @@ +body { + background: #1e1e1e; + font-family: system-ui, -apple-system, BlinkMacSystemFont, sans-serif; + color: #f5f5f5; +} + +.folder { + display: grid; + grid-template-columns: repeat(auto-fill, 100px); + gap: 24px; + padding: 32px; + justify-content: center; +} + +.app-icon { + text-align: center; + cursor: pointer; + user-select: none; + transition: transform 0.15s ease, box-shadow 0.15s ease; +} + +.app-icon img { + width: 72px; + height: 72px; + border-radius: 20px; + box-shadow: 0 8px 18px rgba(0, 0, 0, 0.45); +} + +.app-icon span { + display: block; + margin-top: 8px; + font-size: 13px; + color: #ddd; +} + +.app-icon:hover { + transform: scale(1.08); +} + +.app-icon:active { + transform: scale(0.97); +}