xysiboi/PIbd-23_Baryshev_D.A._InternetProgramming_cyxarukShop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

base: xysiboi:7d3a3de5ab0ddd8a0d476aa1e5fb78bfeeec8b48
Branches Tags
xysiboi:main xysiboi:прикручиваем-back xysiboi:reports xysiboi:lab6 xysiboi:lab5 xysiboi:lab4_dop xysiboi:lab4 xysiboi:lab3 xysiboi:lab1 xysiboi:lab2
...
compare: xysiboi:lab3
Branches Tags
xysiboi:прикручиваем-back xysiboi:reports xysiboi:lab6 xysiboi:lab5 xysiboi:lab4_dop xysiboi:lab4 xysiboi:lab3 xysiboi:lab1 xysiboi:lab2 xysiboi:main

5 Commits
7d3a3de5ab ... lab3

Author SHA1 Message Date
Baryshev Dmitry
6e253891bc oh shit, here we go again 2025-09-24 18:03:04 +04:00
Baryshev Dmitry
801a6cac28 done 2025-05-17 12:54:19 +04:00
Baryshev Dmitry
684c9d7675 допка сделана 2025-05-17 11:46:00 +04:00
Baryshev Dmitry
e0cf8ff04b чтобы не потерять 2025-05-17 10:46:25 +04:00
Baryshev Dmitry
cdb7405b1f завтра 2025-05-17 01:09:49 +04:00
30 changed files with 1666 additions and 953 deletions
Expand all files Collapse all files

139
basket.html
View File

@@ -2,61 +2,102 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>cyxaruk shop catalog</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop basket</title>
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<div class="header">
<a href="main.html" class="logo">
<img src="img/cyxaruk shop logo.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="img/cyxaruk shop logo.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="img/basket.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
</div>
<div class="sad">
<h1>Здесь будут лежать твои товары, <br/> а пока здесь так пусто...</h1>
<img src="img/sad1.jpg">
</div>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="img/telega.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary?gdlkerfdnwq=101&page_from=from_item_card&iid=3935618105&sellerId=81d843720716be16ce230bba484bce75">
<img src="img/avito.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="text-center py-5">
<h1 class="mb-4">Здесь будут лежать твои товары</h1>
<p class="lead mb-4">А пока здесь так пусто...</p>
<img src="img/sad1.jpg" alt="Пустая корзина" class="img-fluid rounded" style="max-height: 300px;">
<div class="mt-4">
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-arrow-left me-2"></i>Вернуться в каталог
</a>
</div>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

337
catalog.html
View File

