forked from makkoncept/Mingo
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
25 lines (25 loc) · 1.58 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!DOCTYPE html><title>Mini</title>
<style>body{background:#445566}
.center{width:550px;height:110px;margin:auto;position:absolute;top:0;bottom:0;left:0;right:0}
.search{display:none}
.one{width:100%;border:none;border-bottom:3px solid #374656;color:bisque;background:#445566;font-size:36px;display:flex}
.radios{display:inline-block}
input:focus{outline:none}
input[type="radio"]{position:absolute;visibility:hidden;display:none}
input[type="radio"]:checked + label{color:#ccc8ce;background:#374656}
label{color:#374656;display:inline-block;cursor:pointer;font-weight:bold;padding:4px 20px}</style>
<div class="radios">
<input type="radio" id="intduck" name="selector">
<label for="intduck">DuckGo</label>
<input type="radio" id="intgoog" name="selector">
<label for="intgoog">Google</label></div>
<div class="center">
<form action="https://www.google.com/search">
<input type="text" name="q" autocomplete="off" autofocus placeholder="Search Google" id="goog" class="search"></form>
<form action="http://ddg.gg">
<input type="text" name="q" autocomplete="off" autofocus placeholder="Search DuckDuckGo" id="duck" class="search one"></form></div>
<script type="text/javascript">
document.querySelector("#intgoog").addEventListener("click",function(){for(var i=0; i<2;i++){document.querySelectorAll(".search")[i].classList.remove("one");}
document.querySelector("#goog").classList.add("one");});
document.querySelector("#intduck").addEventListener("click",function(){for(var i=0; i<2;i++){document.querySelectorAll(".search")[i].classList.remove("one");}
document.querySelector("#duck").classList.add("one");});</script>