Hugging Face's logo

Spaces:
KingNish
/
test-space
Running

App Files Community
29
smolSWE commited on
Commit
e57868a
·
verified ·
1 Parent(s): edc131b

SmolSWE text

Browse files

A test of SmolSWE with new changes

Files changed (13) hide show
  1. 0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/index.html +17 -0
  2. 0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/script.js +62 -0
  3. 0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/style.css +79 -0
  4. 882eea23-73cc-472e-b26b-78907d2ea474/.gitignore +0 -0
  5. b45f4c07-dc90-4db0-943c-dc7a001c53f7/index.html +17 -0
  6. b45f4c07-dc90-4db0-943c-dc7a001c53f7/script.js +62 -0
  7. b45f4c07-dc90-4db0-943c-dc7a001c53f7/style.css +50 -0
  8. cc2b836f-b00f-4caf-b072-5314456893d8/.gitattributes +0 -0
  9. cc2b836f-b00f-4caf-b072-5314456893d8/.gitignore +0 -0
  10. cc2b836f-b00f-4caf-b072-5314456893d8/README.md +0 -0
  11. cc2b836f-b00f-4caf-b072-5314456893d8/index.html +17 -0
  12. cc2b836f-b00f-4caf-b072-5314456893d8/script.js +62 -0
  13. cc2b836f-b00f-4caf-b072-5314456893d8/style.css +50 -0
