Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Проверяем макет по критериям #8

Open
wants to merge 6 commits into
base: master
Choose a base branch
from
Open

Проверяем макет по критериям #8

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
40854dc
правки 04.09
stasssssi Sep 4, 2024
65e2c81
правки 08.09
stasssssi Sep 8, 2024
e188300
правки 19.09
stasssssi Sep 19, 2024
c67d032
правки 24.09
stasssssi Sep 24, 2024
30ce6bd
правки 02.10.2024
stasssssi Oct 2, 2024
b6e7685
сайт 09.10.2024
stasssssi Oct 9, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
113 changes: 73 additions & 40 deletions catalog.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
</a>
<ul class="navigation-list">
<li class="navigation-item">
<a class="navigation-link current-link" href="index.html">Главная</a>
<a class="navigation-link" href="index.html">Главная</a>
</li>
<li class="navigation-item">
<a class="navigation-link" href="">О Седоне</a>
Expand All @@ -32,7 +32,7 @@
<span class="visually-hidden">Поиск</span>
</a>
</li>
<li class="navigation-icon-item">
<li class="navigation-icon-item item-before">
<a class="navigation-icon-link" href="#">
<svg class="navigation-svg" aria-hidden="true" focusable="false" width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M9.9 19C9.6 19 9.3 18.9 9.1 18.6C3.7 12.5 2.4 11.1 2.1 10.7C1.4 9.8 1 8.6 1 7.4C1 4.4 3.4 2 6.5 2C7.8 2 9 2.5 10 3.3C11 2.5 12.3 2 13.5 2C16.5 2 19 4.4 19 7.4C19 8.7 18.5 9.9 17.7 10.8L10.7 18.7C10.5 18.9 10.3 19 9.9 19ZM3.9 9.5C4.2 9.9 7.4 13.5 10 16.4L16.2 9.4C16.7 8.9 16.9 8.2 16.9 7.4C16.9 5.6 15.4 4.1 13.6 4.1C12.6 4.1 11.6 4.6 10.9 5.4C10.6 5.7 10.3 5.8 10 5.8C9.7 5.8 9.4 5.6 9.2 5.4C8.5 4.6 7.5 4.1 6.5 4.1C4.7 4.1 3.2 5.6 3.2 7.4C3.1 8.3 3.5 9 3.9 9.5C3.8 9.5 3.8 9.5 3.9 9.5Z" fill="black"/>
Expand All @@ -44,71 +44,102 @@
<a class="button first-button" href="#">Хочу сюда!</a>
</nav>
</header>
<main class="main-inner main-container">
<main class="main-inner">
<div class="main page-container">
<h1 class="inner-header-title">Гостиницы Седоны</h1>
<ul class="breadcrumbs">
<li class="breadcrumbs-item">
<img src="images/little-home.svg" alt="Домик" width="12px" height="12px">
<a class="breadcrumbs-link" href="index.html"></a>
<span class="small-breadcrumbs">></span>
<a class="breadcrumbs-link breadcrumbs-link-pictures" href="index.html"></a>
</li>
<li class="breadcrumbs-item">
<a class="breadcrumbs-link">Гостиницы</a>
<a class="breadcrumbs-link breadcrumbs-link-hotel">Гостиницы</a>
</li>
</ul>
<section class="catalog-products">
<h2 class="visually-hidden">Список товаров с фильтрами</h2>
<form class="catalog-filter" action="https://echo.htmlacademy.ru/" method="get">
<fieldset class="catalog-filter-group">
<legend class="catalog-filter-title">Инфраструктура:</legend>
<div class="catalog-filter-group">
<legend class="catalog-filter-title filter-title">Инфраструктура:</legend>
<ul class="catalog-filter-list">
<li class="catalog-filter-item">
<label class="control">
<input class="control-input" type="checkbox" name="Бассейн" checked>
Бассейн
<span class="control-mark control-mark-checked"></span>
<span class="control-label">Бассейн</span>
</label>
</li>
<li class="catalog-filter-item">
<label class="control">
<input class="control-input" type="checkbox" name="Парковка" checked>
Парковка
<span class="control-mark control-mark-checked"></span>
<span class="control-label">Парковка</span>
</label>
</li>
<li class="catalog-filter-item">
<label class="control">
<input class="control-input" type="checkbox" name="WI-FI">
WI-FI
<span class="control-mark"></span>
<span class="control-label">WI-FI</span>
</label>
</li>
</ul>
</fieldset>
</div>

