Refactor offerAdder layout for improved UI and accessibility
This commit is contained in:
parent
d4c58547d0
commit
b907ce3d81
111
offerAdder.php
111
offerAdder.php
@ -67,67 +67,72 @@ if ($shopsResult) {
|
||||
|
||||
include 'header.php';
|
||||
?>
|
||||
<main class="page-main" style="padding: 2rem;">
|
||||
<div class="container" style="max-width: 800px; margin: 0 auto; background: #fff; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1);">
|
||||
<h1 style="margin-bottom: 1.5rem;">Angebot hinzufügen</h1>
|
||||
<main class="auth">
|
||||
<section class="auth__grid" style="grid-template-columns: 1fr;">
|
||||
<div class="auth__card">
|
||||
<header class="auth__header">
|
||||
<h2 class="auth__title">Angebot hinzufügen</h2>
|
||||
</header>
|
||||
|
||||
<?php if ($message): ?>
|
||||
<div class="alert alert-<?php echo htmlspecialchars($messageType); ?>" style="padding:15px; margin-bottom: 20px; border-radius: 4px; background-color: <?php echo $messageType === 'success' ? '#d4edda' : '#f8d7da'; ?>; color: <?php echo $messageType === 'success' ? '#155724' : '#721c24'; ?>; border: 1px solid <?php echo $messageType === 'success' ? '#c3e6cb' : '#f5c6cb'; ?>;">
|
||||
<?php echo htmlspecialchars($message); ?>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
<?php if ($message): ?>
|
||||
<p class="<?php echo $messageType === 'success' ? 'auth__alert__sucess' : 'auth__alert__error'; ?>" style="margin-bottom: 1rem;">
|
||||
<?php echo htmlspecialchars($message); ?>
|
||||
</p>
|
||||
<?php endif; ?>
|
||||
|
||||
<form method="POST" action="offerAdder.php" style="display: flex; flex-direction: column; gap: 1.5rem;">
|
||||
<input type="hidden" name="action" value="add_offer">
|
||||
<form method="POST" action="offerAdder.php" class="auth__form">
|
||||
<input type="hidden" name="action" value="add_offer">
|
||||
|
||||
<div style="display: flex; flex-direction: column; gap: 0.5rem;">
|
||||
<label for="product_id" style="font-weight: 600;">Produkt auswählen *</label>
|
||||
<select id="product_id" name="product_id" required style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
|
||||
<option value="">-- Bitte wählen --</option>
|
||||
<?php foreach ($products as $product): ?>
|
||||
<option value="<?php echo htmlspecialchars($product['productID']); ?>" <?php echo (isset($_GET['productID']) && $_GET['productID'] == $product['productID']) ? 'selected' : ''; ?>>
|
||||
<?php echo htmlspecialchars($product['model']); ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; flex-direction: column; gap: 0.5rem;">
|
||||
<label for="shop_id" style="font-weight: 600;">Shop auswählen *</label>
|
||||
<select id="shop_id" name="shop_id" required style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
|
||||
<option value="">-- Bitte wählen --</option>
|
||||
<?php foreach ($shops as $shop): ?>
|
||||
<option value="<?php echo htmlspecialchars($shop['shopID']); ?>">
|
||||
<?php echo htmlspecialchars($shop['name']); ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; gap: 1rem;">
|
||||
<div style="flex: 1; display: flex; flex-direction: column; gap: 0.5rem;">
|
||||
<label for="price" style="font-weight: 600;">Preis (€) *</label>
|
||||
<input type="number" id="price" name="price" step="0.01" min="0" required style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
|
||||
<div class="auth__select__wrap">
|
||||
<label class="auth__select__label" for="product_id">Produkt auswählen *</label>
|
||||
<select id="product_id" name="product_id" class="auth__select" required>
|
||||
<option value="">-- Bitte wählen --</option>
|
||||
<?php foreach ($products as $product): ?>
|
||||
<option value="<?php echo htmlspecialchars($product['productID']); ?>" <?php echo (isset($_GET['productID']) && $_GET['productID'] == $product['productID']) ? 'selected' : ''; ?>>
|
||||
<?php echo htmlspecialchars($product['model']); ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div style="flex: 1; display: flex; flex-direction: column; gap: 0.5rem;">
|
||||
<label for="shipping_cost" style="font-weight: 600;">Versandkosten (€)</label>
|
||||
<input type="number" id="shipping_cost" name="shipping_cost" step="0.01" min="0" value="0.00" style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
|
||||
<div class="auth__select__wrap" style="margin-top: 1rem;">
|
||||
<label class="auth__select__label" for="shop_id">Shop auswählen *</label>
|
||||
<select id="shop_id" name="shop_id" class="auth__select" required>
|
||||
<option value="">-- Bitte wählen --</option>
|
||||
<?php foreach ($shops as $shop): ?>
|
||||
<option value="<?php echo htmlspecialchars($shop['shopID']); ?>">
|
||||
<?php echo htmlspecialchars($shop['name']); ?>
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; align-items: center; gap: 0.5rem;">
|
||||
<input type="checkbox" id="in_stock" name="in_stock" value="1" checked style="width: 18px; height: 18px;">
|
||||
<label for="in_stock" style="font-weight: 600; cursor: pointer;">Auf Lager</label>
|
||||
</div>
|
||||
<div style="display: flex; gap: 1rem; margin-top: 1rem;">
|
||||
<div style="flex: 1;">
|
||||
<label for="price" style="display: block; margin-bottom: 0.5rem; font-weight: 500; color: var(--text-muted);">Preis (€) *</label>
|
||||
<input type="number" id="price" name="price" class="auth__input" step="0.01" min="0" required>
|
||||
</div>
|
||||
<div style="flex: 1;">
|
||||
<label for="shipping_cost" style="display: block; margin-bottom: 0.5rem; font-weight: 500; color: var(--text-muted);">Versandkosten (€)</label>
|
||||
<input type="number" id="shipping_cost" name="shipping_cost" class="auth__input" step="0.01" min="0" value="0.00">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display: flex; flex-direction: column; gap: 0.5rem;">
|
||||
<label for="offer_url" style="font-weight: 600;">Angebots-URL</label>
|
||||
<input type="url" id="offer_url" name="offer_url" placeholder="https://" style="width: 100%; padding: 10px; border: 1px solid #ccc; border-radius: 4px;">
|
||||
</div>
|
||||
<div style="margin-top: 1rem; display: flex; align-items: center; gap: 0.5rem;">
|
||||
<input type="checkbox" id="in_stock" name="in_stock" value="1" checked style="width: 18px; height: 18px; accent-color: var(--primary-color);">
|
||||
<label for="in_stock" style="font-weight: 500; color: var(--text-muted); cursor: pointer;">Auf Lager</label>
|
||||
</div>
|
||||
|
||||
<button type="submit" style="padding: 12px 20px; background: #007bff; color: white; font-weight: bold; border: none; border-radius: 4px; cursor: pointer; align-self: flex-start; text-transform: uppercase; font-size: 0.9rem;">Angebot hinzufügen</button>
|
||||
</form>
|
||||
</div>
|
||||
<div style="margin-top: 1rem;">
|
||||
<label for="offer_url" style="display: block; margin-bottom: 0.5rem; font-weight: 500; color: var(--text-muted);">Angebots-URL</label>
|
||||
<input type="url" id="offer_url" name="offer_url" class="auth__input" placeholder="https://">
|
||||
</div>
|
||||
|
||||
<div class="auth__actions" style="margin-top: 1.5rem;">
|
||||
<button type="submit" class="auth__submit">Angebot hinzufügen</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
<?php include 'footer.php'; ?>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user