Merge branch 'master_stand_10_05_23' of https://gitty.informatik.hs-mannheim.de/2123174/Candle into master_stand_10_05_23

master_stand_10_05_23
Jasmin Weise 2023-05-17 11:20:10 +02:00
commit 546d0ec97e
26 changed files with 349 additions and 51 deletions

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Abmelden</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>

View File

@ -7,6 +7,7 @@
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Anmeldung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script> <script src="burgerIcon.js"></script>
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Anmeldung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script> <script src="burgerIcon.js"></script>
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Bücher</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>
@ -31,10 +32,11 @@
</header> </header>
<div class="containerofbuecher"> <div class="containerofbuecher">
<p id="büchertitel">Bücher</p> <p id="büchertitel">Bücher</p>
<!--First Item-->
<div id="firstItem" class="items" > <div id="firstItem" class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/> <img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Percy Jackson: Diebe im Olymp <a href="percy.html">Percy Jackson: Diebe im Olymp</a>
</h3> </h3>
<p class="discinItem">Verfasser: Rick Riordan <br> <p class="discinItem">Verfasser: Rick Riordan <br>
Erscheinungsjahr: 2010 <br> Erscheinungsjahr: 2010 <br>
@ -44,13 +46,13 @@
<a class="greenbutton" href="percy.html">Verfügbar</a> <a class="greenbutton" href="percy.html">Verfügbar</a>
<a class="binPicture" href=""><img src="pictures/shopping_cart.png" width="25" height="25"></a> <a class="binPicture" href=""><img src="pictures/shopping_cart.png" width="25" height="25"></a>
<hr style="width: 92%;"> <hr style="width: 92%;">
</div> </div>
<!--Second Item--> <!--Second Item-->
<div id="secondItem" class="items"> <div id="secondItem" class="items">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/> <img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
The Hundred and One Dalmatians <a href="dalmatians.html">The Hundred and One Dalmatians</a>
</h3> </h3>
<p class="discinItem">Verfasser: Dodie Smith <br> <p class="discinItem">Verfasser: Dodie Smith <br>
Erscheinungsjahr: 2015 <br> Erscheinungsjahr: 2015 <br>
@ -67,7 +69,8 @@
<div id="thirdItem" class="items"> <div id="thirdItem" class="items">
<img src="pictures/penguin_highway.jpg" width="125" height="200"/> <img src="pictures/penguin_highway.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Penguin Highway <a href="penguin.html">Penguin Highway</a>
</h3> </h3>
<p class="discinItem">Verfasser: Tomihiko Morimi <br> <p class="discinItem">Verfasser: Tomihiko Morimi <br>
Erscheinungsjahr: 2019 <br> Erscheinungsjahr: 2019 <br>
@ -84,7 +87,7 @@
<div id="fourthItem" class="items" > <div id="fourthItem" class="items" >
<img src="pictures/es.jpg" width="125" height="200"/> <img src="pictures/es.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Es <a href="es.html">Es</a>
</h3> </h3>
<p class="discinItem">Verfasser: Stephen King <br> <p class="discinItem">Verfasser: Stephen King <br>
Erscheinungsjahr: 2011 <br> Erscheinungsjahr: 2011 <br>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | The Hundred and One Dalmatians</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Datenschutz</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Erweiterte Suche</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Es</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Impressum</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Home</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,9 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Kontakt</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

96
loeschen.html 100644
View File

@ -0,0 +1,96 @@
<!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="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.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>
<a href="anmelden_warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch entfernen</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Möchten Sie das folgende Buch wirklich aus Ihrem Warenkorb entfernen?</p>
<div class="item" id="verlängerungItem">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" alt="The Hundred and One Dalmatians" height="200">
<div class="beschreibung">
<h2>The Hundred and One Dalmatians</h2>
<h3>von Dodie Smith</h3>
<div class="b2 red">Verfügbar ab: 03.05.2023</div>
</div>
</div>
<div id="verlängerungButtonContainer">
<a id = "verlängerungButton1" href="loeschenErfolgreich.html">Bestätigen</a>
<a id = "verlängerungButton2" href="meinebuecher.html">Abbrechen</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</div>
</nav>
<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>

View File