<fieldset class="catalog-filter-group">
<legend class="catalog-filter-title">Тип жилья:</legend>
<div class="catalog-filter-group catalog-filter-type">
<legend class="catalog-filter-title filter-title">Тип жилья:</legend>
<ul class="catalog-filter-list">
<li class="catalog-filter-item">
<label class="control">
<label class="control-circle">
<input class="control-input" type="radio" name="product-group" value="hotel" checked>
Гостиница
<span class="control-mark-mark control-mark-mark-checked"></span>
<span class="control-label">Гостиница</span>
</label>
</li>
<li class="catalog-filter-item">
<label class="control">
<label class="control-circle">
<input class="control-input" type="radio" name="product-group" value="motel">
Мотель
<span class="control-mark-mark"></span>
<span class="control-label">Мотель</span>
</label>
</li>
<li class="catalog-filter-item">
<label class="control">
<label class="control-circle">
<input class="control-input" type="radio" name="product-group" value="apartaments">
Апартаменты
<span class="control-mark-mark"></span>
<span class="control-label">Апартаменты</span>
</label>
</li>
</ul>
</fieldset>
</div>
<div class="filter-cost">
<legend class="catalog-filter-title">Стоимость, ₽:</legend>

<div>
<div class="range">
<div class="range-scale">
<div class="range-bar" style="width: 226px">
<button class="range-toggle toggle-min">
<span class="visually-hidden">Изменить минимальную цену.</span>
</button>
<button class="range-toggle toggle-max">
<span class="visually-hidden">Изменить максимальную цену.</span>
</button>
</div>
</div>

<div class="range-wrapper-inputs">
<label class="catalog-filter-label">
<input class="range-input input-left" type="number" value="0" name="min-price" style="width: 143px">
<span class="span-input">от</span>
</label>
<label class="catalog-filter-label">
<input class="range-input input-right" type="number" value="9000" name="max-price" style="width: 143px">
<span class="span-input">до</span>
</label>
</div>
</div>
</div>

