completed the current task

.github/pull_request_template.md

@@ -1,10 +1,10 @@
 ## Checklist
 
 ### Required changes:
-- [ ] Center the description (Line 17 in HTML file) using a single change in CSS
-- [ ] Fix JS so that when the search is executed, the search engine is not present in query
-- [ ] Add Google Drive, Google Slides and Google Sheets as a provider
+- [.] Center the description (Line 17 in HTML file) using a single change in CSS
+- [.] Fix JS so that when the search is executed, the search engine is not present in query
+- [.] Add Google Drive, Google Slides and Google Sheets as a provider
 
 ### Optional changes:
 - [ ] Add other search providers (GitHub, Spotify, etc)
-- [ ] Additional CSS styling (as you like)
+- [ ] Additional CSS styling (as you like)

index.css

@@ -14,6 +14,7 @@ body {
 .container {
     display: flex;
     flex-direction: column;
+    align-items: center;
     max-width: min(100vw, 80rem);
     /* Hint */
 }
@@ -88,4 +89,4 @@ body {
 .search_icon {
     width: 1.5rem;
     height: 1.5rem;
-}
+}

index.js

@@ -2,14 +2,7 @@ let current_search = 'google'
 document.querySelector('.search_input').addEventListener('keyup', e => {
     const input = e.target.value;
     let search_engine = input.split(' ')[0].toLowerCase();
-    let search_query = input.split(' ').splice(0).join(' ');
-    switch(search_engine){
-        case 'google':
-        case 'youtube':
-        case 'docs': break;
-        default: search_engine = 'google';
-        search_query = input;
-    }
+    let search_query = input.substring(input.indexOf(' ')+1);
     if(search_engine !== current_search) {
         current_search = search_engine;
         const image = document.querySelector('.search_icon');
@@ -26,6 +19,18 @@ document.querySelector('.search_input').addEventListener('keyup', e => {
                 image.src = 'docs.png';
                 image.alt = 'Google Docs icon';
                 break;
+            case 'sheets':
+                image.src = 'sheets.png';
+                image.alt = 'google sheets icon';
+                break;
+            case 'drive':
+                image.src = 'google-drive.png';
+                image.alt = 'google drive icon';
+                break;
+            case 'slides':
+                image.src = 'slides.png';
+                image.alt = 'google slides icon';
+                break;
         }
     }
     if(e.key === 'Enter')
@@ -36,7 +41,16 @@ document.querySelector('.search_input').addEventListener('keyup', e => {
             case 'youtube': 
                 window.location = `https://www.youtube.com/results?search_query=${search_query}`;
                 break;
+            case 'sheets':
+                window.location = `https://docs.google.com/spreadsheets/?q=${search_query}`;
+                break;
+            case 'drive':
+                window.location = `https://drive.google.com/drive/search?q=${search_query}`;
+                break;
+            case 'slides':
+                window.location = `https://docs.google.com/presentation/?tgif=d&q=${search_query}`;
+                break;
             default: 
                 window.location = `https://www.google.com/search?q=${search_query}`;
         }
-});
+});