mirror of
https://github.com/Ahwxorg/Binternet.git
synced 2026-03-11 08:54:37 +00:00
update front-page
This commit is contained in:
sarthak
parent
5586e5cb1a
commit
0a25ef6a34
4 changed files with 115 additions and 46 deletions
17
index.php
17
index.php
|
|
@ -2,13 +2,14 @@
|
|||
<title>Binternet</title>
|
||||
</head>
|
||||
<body>
|
||||
<div class="mainContainer">
|
||||
<h1 id="bodyHeader"><span>B</span>inter<span>n</span>et</h1>
|
||||
<form class="searchContainer" action="search.php" method="get" autocomplete="off">
|
||||
<div id="inputWrapper"><br><br><br><br>
|
||||
<input type="text" name="q" autofocus/>
|
||||
<button type="submit">Search</button>
|
||||
</div>
|
||||
</form>
|
||||
<div class="mainContainer centered">
|
||||
<h1 id="bodyHeader">Binternet</h1>
|
||||
<p>A privacy respecting Pinterest image search</p>
|
||||
<form class="searchContainer " action="search.php" method="get" autocomplete="off">
|
||||
<div id="inputWrapper">
|
||||
<input type="text" name="q" autofocus/>
|
||||
<button class="" type="submit">Search</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php require "misc/footer.php"; ?>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,12 @@
|
|||
<footer>
|
||||
<div class="footer">
|
||||
<p id="footerText">
|
||||
|
|
||||
<a href="./" target="_blank">Binternet</a>
|
||||
|
|
||||
<a href="https://github.com/Ahwxorg/binternet/" target="_blank">Source code</a>
|
||||
|
|
||||
<a href="https://ahwx.org/donate.php" target="_blank">Donate</a>
|
||||
|
|
||||
<a href="https://github.com/Ahwxorg/binternet#legal-notice" target="_blank">Legal notice</a>
|
||||
|
|
||||
<a href="./" target="_blank">Binternet</a>
|
||||
<a href="https://github.com/Ahwxorg/binternet/" target="_blank">Source</a>
|
||||
<a href="https://ahwx.org/donate.php" target="_blank">Donate</a>
|
||||
<a href="https://github.com/Ahwxorg/binternet#legal-notice" target="_blank">Legal notice</a>
|
||||
|
||||
<?php
|
||||
if (isset($images)) {
|
||||
echo "<br><br>";
|
||||
print(count($images). " images found");
|
||||
}
|
||||
?><br><br>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
?>
|
||||
|
|
@ -1,12 +1,38 @@
|
|||
::root {
|
||||
:root {
|
||||
--inputColor: black;
|
||||
--accent-color:#12e8b9;
|
||||
--fg-color: white;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #2a2b2b;
|
||||
color: white;
|
||||
color: var(--fg-color);
|
||||
font-family: verdana, arial, sans-serif;
|
||||
overflow-x: hidden;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
input:focus {
|
||||
border: 1px solid rgb(97, 97, 97);
|
||||
}
|
||||
|
||||
|
||||
.centered {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 50%;
|
||||
margin-right: -50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.hide{
|
||||
display: none;
|
||||
}
|
||||
|
||||
span {
|
||||
|
|
@ -14,8 +40,18 @@ span {
|
|||
}
|
||||
|
||||
#bodyHeader {
|
||||
margin-top: 10vh;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.mainContainer p {
|
||||
margin-bottom:30px;
|
||||
margin-top: 5px;
|
||||
|
||||
}
|
||||
|
||||
.mainContainer h1 {
|
||||
font-size: 50px;
|
||||
|
||||
}
|
||||
|
||||
.bodyText {
|
||||
|
|
@ -29,17 +65,22 @@ span {
|
|||
}
|
||||
|
||||
footer {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
width: 100vw;
|
||||
height: 10vh;
|
||||
padding: 10px;
|
||||
color: white;
|
||||
background-color: #1f2120;
|
||||
position: fixed;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
footer a{
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
#footerText {
|
||||
margin: 10px;
|
||||
padding: 10px;
|
||||
|
|
@ -51,34 +92,51 @@ footer {
|
|||
|
||||
a {
|
||||
text-decoration: none;
|
||||
color: #12e8b9;
|
||||
color: var(--fg-color);
|
||||
}
|
||||
|
||||
footer a:hover{
|
||||
color: var(--accent-color);
|
||||
}
|
||||
|
||||
#inputWrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
input, button {
|
||||
outline: none;
|
||||
color: white;
|
||||
background-color: #1f2120;
|
||||
border: 1px solid #1f2120;
|
||||
height: 4vh;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
input {
|
||||
width: 500px;
|
||||
outline: none;
|
||||
color: white;
|
||||
background-color: #1f2120;
|
||||
border: 1px solid #1f2120;
|
||||
width: 35vw;
|
||||
height: 4vh;
|
||||
margin: 10px;
|
||||
border-radius: 10px 0px 0px 10px;
|
||||
padding: 15px;
|
||||
font-size: inherit;
|
||||
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 15px;
|
||||
background: #1f2120;
|
||||
border: 1px solid #1f2120;
|
||||
color: black;
|
||||
background-color: var(--accent-color);
|
||||
border: 0;
|
||||
border-radius: 0px 10px 10px 0px;
|
||||
cursor: pointer;
|
||||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/* button:hover{
|
||||
background-color: var(--accent-color);
|
||||
color:white;
|
||||
} */
|
||||
|
||||
img {
|
||||
max-width: 25vw;
|
||||
max-height: 25vw;
|
||||
|
|
@ -87,3 +145,26 @@ img {
|
|||
border-radius: 10px;
|
||||
box-shadow: 5px 5px 5px black;
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width: 750px) {
|
||||
|
||||
body{
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.mainContainer h1 {
|
||||
font-size: 35px;
|
||||
|
||||
}
|
||||
|
||||
input{
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.centered {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -20,8 +20,7 @@
|
|||
|
||||
echo "value=\"$query\"";
|
||||
?>
|
||||
<br>
|
||||
<hr>
|
||||
>
|
||||
</form>
|
||||
|
||||
<?php
|
||||
|
|
|
|||
Loading…
Reference in a new issue