diff --git a/README.md b/README.md index 8f3938b..755cad4 100644 --- a/README.md +++ b/README.md @@ -26,29 +26,29 @@ This assignment should prove that a student is able to: ## Standard requirements -- [ ] Fork the project to your github account -- [ ] Clone the project to your computer -- [ ] Open the project in VSCode with `code ` -- [ ] Initialize playwright and install project packages - - [ ] Use `npm i` to install packages - - [ ] Use `npm run browser-install` to install the browser environment for testing (~131mb will be downloaded) - - [ ] (Windows users only) Use `npm run deps-install` to install playwright additional dependencies (160mb will be downloaded) -- [ ] All the tasks of the "Specific requirements" section MUST be solved -- [ ] **The project's file/folder structure should NOT be edited!** +- [x] Fork the project to your github account +- [x] Clone the project to your computer +- [x] Open the project in VSCode with `code ` +- [x] Initialize playwright and install project packages + - [x] Use `npm i` to install packages + - [x] Use `npm run browser-install` to install the browser environment for testing (~131mb will be downloaded) + - [x] (Windows users only) Use `npm run deps-install` to install playwright additional dependencies (160mb will be downloaded) +- [x] All the tasks of the "Specific requirements" section MUST be solved +- [x] **The project's file/folder structure should NOT be edited!** - [ ] All the tests MUST pass. Fix any errors before you submit (acceptance criteria). - [ ] Use `npm run test` to run all tests in the terminal - [ ] (Optional) Use `npm run test-ui` to run all the tests with GUI - [ ] (Optional) Use `npm run show-report` to see the latest report in the browser - [ ] VSCode IDE MUST have 0 problems listed - [ ] The code of the index.html and styles.css should pass the W3C validation (Feel free to use either the "[w3c web validator](https://marketplace.visualstudio.com/items?itemName=CelianRiboulet.webvalidator)" VSCode extension or the "[Online w3c Markup Validation Service](https://validator.w3.org/#validate_by_input)") -- [ ] The code MUST be formatted with Prettier. -- [ ] Push the changes to the Github repo, when finished. -- [ ] Submit a .txt file with the Github repo url. +- [x] The code MUST be formatted with Prettier. +- [x] Push the changes to the Github repo, when finished. +- [x] Submit a .txt file with the Github repo url. ## Specific requirements For the styles.css file: -- [ ] Find and fix all the syntax issues in the file +- [x] Find and fix all the syntax issues in the file - There are commented out hints for you to find the CSS rules with incorrect syntax - When running tests, the failed test message contains the CSS file line number of the rule that was tested. diff --git a/css/styles.css b/css/styles.css index fbc50cd..8e1c992 100644 --- a/css/styles.css +++ b/css/styles.css @@ -15,7 +15,7 @@ body { /* 🔴 CSS Property name Error here 👇 */ body { - background-colo: #030a1e; + background-color: #030a1e; } .content { @@ -37,10 +37,10 @@ h2 { } /* 🔴 CSS Syntax Error here 👇 */ -main - width: 100%; - padding-top: 60px; - display: flex; +main{ + width: 100; + padding-top: 60%; + display: block; flex-direction: column; gap: 60px; } @@ -50,7 +50,7 @@ main width: 100%; max-width: 964px; margin: 0 auto; - display; flex; + display: flex; gap: 30px; } @@ -62,7 +62,7 @@ i { /* 🔴 CSS Syntax Error here 👇 */ .box { background: linear-gradient(#17192c, #1a1c30), - border: 1px solid #2c3044; + border 1px solid #2c3044; padding: 30px; width: 100%; border-radius: 16px; @@ -110,7 +110,7 @@ i { padding: 12px; background: linear-gradient(45deg, #1e2338, #191e34); border: 1px solid #282d43; - borderRadius: 5px; + border-radius: 5px; } .option-item-name, @@ -129,7 +129,7 @@ i { /* 🔴 CSS Syntax Error here 👇 */ .option-item-name .hint, .review-author-name .hint, -.form-input-group label; { +.form-input-group label { font-size: 12px; color: #b6b8c0; } @@ -137,7 +137,7 @@ i { /* 🔴 CSS Syntax Error here 👇 */ .option-item-selected { display: flex; - align-items = center; + align-items: center; gap: 16px; } @@ -166,7 +166,7 @@ label { /* 🔴 CSS property name Error here 👇 */ [type='radio']:checked ~ label .circle { - BackgroundColor: white; + Background-color: white; border: 4px solid #5f57ff; } @@ -180,7 +180,7 @@ label { gap: 20px; padding: 20px; overflow: hidden; - Pposition: relative; + position: relative; } /* 🔴 CSS syntax Error here 👇 */ @@ -192,7 +192,7 @@ label { bottom: 0; left: 0; right: 0; - background-image: url(/assets/backgrounds/review-bg.png'); + background-image: url(/assets/backgrounds/review-bg.png); background-size: cover; } @@ -378,5 +378,5 @@ footer ul a { /* 🔴 CSS property name Error here 👇 */ footer ul li span a { - colorrrrr: rgb(218, 82, 82); + color: rgb(218, 82, 82); }