PIbd-21_Danilov_V.V._Intern.../Lab3/Catalog.html
Владимир Данилов 83490711d5 отчет
2023-12-19 20:23:11 +04:00

195 lines
11 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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 = "./style.css">
</head>
<body class="h-100 d-flex flex-column">
<header>
<nav class="navbar navbar-expand-md">
<div class="container-fluid">
<a class = "navbar-brand" href = "./" style="color: #6A3502;">
<i class="fa-solid fa-microchip"></i>
Техник
</a>
<form class="d-flex">
<input class="form-control" type="search" placeholder="Поиск по сайту" aria-label="Search">
<button class="btn btn-outline-*" type="submit" style="color: #6A3502;"><i class="fa-solid fa-search"></i></button>
</form>
<a class="nav-link" href="./Login.html">Вход</a>
</div>
</nav>
</header>
<main class="container-fluid" style="background-color: antiquewhite;">
<div class="row d-flex">
<article class="col-lg-3">
<article class="nav-link" style="background-color: white;">
<div class="d-flex flex-column">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarAvailability"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<h4>Наличие в магазине</h4>
</button>
<div class="navbar-collapse collapse" id="navbarAvailability">
<div class="navbar-nav">
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox1" name="checkbox1" type="checkbox" checked>
<label class="form-check-label" for="checkbox1">В наличии</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox" checked>
<label class="form-check-label" for="checkbox2">Под заказ</label>
</div>
</li>
</div>
</div>
</article>
<article class="nav-link" style="background-color: white;">
<div class="d-flex flex-column">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarScreenDg"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<h4>Диагональ экрана (дюйм)</h4>
</button>
<div class="navbar-collapse collapse" id="navbarScreenDg">
<div class="navbar-nav">
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" type="radio" name="radio-example" id="radio0" checked>
<label class="form-check-label" for="radio0">Все</label>
</div>
</li>
<li>
<div class="form-check me-md-3">
<input class="form-check-input" type="radio" name="radio-example" id="radio1">
<label class="form-check-label" for="radio1">Менее 13.9</label>
</div>
</li>
<li>
<div class="form-check">
<input class="form-check-input" type="radio" name="radio-example" id="radio2">
<label class="form-check-label" for="radio2">14 - 14.9</label>
</div>
</li>
<li>
<div class="form-check">
<input class="form-check-input" type="radio" name="radio-example" id="radio4">
<label class="form-check-label" for="radio4">16 и более</label>
</div>
</li>
</div>
</div>
</article>
<article class="nav-link" style="background-color: white;">
<div class="d-flex flex-column">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarRAM"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<h4>Объем оперативной памяти (ГБ)</h4>
</button>
<div class="navbar-collapse collapse" id="navbarRAM">
<div class="navbar-nav">
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox1" name="checkbox1" type="checkbox">
<label class="form-check-label" for="checkbox1">4 ГБ</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">6 ГБ</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">8 ГБ</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">12 ГБ</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">16 ГБ</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">32 ГБ</label>
</div>
</li>
</div>
</div>
</article>
<article class="nav-link" style="background-color: white;">
<div class="d-flex flex-column">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCreateCPU"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<h4>Производитель процессора</h4>
</button>
<div class="navbar-collapse collapse" id="navbarCreateCPU">
<div class="navbar-nav">
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox1" name="checkbox1" type="checkbox">
<label class="form-check-label" for="checkbox1">AMD</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">Apple</label>
</div>
</li>
<li class="nav-item">
<div class="form-check">
<input class="form-check-input" id="checkbox2" name="checkbox2" type="checkbox">
<label class="form-check-label" for="checkbox2">Intel</label>
</div>
</li>
</div>
</div>
</article>
</article>
<div class="container col-lg-9">
<div id="items-catalog">
</div>
</div>
</div>
</main>
<footer class="footer mt-auto d-flex flex-shrink-0 align-items-center">
© 2023 Компания Техник. Администрация Сайта не несет ответственности за размещаемые Пользователями материалы (в т.ч. информацию и изображения), их содержание и качество.
</footer>
<script type="module">
import validation from "./js/validation";
import { linesPageForm } from "./js/lines"
document.addEventListener('DOMContentLoaded', () => {
validation();
const urlParams = new URLSearchParams(location.search);
linesPageForm(urlParams.get("id"));
});
</script>
</body>
</html>