@ -0,0 +1,86 @@
<!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="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Löschen Erfolgreich</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
</head>
<body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.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>
<a href="anmelden_warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch erfolgreich entfernt</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Das Buch wurde aus Ihrem Warenkorb entfernt.</p>
<div id="verlängerungButtonContainer">
<a id = "verlängerungErfolgreichButton1" href="warenkorb.html">Zurück zum Warennkorb</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</div>
</nav>
<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>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Meine Bücher</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
@ -36,7 +37,7 @@
<div id="firstItem" class="items" > <div id="firstItem" class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/> <img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Percy Jackson: Diebe im Olymp <a href="percy.html">Percy Jackson: Diebe im Olymp</a>
</h3> </h3>
<p class="discinItem">von Rick Riordan <br> <p class="discinItem">von Rick Riordan <br>
</p> </p>
@ -50,7 +51,7 @@
<div id="secondItem" class="items"> <div id="secondItem" class="items">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/> <img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
The Hundred and One Dalmatians <a href="dalmatians.html">The Hundred and One Dalmatians</a>
</h3> </h3>
<p class="discinItem">von Dodie Smith <br> <p class="discinItem">von Dodie Smith <br>
</p> </p>
@ -65,7 +66,7 @@
<div id="thirdItem" class="items"> <div id="thirdItem" class="items">
<img src="pictures/penguin_highway.jpg" width="125" height="200"/> <img src="pictures/penguin_highway.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Penguin Highway <a href="penguin.html">Penguin Highway</a>
</h3> </h3>
<p class="discinItem">von Tomihiko Morimi <br> <p class="discinItem">von Tomihiko Morimi <br>
</p> </p>
@ -78,7 +79,7 @@
<div id="fourthItem" class="items" > <div id="fourthItem" class="items" >
<img src="pictures/es.jpg" width="125" height="200"/> <img src="pictures/es.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Es <a href="es.html">Es</a>
</h3> </h3>
<p class="discinItem">von Stephen King <br> <p class="discinItem">von Stephen King <br>
</p> </p>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Penguin Highway</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Percy Jackson: Diebe im Olymp</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -7,7 +7,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Registrierung</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Erfolgreich Registriert</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Reservierungsbestätigung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script> <script src="burgerIcon.js"></script>
</head> </head>
<body> <body>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Reservierung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script> <script src="burgerIcon.js"></script>
</head> </head>
<body> <body>

View File

@ -755,6 +755,11 @@ left: 0px;
width: 100%; width: 100%;
height: 66%; height: 66%;
} }
.headerinItem a {
text-decoration: none;
color: initial;
}
.containerofbuecher{ .containerofbuecher{
-ms-overflow-style: none; /* IE and Edge */ -ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */ scrollbar-width: none; /* Firefox */
@ -1403,10 +1408,8 @@ input[type=number] {
/*Verlängerung Start*/ /*Verlängerung Start*/
#verlängerung { #verlängerung {
overflow-y: scroll; overflow: auto;
display:flex; display:flex;
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
position: absolute; position: absolute;
top: 230px; top: 230px;
left: 50px; left: 50px;
@ -1418,6 +1421,7 @@ input[type=number] {
font-weight: normal; font-weight: normal;
} }
#verlängerungContent { #verlängerungContent {
overflow: auto;
position: fixed; position: fixed;
margin-top: 40px; margin-top: 40px;
margin-left: 25px; margin-left: 25px;
@ -1501,6 +1505,10 @@ input[type=number] {
border-radius: 8px; border-radius: 8px;
border: 0; border: 0;
} }
#verlängerungErfolgreichButton1{
width: 220px;
}
/*Verlängerung Ende*/ /*Verlängerung Ende*/
/*Largest Devices*/ /*Largest Devices*/

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Über Uns</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body> <body>
<header> <header>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Verlängerung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script> <script src="burgerIcon.js"></script>
</head> </head>
<body> <body>
@ -31,8 +32,6 @@
</div> </div>
</header> </header>
<div class="hauptcontainer" id="verlängerung"> <div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch verlängern</h1> <h1 id="verlängerungH1">Buch verlängern</h1>
<div id="verlängerungContent"> <div id="verlängerungContent">
@ -54,7 +53,6 @@
</div> </div>
</div> </div>

View File

@ -1,10 +1,96 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html>
<head> <head>
<meta charset="UTF-8"> <meta lang="de"/>
<title>Title</title> <meta charset="utf-8"/>
<meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<title>Candle Bibliothek | Verlängerung Bestätigung</title>
<link rel="icon" href="pictures/candle.png">
<script src="burgerIcon.js"></script>
</head> </head>
<body> <body>
<header>
<h1 class="kopf" >
<br><br>
Bibliothek <a href="index.html" id="bildID"> <img id="CandleID" src="pictures/candle.png" alt="Bild von einer Kerze"
width="200" height="192"/> </a>
<br><br> Candle
</h1>
<div>
<a id="uberuns" href="uberuns.html">Über Uns</a>
<a id="buecher" href="buecher.html">Bücher</a>
<a id="meinebuecher" href="anmelden_meinebuecher.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>
<a href="anmelden_warenkorb.html" id="warenKorbID"> <img id="shoppingCard" src="pictures/shopingcart.png" alt="Bild von einem Wagen"
width="50" height="50"/> </a>
</div>
</header>
<div class="hauptcontainer" id="verlängerung">
<h1 id="verlängerungH1">Buch erfolgreich verlängert</h1>
<div id="verlängerungContent">
<p id="möchten-sie">Das Buch wurde verlängert.<br>Neues Rückgabedatum: 10.05.2023</p>
<div class="item" id="verlängerungItem">
<img src="pictures/es.jpg" alt="Es" height="200">
<div class="beschreibung">
<h2>Es</h2>
<h3>von Stephen King</h3>
<div class="b2 green">Rückgabe am: 10.05.2023</div>
</div>
</div>
<div id="verlängerungButtonContainer">
<a id = "verlängerungErfolgreichButton1" href="meinebuecher.html">Zurück zu Meine Bücher</a>
</div>
</div>
</div>
<!--Link JS file-->
<!--If it was small and got big, it calls the function only one time and doesn't do it all the time-->
<script>
var widthissue = false;
window.addEventListener("resize", function(event) {
if(window.innerWidth > 800 && widthissue) {
widthissue = false
unset()
}
else if(window.innerWidth < 800) widthissue = true;
})
</script>
<nav id="activeid" class="active">
<div class="navLinks">
<input class="nav-toggleclass"id="nav-toggle" type="checkbox" onclick="openNav()";>
<label for="nav-toggle" class="icon-burger" >
<div class="line"></div>
<div class="line"></div>
<div class="line"></div>
</label>
</div>
</nav>
<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> </body>
</html> </html>

