Update index.html

index.html

@@ -98,6 +98,8 @@
     .tag.video { background-color: #E91E63; color: white; }
     .tag.utility { background-color: #9E9E9E; color: white; }
     .tag.predict { background-color: #673AB7; color: white; }
+    .tag.Productivity { background-color: #673AB7; color: white; }    
+    
     .tag.game { background-color: #4CAF50; color: white; }
     .tag.education { background-color: #3F51B5; color: white; }
     .tag.announcement { background-color: #607d8b; color: white; }
@@ -183,6 +185,8 @@
     .toggle-button[data-filter="video"] { background-color: #E91E63; color: white; }
     .toggle-button[data-filter="utility"] { background-color: #9E9E9E; color: white; }
     .toggle-button[data-filter="predict"] { background-color: #673AB7; color: white; }
+    .toggle-button[data-filter="Productivity"] { background-color: #673AB7; color: white; }
+    
     .toggle-button[data-filter="game"] { background-color: #4CAF50; color: white; }
     .toggle-button[data-filter="education"] { background-color: #3F51B5; color: white; }
 
@@ -241,7 +245,8 @@
       <button class="toggle-button" data-filter="vision">Vision</button>
       <button class="toggle-button" data-filter="multimodal">Multimodal</button>
       <button class="toggle-button" data-filter="video">Video</button>
-      <button class="toggle-button" data-filter="predict">Predict</button>      
+      <button class="toggle-button" data-filter="predict">Predict</button> 
+      <button class="toggle-button" data-filter="Productivity">Productivity</button> 
       <button class="toggle-button" data-filter="utility">Utility</button>
 
       <button class="toggle-button" data-filter="game">Game</button>