commit 29530069827a22e42e530cd4f1bd352c97c00e49 Author: deepjyoti30 Date: Tue May 12 19:21:50 2020 +0530 git init diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..f1ac29b --- /dev/null +++ b/css/main.css @@ -0,0 +1,33 @@ +@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap"); +.roboto, body { + font-family: 'Roboto', sans-serif; } + +body { + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background: #263238; + color: #fff; } + +.main { + width: 100%; } + .main #search-bar { + width: 50%; + margin: 0 auto; + height: 45px; } + .main #search-bar input { + height: inherit; + width: 100%; + background: #304047; + box-shadow: none; + border: none; + text-align: center; + border-radius: 6px; + outline: none; + padding: 7px 14px; + font-size: 18px; + color: #fff; } + .main #search-bar input:focus { + box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); + transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); } diff --git a/index.html b/index.html new file mode 100644 index 0000000..be529e8 --- /dev/null +++ b/index.html @@ -0,0 +1,27 @@ + + + + + + startpage + + + + + + + +
+ +
+ + + + + + + + + \ No newline at end of file diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..baada39 --- /dev/null +++ b/js/main.js @@ -0,0 +1,24 @@ +window.onload = function() { + this.initBody() +} + +searchBarId = "search-bar-input" + +function initBody() { + /** + * Function called when the body is loaded. + * + * Do everything like adding an event listener to + * other things. + */ + // Clear the search bar on load, just in case + $("#" + searchBarId).val("") + $("#" + searchBarId).on("keypress", (event) => { + if (event.which != 13) return + + // Open google with the search results. + googleSearchUrl = "https://www.google.com/search?q=" + query = document.getElementById(searchBarId).value.replace(/\ /g, "+") + document.location = googleSearchUrl + query + }) +} \ No newline at end of file diff --git a/scss/main.scss b/scss/main.scss new file mode 100644 index 0000000..687862c --- /dev/null +++ b/scss/main.scss @@ -0,0 +1,47 @@ +$background: #263238; +$foreground: #fff; +@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); + +.roboto { + font-family: 'Roboto', sans-serif; +} + +body { + height: 100vh; + display: flex; + align-items: center; + justify-content: center; + background: $background; + color: $foreground; + @extend .roboto; +} + +.main { + width: 100%; + + #search-bar { + width: 50%; + margin: 0 auto; + height: 45px; + + input { + height: inherit; + width: 100%; + background: lighten($background, 5); + box-shadow: none; + border: none; + text-align: center; + border-radius: 6px; + outline: none; + padding: 7px 14px; + font-size: 18px; + color: $foreground; + + &:focus { + box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); + transition: all 0.3s cubic-bezier(.25,.8,.25,1); + } + + } + } +} \ No newline at end of file