From 17261ae4cb232eb7a6cf1c75f66563ae3615b908 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz?= <1luki9901@gmail.com> Date: Fri, 6 Dec 2024 22:26:07 +0100 Subject: [PATCH 1/2] solution --- .github/workflows/test.yml-template | 29 ++++++ README.md | 4 +- package-lock.json | 37 ++++--- package.json | 3 +- src/index.html | 122 ++++++++++++++++++++++ src/styles/main.scss | 152 ++++++++++++++++++++++++++++ 6 files changed, 327 insertions(+), 20 deletions(-) create mode 100644 .github/workflows/test.yml-template diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template new file mode 100644 index 000000000..8b5743ecb --- /dev/null +++ b/.github/workflows/test.yml-template @@ -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 diff --git a/README.md b/README.md index a95e97afe..cc30e5a19 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Kickstarter landing page (HARD) -**⚠️ Attention: this is a hard landing page for development. We highly recommend choosing this landing page only if you didn't have a lot of troubles with previous homework tasks and if you sent all homework in time (didn't miss deadlines).** +**⚠️ Attention: this is a hard landing page for development. We highly recommend choosing this landing page only if you didn't have a lot of troubles with previous homework tasks and if you sent all homework in time (didn't miss deadlines).** Implement landing page according to [Figma design](https://www.figma.com/file/Ujp7bCFuvuJlkn8TSbQPSZ/%E2%84%9611-(kickstarter)?node-id=19655%3A33) - Use BEM and SCSS - The design 1440px @@ -34,7 +34,7 @@ Implement landing page according to [Figma design](https://www.figma.com/file/Uj 11. `git push origin develop` - to send you code for PR 12. Create a Pull Request (PR) from your branch `develop` to branch `master` of original repo. 13. Replace `` with your Github username in the - [DEMO LINK](https://.github.io/Kickstarter/) + [DEMO LINK](https://1luki9901.github.io/Kickstarter/) 14. Copy `DEMO LINK` to the PR description > To update you PR repeat steps 7-11 diff --git a/package-lock.json b/package-lock.json index 05ac51229..25188b82d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -13,7 +13,7 @@ "@linthtml/linthtml": "^0.9.6", "@mate-academy/bemlint": "latest", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^1.8.6", + "@mate-academy/scripts": "^1.9.12", "@mate-academy/stylelint-config": "latest", "@parcel/transformer-sass": "^2.12.0", "jest": "^29.7.0", @@ -1222,10 +1222,11 @@ "dev": true }, "node_modules/@mate-academy/scripts": { - "version": "1.8.6", - "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-1.8.6.tgz", - "integrity": "sha512-b4om/whj4G9emyi84ORE3FRZzCRwRIesr8tJHXa8EvJdOaAPDpzcJ8A0sFfMsWH9NUOVmOwkBtOXDu5eZZ00Ig==", + "version": "1.9.12", + "resolved": "https://registry.npmjs.org/@mate-academy/scripts/-/scripts-1.9.12.tgz", + "integrity": "sha512-/OcmxMa34lYLFlGx7Ig926W1U1qjrnXbjFJ2TzUcDaLmED+A5se652NcWwGOidXRuMAOYLPU2jNYBEkKyXrFJA==", "dev": true, + "license": "MIT", "dependencies": { "@octokit/rest": "^17.11.2", "@types/get-port": "^4.2.0", @@ -4152,10 +4153,11 @@ } }, "node_modules/cross-spawn": { - "version": "7.0.3", - "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.3.tgz", - "integrity": "sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==", + "version": "7.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz", + "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==", "dev": true, + "license": "MIT", "dependencies": { "path-key": "^3.1.0", "shebang-command": "^2.0.0", @@ -6610,10 +6612,11 @@ } }, "node_modules/micromatch": { - "version": "4.0.7", - "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz", - "integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==", + "version": "4.0.8", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz", + "integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==", "dev": true, + "license": "MIT", "dependencies": { "braces": "^3.0.3", "picomatch": "^2.3.1" @@ -7168,10 +7171,11 @@ "dev": true }, "node_modules/path-to-regexp": { - "version": "1.8.0", - "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.8.0.tgz", - "integrity": "sha512-n43JRhlUKUAlibEJhPeir1ncUID16QnEjNpwzNdO3Lm4ywrBpBZ5oLD0I6br9evr1Y9JTqwRtAh7JLoOzAQdVA==", + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-1.9.0.tgz", + "integrity": "sha512-xIp7/apCFJuUHdDLWe8O1HIkb0kQrOMb/0u6FXQjemHn/ii5LrIzU6bdECnsiTF/GjZkMEKg1xdiZwNqDYlZ6g==", "dev": true, + "license": "MIT", "dependencies": { "isarray": "0.0.1" } @@ -8752,10 +8756,11 @@ } }, "node_modules/windows-release/node_modules/cross-spawn": { - "version": "6.0.5", - "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.5.tgz", - "integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==", + "version": "6.0.6", + "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-6.0.6.tgz", + "integrity": "sha512-VqCUuhcd1iB+dsv8gxPttb5iZh/D0iubSP21g36KXdEuf6I5JiioesUVjpCdHV9MZRUfVFlvwtIUyPfxo5trtw==", "dev": true, + "license": "MIT", "dependencies": { "nice-try": "^1.0.4", "path-key": "^2.0.1", diff --git a/package.json b/package.json index 83c8373ca..d7f0fbd91 100644 --- a/package.json +++ b/package.json @@ -18,12 +18,11 @@ "keywords": [], "author": "Mate Academy", "license": "GPL-3.0", - "dependencies": {}, "devDependencies": { "@linthtml/linthtml": "^0.9.6", "@mate-academy/bemlint": "latest", "@mate-academy/linthtml-config": "latest", - "@mate-academy/scripts": "^1.8.6", + "@mate-academy/scripts": "^1.9.12", "@mate-academy/stylelint-config": "latest", "@parcel/transformer-sass": "^2.12.0", "jest": "^29.7.0", diff --git a/src/index.html b/src/index.html index 8019b83ec..aa15c257c 100644 --- a/src/index.html +++ b/src/index.html @@ -17,3 +17,125 @@

Hello Mate Academy

+
+ +
+ +
+

Benefits

+

Description of benefits...

+
+ +
+

Presentation

+

Description of presentation...

+
+ +
+

About Us

+

Description about us...

+
+ +
+

Technology

+

Description of technology...

+
+ +
+

Testimonials

+

Description of testimonials...

+
+ +
+

Features

+

Description of features...

+
+ +
+

Questions

+

Description of questions...

+
+ +
+

Footer content...

+
diff --git a/src/styles/main.scss b/src/styles/main.scss index fb9195d12..fa5083224 100644 --- a/src/styles/main.scss +++ b/src/styles/main.scss @@ -5,3 +5,155 @@ body { background: $c-gray; } + +.header { + background-color: $c-white; + padding: 20px; + + &__nav { + display: flex; + justify-content: space-between; + align-items: center; + + &-item { + margin: 0 15px; + font-size: 16px; + } + } +} + +.benefits { + padding: 40px 20px; + background-color: $c-light-gray; + + &__item { + margin-bottom: 20px; + font-size: 18px; + } +} + +.presentation { + padding: 60px 20px; + background-color: $c-white; + + &__title { + font-size: 24px; + margin-bottom: 20px; + } + + &__description { + font-size: 16px; + } +} + +.about-us { + padding: 40px 20px; + background-color: $c-light-gray; + + &__title { + font-size: 24px; + margin-bottom: 20px; + } + + &__content { + font-size: 16px; + } +} + +.technology { + padding: 40px 20px; + background-color: $c-white; + + &__item { + margin-bottom: 20px; + font-size: 18px; + } +} + +.testimonials { + padding: 40px 20px; + background-color: $c-light-gray; + + &__item { + margin-bottom: 20px; + font-size: 16px; + } +} + +.features { + padding: 40px 20px; + background-color: $c-white; + + &__item { + margin-bottom: 20px; + font-size: 18px; + } +} + +.questions { + padding: 40px 20px; + background-color: $c-light-gray; + + &__item { + margin-bottom: 20px; + font-size: 16px; + } +} + +.footer { + padding: 20px; + background-color: $c-dark-gray; + color: $c-white; + + &__content { + font-size: 14px; + } +} + +@media (max-width: 1280px) { + .header__nav-item, + .benefits__item, + .presentation__title, + .presentation__description, + .about-us__title, + .about-us__content, + .technology__item, + .testimonials__item, + .features__item, + .questions__item, + .footer__content { + font-size: 14px; + } +} + +@media (max-width: 640px) { + .header__nav-item, + .benefits__item, + .presentation__title, + .presentation__description, + .about-us__title, + .about-us__content, + .technology__item, + .testimonials__item, + .features__item, + .questions__item, + .footer__content { + font-size: 12px; + } +} + +@media (max-width: 320px) { + .header__nav-item, + .benefits__item, + .presentation__title, + .presentation__description, + .about-us__title, + .about-us__content, + .technology__item, + .testimonials__item, + .features__item, + .questions__item, + .footer__content { + font-size: 10px; + } +} From 063bd327d3ec1af64626e2224a87209fd17336ad Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz?= <1luki9901@gmail.com> Date: Fri, 13 Dec 2024 23:39:46 +0100 Subject: [PATCH 2/2] add task solution --- src/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/index.html b/src/index.html index aa15c257c..0c201650e 100644 --- a/src/index.html +++ b/src/index.html @@ -9,7 +9,7 @@ Title