diff --git a/new.css b/new.css new file mode 100644 index 0000000..40928e3 --- /dev/null +++ b/new.css @@ -0,0 +1,35 @@ +body { + background-image: url(https://th.bing.com/th/id/R.1591954549cb4f45870949c4de53cdaf?rik=RcEP3rK4%2bsT4TA&riu=http%3a%2f%2fumaar.github.io%2fexperiments%2fgithub-3d-logo%2frender-2.jpg&ehk=VpOrW33N7blW8q7XMTSvR8krYhTyJ7ruH%2f%2fmUKlWXYM%3d&risl=&pid=ImgRaw&r=0); + background-repeat: no-repeat; + background-attachment: fixed; + background-size: 100% 100%; + } + h1 { + font-family: 'DynaPuff', cursive; + text-align: center; + text-align: center; + font-size: 120px; + color: white; + } + h1:hover{ + color: #FF8400; + } + .btn:hover{ background: #FF8400; + background-image: -webkit-linear-gradient(top, #FF8400, #F9D949); + background-image: -moz-linear-gradient(top, #FF8400, #F9D949); + background-image: -ms-linear-gradient(top, #FF8400, #F9D949); + background-image: -o-linear-gradient(top, #FF8400, #F9D949); + background-image: linear-gradient(to bottom, #FF8400, #F9D949); + + color: #a30714; + } + + #result { + height: 10px; + position:absolute; + left: 35%; + + } + .image{ + height: 50px; + } diff --git a/new.html b/new.html new file mode 100644 index 0000000..cb1e658 --- /dev/null +++ b/new.html @@ -0,0 +1,59 @@ + + + + + + + + + + + + + Github User Finder + + + +
+
+
+ +

+ GITHUB USER FINDER +

+ +
+
+ +
+
+ +
+
+
+ +
+
+
+
+ Click on the picture below +
+
+










+

+ +
+ +
+
+ + + + + + + \ No newline at end of file diff --git a/new.js b/new.js new file mode 100644 index 0000000..333dded --- /dev/null +++ b/new.js @@ -0,0 +1,32 @@ +function functionName() { + document.querySelector(".box").classList.toggle("b1") + } + + //fetch data from form! + var form = document.getElementById("myForm"); + + + form.addEventListener('submit', function (e) { + + //prevent the auto submission of form + e.preventDefault(); + + var search = document.getElementById("search").value; + + //to remove space in b/w firstName & lastName + var originalName = search.split(' ').join(''); + + document.getElementById("result").innerHTML = ''; + + fetch("https://api.github.com/users/" + originalName) + .then((result) => result.json()) + .then((data) => { + console.log(data) + + document.getElementById("result").classList.add("discription"); + + document.getElementById("result").innerHTML = ` + + ` + }) + })