@@ -2,23 +2,38 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop catalog</title>
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<!-- Bootstrap CSS -->
<link href="node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Icons -->
<link rel="stylesheet" href="node_modules/bootstrap-icons/font/bootstrap-icons.css">
<!-- Минимальные кастомные стили -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
.like-btn.liked {
color: #000000 !important;
border-color: #dc3545 !important;
}
.like-btn.liked i {
color: #dc3545 !important;
}
/* Черная оконтовка при наведении на нажатую кнопку */
.like-btn.liked:hover i {
text-shadow: 0 0 2px #000000,
0 0 2px #000000,
0 0 2px #000000;
}
/* Плавное изменение */
.like-btn i {
transition: text-shadow 0.2s ease;
}
</style>
</head>
<body>
<!-- Навигация с использованием Bootstrap -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="img/cyxaruk shop logo.jpg" alt="сухарик шоп" width="60" height="60" class="rounded me-2">
<h1 class="h5 mb-0">cyxaruk shop</h1>
<img src="img/cyxaruk shop logo.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
@@ -26,142 +41,286 @@
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" role="button" data-bs-toggle="dropdown">
Каталог
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Для мужчин</a></li>
<li><a class="dropdown-item" href="#">Для женщин</a></li>
<li><a class="dropdown-item" href="#">Для детей</a></li>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Заказ из-за границы</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html">Контакты</a>
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html">
<i class="bi bi-heart-fill"></i> Избранное
</a>
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html">
<i class="bi bi-cart-fill"></i> Корзина
</a>
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<main class="container mt-5 pt-4">
<!-- Форма для добавления товаров -->
<div class="card mb-4">
<div class="card-body">
<h2 class="card-title">Добавить новый товар</h2>
<form id="addProductForm" class="row g-3">
<div class="col-md-6">
<label for="productName" class="form-label">Название товара</label>
<input type="text" class="form-control" id="productName" required>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="accordion" id="accordionExample" >
<div class="accordion-item" >
<h2 class="accordion-header" id="headingOne" >
<button class="accordion-button" type="button" data-bs-toggle="collapse" style="background-color: #b0d8ff;" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Добавить товар
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<div class="card mb-4 border-0 shadow">
<div class="card-body">
<form id="addProductForm" class="row g-3">
<div class="col-md-6">
<label for="productName" class="form-label">Название товара</label>
<input type="text" class="form-control" id="productName" required>
</div>
<div class="col-md-6">
<label for="productPrice" class="form-label">Цена</label>
<input type="text" class="form-control" id="productPrice" required>
</div>
<div class="col-12">
<label for="productDescription" class="form-label">Описание</label>
<textarea class="form-control" id="productDescription" rows="3" required></textarea>
</div>
<div class="col-12">
<label for="productImage" class="form-label">Ссылка на изображение</label>
<input type="text" class="form-control" id="productImage" required>
</div>
<div class="col-12">
<button type="submit" class="btn" style="background-color: #00264d; color: white;">
<i class="bi bi-check-circle me-2"></i>Добавить товар
</button>
</div>
</form>
</div>
</div>
</div>
<div class="col-md-6">
<label for="productPrice" class="form-label">Цена</label>
<input type="text" class="form-control" id="productPrice" required>
</div>
<div class="col-12">
<label for="productDescription" class="form-label">Описание</label>
<textarea class="form-control" id="productDescription" rows="3" required></textarea>
</div>
<div class="col-12">
<label for="productImage" class="form-label">Ссылка на изображение</label>
<input type="text" class="form-control" id="productImage" required>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary">
<i class="bi bi-plus-circle"></i> Добавить товар
</button>
</div>
</form>
</div>
</div>
</div>
<h1 class="text-center mb-4 mt-2">Каталог товаров</h1>
<!-- Карточки товаров -->
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4" id="productsContainer">
<!-- Товары будут добавляться сюда через JS -->
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4 mb-5" id="productsContainer">
<!-- Карточка товара 1 -->
<div class="col">
<div class="card h-100">
<div class="card h-100 border-0 shadow">
<img src="img/stonik.jpg" class="card-img-top" alt="Stone Island">
<div class="card-body">
<h5 class="card-title">Stone Island</h5>
<p class="card-text">super idol rovny pacan,<br> groza rayona, mother's modnik,<br> патч на месте</p>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, патч на месте</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$1999.99</span>
<button class="btn btn-sm btn-outline-primary">
<i class="bi bi-cart-plus"></i> В корзину
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-heart"></i>
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i>
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Остальные товары в аналогичном формате -->
<!-- Карточка товара 2 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="img/adidas.jpg" class="card-img-top" alt="Adidas">
<div class="card-body">
<h5 class="card-title">Adidas</h5>
<p class="card-text">sportik, street, baskemtball, air, old school</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$19.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 3 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="img/napapisaj.jpg" class="card-img-top" alt="Napapisaj">
<div class="card-body">
<h5 class="card-title">Napapisaj</h5>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, +rep from brothers</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$1499.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 4 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="img/lacoste.png" class="card-img-top" alt="Lacoste">
<div class="card-body">
<h5 class="card-title">Lacoste</h5>
<p class="card-text">style, nice, mother's modnik, cotton, krokodil</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$399.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 5 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="img/samba.png" class="card-img-top" alt="Samba">
<div class="card-body">
<h5 class="card-title">Samba</h5>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, +rep from brothers</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$449.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
</div>
</main>
<!-- Футер -->
<footer class="bg-dark text-white py-4 mt-5">
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-1"></i>
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop fs-1"></i>
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end mt-3 mt-md-0">
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p>89876320523</p>
<p>Ульяновск, Россия</p>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<!-- Bootstrap JS -->
<script src="node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<!-- Скрипт для добавления товаров -->
<script>
document.getElementById('addProductForm').addEventListener('submit', function(e) {
function handleLikeButtonClick() {
const icon = this.querySelector("i");
this.classList.toggle("liked");
if (this.classList.contains("liked")) {
this.classList.remove("btn-outline-secondary");
this.classList.add("btn-outline-danger");
icon.classList.remove("bi-heart");
icon.classList.add("bi-heart-fill");
} else {
this.classList.remove("btn-outline-danger");
this.classList.add("btn-outline-secondary");
icon.classList.remove("bi-heart-fill");
icon.classList.add("bi-heart");
}
}
document.querySelectorAll(".like-btn").forEach((button) => {
button.addEventListener("click", handleLikeButtonClick);
});
document.getElementById("addProductForm").addEventListener("submit", function (e) {
e.preventDefault();
const name = document.getElementById('productName').value;
const price = document.getElementById('productPrice').value;
const description = document.getElementById('productDescription').value;
const image = document.getElementById('productImage').value;
const name = document.getElementById("productName").value;
const price = document.getElementById("productPrice").value;
const description = document.getElementById("productDescription").value;
const image = document.getElementById("productImage").value;
const productCard = `
<div class="col">
<div class="card h-100">
<div class="card h-100 border-0 shadow">
<img src="${image}" class="card-img-top" alt="${name}">
<div class="card-body">
<h5 class="card-title">${name}</h5>
@@ -170,24 +329,28 @@
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">${price}</span>
<button class="btn btn-sm btn-outline-primary">
<i class="bi bi-cart-plus"></i> В корзину
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-heart"></i>
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i>
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
`;
document.getElementById('productsContainer').insertAdjacentHTML('beforeend', productCard);
const container = document.getElementById("productsContainer");
container.insertAdjacentHTML("beforeend", productCard);
container.lastElementChild.querySelector(".like-btn").addEventListener("click", handleLikeButtonClick);
this.reset();
});
</script>

234
contacts.html
View File

@@ -1,95 +1,163 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>cyxaruk shop contacts</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop contacts</title>
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/styles.css" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
html, body {
height: 100%;
}
body {
display: flex;
flex-direction: column;
color: #00264d;
}
main {
flex: 1 0 auto;
}
footer {
flex-shrink: 0;
}
.table-custom {
background-color: #00264d;
color: white;
}
.table-custom thead th {
background-color: #001a3a;
color: white;
}
.table-custom tbody tr:hover {
background-color: #003366;
color: white;
}
</style>
</head>
<body>
<div class="content">
<header class="header">
<a href="main.html" class="logo">
<img src="img/cyxaruk shop logo.jpg" alt="сухарик шоп" />
<h1>cyxaruk shop</h1>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="img/basket.png" width="50" height="50" alt="корзина" />
</a></li>
</ul>
</header>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="img/cyxaruk shop logo.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<main class="main">
<div class="table-wrapper">
<table>
<caption>Контакты (звонить только в поддержку)</caption>
<thead>
<tr>
<th>ФИО</th>
<th>Должность</th>
<th>Телефон</th>
<th>Телеграм</th>
</tr>
</thead>
<tbody>
<tr>
<td>Платонов Артемий Михайлович</td>
<td>Администрация / продавец</td>
<td>89876320523</td>
<td>@RBCScyxaruk</td>
</tr>
<tr>
<td>Ауц Евгений Валерьевич</td>
<td>Продавец / поддержка круглосуточная</td>
<td>89021263060</td>
<td>@yevgenauts</td>
</tr>
<tr>
<td>Данилюк Анжела</td>
<td>Продавец / консультант</td>
<td>89176235020</td>
<td>@bomzhela</td>
</tr>
</tbody>
</table>
</div>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<h1 class="text-center mb-4">Контакты</h1>
<div class="card border-0 shadow-sm mb-4">
<div class="card-header" style="background-color: #00264d; color: white;">
<h5 class="mb-0"><i class="bi bi-info-circle me-2"></i>Контактная информация</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-custom table-striped table-hover">
<caption class="text-dark">Контакты (звонить только в поддержку)</caption>
<thead>
<tr>
<th>ФИО</th>
<th>Должность</th>
<th>Телефон</th>
<th>Телеграм</th>
</tr>
</thead>
<tbody>
<tr>
<td>Платонов Артемий Михайлович</td>
<td>Администрация / продавец</td>
<td>89876320523</td>
<td>@RBCScyxaruk</td>
</tr>
<tr>
<td>Ауц Евгений Валерьевич</td>
<td>Продавец / поддержка круглосуточная</td>
<td>89021263060</td>
<td>@yevgenauts</td>
</tr>
<tr>
<td>Данилюк Анжела</td>
<td>Продавец / консультант</td>
<td>89176235020</td>
<td>@bomzhela</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</main>
<footer class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="img/telega.png" width="100" height="100" alt="Telegram" />
</a>
<h2>← also follow us on tg</h2>
<footer class="py-4" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary">
<img src="img/avito.png" width="80" height="80" alt="Avito" />
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
</div>
</footer>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

7
css/bootstrap.min.css vendored
View File

File diff suppressed because one or more lines are too long

35
css/styles.css
View File

@@ -1,35 +0,0 @@
/* Кастомные цвета */
.bg-primary {
background-color: #112d4e !important;
}
/* Отступ для фиксированной навигации */
body {
padding-top: 56px;
}
/* Кастомные карточки */
.card {
transition: transform 0.2s;
}
.card:hover {
transform: translateY(-5px);
}
/* Адаптация изображений */
.card-img-top {
height: 200px;
object-fit: cover;
}
/* Кастомные кнопки */
.btn-outline-primary {
--bs-btn-hover-bg: #112d4e;
}
/* Адаптация для мобильных */
@media (max-width: 768px) {
.navbar-brand h1 {
font-size: 1rem;
}
}

BIN
dist/assets/adidas-gadQV-Lz.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 219 KiB

BIN
dist/assets/ava-DiHUHyvl.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

BIN
dist/assets/avito-CsvEEyyf.png vendored
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 28 KiB

BIN
dist/assets/basket-CMXx_bEF.png vendored
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 11 KiB

6
dist/assets/bootstrap-CvKP2mzs.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
dist/assets/bootstrap-icons-BOrJxbIo.woff vendored
View File

Binary file not shown.

BIN
dist/assets/bootstrap-icons-BtvjY1KL.woff2 vendored
View File

Binary file not shown.

BIN
dist/assets/lacoste-BSTUvTkt.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.5 MiB

BIN
dist/assets/napapisaj-DNuXYAGR.jpg vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 260 KiB

9
dist/assets/page2-CE6iOV0z.css vendored
View File

File diff suppressed because one or more lines are too long

BIN
dist/assets/samba-C8wu5LAG.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 MiB

1
dist/assets/styles-hlLHg5xD.css vendored
View File

@@ -1 +0,0 @@
.bg-primary{background-color:#112d4e!important}body{padding-top:56px}.card{transition:transform .2s}.card:hover{transform:translateY(-5px)}.card-img-top{height:200px;object-fit:cover}.btn-outline-primary{--bs-btn-hover-bg: #112d4e}@media (max-width: 768px){.navbar-brand h1{font-size:1rem}}

BIN
dist/assets/telega-CVjeM3Sj.png vendored
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 30 KiB

165
dist/basket.html vendored
View File

@@ -1,62 +1,103 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
<title>cyxaruk shop catalog</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link rel="stylesheet" crossorigin href="/assets/bootstrap-CvKP2mzs.css">
<link rel="stylesheet" crossorigin href="/assets/styles-hlLHg5xD.css">
</head>
<body>
<div class="header">
<a href="main.html" class="logo">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="/assets/basket-CMXx_bEF.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
</div>
<div class="sad">
<h1>Здесь будут лежать твои товары, <br/> а пока здесь так пусто...</h1>
<img src="/assets/sad1-DBuXZxMU.jpg">
</div>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="/assets/telega-CVjeM3Sj.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary?gdlkerfdnwq=101&page_from=from_item_card&iid=3935618105&sellerId=81d843720716be16ce230bba484bce75">
<img src="/assets/avito-CsvEEyyf.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop basket</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="text-center py-5">
<h1 class="mb-4">Здесь будут лежать твои товары</h1>
<p class="lead mb-4">А пока здесь так пусто...</p>
<img src="/assets/sad1-DBuXZxMU.jpg" alt="Пустая корзина" class="img-fluid rounded" style="max-height: 300px;">
<div class="mt-4">
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-arrow-left me-2"></i>Вернуться в каталог
</a>
</div>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

550
dist/catalog.html vendored
View File

@@ -1,194 +1,358 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>cyxaruk shop catalog</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<!-- Bootstrap CSS -->
<!-- Bootstrap Icons -->
<!-- Минимальные кастомные стили -->
<link rel="stylesheet" crossorigin href="/assets/page2-CE6iOV0z.css">
<link rel="stylesheet" crossorigin href="/assets/styles-hlLHg5xD.css">
</head>
<body>
<!-- Навигация с использованием Bootstrap -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="сухарик шоп" width="60" height="60" class="rounded me-2">
<h1 class="h5 mb-0">cyxaruk shop</h1>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" role="button" data-bs-toggle="dropdown">
Каталог
</a>
<ul class="dropdown-menu">
<li><a class="dropdown-item" href="#">Для мужчин</a></li>
<li><a class="dropdown-item" href="#">Для женщин</a></li>
<li><a class="dropdown-item" href="#">Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#">Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html">Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html">
<i class="bi bi-heart-fill"></i> Избранное
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html">
<i class="bi bi-cart-fill"></i> Корзина
</a>
</li>
</ul>
</div>
</div>
</nav>
<main class="container mt-5 pt-4">
<!-- Форма для добавления товаров -->
<div class="card mb-4">
<div class="card-body">
<h2 class="card-title">Добавить новый товар</h2>
<form id="addProductForm" class="row g-3">
<div class="col-md-6">
<label for="productName" class="form-label">Название товара</label>
<input type="text" class="form-control" id="productName" required>
</div>
<div class="col-md-6">
<label for="productPrice" class="form-label">Цена</label>
<input type="text" class="form-control" id="productPrice" required>
</div>
<div class="col-12">
<label for="productDescription" class="form-label">Описание</label>
<textarea class="form-control" id="productDescription" rows="3" required></textarea>
</div>
<div class="col-12">
<label for="productImage" class="form-label">Ссылка на изображение</label>
<input type="text" class="form-control" id="productImage" required>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary">
<i class="bi bi-plus-circle"></i> Добавить товар
</button>
</div>
</form>
</div>
</div>
<!-- Карточки товаров -->
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4" id="productsContainer">
<!-- Товары будут добавляться сюда через JS -->
<div class="col">
<div class="card h-100">
<img src="/assets/stonik-D_cwcHTM.jpg" class="card-img-top" alt="Stone Island">
<div class="card-body">
<h5 class="card-title">Stone Island</h5>
<p class="card-text">super idol rovny pacan,<br> groza rayona, mother's modnik,<br> патч на месте</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$1999.99</span>
<button class="btn btn-sm btn-outline-primary">
<i class="bi bi-cart-plus"></i> В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-heart"></i>
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i>
</button>
</div>
</div>
</div>
</div>
<!-- Остальные товары в аналогичном формате -->
</div>
</main>
<!-- Футер -->
<footer class="bg-dark text-white py-4 mt-5">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-1"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop fs-1"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end mt-3 mt-md-0">
<h5>Контакты</h5>
<p>89876320523</p>
<p>Ульяновск, Россия</p>
</div>
</div>
</div>
</footer>
<!-- Bootstrap JS -->
<script src="node_modules/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<!-- Скрипт для добавления товаров -->
<script>
document.getElementById('addProductForm').addEventListener('submit', function(e) {
e.preventDefault();
const name = document.getElementById('productName').value;
const price = document.getElementById('productPrice').value;
const description = document.getElementById('productDescription').value;
const image = document.getElementById('productImage').value;
const productCard = `
<div class="col">
<div class="card h-100">
<img src="${image}" class="card-img-top" alt="${name}">
<div class="card-body">
<h5 class="card-title">${name}</h5>
<p class="card-text">${description}</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">${price}</span>
<button class="btn btn-sm btn-outline-primary">
<i class="bi bi-cart-plus"></i> В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-heart"></i>
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i>
</button>
</div>
</div>
</div>
</div>
`;
document.getElementById('productsContainer').insertAdjacentHTML('beforeend', productCard);
this.reset();
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop catalog</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
.like-btn.liked {
color: #000000 !important;
border-color: #dc3545 !important;
}
.like-btn.liked i {
color: #dc3545 !important;
}
/* Черная оконтовка при наведении на нажатую кнопку */
.like-btn.liked:hover i {
text-shadow: 0 0 2px #000000,
0 0 2px #000000,
0 0 2px #000000;
}
/* Плавное изменение */
.like-btn i {
transition: text-shadow 0.2s ease;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="accordion" id="accordionExample" >
<div class="accordion-item" >
<h2 class="accordion-header" id="headingOne" >
<button class="accordion-button" type="button" data-bs-toggle="collapse" style="background-color: #b0d8ff;" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Добавить товар
</button>
</h2>
<div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
<div class="accordion-body">
<div class="card mb-4 border-0 shadow">
<div class="card-body">
<form id="addProductForm" class="row g-3">
<div class="col-md-6">
<label for="productName" class="form-label">Название товара</label>
<input type="text" class="form-control" id="productName" required>
</div>
<div class="col-md-6">
<label for="productPrice" class="form-label">Цена</label>
<input type="text" class="form-control" id="productPrice" required>
</div>
<div class="col-12">
<label for="productDescription" class="form-label">Описание</label>
<textarea class="form-control" id="productDescription" rows="3" required></textarea>
</div>
<div class="col-12">
<label for="productImage" class="form-label">Ссылка на изображение</label>
<input type="text" class="form-control" id="productImage" required>
</div>
<div class="col-12">
<button type="submit" class="btn" style="background-color: #00264d; color: white;">
<i class="bi bi-check-circle me-2"></i>Добавить товар
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</div>
<h1 class="text-center mb-4 mt-2">Каталог товаров</h1>
<!-- Карточки товаров -->
<div class="row row-cols-1 row-cols-md-2 row-cols-lg-3 g-4 mb-5" id="productsContainer">
<!-- Карточка товара 1 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="/assets/stonik-D_cwcHTM.jpg" class="card-img-top" alt="Stone Island">
<div class="card-body">
<h5 class="card-title">Stone Island</h5>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, патч на месте</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$1999.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 2 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="/assets/adidas-gadQV-Lz.jpg" class="card-img-top" alt="Adidas">
<div class="card-body">
<h5 class="card-title">Adidas</h5>
<p class="card-text">sportik, street, baskemtball, air, old school</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$19.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 3 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="/assets/napapisaj-DNuXYAGR.jpg" class="card-img-top" alt="Napapisaj">
<div class="card-body">
<h5 class="card-title">Napapisaj</h5>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, +rep from brothers</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$1499.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 4 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="/assets/lacoste-BSTUvTkt.png" class="card-img-top" alt="Lacoste">
<div class="card-body">
<h5 class="card-title">Lacoste</h5>
<p class="card-text">style, nice, mother's modnik, cotton, krokodil</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$399.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
<!-- Карточка товара 5 -->
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="/assets/samba-C8wu5LAG.png" class="card-img-top" alt="Samba">
<div class="card-body">
<h5 class="card-title">Samba</h5>
<p class="card-text">super idol rovny pacan, groza rayona, mother's modnik, +rep from brothers</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">$449.99</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
function handleLikeButtonClick() {
const icon = this.querySelector("i");
this.classList.toggle("liked");
if (this.classList.contains("liked")) {
this.classList.remove("btn-outline-secondary");
this.classList.add("btn-outline-danger");
icon.classList.remove("bi-heart");
icon.classList.add("bi-heart-fill");
} else {
this.classList.remove("btn-outline-danger");
this.classList.add("btn-outline-secondary");
icon.classList.remove("bi-heart-fill");
icon.classList.add("bi-heart");
}
}
document.querySelectorAll(".like-btn").forEach((button) => {
button.addEventListener("click", handleLikeButtonClick);
});
document.getElementById("addProductForm").addEventListener("submit", function (e) {
e.preventDefault();
const name = document.getElementById("productName").value;
const price = document.getElementById("productPrice").value;
const description = document.getElementById("productDescription").value;
const image = document.getElementById("productImage").value;
const productCard = `
<div class="col">
<div class="card h-100 border-0 shadow">
<img src="${image}" class="card-img-top" alt="${name}">
<div class="card-body">
<h5 class="card-title">${name}</h5>
<p class="card-text">${description}</p>
</div>
<div class="card-footer bg-transparent">
<div class="d-flex justify-content-between align-items-center">
<span class="text-muted">${price}</span>
<button class="btn btn-sm" style="background-color: #00264d; color: white;">
<i class="bi bi-cart-plus me-1"></i>В корзину
</button>
</div>
<div class="mt-2 d-flex justify-content-between">
<button class="btn btn-sm btn-outline-secondary like-btn">
<i class="bi bi-heart"></i> В избранное
</button>
<button class="btn btn-sm btn-outline-secondary">
<i class="bi bi-share"></i> Поделиться
</button>
</div>
</div>
</div>
</div>
`;
const container = document.getElementById("productsContainer");
container.insertAdjacentHTML("beforeend", productCard);
container.lastElementChild.querySelector(".like-btn").addEventListener("click", handleLikeButtonClick);
this.reset();
});
</script>
</body>
</html>

258
dist/contacts.html vendored
View File

@@ -1,95 +1,163 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>cyxaruk shop contacts</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link rel="stylesheet" crossorigin href="/assets/bootstrap-CvKP2mzs.css">
<link rel="stylesheet" crossorigin href="/assets/styles-hlLHg5xD.css">
</head>
<body>
<div class="content">
<header class="header">
<a href="main.html" class="logo">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="сухарик шоп" />
<h1>cyxaruk shop</h1>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="/assets/basket-CMXx_bEF.png" width="50" height="50" alt="корзина" />
</a></li>
</ul>
</header>
<main class="main">
<div class="table-wrapper">
<table>
<caption>Контакты (звонить только в поддержку)</caption>
<thead>
<tr>
<th>ФИО</th>
<th>Должность</th>
<th>Телефон</th>
<th>Телеграм</th>
</tr>
</thead>
<tbody>
<tr>
<td>Платонов Артемий Михайлович</td>
<td>Администрация / продавец</td>
<td>89876320523</td>
<td>@RBCScyxaruk</td>
</tr>
<tr>
<td>Ауц Евгений Валерьевич</td>
<td>Продавец / поддержка круглосуточная</td>
<td>89021263060</td>
<td>@yevgenauts</td>
</tr>
<tr>
<td>Данилюк Анжела</td>
<td>Продавец / консультант</td>
<td>89176235020</td>
<td>@bomzhela</td>
</tr>
</tbody>
</table>
</div>
</main>
<footer class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="/assets/telega-CVjeM3Sj.png" width="100" height="100" alt="Telegram" />
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary">
<img src="/assets/avito-CsvEEyyf.png" width="80" height="80" alt="Avito" />
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
</div>
</footer>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop contacts</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
html, body {
height: 100%;
}
body {
display: flex;
flex-direction: column;
color: #00264d;
}
main {
flex: 1 0 auto;
}
footer {
flex-shrink: 0;
}
.table-custom {
background-color: #00264d;
color: white;
}
.table-custom thead th {
background-color: #001a3a;
color: white;
}
.table-custom tbody tr:hover {
background-color: #003366;
color: white;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<h1 class="text-center mb-4">Контакты</h1>
<div class="card border-0 shadow-sm mb-4">
<div class="card-header" style="background-color: #00264d; color: white;">
<h5 class="mb-0"><i class="bi bi-info-circle me-2"></i>Контактная информация</h5>
</div>
<div class="card-body">
<div class="table-responsive">
<table class="table table-custom table-striped table-hover">
<caption class="text-dark">Контакты (звонить только в поддержку)</caption>
<thead>
<tr>
<th>ФИО</th>
<th>Должность</th>
<th>Телефон</th>
<th>Телеграм</th>
</tr>
</thead>
<tbody>
<tr>
<td>Платонов Артемий Михайлович</td>
<td>Администрация / продавец</td>
<td>89876320523</td>
<td>@RBCScyxaruk</td>
</tr>
<tr>
<td>Ауц Евгений Валерьевич</td>
<td>Продавец / поддержка круглосуточная</td>
<td>89021263060</td>
<td>@yevgenauts</td>
</tr>
<tr>
<td>Данилюк Анжела</td>
<td>Продавец / консультант</td>
<td>89176235020</td>
<td>@bomzhela</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</main>
<footer class="py-4" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

147
dist/likes.html vendored
View File

@@ -2,65 +2,102 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>cyxaruk shop catalog</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop likes</title>
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link rel="stylesheet" crossorigin href="/assets/bootstrap-CvKP2mzs.css">
<link rel="stylesheet" crossorigin href="/assets/styles-hlLHg5xD.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<div class="content">
<div class="header">
<a href="main.html" class="logo">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">User</a></li>
<li><a href="basket.html">
<img src="/assets/basket-CMXx_bEF.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
</div>
<div class="sad">
<h1>Здесь будут лежать товары, которые тебе понравились, <br/> а пока здесь так пусто...</h1>
<img src="/assets/sad2-GwJVM7cz.jpeg" width="500" height="300">
</div>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="/assets/telega-CVjeM3Sj.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary?gdlkerfdnwq=101&page_from=from_item_card&iid=3935618105&sellerId=81d843720716be16ce230bba484bce75">
<img src="/assets/avito-CsvEEyyf.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="text-center py-5">
<h1 class="mb-4">Здесь будут лежать товары, которые тебе понравились</h1>
<p class="lead mb-4">А пока здесь так пусто...</p>
<img src="/assets/sad2-GwJVM7cz.jpeg" alt="Пустое избранное" class="img-fluid rounded" style="max-height: 300px;">
<div class="mt-4">
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-heart me-2"></i>Найти что-то интересное
</a>
</div>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

259
dist/main.html vendored
View File

@@ -2,129 +2,174 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop</title>
<link rel="stylesheet" crossorigin href="/assets/bootstrap-CvKP2mzs.css">
<link rel="stylesheet" crossorigin href="/assets/styles-hlLHg5xD.css">
<link rel="shortcut icon" href="/assets/favicon-cXvr3Sfo.ico" type="image/x-icon">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
body {
color: #00264d;
}
</style>
</head>
<body>
<div class="content">
<div class="header">
<a href="main.html" class="logo">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="/assets/cyxaruk%20shop%20logo-DRloma41.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="/assets/basket-CMXx_bEF.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="row align-items-center mb-5">
<div class="col-md-6 mb-4 mb-md-0">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B82-CnCqIiH2.jpg" alt="Промо" class="img-fluid rounded shadow">
</div>
<div class="col-md-6 text-center text-md-end d-flex flex-column align-items-md-center">
<h2 class="fw-bold mb-3"><em>Official cyxaruk shop website</em></h2>
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-bag me-2"></i>Начать покупки
</a>
</div>
</div>
<main class="main">
<div class="promo-section">
<div class="image-container">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B82-CnCqIiH2.jpg" alt="Шмотки">
</div>
<div class="text-container">
<h2> <em>Official cyxaruk shop website</em> </h2>
<a href="catalog.html" class="button"> Go shopping </a>
<div class="text-center mb-5">
<h1 class="fw-bold">ONLY THE FATTEST STUFF</h1>
</div>
<div class="row g-4 mb-5">
<div class="col-md-6">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B8-mMMCdlPj.jpg" alt="Товары 1" class="img-fluid rounded shadow">
</div>
<div class="col-md-6">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B831-TxMfC034.jpg" alt="Товары 2" class="img-fluid rounded shadow">
</div>
</div>
<h2 class="text-center mb-4"><em>Отзывы</em></h2>
<div class="row g-4">
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="/assets/ava-DiHUHyvl.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="AUC EVGEN">
<h5 class="card-title">AUC EVGEN</h5>
<p class="card-text">Сотрудничаем уже 7 лет, все четко</p>
</div>
</div>
</div>
<div class="text-container">
<h1>ONLY THE FATTEST STUFF</h1>
</div>
<div class="page">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B8-mMMCdlPj.jpg" alt="шмотки1">
<img src="/assets/%D1%88%D0%BC%D0%BE%D1%82%D0%BA%D0%B831-TxMfC034.jpg" alt="шмотки2">
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="/assets/ava-DiHUHyvl.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Vupava Kitalya">
<h5 class="card-title">Vupava Kitalya</h5>
<p class="card-text">Просил найти его бренд Napapisaj, очень редкая штука, но он справился, 10/10</p>
</div>
</div>
</div>
<h1><em>Отзывы</em></h1>
<div class="feedback">
<div class="column">
<div class="avatar"></div>
<h3 class="username">Pistoletov Sasha</h3>
<p class="comment">
стон 1200 рублей и расход, го можно пж?
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">AUC EVGEN</h3>
<p class="comment">
Сотрудничаем уже 7 лет, все четко
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Vupava Kitalya</h3>
<p class="comment">
Просил найти его бренд Napapisaj, очень редкая штука, но он справился, 10/10
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Anjela Danil</h3>
<p class="comment">
Норм продавец, 9/10, пук пук
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Hater228</h3>
<p class="comment">
Как от ****** отойдешь, цену поменяй, клоун
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Bima Daryshev</h3>
<p class="comment">
При покупке не возникло никаких проблем, предоставляет огромное кол-во скидок
</p>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="/assets/ava-DiHUHyvl.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Hater228">
<h5 class="card-title">Hater228</h5>
<p class="card-text">Как от ****** отойдешь, цену поменяй, клоун</p>
</div>
</div>
</div>
</main>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="/assets/telega-CVjeM3Sj.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/...">
<img src="/assets/avito-CsvEEyyf.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="/assets/ava-DiHUHyvl.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Anjela Danil">
<h5 class="card-title">Anjela Danil</h5>
<p class="card-text">Норм продавец, 9/10, пук пук</p>
</div>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="/assets/ava-DiHUHyvl.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Bima Daryshev">
<h5 class="card-title">Bima Daryshev</h5>
<p class="card-text">При покупке не возникло никаких проблем, предоставляет огромное кол-во скидок</p>
</div>
</div>
</div>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

BIN
img/ava.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB

7
js/bootstrap.bundle.min.js vendored
View File

File diff suppressed because one or more lines are too long

143
likes.html
View File

@@ -2,63 +2,102 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>cyxaruk shop catalog</title>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop likes</title>
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
</head>
<body>
<div class="content">
<div class="header">
<a href="main.html" class="logo">
<img src="img/cyxaruk shop logo.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="img/cyxaruk shop logo.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">User</a></li>
<li><a href="basket.html">
<img src="img/basket.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
</div>
<div class="sad">
<h1>Здесь будут лежать товары, которые тебе понравились, <br/> а пока здесь так пусто...</h1>
<img src="img/sad2.jpeg" width="500" height="300">
</div>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="img/telega.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/6f43f8798e9eb61c3350f391762e98b3/all/odezhda_obuv_aksessuary?gdlkerfdnwq=101&page_from=from_item_card&iid=3935618105&sellerId=81d843720716be16ce230bba484bce75">
<img src="img/avito.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="text-center py-5">
<h1 class="mb-4">Здесь будут лежать товары, которые тебе понравились</h1>
<p class="lead mb-4">А пока здесь так пусто...</p>
<img src="img/sad2.jpeg" alt="Пустое избранное" class="img-fluid rounded" style="max-height: 300px;">
<div class="mt-4">
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-heart me-2"></i>Найти что-то интересное
</a>
</div>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
</html>

257
main.html
View File

@@ -2,127 +2,174 @@
<html lang="ru">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="css/styles.css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>cyxaruk shop</title>
<link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css">
<link rel="stylesheet" href="css/styles.css" />
<style>
body {
color: #00264d;
}
</style>
</head>
<body>
<div class="content">
<div class="header">
<a href="main.html" class="logo">
<img src="img/cyxaruk shop logo.jpg" alt="сухарик шоп">
<h1>cyxaruk shop</h1>
<nav class="navbar navbar-expand-lg navbar-dark" style="background-color: #00264d;">
<div class="container">
<a class="navbar-brand d-flex align-items-center" href="main.html">
<img src="img/cyxaruk shop logo.jpg" alt="логотип" width="50" height="50" class="rounded-circle me-2">
<span class="fw-bold">cyxaruk shop</span>
</a>
<ul class="menu">
<li class="dropdown">
<a href="catalog.html">Catalog ▾</a>
<ul class="features-menu">
<li><a href="#">For Men</a></li>
<li><a href="#">For Women</a></li>
<li><a href="#">For Kids</a></li>
<li><a href="#">Order from abroad</a></li>
</ul>
</li>
<li><a href="contacts.html">Contacts</a></li>
<li><a href="likes.html">Likes</a></li>
<li><a href="basket.html">
<img src="img/basket.png" width="50" height="50" alt="корзина">
</a></li>
</ul>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="catalog.html" id="navbarDropdown" role="button"
data-bs-toggle="dropdown" aria-expanded="false">
<i class="bi bi-list-ul me-1"></i>Каталог
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-male me-2"></i>Для мужчин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-gender-female me-2"></i>Для женщин</a></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-emoji-smile me-2"></i>Для детей</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="#"><i class="bi bi-globe me-2"></i>Заказ из-за границы</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="contacts.html"><i class="bi bi-telephone me-1"></i>Контакты</a>
</li>
<li class="nav-item">
<a class="nav-link" href="likes.html"><i class="bi bi-heart me-1"></i>Избранное</a>
</li>
<li class="nav-item">
<a class="nav-link" href="basket.html"><i class="bi bi-cart me-1"></i>Корзина</a>
</li>
</ul>
</div>
</div>
</nav>
<style>
@media (min-width: 992px) {
.navbar .dropdown:hover .dropdown-menu {
display: block;
}
.navbar .dropdown .dropdown-menu {
margin-top: 0;
}
}
</style>
<main class="container my-4">
<div class="row align-items-center mb-5">
<div class="col-md-6 mb-4 mb-md-0">
<img src="img/шмотки2.jpg" alt="Промо" class="img-fluid rounded shadow">
</div>
<div class="col-md-6 text-center text-md-end d-flex flex-column align-items-md-center">
<h2 class="fw-bold mb-3"><em>Official cyxaruk shop website</em></h2>
<a href="catalog.html" class="btn btn-lg" style="background-color: #00264d; color: white;">
<i class="bi bi-bag me-2"></i>Начать покупки
</a>
</div>
</div>
<main class="main">
<div class="promo-section">
<div class="image-container">
<img src="img/шмотки2.jpg" alt="Шмотки">
</div>
<div class="text-container">
<h2> <em>Official cyxaruk shop website</em> </h2>
<a href="catalog.html" class="button"> Go shopping </a>
<div class="text-center mb-5">
<h1 class="fw-bold">ONLY THE FATTEST STUFF</h1>
</div>
<div class="row g-4 mb-5">
<div class="col-md-6">
<img src="img/шмотки.jpg" alt="Товары 1" class="img-fluid rounded shadow">
</div>
<div class="col-md-6">
<img src="img/шмотки31.jpg" alt="Товары 2" class="img-fluid rounded shadow">
</div>
</div>
<h2 class="text-center mb-4"><em>Отзывы</em></h2>
<div class="row g-4">
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="img/ava.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="AUC EVGEN">
<h5 class="card-title">AUC EVGEN</h5>
<p class="card-text">Сотрудничаем уже 7 лет, все четко</p>
</div>
</div>
</div>
<div class="text-container">
<h1>ONLY THE FATTEST STUFF</h1>
</div>
<div class="page">
<img src="img/шмотки.jpg" alt="шмотки1">
<img src="img/шмотки31.jpg" alt="шмотки2">
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="img/ava.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Vupava Kitalya">
<h5 class="card-title">Vupava Kitalya</h5>
<p class="card-text">Просил найти его бренд Napapisaj, очень редкая штука, но он справился, 10/10</p>
</div>
</div>
</div>
<h1><em>Отзывы</em></h1>
<div class="feedback">
<div class="column">
<div class="avatar"></div>
<h3 class="username">Pistoletov Sasha</h3>
<p class="comment">
стон 1200 рублей и расход, го можно пж?
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">AUC EVGEN</h3>
<p class="comment">
Сотрудничаем уже 7 лет, все четко
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Vupava Kitalya</h3>
<p class="comment">
Просил найти его бренд Napapisaj, очень редкая штука, но он справился, 10/10
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Anjela Danil</h3>
<p class="comment">
Норм продавец, 9/10, пук пук
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Hater228</h3>
<p class="comment">
Как от ****** отойдешь, цену поменяй, клоун
</p>
</div>
<div class="column">
<div class="avatar"></div>
<h3 class="username">Bima Daryshev</h3>
<p class="comment">
При покупке не возникло никаких проблем, предоставляет огромное кол-во скидок
</p>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="img/ava.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Hater228">
<h5 class="card-title">Hater228</h5>
<p class="card-text">Как от ****** отойдешь, цену поменяй, клоун</p>
</div>
</div>
</div>
</main>
<div class="footer">
<div class="social-container">
<div class="social">
<a href="https://t.me/cyxarukShop">
<img src="img/telega.png" width="100" height="100" alt="Telegram">
</a>
<h2>← also follow us on tg</h2>
</div>
<div class="social">
<a href="https://www.avito.ru/brands/...">
<img src="img/avito.png" width="80" height="80" alt="Avito">
</a>
<h1>← and avito</h1>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="img/ava.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Anjela Danil">
<h5 class="card-title">Anjela Danil</h5>
<p class="card-text">Норм продавец, 9/10, пук пук</p>
</div>
</div>
</div>
<div class="contact-info">
<h2>89876320523</h2>
<h2>Ulyanovsk, Russia</h2>
<div class="col-md-6 col-lg-4">
<div class="card h-100 border-0 shadow">
<div class="card-body text-center">
<img src="img/ava.jpg" class="mx-auto mb-3 rounded-circle" style="width: 60px; height: 60px; object-fit: cover;" alt="Bima Daryshev">
<h5 class="card-title">Bima Daryshev</h5>
<p class="card-text">При покупке не возникло никаких проблем, предоставляет огромное кол-во скидок</p>
</div>
</div>
</div>
</div>
</div>
<script src="js/bootstrap.bundle.min.js"></script>
</div>
</main>
<footer class="py-4 mt-5" style="background-color: #00264d; color: white;">
<div class="container">
<div class="row">
<div class="col-md-6 mb-3 mb-md-0">
<div class="d-flex align-items-center mb-3">
<a href="https://t.me/cyxarukShop" class="text-white me-3">
<i class="bi bi-telegram fs-2"></i>
</a>
<span>Подпишитесь на нас в Telegram</span>
</div>
<div class="d-flex align-items-center">
<a href="https://www.avito.ru/..." class="text-white me-3">
<i class="bi bi-shop-window fs-2"></i>
</a>
<span>Мы на Авито</span>
</div>
</div>
<div class="col-md-6 text-md-end">
<h5>Контакты</h5>
<p><i class="bi bi-telephone me-2"></i>89876320523</p>
<p><i class="bi bi-geo-alt me-2"></i>Ulyanovsk, Russia</p>
</div>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>

BIN
node_modules/@esbuild/win32-x64/esbuild.exe generated vendored
View File

Binary file not shown.

BIN
node_modules/@rollup/rollup-win32-x64-msvc/rollup.win32-x64-msvc.node generated vendored
View File

Binary file not shown.

65
styles.css Normal file
View File

@@ -0,0 +1,65 @@
body {
padding-top: 56px;
background-color: #f8f9fa;
color:#00264d
}
.bg-custom {
background-color: #00264d !important;
}
.btn-custom {
background-color: #00264d;
border-color: #00264d;
color: white;
}
.btn-custom:hover {
background-color: #003366;
border-color: #003366;
color: white;
}
.card {
transition: transform 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.img-thumbnail {
padding: 0.25rem;
background-color: #fff;
border: 1px solid #dee2e6;
border-radius: 0.25rem;
max-width: 100%;
height: auto;
}
.navbar-brand img {
border: 2px solid rgba(255, 255, 255, 0.1);
}
.form-control:focus {
border-color: #00264d;
box-shadow: 0 0 0 0.25rem rgba(0, 38, 77, 0.25);
}
/* Адаптивность */
@media (max-width: 768px) {
.navbar-brand span {
font-size: 1rem;
}
.display-4 {
font-size: 2rem;
}
}