Refine interactive layout and content

- Center cards in one-by-one mode.
- Remove global header/footer from interactive pages.
- Fix "School Connect" text on data structures page.
- Remove binary representation interactive from data structures list.

src/components/BinarySearchTrick.tsx

@@ -231,7 +231,7 @@ const BinarySearchTrick = ({ showSocialShare = true }: BinarySearchTrickProps) =
         </div>
       )}
 
-      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5 gap-4">
+      <div className={`grid gap-4 ${isOneByOne ? 'grid-cols-1 justify-items-center' : 'grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5'}`}>
         {getDisplayCards().map((card) => (
           <Card 
             key={card.id} 

src/components/InteractiveGallery.tsx

@@ -3,7 +3,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/com
 import { Input } from '@/components/ui/input';
 import { Badge } from '@/components/ui/badge';
 import { Search } from 'lucide-react';
-import BinaryNumberGame from '@/components/BinaryNumberGame';
+
 import BinarySearchTrick from '@/components/BinarySearchTrick';
 interface Interactive {
   id: string;
@@ -13,12 +13,6 @@ interface Interactive {
   component: React.ComponentType;
 }
 const interactives: Interactive[] = [{
-  id: 'binary-number-game',
-  title: 'Binary Number Representation',
-  description: 'Learn binary representation by expressing numbers as sums of powers of two. Toggle cards to match the target sum!',
-  tags: ['binary', 'math', 'numbers', 'representation', 'powers-of-two'],
-  component: BinaryNumberGame
-}, {
   id: 'binary-search-trick',
   title: 'Binary Search Magic Trick',
   description: 'Perform an amazing magic trick that reveals how binary numbers work. Think of a number and watch the magic happen!',
@@ -43,7 +37,7 @@ const InteractiveGallery = () => {
   }
   return <div className="space-y-6">
       <div className="space-y-4">
-        <h1 className="text-3xl font-bold text-foreground">School Connect Interactives</h1>
+        <h1 className="text-3xl font-bold text-foreground">Data Structures Interactives</h1>
         <p className="text-muted-foreground text-lg">
           Interactive tools and resources designed to connect theoretical concepts with practical applications in educational settings.
         </p>

src/pages/theme-pages/DataStructures.tsx

@@ -1,15 +1,13 @@
-import Layout from "@/components/Layout";
 import InteractiveGallery from "@/components/InteractiveGallery";
+
 const DataStructures = () => {
-  return <Layout>
+  return (
-      <div className="space-y-8">
+    <div className="min-h-screen bg-background">
-        <div className="text-center">
+      <div className="max-w-7xl mx-auto p-6">
-          
-          
-        </div>
-        
         <InteractiveGallery />
       </div>
-    </Layout>;
+    </div>
+  );
 };
+
 export default DataStructures;