chore(learn): audit files for crowdin (#40838)

* chore(learn): audit files for crowdin

Audits the challenge text in the Responsive Web Design superblock to
account for words/phrases that should not be translated because they
refer to code.

Signed-off-by: nhcarrigan <nhcarrigan@gmail.com>

* fix: remove quotes from code

Removes instances of quoted code blocks, or code blocked quotes.

Signed-off-by: nhcarrigan <nhcarrigan@gmail.com>

* fix: additional uncaught quote-codes

Thanks Oliver :)

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

* fix: so many quotes

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* fix: missing punctuation

Noted in a Crowdin comment.

Signed-off-by: nhcarrigan <nhcarrigan@gmail.com>

* fix: remove more quotes

Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>

Co-authored-by: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>
Co-authored-by: Randell Dawson <5313213+RandellDawson@users.noreply.github.com>
This commit is contained in:
Nicholas Carrigan (he/him)
2021-02-01 11:56:07 -08:00
committed by GitHub
parent 4c99d18b2f
commit 427444c757
64 changed files with 122 additions and 123 deletions

View File

@ -19,13 +19,13 @@ You can specify a `border-radius` with pixels. Give your cat photo a `border-rad
# --hints--
Your image element should have the class "thick-green-border".
Your image element should have the class `thick-green-border`.
```js
assert($('img').hasClass('thick-green-border'));
```
Your image should have a border radius of `10px`
Your image should have a border radius of `10px`.
```js
assert(

View File

@ -19,7 +19,7 @@ Here's how you do it:
background: var(--penguin-skin, black);
```
This will set background to black if your variable wasn't set. Note that this can be useful for debugging.
This will set background to `black` if your variable wasn't set. Note that this can be useful for debugging.
# --instructions--

View File

@ -21,7 +21,7 @@ For example, if you wanted an element's background color to be `green`, you'd pu
# --instructions--
Create a class called `silver-background` with the `background-color` of silver. Assign this class to your `div` element.
Create a class called `silver-background` with the `background-color` of `silver`. Assign this class to your `div` element.
# --hints--

View File

@ -28,7 +28,7 @@ Family names are case-sensitive and need to be wrapped in quotes if there is a s
# --instructions--
Import the Lobster font to your web page. Then, use an element selector to set `Lobster` as the `font-family` for your `h2` element.
Import the `Lobster` font to your web page. Then, use an element selector to set `Lobster` as the `font-family` for your `h2` element.
# --hints--

View File

@ -17,11 +17,11 @@ This means that if you do want to provide a browser fallback, it's as easy as pr
# --instructions--
It looks like a variable is being used to set the background color of the `.red-box` class. Let's improve our browser compatibility by adding another `background` declaration right before the existing declaration and set its value to red.
It looks like a variable is being used to set the background color of the `.red-box` class. Let's improve our browser compatibility by adding another `background` declaration right before the existing declaration and set its value to `red`.
# --hints--
Your `.red-box` rule should include a fallback with the `background` set to red immediately before the existing `background` declaration.
Your `.red-box` rule should include a fallback with the `background` set to `red` immediately before the existing `background` declaration.
```js
assert(

View File

@ -13,7 +13,7 @@ Yay! We just proved that inline styles will override all the CSS declarations in
But wait. There's one last way to override CSS. This is the most powerful method of all. But before we do it, let's talk about why you would ever want to override CSS.
In many situations, you will use CSS libraries. These may accidentally override your own CSS. So when you absolutely need to be sure that an element has specific CSS, you can use `!important`
In many situations, you will use CSS libraries. These may accidentally override your own CSS. So when you absolutely need to be sure that an element has specific CSS, you can use `!important`.
Let's go all the way back to our `pink-text` class declaration. Remember that our `pink-text` class was overridden by subsequent class declarations, id declarations, and inline styles.
@ -39,7 +39,7 @@ Your `h1` element should have the class `blue-text`.
assert($('h1').hasClass('blue-text'));
```
Your `h1` element should have the id of `orange-text`.
Your `h1` element should have the `id` of `orange-text`.
```js
assert($('h1').attr('id') === 'orange-text');

View File

@ -9,7 +9,7 @@ dashedName: override-styles-in-subsequent-css
# --description--
Our "pink-text" class overrode our `body` element's CSS declaration!
Our `pink-text` class overrode our `body` element's CSS declaration!
We just proved that our classes will override the `body` element's CSS. So the next logical question is, what can we do to override our `pink-text` class?

View File

@ -29,7 +29,7 @@ To begin, apply the `monospace` font to the `h2` element, so that it now has two
In the last challenge, you imported the `Lobster` font using the `link` tag. Now comment out that import of the `Lobster` font (using the HTML comments you learned before) from Google Fonts so that it isn't available anymore. Notice how your `h2` element degrades to the `monospace` font.
**Note:** If you have the Lobster font installed on your computer, you won't see the degradation because your browser is able to find the font.
**Note:** If you have the `Lobster` font installed on your computer, you won't see the degradation because your browser is able to find the font.
# --hints--

View File

@ -43,7 +43,7 @@ Your `h2` element should have the class `red-text`.
assert($('h2').hasClass('red-text'));
```
Your stylesheet should declare a `red-text` class and have its color set to red.
Your stylesheet should declare a `red-text` class and have its color set to `red`.
```js
assert(code.match(/\.red-text\s*\{\s*color\s*:\s*red;\s*\}/g));

View File

@ -17,7 +17,7 @@ These four values work like a clock: top, right, bottom, left, and will produce
# --instructions--
Use Clockwise Notation to give the ".blue-box" class a `padding` of `40px` on its top and left side, but only `20px` on its bottom and right side.
Use Clockwise Notation to give the `.blue-box` class a `padding` of `40px` on its top and left side, but only `20px` on its bottom and right side.
# --hints--

View File

@ -40,7 +40,7 @@ Delete your `h2` element's style attribute, and instead create a CSS `style` blo
# --hints--
The style attribute should be removed from your `h2` element.
The `style` attribute should be removed from your `h2` element.
```js
assert(!$('h2').attr('style'));

View File

@ -11,11 +11,11 @@ dashedName: use-rgb-values-to-color-elements
Another way you can represent colors in CSS is by using `RGB` values.
The RGB value for black looks like this:
The `RGB` value for black looks like this:
`rgb(0, 0, 0)`
The RGB value for white looks like this:
The `RGB` value for white looks like this:
`rgb(255, 255, 255)`