<div class="warapper-button">
<button class="button button-blue-blue big-button" type="submit">Применить</button>
<button class="button button-reset big-button" type="reset">Сбросить</button>
</div>
Expand All @@ -126,35 +157,35 @@ <h2 class="title">Найдено гостиниц: 38</h2>
</select>
<ul class="button-wrapper">
<li>
<a href="#" class="button-button button-checked mode">
<a href="#" class="button-button mode">
<span class="visually-hidden">Показать карточки</span>
</a>
</li>
<li>
<a class="button-button mode-second" href="#">
<span class="visually-hidden">Показать не знаю что это</span>
<a class="button-button mode-image" href="#">
<span class="visually-hidden">Отображение гостиниц</span>
</a>
</li>
<li>
<a class="button-button mode-third" href="#">
<a class="button-button mode-list" href="#">
<span class="visually-hidden">Показать список</span>
</a>
</li>
</ul>
</div>
<ul class="product-list">
<li class="product-card">
<li class="product-card five-stars">
<a class="product-card-link" href="#">
<img class="product-card-image" src="images/hotel-1.jpg" width="300px" height="212px" alt="Amara Resort & Spa">
<h3 class="product-card-title">Amara Resort & Spa</h3>
</a>
<span>Гостиница</span>
<b class="price">От 4000 ₽</b>
<a class="product-card-button button button-small" href="#">Подробнее</a>
<a class="product-card-button-blue button button-blue-blue button-small-small" href="#">В избранное</a>
<a class="button button-small" href="#">Подробнее</a>
<a class="button button-blue-blue button-small-small" href="#">В избранное</a>
<p class="points">Рейтинг: 8,5</p>
</li>
<li class="product-card">
<li class="product-card five-stars">
<a class="product-card-link" href="#">
<img class="product-card-image" src="images/hotel-2.jpg" width="300px" height="212px" alt="Villas at Poco Diablo">
<h3 class="product-card-title">Villas at Poco Diablo</h3>
Expand All @@ -165,7 +196,7 @@ <h3 class="product-card-title">Villas at Poco Diablo</h3>
<a class="product-card-button-checked button button-green-green" href="#">В избранном</a>
<p class="points">Рейтинг: 9,2</p>
</li>
<li class="product-card">
<li class="product-card three-stars">
<a class="product-card-link" href="#">
<img class="product-card-image" src="images/hotel-3.jpg" width="300px" height="212px" alt="Desert Quail Inn">
<h3 class="product-card-title">Desert Quail Inn</h3>
Expand All @@ -176,7 +207,7 @@ <h3 class="product-card-title">Desert Quail Inn</h3>
<a class="product-card-button-blue button button-blue-blue button-small-small" href="#">В избранное</a>
<p class="points">Рейтинг: 6,9</p>
</li>
<li class="product-card">
<li class="product-card two-stars">
<a class="product-card-link" href="#">
<img class="product-card-image" src="images/hotel-4.jpg" width="300px" height="212px" alt="GreenTree Inn">
<h3 class="product-card-title">GreenTree Inn</h3>
Expand All @@ -193,31 +224,33 @@ <h3 class="product-card-title">GreenTree Inn</h3>
<a class="pagination-link pagination-current">1</a>
</li>
<li class="pagination-item">
<a class="pagination-link" href="#">2</a>
<a class="pagination-link pagination-link-link" href="#">2</a>
</li>
<li class="pagination-item">
<a class="pagination-link" href="#">3</a>
<a class="pagination-link pagination-link-link" href="#">3</a>
</li>
<li class="pagination-item">
<a class="pagination-link" href="#">4</a>
<a class="pagination-link pagination-link-link" href="#">4</a>
</li>
<li class="pagination-item">
<a class="pagination-link pagination-empty" href="#">...</a>
</li>
<li class="pagination-item">
<a class="pagination-link ten" href="#">10</a>
<a class="pagination-link ten pagination-link-link" href="#">10</a>
</li>
</ul>
</section>
<section>
<div class="information-wraper">
<h3 class="description-black">Подпишитесь на рассылку</h3>
<p class="information">Только полезная информация и никакого спама,<br> честное бойскаутское!</p>
<div class="form-wrapper">
<form class="newsletter-form" action="https://echo.htmlacademy.ru/" method="post">
<label for="newsletter-email">Email</label>
<input class="field" placeholder="Ваш e=mail" type="email" name="newsletter-email" id="newsletter-email" required>
<button class="button newsletter-button" type="submit">Подписаться</button>
<label for="newsletter-email"></label>
<input class="field-email-grey" placeholder="Ваш e-mail" type="email" name="newsletter-email" id="newsletter-email" required>
</form>
<button class="button newsletter-button" type="submit">Подписаться</button>
</div>
</div>
</section>
</div>
Expand Down
13 changes: 13 additions & 0 deletions images/calendar.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/circle.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/cross.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
28 changes: 28 additions & 0 deletions images/fourStars.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
5 changes: 4 additions & 1 deletion images/home.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/i.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/minus.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/plus.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions images/sedona.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
22 changes: 22 additions & 0 deletions images/threeStars.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
16 changes: 16 additions & 0 deletions images/twoStars.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading