IP_3sem/3_laba_IP_project/index.html

177 lines
7.3 KiB
HTML
Raw Normal View History

2023-11-30 21:18:37 +04:00
<html lang="ru">
<head>
<meta charset="utf-8">
<title>Ульяновский кондитер</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="module" src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<link href="node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
<link rel="stylesheet" href="css/style.css">
</head>
<body class="h-100 d-flex flex-column">
<header>
<nav class="navbar navbar-expand-md navbar-white fixed-top">
<div class="btn_open_sidebar">
<button class="btn_open btn-primary" type="button" data-bs-toggle="offcanvas"
data-bs-target="#offcanvasScrolling" aria-controls="offcanvasScrolling"></button>
</div>
<div class="container-fluid top_pannel">
<div class="navbar-collapse collapse justify-content-start" id="navbarNav">
<div class="navbar-nav text_containter">
<div class="arrow_and_cities">
<img class="icon_top" src="src/arrow_icon.png" alt="arrow_icon">
<a class="nav-link " href="./index.html" style=" color: black;">Ульяновск</a>
</div>
<a class="nav-link adress" href="page-edit.html" style="margin-left: 40px; color: black;">Адреса
магазинов</a>
</div>
</div>
<div class="navbar-collapse collapse justify-content-end " id="navbarNav1">
<div class="navbar-nav icon-container">
<a href="page2.html">
<img class="icon_top" src="src/acc_icon.png" alt="acc_icon">
</a>
<a href="page3.html">
<img class="icon_top" src="src/shop_icon.png" alt="shop_icon">
</a>
<a href="page2.html">
<img class="icon_top" src="src/search_icon.png" alt="search_icon">
</a>
</div>
</div>
</div>
</nav>
</header>
<div class="offcanvas offcanvas-start show" data-bs-scroll="true" data-bs-backdrop="false" tabindex="-1"
id="offcanvasScrolling" aria-labelledby="offcanvasScrollingLabel">
<div class="offcanvas-header">
<a href="./index.html">
<img class="logo_sidebar" src="src/logo.png" alt="shop_icon">
</a>
<button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<div class="list_sidebar">
<div class="list_font">
<ul>
<li>Клубника в шоколаде</li>
<li>Бананы в шоколаде</li>
<li>Конфеты</li>
<li>Шоколад</li>
<li>Медианты</li>
</ul>
</div>
</div>
<div class="bottom_sidebar">
<h0>8 800 700 34 21
<div class="take_order" style="color: #25e000;">Сделать заказ</div>
</h0>
<div class="social_network">
<a href="page-admin.html" style="text-decoration: none;">
<img class="vk" src="src/whatsapp_icon.png" alt="vk">
</a>
<img class="whatsapp" src="src/vk_icon.png" alt="whatsapp">
</div>
</div>
</div>
</div>
<script>
function checkMediaQuery() {
var sidebar = document.querySelector('.offcanvas');
var button = document.querySelector('.btn-primary');
if (window.matchMedia('(max-width: 1300px)').matches) {
sidebar.classList.remove('show');
button.setAttribute('aria-expanded', 'false');
} else {
sidebar.classList.add('show');
button.setAttribute('aria-expanded', 'true');
}
}
window.addEventListener('load', checkMediaQuery);
window.addEventListener('resize', checkMediaQuery);
</script>
<main class="container main_pannel">
<h1>Клубника в шоколаде</h1>
<div id="my-id-for-text" class="container table">
</div>
</main>
<div id="items-update" class="modal fade" tabindex="-1" data-bs-backdrop="static" data-bs-keyboard="false">
<div class="modal-dialog">
<form id="items-form" class="needs-validation" novalidate>
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="items-update-title"></h1>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="text-center">
<img id="image-preview" src="https://via.placeholder.com/200" class="rounded"
alt="placeholder">
</div>
<input id="items-line-id" type="number" hidden>
<div class="mb-2 ">
<label for="item" class="form-label">Название</label>
<select id="item" class="form-select" name="selected" required>
</select>
</div>
<div class="mb-2 ">
<label class="form-label" for="price">Цена</label>
<input id="price" name="price" class="form-control" type="number" placeholder="Цена" min="0"
step="100" required>
</div>
<div class="mb-2 ">
<label class="form-label" for="price">Количество</label>
<input id="count" name="count" class="form-control" type="number" placeholder="Количество"
min="0" step="1" required>
</div>
<div class=" mb-3 ">
<label class="form-label" for="image">Изображение</label>
<input id="image" type="file" name="image" class="form-control" accept="image/*" required>
</div>
2023-12-06 20:23:44 +04:00
<div class="mb-2 width_add_object">
<label for="item" class="form-label">Скидка</label>
<select id="discounts" class="form-select" name="selected" required>
</select>
</div>
2023-11-30 21:18:37 +04:00
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Закрыть</button>
<button type="submit" class="btn btn-primary">Сохранить</button>
</div>
</div>
</form>
</div>
</div>
<script type="module">
import validation from "./js/validation";
import {linesFormOnIndex} from "./js/lines";
import {linesForm} from "./js/lines";
document.addEventListener('DOMContentLoaded', () => {
validation();
linesFormOnIndex();
linesForm();
});
</script>
</body>
</html>