Your app is a smart study assistant for schools.

It helps students and teachers organize study materials, send school announcements, and chat with an AI bot that understands the school’s content — all in one simple Hebrew-friendly website.

🧑‍🎓 Who It’s For

Students – upload their class files (like PDFs, notes, or Google Docs), ask the AI study questions, and see approved announcements.

Teachers – approve or post announcements, share class materials, and help students with reliable content.

Admins – manage the whole site (logo, roles, permissions).

💡 What It Does (Core MVP Features)

Login & Roles

Students and teachers can sign up with email and password.

Teachers must confirm they are adults (18+).

Each user can choose a bot name (like “My Study Buddy”).

Upload or Import Study Materials

Students upload PDFs, images, Excel files, or paste Google Docs links.

The app extracts readable text from these files and stores it locally (or in a database later).

Chatbot (The Smart Assistant)

The AI bot reads your uploaded files and answers your questions based on that content.

It speaks Hebrew clearly and briefly.

It “remembers” details about your grade, class, and subjects.

Announcements

Any user can draft an announcement.

Teachers or admins must approve it before it becomes visible.

Announcements can be for the whole school, a specific grade, or a single class.

Design & Simplicity

Clean, modern look with right-to-left (RTL) Hebrew support.

Easy to use on computers or phones.

Shows school logo, e.g., “Yitzhak Shamir Six-Year School – Petah Tikva”.

⚙️ How It Works (MVP Logic)

Everything is stored in the browser (localStorage) — no server required at first.

The AI chat uses a small backend endpoint that talks to a model (like Gemini or GPT-4).

Later, you can connect it to a real database (like Supabase) to make accounts persistent.

🚀 Example Flow

A student signs up and uploads a PDF of “Math – Unit 2 Notes.”

They go to the chat page and ask: “How do I solve quadratic equations?”

The AI bot reads their uploaded material and answers based on it (in Hebrew).

The teacher posts an announcement: “Exam next Tuesday – Grade 10.”

The student sees that announcement instantly in their feed.

🧱 What Makes It Special

Grounded AI: answers only from real school materials, not random internet data.

Simple & Safe: no distractions, just study help and verified messages.

Designed for schools: every part (roles, grades, classes) fits real classrooms.

🗺️ After MVP (Future Versions)

AI searches multiple files and gives cited answers.

Shared class Spaces for group learning.

Analytics dashboard for teachers.

Real database, user accounts, and file storage.

In short, your idea is “ChatGPT + Google Drive + School Portal” — all in one, simple, Hebrew-friendly website where the AI learns from the school’s materials and helps students study smarter.

README.md

@@ -1,10 +1,13 @@
 ---
-title: Smartstudy Buddyhub
-emoji: 🚀
-colorFrom: blue
-colorTo: red
+title: SmartStudy BuddyHub 📚✨
+colorFrom: pink
+colorTo: purple
+emoji: 🐳
 sdk: static
 pinned: false
