Update README.md

README.md

@@ -1,162 +1,47 @@
----
-title: Machine Learning Systems
-emoji: 📚
-colorFrom: purple
-colorTo: blue
-sdk: static
-pinned: false
----
-
-# Machine Learning Systems PDF Viewer
-
-A stunning, modern web application for viewing the Machine Learning Systems PDF. Built with vanilla JavaScript, HTML, and CSS, featuring a premium dark mode design with glassmorphism effects.
-
-## ✨ Features
-
-- 📄 **PDF.js Integration** - Smooth in-browser PDF viewing
-- 🎨 **Premium Design** - Dark mode with vibrant gradients and glassmorphism
-- 🔍 **Search Functionality** - Find text across all pages
-- ⌨️ **Keyboard Shortcuts** - Navigate efficiently with hotkeys
-- 📱 **Fully Responsive** - Works beautifully on all devices
-- 🎯 **Page Thumbnails** - Quick navigation with visual previews
-- 🔎 **Zoom Controls** - Multiple zoom options including fit-to-width
-- 🖼️ **Fullscreen Mode** - Distraction-free reading experience
-
-## 🚀 Deployment to Hugging Face Spaces
-
-### Step 1: Create a New Space
-
-1. Go to [Hugging Face](https://huggingface.co/) and sign in
-2. Click on your profile → **New Space**
-3. Choose:
-   - **Space name**: `ml-systems-pdf-viewer` (or your preferred name)
-   - **License**: Choose your preferred license
-   - **Space SDK**: Select **Static**
-   - **Visibility**: Public or Private
-
-### Step 2: Upload Files
-
-You can upload files either through the web interface or using Git:
-
-#### Option A: Web Interface
-1. In your Space, click **Files** → **Add file** → **Upload files**
-2. Upload these files:
-   - `index.html`
-   - `styles.css`
-   - `script.js`
-   - `Machine-Learning-Systems.pdf`
-   - `README.md` (this file)
-
-#### Option B: Git (Recommended)
-```bash
-# Clone your Space repository
-git clone https://huggingface.co/spaces/YOUR_USERNAME/YOUR_SPACE_NAME
-cd YOUR_SPACE_NAME
-
-# Copy all files
-cp index.html styles.css script.js Machine-Learning-Systems.pdf README.md ./
-
-# Commit and push
-git add .
-git commit -m "Initial commit: PDF viewer application"
-git push
-```
-
-### Step 3: Configure Custom Domain
-
-1. Go to your Space settings
-2. Navigate to **Settings** → **Domains**
-3. Click **Add a domain**
-4. Follow the instructions to:
-   - Add your custom domain (e.g., `ml-systems.yourdomain.com`)
-   - Update your DNS records with the provided CNAME
-   - Wait for DNS propagation (can take up to 48 hours)
-
-**DNS Configuration Example:**
-```
-Type: CNAME
-Name: ml-systems (or your subdomain)
-Value: spaces.huggingface.co
-TTL: 3600
-```
-
-5. Once DNS is propagated, enable SSL certificate (automatic via Let's Encrypt)
-
-## 💻 Local Development
-
-To run this project locally:
-
-1. **Clone or download** this repository
-2. **Ensure all files are in the same directory**:
-   - `index.html`
-   - `styles.css`
-   - `script.js`
-   - `Machine-Learning-Systems.pdf`
-3. **Open `index.html`** in a modern web browser (Chrome, Firefox, Safari, or Edge)
-
-> **Note**: For the best experience, serve the files through a local web server rather than opening the HTML file directly. You can use:
-> - Python: `python -m http.server 8000`
-> - Node.js: `npx http-server`
-> - VS Code: Use the Live Server extension
-
-## ⌨️ Keyboard Shortcuts
-
-- `←` / `→` - Navigate between pages
-- `↑` / `↓` - Navigate between pages (alternative)
-- `+` / `-` - Zoom in/out
-- `Ctrl+F` - Open search
-- `F` - Toggle fullscreen
-- `Ctrl+Wheel` - Zoom with mouse wheel
-
-## 🎨 Design Features
-
-- **Glassmorphism UI** - Frosted glass effect with backdrop blur
-- **Vibrant Gradients** - Purple, blue, and cyan color scheme
-- **Smooth Animations** - Micro-interactions for better UX
-- **Responsive Layout** - Adapts to mobile, tablet, and desktop
-- **Dark Mode** - Eye-friendly dark theme optimized for reading
-
-## 🔧 Customization
-
-### Change Colors
-Edit the CSS custom properties in `styles.css`:
-```css
-:root {
-    --color-accent-primary: #a855f7;  /* Purple */
-    --color-accent-secondary: #3b82f6; /* Blue */
-    --color-accent-tertiary: #06b6d4;  /* Cyan */
-}
-```
-
-### Default Zoom Level
-Edit `script.js`:
-```javascript
-const state = {
-    scale: 1.5, // Change this value (1.0 = 100%)
-    // ...
-};
-```
-
-## 📦 Dependencies
-
-- [PDF.js](https://mozilla.github.io/pdf.js/) v3.11.174 (loaded via CDN)
-- [Google Fonts](https://fonts.google.com/) - Inter & Fira Code
-
-## 🌐 Browser Support
-
-- Chrome/Edge (latest)
-- Firefox (latest)
-- Safari (latest)
-- Mobile browsers (iOS Safari, Chrome Mobile)
-
-## 📝 License
-
-This PDF viewer application is provided as-is. The PDF content may have its own license.
-
-## 🤝 Contributing
-
-Feel free to fork this project and customize it for your needs!
-
----
-
-Built with ❤️ for the Machine Learning community
+---
+title: Machine Learning Systems
+emoji: 📚
+colorFrom: purple
+colorTo: blue
+sdk: static
+app_file: index.html
+pinned: false
+---
+
+# Machine Learning Systems PDF Viewer
+
+A modern web app for viewing the *Machine Learning Systems* PDF in the browser.  
+Built with plain HTML, CSS, and JavaScript.
+
+## Features
+
+- In-browser PDF viewing (PDF.js)
+- Dark mode UI
+- Page navigation
+- Zoom controls
+- Search across pages
+- Keyboard shortcuts
+- Responsive layout
+- Fullscreen mode
+
+## Files
+
+The project uses these files at the repository root:
+
+- `index.html`
+- `styles.css`
+- `script.js`
+- `Machine-Learning-Systems.pdf`
+
+## Tech Stack
+
+- HTML
+- CSS
+- JavaScript
+- PDF.js (CDN)
+
+## Notes
+
+- This is a **Static Hugging Face Space**
+- No backend or Python code is used
+- All logic runs in the browser