Candle/erweiterteSuche.html

127 lines
5.9 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta lang="de"/>
<meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="probestyle.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek</title>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <img src="pictures/Candle.png" alt="Bild von einer Kerze"
width="200" height="200"/>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberUns.html">Über Uns</a>
<a id="buecher" href="bücher.html">Bücher</a>
<a id="meinebuecher" href="meineBücher.html">Meine Bücher</a>
<form action="">
<input class="suchleiste" type="search" placeholder="Suche..." >
<button type="submit" id="buttonID" class="searchButton"><i class="fa fa-search"></i> </button>
</form>
<a id="erweitertesuche" href="erweiterteSuche.html">Erweiterte Suche</a>
</div>
</header>
<div class="homepage">
<img src="pictures/sidecandle.png" id="sidecandle" alt="sidecandle">
<p class="p3">
<span id="titleschwarz" > Erweiterte Suche </span> <br><br>
<form action="">
<input type="search" class="buchtitel" list="Titel">
<datalist id="Titel">
<option value="Titel"></option>
</datalist>
<input type="search" class="buchtiteloptions" list="buchtiteloptionen">
<datalist id="buchtiteloptionen">
<option value="Percy Jackson: Diebe im Olymp"></option>
<option value="The Hundred and One Dalmatians"></option>
<option value="Penguin Highway"></option>
<option value="Es"></option>
</datalist>
<input type="search" class="und-wort1" list="Und">
<datalist id="Und">
<option value="und"></option>
<option value="oder"></option>
</datalist>
<input type="search" class="autor" list="Autor">
<datalist id="Autor">
<option value="Autor"></option>
</datalist>
<input type="search" class="autoroptions" list="autoroptionen">
<datalist id="autoroptionen">
<option value="Rick Riordan"></option>
<option value="Dodie Smith"></option>
<option value="Tomihiko Morimi"></option>
<option value="Stephen Kind"></option>
</datalist>
<input type="search" class="und-wort2" list="Und" >
<datalist id="Und">
<option value="und"></option>
<option value="oder"></option>
</datalist>
<input type="search" class="stichwort" list="Stichwort">
<datalist id="Stichwort">
<option value="Stichwort"></option>
</datalist>
<input type="search" class="stichwörteroptions" list="stichwörteroptionen">
<datalist id="stichwörteroptionen">
<option value="Wissenschaft"></option>
<option value="Progress"></option>
<option value="Mano"></option>
<option value="Phänomenologie"></option>
<option value="Kinder"></option>
<option value="Habits"></option>
<option value="Algebra"></option>
</datalist>
<span id="titleschwarz" class="p4" style> Weitere Suchkriterien</span><br><br></p>
<span class="p5">Jahr von </span>
<input type="date" class="p6" name="Buchdatum1">
<span class="p7">bis </span>
<input type="date" class="p8" name="Buchdatum2">
<span class="p9">Sprache </span>
<input type="search" class="p10" list="sprachoptionen">
<datalist id="sprachoptionen">
<option value="Deutsch"></option>
<option value="Englisch"></option>
<option value="Arabisch"></option>
<option value="Französisch"></option>
</datalist>
<span class="p11">Verfügbarkeit</span>
<input type="checkbox" class="p12" name="status" value="verfügbareBücher">
<span class="p13">verfügbare Bücher</span>
<a id="suchen" href="">suchen</a>
<a id="suchfelderleeren" href="">Suchfelder leeren</a>
</form>
</p>
</div>
<footer class="fuss" >
<div>
<a id="impressum" href="impressum.html">Impressum</a>
<a id="kontakt" href="kontakt.html">Kontakt</a>
<a id="datenschutz" href="datenschutz.html">Datenschutz</a>
</div>
</footer>
</body>
</html>