+tags:
+  - deepsite-v3
 ---
 
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
+# Welcome to your new DeepSite project!
+This project was created with [DeepSite](https://huggingface.co/deepsite).

components/footer.js

@@ -0,0 +1,56 @@
+class CustomFooter extends HTMLElement {
+  connectedCallback() {
+    this.attachShadow({ mode: 'open' });
+    this.shadowRoot.innerHTML = `
+      <style>
+        footer {
+          background-color: var(--secondary-color);
+          color: white;
+          text-align: center;
+          padding: 2rem;
+          margin-top: 40px;
+        }
+        
+        .footer-content {
+          max-width: 1200px;
+          margin: 0 auto;
+        }
+        
+        .footer-links {
+          display: flex;
+          justify-content: center;
+          gap: 20px;
+          margin-bottom: 20px;
+        }
+        
+        .footer-links a {
+          color: white;
+          text-decoration: none;
+        }
+        
+        .footer-links a:hover {
+          text-decoration: underline;
+        }
+        
+        .copyright {
+          margin-top: 20px;
+          font-size: 0.9rem;
+          opacity: 0.8;
+        }
+      </style>
+      <footer>
+        <div class="footer-content">
+          <div class="footer-links">
+            <a href="/about.html">אודות</a>
+            <a href="/privacy.html">פרטיות</a>
+            <a href="/contact.html">צור קשר</a>
+          </div>
+          <div class="copyright">
+            © 2023 SmartStudy BuddyHub - כל הזכויות שמורות
+          </div>
+        </div>
+      </footer>
+    `;
+  }
+}
+customElements.define('custom-footer', CustomFooter);

components/navbar.js

@@ -0,0 +1,78 @@
+class CustomNavbar extends HTMLElement {
+  connectedCallback() {
+    this.attachShadow({ mode: 'open' });
+    this.shadowRoot.innerHTML = `
+      <style>
+        nav {
+          background-color: var(--primary-color);
+          color: white;
+          padding: 1rem 2rem;
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+        }
+        
+        .logo {
+          display: flex;
+          align-items: center;
+          font-weight: bold;
+          font-size: 1.2rem;
+        }
+        
+        .logo img {
+          height: 40px;
+          margin-left: 10px;
+        }
+        
+        .nav-links {
+          display: flex;
+          gap: 20px;
+        }
+        
+        .nav-links a {
+          color: white;
+          text-decoration: none;
+          padding: 0.5rem 1rem;
+          border-radius: 5px;
+          transition: background-color 0.3s;
+        }
+        
+        .nav-links a:hover {
+          background-color: rgba(255, 255, 255, 0.2);
+        }
+        
+        @media (max-width: 768px) {
+          nav {
+            flex-direction: column;
+            padding: 1rem;
+          }
+          
+          .nav-links {
+            margin-top: 1rem;
+            width: 100%;
+            justify-content: space-around;
+          }
+          
+          .nav-links a {
+            padding: 0.5rem;
+          }
+        }
+      </style>
+      <nav>
+        <div class="logo">
+          <img src="http://static.photos/education/200x200/1" alt="School Logo">
+          <span>בית ספר יצחק שמיר</span>
+        </div>
+        <div class="nav-links">
+          <a href="/">בית</a>
+          <a href="/chat.html">צ'אט AI</a>
+          <a href="/materials.html">חומרי לימוד</a>
+          <a href="/announcements.html">הכרזות</a>
+          <a href="/login.html">התחברות</a>
+        </div>
+      </nav>
+    `;
+  }
+}
+customElements.define('custom-navbar', CustomNavbar);

index.html

@@ -1,19 +1,49 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>
+<!DOCTYPE html>
+<html lang="he" dir="rtl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>SmartStudy BuddyHub - בית הספר יצחק שמיר</title>
+    <link rel="stylesheet" href="style.css">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+</head>
+<body>
+    <custom-navbar></custom-navbar>
+    
+    <main class="container">
+        <section class="hero">
+            <h1>ברוכים הבאים ל-SmartStudy BuddyHub</h1>
+            <p>העוזר הלימודי החכם שלך! שאל שאלות, קבל תשובות והשאר מעודכן בהכרזות בית הספר.</p>
+            <div class="cta-buttons">
+                <a href="/login.html" class="btn primary">התחברות</a>
+                <a href="/register.html" class="btn secondary">הרשמה</a>
+            </div>
+        </section>
+
+        <section class="features">
+            <div class="feature-card">
+                <i class="fas fa-robot"></i>
+                <h3>עוזר לימודי AI</h3>
+                <p>קבל תשובות חכמות המבוססות על חומרי הלימוד שלך</p>
+            </div>
+            <div class="feature-card">
+                <i class="fas fa-bullhorn"></i>
+                <h3>הכרזות בית ספר</h3>
+                <p>הישאר מעודכן בכל ההכרזות החשובות</p>
+            </div>
+            <div class="feature-card">
+                <i class="fas fa-book"></i>
+                <h3>ניהול חומרים</h3>
+                <p>אחסן וסדר את כל חומרי הלימוד במקום אחד</p>
+            </div>
+        </section>
+    </main>
+
+    <custom-footer></custom-footer>
+
+    <script src="components/navbar.js"></script>
+    <script src="components/footer.js"></script>
+    <script src="script.js"></script>
+<script src="https://huggingface.co/deepsite/deepsite-badge.js"></script>
+</body>
+</html>

style.css

@@ -1,28 +1,103 @@
+:root {
+    --primary-color: #4a6fa5;
+    --secondary-color: #166088;
+    --accent-color: #4fc3f7;
+    --text-color: #333;
+    --light-bg: #f5f9fc;
+    --rtl: rtl;
+}
+
 body {
-	padding: 2rem;
-	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    margin: 0;
+    padding: 0;
+    color: var(--text-color);
+    direction: var(--rtl);
+    background-color: var(--light-bg);
+}
+
+.container {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 20px;
+}
+
+.hero {
+    text-align: center;
+    padding: 60px 20px;
+    background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));
+    color: white;
+    border-radius: 10px;
+    margin-bottom: 40px;
 }
 
-h1 {
-	font-size: 16px;
-	margin-top: 0;
+.hero h1 {
+    font-size: 2.5rem;
+    margin-bottom: 20px;
 }
 
-p {
-	color: rgb(107, 114, 128);
-	font-size: 15px;
-	margin-bottom: 10px;
-	margin-top: 5px;
+.hero p {
+    font-size: 1.2rem;
+    margin-bottom: 30px;
 }
 
-.card {
-	max-width: 620px;
-	margin: 0 auto;
-	padding: 16px;
-	border: 1px solid lightgray;
-	border-radius: 16px;
+.cta-buttons {
+    display: flex;
+    justify-content: center;
+    gap: 20px;
 }
 
-.card p:last-child {
-	margin-bottom: 0;
+.btn {
+    padding: 12px 24px;
+    border-radius: 5px;
+    text-decoration: none;
+    font-weight: bold;
+    transition: all 0.3s ease;
 }
+
+.btn.primary {
+    background-color: white;
+    color: var(--primary-color);
+}
+
+.btn.secondary {
+    background-color: transparent;
+    color: white;
+    border: 2px solid white;
+}
+
+.btn:hover {
+    transform: translateY(-3px);
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+}
+
+.features {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 30px;
+    margin-bottom: 40px;
+}
+
+.feature-card {
+    background: white;
+    padding: 30px;
+    border-radius: 10px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
+    text-align: center;
+    transition: transform 0.3s ease;
+}
+
+.feature-card:hover {
+    transform: translateY(-10px);
+}
+
+.feature-card i {
+    font-size: 3rem;
+    color: var(--accent-color);
+    margin-bottom: 20px;
+}
+
+.feature-card h3 {
+    font-size: 1.5rem;
+    margin-bottom: 15px;
+}