Skip to content

Commit

Permalink
add task solution
Browse files Browse the repository at this point in the history
  • Loading branch information
Slavko3111 committed Oct 23, 2024
1 parent bfc531d commit 3fecadb
Show file tree
Hide file tree
Showing 9 changed files with 15,956 additions and 7,603 deletions.
29 changes: 29 additions & 0 deletions .github/workflows/test.yml-template
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
name: Test

on:
pull_request:
branches: [ master ]

jobs:
build:

runs-on: ubuntu-latest

strategy:
matrix:
node-version: [20.x]

steps:
- uses: actions/checkout@v2
- name: Use Node.js ${{ matrix.node-version }}
uses: actions/setup-node@v1
with:
node-version: ${{ matrix.node-version }}
- run: npm install
- run: npm test
- name: Upload HTML report(backstop data)
if: ${{ always() }}
uses: actions/upload-artifact@v2
with:
name: report
path: backstop_data
23,425 changes: 15,829 additions & 7,596 deletions package-lock.json

Large diffs are not rendered by default.

5 changes: 2 additions & 3 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -17,17 +17,16 @@
"keywords": [],
"author": "Mate Academy",
"license": "GPL-3.0",
"dependencies": {},
"devDependencies": {
"@linthtml/linthtml": "^0.9.6",
"@mate-academy/backstop-config": "latest",
"@mate-academy/bemlint": "latest",
"@mate-academy/linthtml-config": "latest",
"@mate-academy/scripts": "^1.8.6",
"@mate-academy/scripts": "^1.2.8",
"@mate-academy/stylelint-config": "latest",
"backstopjs": "6.3.23",
"jest": "^29.7.0",
"parcel": "^2.12.0",
"parcel": "^1.12.3",
"prettier": "^3.3.2",
"stylelint": "^16.7.0",
"stylelint-scss": "^6.4.1"
Expand Down
4 changes: 2 additions & 2 deletions readme.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Stars block

Implement the [Stars Block](https://www.figma.com/file/ojkArVazq7vsX0nbpn9CxZ/Moyo-%2F-Catalog-(ENG)?node-id=11325%3A2960) used in a card and catalog.
Implement the [Stars Block](https://www.figma.com/design/ojkArVazq7vsX0nbpn9CxZ/Moyo-%2F-Catalog-(ENG)?node-id=11325-2960&node-type=canvas&t=OkKYkNwzIhzt6eIo-0) used in a card and catalog.

Hold `Alt` key (`Option` on MacOS) to measure distances in Figma.
Hold `Alt` key (`Option` on MacOS) to measure distances in Figma.

> Here are the [Layout Tasks Instructions](https://mate-academy.github.io/layout_task-guideline)
Expand Down
Binary file added src/images/img/star-active.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/images/img/star.png
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 src/images/img/star.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
48 changes: 47 additions & 1 deletion src/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,52 @@
/>
</head>
<body>
<h1>Stars</h1>
<div class="stars stars--0">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>

<div class="stars stars--1">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>

<div class="stars stars--2">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>

<div class="stars stars--3">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>

<div class="stars stars--4">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>

<div class="stars stars--5">
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
<div class="stars__stars"></div>
</div>
</body>
</html>
45 changes: 44 additions & 1 deletion src/style.css
Original file line number Diff line number Diff line change
@@ -1 +1,44 @@
/* add styles here */
html {
margin: 0;
padding: 0;
}

body {
margin: 0;
padding: 0;
}

.stars {
display: flex;
}

.stars__stars {
width: 16px;
height: 16px;

background-position: center;
background-repeat: no-repeat;
background-image: url(images/star.svg);
margin-right: 4px;
border-radius: 0.5px;
}

.stars--1 .stars__stars:nth-child(1) {
background-image: url(images/star-active.svg);
}

.stars--2 .stars__stars:nth-child(-n + 2) {
background-image: url(images/star-active.svg);
}

.stars--3 .stars__stars:nth-child(-n + 3) {
background-image: url(images/star-active.svg);
}

.stars--4 .stars__stars:nth-child(-n + 4) {
background-image: url(images/star-active.svg);
}

.stars--5 .stars__stars:nth-child(-n + 5) {
background-image: url(images/star-active.svg);
}

0 comments on commit 3fecadb

Please sign in to comment.