Compare commits

..

No commits in common. "f588e5f608b4ca9682b09be44ac83e3944dc52cc" and "c35cf57eab5ff52d57ebb08efe7f1989625f9811" have entirely different histories.

2 changed files with 30 additions and 38 deletions

View File

@ -88,81 +88,81 @@
<div class="swiper-wrapper">
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>
</div>
<div class="swiper-slide">
<a href="#" class="category hover-anim">
<!-- <div class="category-img">
<div class="category-img">
<img src="media/category1.png" alt="Category 1" class="category-img__img">
</div> -->
</div>
<p class="category-title">Mexican</p>
</a>

View File

@ -260,30 +260,27 @@ body {
}
.categories .swiper-slide {
width: 100px;
height: 120px;
width: 120px;
}
.categories-swiper {
padding: 0 20px;
height: 120px;
padding: 0 15px;
}
.category {
margin-left: 20px;
width: 100px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
text-align: center;
padding: 10px 0;
text-decoration: none;
filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.1));
background-color: var(--panel-background);
border-radius: 10px;
}
.category-title {
@ -725,14 +722,6 @@ label span {
display: flex;
}
input[type="checkbox"]{
accent-color: #0DBB99;
}
.catalog a{
text-decoration: none;
}
.catalog-recipe {
display: block;
width: 200px;
@ -780,7 +769,7 @@ input[type="checkbox"]{
.filters {
position: fixed;
max-height: 454px;
height: 454px;
width: 230px;
padding: 15px;
background-color: var(--panel-background);
@ -807,7 +796,10 @@ input[type="checkbox"]{
.filters-checkboxes ul {
list-style: none;
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 3px;
column-gap: 8px;
padding: 0;
max-height: 100px;
overflow-y: auto;