Skip to content

Commit

Permalink
commit
Browse files Browse the repository at this point in the history
  • Loading branch information
@lopatkinss
lopatkinss committed Nov 13, 2024
1 parent d8cb5a9 commit efe634a
Show file tree
Hide file tree
Showing 3 changed files with 135 additions and 31 deletions.
1 change: 0 additions & 1 deletion src/blocks/cards.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

body {
margin: 0;
font-family: Roboto, sans-serif;
Expand Down
1 change: 0 additions & 1 deletion src/blocks/navigation.scss
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@

body {
margin: 0;
}
Expand Down
164 changes: 135 additions & 29 deletions src/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,20 +2,32 @@
<html lang="en">
<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.0"
/>
<title>Catalog</title>
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
rel="preconnect"
href="https://fonts.gstatic.com"
/>
<link
href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="styles/index.scss" />
<link
rel="stylesheet"
href="styles/index.scss"
/>
</head>

<body>
<header class="header">
<div class="logo">
<a href="index.html" class="logo__link">
<a
href="index.html"
class="logo__link"
>
<img
src="./images/logo.png"
alt="MOYO logo"
Expand All @@ -25,30 +37,89 @@
</div>
<nav class="nav">
<ul class="nav__list">
<li class="nav__item"><a href="##" class="nav__link is-active">Apple</a></li>
<li class="nav__item"><a href="#" class="nav__link">Samsung</a></li>
<li class="nav__item"><a href="#" class="nav__link">Smartphones</a></li>
<li class="nav__item">
<a href="#"
class="nav__link" data-qa="hover">Laptops & Computers</a>
<a
href="##"
class="nav__link is-active"
>
Apple
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Samsung
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Smartphones
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
data-qa="hover"
>
Laptops & Computers
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Gadgets
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Tablets
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Photo
</a>
</li>
<li class="nav__item">
<a
href="#"
class="nav__link"
>
Video
</a>
</li>
<li class="nav__item"><a href="#" class="nav__link">Gadgets</a></li>
<li class="nav__item"><a href="#" class="nav__link">Tablets</a></li>
<li class="nav__item"><a href="#" class="nav__link">Photo</a></li>
<li class="nav__item"><a href="#" class="nav__link">Video</a></li>
</ul>
</nav>
</header>

<section class="catalog">
<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -73,14 +144,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -105,14 +181,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -137,14 +218,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -169,14 +255,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -201,14 +292,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -233,14 +329,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand All @@ -265,14 +366,19 @@ <h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3
</button>
</article>

<article class="card" data-qa="card">
<article
class="card"
data-qa="card"
>
<div class="card__image">
<img
src="./images/imac.jpeg"
alt="APPLE A1419 iMac 27"
/>
</div>
<h3 class="card__title">APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)</h3>
<h3 class="card__title">
APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)
</h3>
<p class="card__code">Product code: 195434</p>
<div class="card__assessment">
<div class="stars stars--4">
Expand Down

0 comments on commit efe634a

Please sign in to comment.