View File

@ -6,7 +6,8 @@
<meta name="viewport" content="device=device-width, initial-scaling=1"/> <meta name="viewport" content="device=device-width, initial-scaling=1"/>
<link rel="Stylesheet" type="text/css" href="style.css"/> <link rel="Stylesheet" type="text/css" href="style.css"/>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.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> <title>Candle Bibliothek | Warenkorb</title>
<link rel="icon" href="pictures/candle.png">
</head> </head>
<body style="background-color:#987554;"> <body style="background-color:#987554;">
@ -49,7 +50,7 @@
<div id="firstItem" class="items" > <div id="firstItem" class="items" >
<img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/> <img src="pictures/percy_jackson_diebe_im_olymp.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Percy Jackson: Diebe im Olymp <a href="percy.html">Percy Jackson: Diebe im Olymp</a>
</h3> </h3>
<p class="discinItem">von Rick Riordan</p> <p class="discinItem">von Rick Riordan</p>
<a class="greenbutton" href="percy.html">Verfügbar</a> <a class="greenbutton" href="percy.html">Verfügbar</a>
@ -72,7 +73,7 @@
</div> </div>
</div> </div>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a> <a class="binPicture" href="loeschen.html"><img src="pictures/bin.png" width="25" height="25"></a>
</div> </div>
<hr style="width: 96%;"> <hr style="width: 96%;">
@ -82,7 +83,7 @@
<div id="secondItem" class="items"> <div id="secondItem" class="items">
<img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/> <img src="pictures/the_hundred_and_one_dalmatians.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
The Hundred and One Dalmatians <a href="dalmatians.html">The Hundred and One Dalmatians</a>
</h3> </h3>
<p class="discinItem">von Dodie Smith</p> <p class="discinItem">von Dodie Smith</p>
<a class="redbutton" href="dalmatians.html">Verfügbar ab: 30.04.2023</a> <a class="redbutton" href="dalmatians.html">Verfügbar ab: 30.04.2023</a>
@ -104,7 +105,7 @@
</button> </button>
</div> </div>
</div> </div>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a> <a class="binPicture" href="loeschen.html"><img src="pictures/bin.png" width="25" height="25"></a>
</div> </div>
<hr style="width: 96%;"> <hr style="width: 96%;">
@ -114,7 +115,7 @@
<div id="thirdItem" class="items"> <div id="thirdItem" class="items">
<img src="pictures/penguin_highway.jpg" width="125" height="200"/> <img src="pictures/penguin_highway.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Penguin Highway <a href="penguin.html">Penguin Highway</a>
</h3> </h3>
<p class="discinItem">von Tomihiko Morimi</p> <p class="discinItem">von Tomihiko Morimi</p>
<a class="greenbutton" href="penguin.html">Verfügbar</a> <a class="greenbutton" href="penguin.html">Verfügbar</a>
@ -136,7 +137,7 @@
</button> </button>
</div> </div>
</div> </div>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a> <a class="binPicture" href="loeschen.html"><img src="pictures/bin.png" width="25" height="25"></a>
</div> </div>
<hr style="width: 96%;"> <hr style="width: 96%;">
@ -146,7 +147,7 @@
<div id="fourthItem" class="items" > <div id="fourthItem" class="items" >
<img src="pictures/es.jpg" width="125" height="200"/> <img src="pictures/es.jpg" width="125" height="200"/>
<h3 class="headerinItem"> <h3 class="headerinItem">
Es <a href="es.html">Es</a>
</h3> </h3>
<p class="discinItem">von Stephen Kind</p> <p class="discinItem">von Stephen Kind</p>
<a class="redbutton" href="es.html" >Verfügbar ab: 10.05.2023</a> <a class="redbutton" href="es.html" >Verfügbar ab: 10.05.2023</a>
@ -168,7 +169,7 @@
</button> </button>
</div> </div>
</div> </div>
<a class="binPicture" href=""><img src="pictures/bin.png" width="25" height="25"></a> <a class="binPicture" href="loeschen.html"><img src="pictures/bin.png" width="25" height="25"></a>
</div> </div>