Initial Commit
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
||||
data
|
8
config/config.php
Normal file
@@ -0,0 +1,8 @@
|
||||
<?php
|
||||
|
||||
$servername = 'localhost';
|
||||
$username = 'wishlist';
|
||||
$db = 'wishlist';
|
||||
$password = 'R!6CIb-KxM96EC]6';
|
||||
|
||||
?>
|
7
css/bootstrap.min.css
vendored
Normal file
1
css/bootstrap.min.css.map
Normal file
7
css/bootstrap.rtl.min.css
vendored
Normal file
1
css/bootstrap.rtl.min.css.map
Normal file
8441
css/custom.css
Normal file
63
css/tweaks.css
Normal file
@@ -0,0 +1,63 @@
|
||||
@font-face {
|
||||
font-family: 'Comfortaa';
|
||||
font-style: normal;
|
||||
font-weight: 300;
|
||||
src: url(../fonts/comfortaa.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
.bd-placeholder-img {
|
||||
font-size: 1.125rem;
|
||||
text-anchor: middle;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.bd-placeholder-img-lg {
|
||||
font-size: 3.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.b-example-divider {
|
||||
height: 3rem;
|
||||
background-color: rgba(0, 0, 0, .1);
|
||||
border: solid rgba(0, 0, 0, .15);
|
||||
border-width: 1px 0;
|
||||
box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
|
||||
}
|
||||
|
||||
.b-example-vr {
|
||||
flex-shrink: 0;
|
||||
width: 1.5rem;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.bi {
|
||||
vertical-align: -.125em;
|
||||
fill: currentColor;
|
||||
}
|
||||
|
||||
.nav-scroller {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
height: 2.75rem;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
.nav-scroller .nav {
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
padding-bottom: 1rem;
|
||||
margin-top: -1px;
|
||||
overflow-x: auto;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
}
|
||||
|
||||
.card-img-top {
|
||||
width: 100%;
|
||||
height: 15vw;
|
||||
object-fit: scale-down;
|
||||
}
|
BIN
fonts/comfortaa.woff2
Normal file
BIN
img/android-chrome-192x192.png
Normal file
After Width: | Height: | Size: 14 KiB |
BIN
img/android-chrome-512x512.png
Normal file
After Width: | Height: | Size: 39 KiB |
BIN
img/apple-touch-icon.png
Normal file
After Width: | Height: | Size: 13 KiB |
BIN
img/critical.png
Normal file
After Width: | Height: | Size: 7.9 KiB |
BIN
img/favicon-16x16.png
Normal file
After Width: | Height: | Size: 545 B |
BIN
img/favicon-32x32.png
Normal file
After Width: | Height: | Size: 1.3 KiB |
BIN
img/favicon.ico
Normal file
After Width: | Height: | Size: 15 KiB |
BIN
img/info.png
Normal file
After Width: | Height: | Size: 9.6 KiB |
BIN
img/logo.png
Normal file
After Width: | Height: | Size: 5.6 KiB |
1
img/site.webmanifest
Normal file
@@ -0,0 +1 @@
|
||||
{"name":"","short_name":"","icons":[{"src":"/static/img/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/static/img/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
|
BIN
img/warn.png
Normal file
After Width: | Height: | Size: 9.4 KiB |
25
include/listgenerator.php
Normal file
@@ -0,0 +1,25 @@
|
||||
<?php
|
||||
|
||||
function generateListItem($ListItemID, $ItemImage, $ItemTitle, $ItemPrice, $ItemComment)
|
||||
{
|
||||
$formatter = new NumberFormatter('de_DE', NumberFormatter::CURRENCY);
|
||||
|
||||
echo ('
|
||||
<div class="col">
|
||||
<div class="card shadow-sm">
|
||||
<img src="' . $ItemImage . '" class="card-img-top">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">' . $ItemTitle . '</h5>
|
||||
<p class="card-text">' . $ItemComment . '</p>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary">zum Anbieter</button>
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary">Reservieren</button>
|
||||
</div>
|
||||
<small class="text-muted">' . $formatter->formatCurrency($ItemPrice / 100, 'EUR') . '</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
');
|
||||
}
|
132
index.php
Normal file
@@ -0,0 +1,132 @@
|
||||
<?php
|
||||
ini_set('display_errors', 1);
|
||||
ini_set('display_startup_errors', 1);
|
||||
error_reporting(E_ALL);
|
||||
include_once('include/listgenerator.php');
|
||||
include_once('config/config.php');
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Simple Wishlist</title>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="stylesheet" href="css/bootstrap.min.css">
|
||||
<!--<link rel="stylesheet" href="css/custom.css">-->
|
||||
<link rel="stylesheet" href="css/tweaks.css">
|
||||
<script src="js/bootstrap.bundle.min.js"></script>
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="img/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon-16x16.png">
|
||||
<link rel="manifest" href="img/site.webmanifest">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<div class="navbar navbar-dark bg-dark shadow-sm">
|
||||
<div class="container">
|
||||
<a href="#" class="navbar-brand d-flex align-items-center">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" aria-hidden="true" class="me-2" viewBox="0 0 24 24">
|
||||
<path d="M23 19a2 2 0 0 1-2 2H3a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h4l2-3h6l2 3h4a2 2 0 0 1 2 2z"></path>
|
||||
<circle cx="12" cy="13" r="4"></circle>
|
||||
</svg>
|
||||
<strong>Simple Wishlist</strong>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section class="py-5 text-center container">
|
||||
<div class="row py-lg-5">
|
||||
<div class="col-lg-6 col-md-8 mx-auto">
|
||||
<h1 class="fw-light">Album example</h1>
|
||||
<p class="lead text-muted">Something short and leading about the collection below—its contents, the creator, etc. Make it short and sweet, but not too short so folks don’t simply skip over it entirely.</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<div class="album py-5 bg-light">
|
||||
<div class="container">
|
||||
|
||||
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
|
||||
|
||||
<?php
|
||||
// Create connection
|
||||
$conn = new mysqli($servername, $username, $password, $db);
|
||||
|
||||
// Check connection
|
||||
if ($conn->connect_error) {
|
||||
die("Connection failed: " . $conn->connect_error);
|
||||
}
|
||||
$sql = "SELECT ID, title, description, image, reserved, price FROM whishes";
|
||||
$result = $conn->query($sql);
|
||||
|
||||
if ($result !== false && $result->num_rows > 0) {
|
||||
while ($row = $result->fetch_assoc()) {
|
||||
generateListItem($row['ID'], $row['image'], $row['title'], $row['price'], $row['description']);
|
||||
}
|
||||
$conn->close();
|
||||
}
|
||||
?>
|
||||
|
||||
<div class="col">
|
||||
<div class="card shadow-sm">
|
||||
<svg class="bd-placeholder-img card-img-top" width="100%" height="225" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="Placeholder: Thumbnail" preserveAspectRatio="xMidYMid slice" focusable="false">
|
||||
<title>add new Item</title>
|
||||
<rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">+</text>
|
||||
</svg>
|
||||
|
||||
<div class="card-body">
|
||||
<h5 class="card-title">new Item</h5>
|
||||
<p class="card-text">extend your wishlist by adding a new Item</p>
|
||||
<div class="d-flex justify-content-between align-items-center">
|
||||
<div class="btn-group">
|
||||
<button type="button" class="btn btn-sm btn-outline-secondary" data-bs-toggle="modal" data-bs-target="#addItemModal">Add Item</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="text-muted py-5">
|
||||
<div class="container">
|
||||
<p class="float-end mb-1">
|
||||
<a href="#">Back to top</a>
|
||||
</p>
|
||||
<p class="mb-1">Album example is © Bootstrap, but please download and customize it for yourself!</p>
|
||||
<p class="mb-0">New to Bootstrap? <a href="/">Visit the homepage</a> or read our <a href="../getting-started/introduction/">getting started guide</a>.</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Modal -->
|
||||
<div class="modal fade" id="addItemModal" tabindex="-1" aria-labelledby="addItemModalLabel" aria-hidden="true">
|
||||
<div class="modal-dialog">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h5 class="modal-title" id="addItemModalLabel">Add new Item</h5>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body">
|
||||
...
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
||||
<button type="button" class="btn btn-primary">Add new Item</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
||||
</html>
|