fix cafe menu tests

This commit is contained in:
Shaun Hamilton
2021-10-26 11:36:58 +00:00
committed by Oliver Eyton-Williams
parent 40e65a4501
commit f669193b82
2 changed files with 23 additions and 14 deletions

View File

@ -7,33 +7,40 @@ dashedName: step-15
# --description-- # --description--
You have styled three elements by writing CSS inside the `style` tags. This works, but since there will many more styles, it's best to put all the styles in a separate file and link to it. You have styled three elements by writing CSS inside the `style` tags. This works, but since there will be many more styles, it's best to put all the styles in a separate file and link to it.
We have created a separate `styles.css` file for you and switched the editor view to that file. You can change between files with the tabs at the top of the editor. We have created a separate `index.css` file for you and switched the editor view to that file. You can change between files with the tabs at the top of the editor.
Start by rewriting the styles you have created into the `styles.css` file. Make sure to exclude the opening and closing `style` tags. Start by rewriting the styles you have created into the `index.css` file. Make sure to exclude the opening and closing `style` tags.
# --hints-- # --hints--
Your `styles.css` file should have the `h1, h2, p` type selector. Your `index.css` file should have the `h1, h2, p` type selector.
```js ```js
const css = code.split('<!DOCTYPE html>')[0]; (getUserInput) => {
assert(__helpers.removeWhiteSpace(css).match(/(h1|h2|p),(h1|h2|p),(h1|h2|p){/)) const css = getUserInput('editableContents');
assert(__helpers.removeWhiteSpace(css).match(/(h1|h2|p),(h1|h2|p),(h1|h2|p)\{/));
}
``` ```
Your selector should set the `text-align` property to `center`. Your selector should set the `text-align` property to `center`.
```js ```js
const css = code.split('<!DOCTYPE html>')[0]; (getUserInput) => {
const css = getUserInput('editableContents');
assert(css.match(/text-align:\s*center;?/)); assert(css.match(/text-align:\s*center;?/));
}
``` ```
You should only have one selector. You should only have one selector.
```js ```js
const css = code.split('<!DOCTYPE html>')[0]; (getUserInput) => {
assert(css.match(/text-align:\s*center;?/).length === 1); const css = getUserInput('editableContents');
assert(css.match(/text-align:\s*center;?/)?.length === 1);
}
``` ```
# --seed-- # --seed--

View File

@ -7,7 +7,7 @@ dashedName: step-16
# --description-- # --description--
Now that you have the CSS in the `styles.css` file, go ahead and remove the `style` element and all its content. Once it is removed, the text that was centered will shift back to the left. Now that you have the CSS in the `index.css` file, go ahead and remove the `style` element and all its content. Once it is removed, the text that was centered will shift back to the left.
# --hints-- # --hints--
@ -20,9 +20,11 @@ assert(!code.match(/style/i));
You should not have any CSS selectors in your HTML file. You should not have any CSS selectors in your HTML file.
```js ```js
const html = code.split('<!DOCTYPE html>')[1]; (getUserInput) => {
const html = getUserInput('editableContents');
assert(!html.includes('style')); assert(!html.includes('style'));
assert(!html.includes('text-align')); assert(!html.includes('text-align'));
}
``` ```
# --seed-- # --seed--