0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/index.html ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Google Clone</title>
5
+ <link rel="stylesheet" href="style.css">
6
+ </head>
7
+ <body>
8
+ <div class="logo-container"><img src="https://www.google.com/images/branding/googlelogo/1x/googlelogo_color_272x92dp.png" alt="Google Logo"></div><div class="search-container">
9
+ <input type="text" id="search-input" placeholder="Search Google">
10
+ <div id="suggestions"></div>
11
+ </div>
12
+ <div id="results-container">
13
+ </div>
14
+
15
+ <script src="script.js"></script>
16
+ </body>
17
+ </html>
0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/script.js ADDED
@@ -0,0 +1,62 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ const searchInput = document.getElementById("search-input");
2
+ const suggestionsDiv = document.getElementById("suggestions");
3
+ const resultsContainer = document.getElementById("results-container");
4
+
5
+ const dummySuggestions = [
6
+ "what is javascript",
7
+ "how to make a website",
8
+ "best restaurants near me",
9
+ "weather today",
10
+ "current news"
11
+ ];
12
+
13
+ searchInput.addEventListener("input", function() {
14
+ const inputValue = searchInput.value.toLowerCase();
15
+ const filteredSuggestions = dummySuggestions.filter(suggestion =>
16
+ suggestion.toLowerCase().startsWith(inputValue)
17
+ );
18
+
19
+ displaySuggestions(filteredSuggestions);
20
+ });
21
+
22
+ function displaySuggestions(suggestions) {
23
+ suggestionsDiv.innerHTML = "";
24
+ if (suggestions.length > 0 && searchInput.value) {
25
+ suggestions.forEach(suggestion => {
26
+ const suggestionElement = document.createElement("div");
27
+ suggestionElement.textContent = suggestion;
28
+ suggestionElement.addEventListener("click", function() {
29
+ searchInput.value = suggestion;
30
+ suggestionsDiv.style.display = "none";
31
+ displayResults(suggestion);
32
+ });
33
+ suggestionsDiv.appendChild(suggestionElement);
34
+ });
35
+ suggestionsDiv.style.display = "block";
36
+ } else {
37
+ suggestionsDiv.style.display = "none";
38
+ }
39
+ }
40
+
41
+ searchInput.addEventListener("keydown", function(event) {
42
+ if (event.key === "Enter") {
43
+ const inputValue = searchInput.value;
44
+ displayResults(inputValue);
45
+ suggestionsDiv.style.display = "none";
46
+ }
47
+ });
48
+
49
+ function displayResults(query) {
50
+ resultsContainer.innerHTML = "";
51
+ const dummyResults = [
52
+ `Result 1 for ${query}`,
53
+ `Result 2 for ${query}`,
54
+ `Result 3 for ${query}`
55
+ ];
56
+
57
+ dummyResults.forEach(result => {
58
+ const resultElement = document.createElement("div");
59
+ resultElement.textContent = result;
60
+ resultsContainer.appendChild(resultElement);
61
+ });
62
+ }
0f40e52e-5ae3-4685-8f7f-be5a3c44aeea/style.css ADDED
@@ -0,0 +1,79 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+
2
+ body {
3
+ font-family: Arial, sans-serif;
4
+ margin: 0;
5
+ padding: 0;
6
+ display: flex;
7
+ flex-direction: column;
8
+ align-items: center;
9
+ min-height: 100vh; /* Use min-height for better centering */
10
+ }
11
+
12
+ .logo-container {
13
+ margin-top: 100px; /* Adjust as needed */
14
+ margin-bottom: 20px; /* Space between logo and search bar */
15
+ text-align: center;
16
+ }
17
+
18
+ .logo-container img {
19
+ width: auto; /* Maintain aspect ratio */
20
+ height: 92px; /* Google logo height */
21
+ }
22
+
23
+ .search-container {
24
+ /* margin-top: 100px; */ /* Removed, logo container handles top margin */
25
+ position: relative;
26
+ }
27
+
28
+ #search-input {
29
+ width: 580px; /* Increased width slightly */
30
+ padding: 13px 20px; /* Adjusted padding */
31
+ font-size: 16px;
32
+ border: 1px solid #dfe1e5; /* Softer border color */
33
+ border-radius: 24px;
34
+ outline: none;
35
+ box-shadow: 0 1px 6px rgb(32 33 36 / 28%); /* Add a subtle shadow */
36
+ transition: box-shadow 0.3s ease-in-out; /* Smooth transition */
37
+ }
38
+
39
+ #search-input:focus {
40
+ border-color: #adadad; /* Slightly darker border on focus */
41
+ box-shadow: 0 1px 6px rgb(32 33 36 / 28%); /* Keep shadow on focus */
42
+ }
43
+
44
+
45
+ #suggestions {
46
+ position: absolute;
47
+ top: 100%;
48
+ left: 0;
49
+ width: calc(580px + 40px); /* Match input width + padding */
50
+ background-color: #fff;
51
+ border: 1px solid #dfe1e5;
52
+ border-top: none;
53
+ border-radius: 0 0 8px 8px;
54
+ box-shadow: 0 4px 6px rgb(32 33 36 / 10%); /* Softer shadow */
55
+ display: none;
56
+ z-index: 1;
57
+ }
58
+
59
+ #suggestions div {
60
+ padding: 10px 16px; /* Adjusted padding */
61
+ cursor: pointer;
62
+ font-size: 14px;
63
+ }
64
+
65
+ #suggestions div:hover {
66
+ background-color: #f0f0f0;
67
+ }
68
+
69
+ #results-container {
70
+ margin-top: 40px; /* Increased margin for results */
71
+ width: 600px; /* Adjusted width */
72
+ }
73
+
74
+ #results-container div {
75
+ margin-bottom: 15px; /* Space between results */
76
+ padding: 10px 0;
77
+ border-bottom: 1px solid #eee; /* Separator line */
78
+ font-size: 14px;
79
+ }
882eea23-73cc-472e-b26b-78907d2ea474/.gitignore ADDED
File without changes
b45f4c07-dc90-4db0-943c-dc7a001c53f7/index.html ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Google Clone</title>
5
+ <link rel="stylesheet" href="style.css">
6
+ </head>
7
+ <body>
8
+ <div class="search-container">
9
+ <input type="text" id="search-input" placeholder="Search Google">
10
+ <div id="suggestions"></div>
11
+ </div>
12
+ <div id="results-container">
13
+ </div>
14
+
15
+ <script src="script.js"></script>
16
+ </body>
17
+ </html>
b45f4c07-dc90-4db0-943c-dc7a001c53f7/script.js ADDED
@@ -0,0 +1,62 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ const searchInput = document.getElementById("search-input");
2
+ const suggestionsDiv = document.getElementById("suggestions");
3
+ const resultsContainer = document.getElementById("results-container");
4
+
5
+ const dummySuggestions = [
6
+ "what is javascript",
7
+ "how to make a website",
8
+ "best restaurants near me",
9
+ "weather today",
10
+ "current news"
11
+ ];
12
+
13
+ searchInput.addEventListener("input", function() {
14
+ const inputValue = searchInput.value.toLowerCase();
15
+ const filteredSuggestions = dummySuggestions.filter(suggestion =>
16
+ suggestion.toLowerCase().startsWith(inputValue)
17
+ );
18
+
19
+ displaySuggestions(filteredSuggestions);
20
+ });
21
+
22
+ function displaySuggestions(suggestions) {
23
+ suggestionsDiv.innerHTML = "";
24
+ if (suggestions.length > 0 && searchInput.value) {
25
+ suggestions.forEach(suggestion => {
26
+ const suggestionElement = document.createElement("div");
27
+ suggestionElement.textContent = suggestion;
28
+ suggestionElement.addEventListener("click", function() {
29
+ searchInput.value = suggestion;
30
+ suggestionsDiv.style.display = "none";
31
+ displayResults(suggestion);
32
+ });
33
+ suggestionsDiv.appendChild(suggestionElement);
34
+ });
35
+ suggestionsDiv.style.display = "block";
36
+ } else {
37
+ suggestionsDiv.style.display = "none";
38
+ }
39
+ }
40
+
41
+ searchInput.addEventListener("keydown", function(event) {
42
+ if (event.key === "Enter") {
43
+ const inputValue = searchInput.value;
44
+ displayResults(inputValue);
45
+ suggestionsDiv.style.display = "none";
46
+ }
47
+ });
48
+
49
+ function displayResults(query) {
50
+ resultsContainer.innerHTML = "";
51
+ const dummyResults = [
52
+ `Result 1 for ${query}`,
53
+ `Result 2 for ${query}`,
54
+ `Result 3 for ${query}`
55
+ ];
56
+
57
+ dummyResults.forEach(result => {
58
+ const resultElement = document.createElement("div");
59
+ resultElement.textContent = result;
60
+ resultsContainer.appendChild(resultElement);
61
+ });
62
+ }
b45f4c07-dc90-4db0-943c-dc7a001c53f7/style.css ADDED
@@ -0,0 +1,50 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ font-family: Arial, sans-serif;
3
+ margin: 0;
4
+ padding: 0;
5
+ display: flex;
6
+ flex-direction: column;
7
+ align-items: center;
8
+ }
9
+
10
+ .search-container {
11
+ margin-top: 100px;
12
+ position: relative;
13
+ }
14
+
15
+ #search-input {
16
+ width: 500px;
17
+ padding: 12px 20px;
18
+ font-size: 16px;
19
+ border: 1px solid #ccc;
20
+ border-radius: 24px;
21
+ outline: none;
22
+ }
23
+
24
+ #suggestions {
25
+ position: absolute;
26
+ top: 100%;
27
+ left: 0;
28
+ width: 500px;
29
+ background-color: #fff;
30
+ border: 1px solid #ccc;
31
+ border-top: none;
32
+ border-radius: 0 0 8px 8px;
33
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
34
+ display: none;
35
+ z-index: 1;
36
+ }
37
+
38
+ #suggestions div {
39
+ padding: 8px 16px;
40
+ cursor: pointer;
41
+ }
42
+
43
+ #suggestions div:hover {
44
+ background-color: #f0f0f0;
45
+ }
46
+
47
+ #results-container {
48
+ margin-top: 20px;
49
+ width: 600px;
50
+ }
cc2b836f-b00f-4caf-b072-5314456893d8/.gitattributes ADDED
File without changes
cc2b836f-b00f-4caf-b072-5314456893d8/.gitignore ADDED
File without changes
cc2b836f-b00f-4caf-b072-5314456893d8/README.md ADDED
File without changes
cc2b836f-b00f-4caf-b072-5314456893d8/index.html ADDED
@@ -0,0 +1,17 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html>
3
+ <head>
4
+ <title>Google Clone</title>
5
+ <link rel="stylesheet" href="style.css">
6
+ </head>
7
+ <body>
8
+ <div class="search-container">
9
+ <input type="text" id="search-input" placeholder="Search Google">
10
+ <div id="suggestions"></div>
11
+ </div>
12
+ <div id="results-container">
13
+ </div>
14
+
15
+ <script src="script.js"></script>
16
+ </body>
17
+ </html>
cc2b836f-b00f-4caf-b072-5314456893d8/script.js ADDED
@@ -0,0 +1,62 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ const searchInput = document.getElementById("search-input");
2
+ const suggestionsDiv = document.getElementById("suggestions");
3
+ const resultsContainer = document.getElementById("results-container");
4
+
5
+ const dummySuggestions = [
6
+ "what is javascript",
7
+ "how to make a website",
8
+ "best restaurants near me",
9
+ "weather today",
10
+ "current news"
11
+ ];
12
+
13
+ searchInput.addEventListener("input", function() {
14
+ const inputValue = searchInput.value.toLowerCase();
15
+ const filteredSuggestions = dummySuggestions.filter(suggestion =>
16
+ suggestion.toLowerCase().startsWith(inputValue)
17
+ );
18
+
19
+ displaySuggestions(filteredSuggestions);
20
+ });
21
+
22
+ function displaySuggestions(suggestions) {
23
+ suggestionsDiv.innerHTML = "";
24
+ if (suggestions.length > 0 && searchInput.value) {
25
+ suggestions.forEach(suggestion => {
26
+ const suggestionElement = document.createElement("div");
27
+ suggestionElement.textContent = suggestion;
28
+ suggestionElement.addEventListener("click", function() {
29
+ searchInput.value = suggestion;
30
+ suggestionsDiv.style.display = "none";
31
+ displayResults(suggestion);
32
+ });
33
+ suggestionsDiv.appendChild(suggestionElement);
34
+ });
35
+ suggestionsDiv.style.display = "block";
36
+ } else {
37
+ suggestionsDiv.style.display = "none";
38
+ }
39
+ }
40
+
41
+ searchInput.addEventListener("keydown", function(event) {
42
+ if (event.key === "Enter") {
43
+ const inputValue = searchInput.value;
44
+ displayResults(inputValue);
45
+ suggestionsDiv.style.display = "none";
46
+ }
47
+ });
48
+
49
+ function displayResults(query) {
50
+ resultsContainer.innerHTML = "";
51
+ const dummyResults = [
52
+ `Result 1 for ${query}`,
53
+ `Result 2 for ${query}`,
54
+ `Result 3 for ${query}`
55
+ ];
56
+
57
+ dummyResults.forEach(result => {
58
+ const resultElement = document.createElement("div");
59
+ resultElement.textContent = result;
60
+ resultsContainer.appendChild(resultElement);
61
+ });
62
+ }
cc2b836f-b00f-4caf-b072-5314456893d8/style.css ADDED
@@ -0,0 +1,50 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ body {
2
+ font-family: Arial, sans-serif;
3
+ margin: 0;
4
+ padding: 0;
5
+ display: flex;
6
+ flex-direction: column;
7
+ align-items: center;
8
+ }
9
+
10
+ .search-container {
11
+ margin-top: 100px;
12
+ position: relative;
13
+ }
14
+
15
+ #search-input {
16
+ width: 500px;
17
+ padding: 12px 20px;
18
+ font-size: 16px;
19
+ border: 1px solid #ccc;
20
+ border-radius: 24px;
21
+ outline: none;
22
+ }
23
+
24
+ #suggestions {
25
+ position: absolute;
26
+ top: 100%;
27
+ left: 0;
28
+ width: 500px;
29
+ background-color: #fff;
30
+ border: 1px solid #ccc;
31
+ border-top: none;
32
+ border-radius: 0 0 8px 8px;
33
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
34
+ display: none;
35
+ z-index: 1;
36
+ }
37
+
38
+ #suggestions div {
39
+ padding: 8px 16px;
40
+ cursor: pointer;
41
+ }
42
+
43
+ #suggestions div:hover {
44
+ background-color: #f0f0f0;
45
+ }
46
+
47
+ #results-container {
48
+ margin-top: 20px;
49
+ width: 600px;
50
+ }