Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Markdown conversion for pt-BR - Cleanup - Learning Area section #8466

Merged
merged 2 commits into from
Sep 14, 2022
Merged

Markdown conversion for pt-BR - Cleanup - Learning Area section #8466

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
16eae77
Fix everything except dls and tables
SphinxKnight Sep 13, 2022
97e4e14
Fix dls
SphinxKnight Sep 13, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion files/pt-br/learn/common_questions/set_up_a_local_testing_server/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -109,5 +109,5 @@ <h2 id="Executando_linguagens_do_lado_do_servidor_localmente">Executando linguag
<li>Para executar o código PHP no lado do servidor, inicie o <a href="https://www.php.net/manual/pt_BR/features.commandline.webserver.php">servidor de desenvolvimento interno do PHP</a>:</li>
</ul>

<pre class="shellcode">$ cd path/to/your/php/code
<pre>$ cd path/to/your/php/code
$ php -S localhost:8000</pre>
4 changes: 2 additions & 2 deletions files/pt-br/learn/common_questions/using_github_pages/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
slug: Learn/Common_questions/Using_Github_pages
translation_of: Learn/Common_questions/Using_Github_pages
---
<p class="summcary"><a href="https://github.com/">GitHub</a> is a "social coding" site. It allows you to upload code repositories for
<p><a href="https://github.com/">GitHub</a> is a "social coding" site. It allows you to upload code repositories for
storage in thecelio <a href="http://git-scm.com/">Git</a> <strong>version control system. </strong>You can then collaborate on code projects, and the system is open-source by default, meaning that anyone in the world can find your GitHub code, use it, learn from it, and improve on it. You can do that with other people's code too! This article provides a basic guide to publishing content using Github's gh-pages feature.</p>

<h2 id="Publishing_content">Publishing content</h2>
Expand Down Expand Up @@ -70,7 +70,7 @@ <h3 id="Uploading_your_files_to_GitHub">Uploading your files to GitHub</h3>
<ol>
<li>On the current page, you are interested in the section <em>…or push an existing repository from the command line</em>. You should see two lines of code listed in this section. Copy the whole of the first line, paste it into the command line, and press Enter. The command should look something like this:

<pre class="copyable-terminal-content js-zeroclipboard-target"><span class="user-select-contain">git remote add origin <span class="js-live-clone-url">https://github.com/chrisdavidmills/my-repository.git</span></span></pre>
<pre>git remote add origin https://github.com/chrisdavidmills/my-repository.git</pre>
</li>
<li>Next, type the following two commands, pressing Enter after each one. These prepare the code for uploading to GitHub, and ask Git to manage these files.
<pre class="brush: bash">git add --all
Expand Down
2 changes: 1 addition & 1 deletion files/pt-br/learn/common_questions/what_software_do_i_need/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<p>Neste artigo nós destacamos quais <em>softwares</em> você precisa para editar, fazer <em>upload</em> ou visualizar um <em>site</em>.</p>
</div>

<table class="learn-box nostripe standard-table">
<table>
<tbody>
<tr>
<th scope="row">Pré requisitos:</th>
Expand Down
15 changes: 6 additions & 9 deletions files/pt-br/learn/css/building_blocks/cascade_and_inheritance/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,16 +96,13 @@ <h3 id="Controlando_Herança">Controlando Herança</h3>

<p>CSS fornece quatro valores especiais de propriedades universais para controlar a herança. Cada propriedade CSS aceita esses valores.</p>

<p>{{cssxref("inherit")}}</p>

<p> Define o valor da propriedade aplicada a um elemento selecionado para ser o mesmo de seu elemento pai. Efetivamente, isso "ativa a herança".</p>

<p>{{cssxref("initial")}}</p>

<dl>
<dd>Define o valor da propriedade aplicada a um elemento selecionado para o valor inicial dessa propriedade.</dd>
<dt>{{cssxref("unset")}}</dt>
<dd>Restaura a propriedade com seu valor natural, o que significa que se a propriedade é herdada naturalmente, ela age como herdada, caso contrário, ela age como inicial.</dd>
<dt>{{cssxref("inherit")}}</dt>
<dd>Define o valor da propriedade aplicada a um elemento selecionado para ser o mesmo de seu elemento pai. Efetivamente, isso "ativa a herança".</dd>
<dt>{{cssxref("initial")}}</dt>
<dd>Define o valor da propriedade aplicada a um elemento selecionado para o valor inicial dessa propriedade.</dd>
<dt>{{cssxref("unset")}}</dt>
<dd>Restaura a propriedade com seu valor natural, o que significa que se a propriedade é herdada naturalmente, ela age como herdada, caso contrário, ela age como inicial.</dd>
</dl>

<div class="blockIndicator note">
Expand Down
10 changes: 0 additions & 10 deletions files/pt-br/learn/css/css_layout/introduction/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -94,7 +94,6 @@ <h2 id="Flexbox">Flexbox</h2>

<div id="Flex_1">
<div class="hidden">
<h6 id="Flexbox_Example_1">Flexbox Example 1</h6>

<pre class="brush: css">* {box-sizing: border-box;}

Expand Down Expand Up @@ -127,7 +126,6 @@ <h6 id="Flexbox_Example_1">Flexbox Example 1</h6>

<div id="Flex_2">
<div class="hidden">
<h6 id="Flexbox_Example_2">Flexbox Example 2</h6>

<pre class="brush: css"> * {box-sizing: border-box;}

Expand Down Expand Up @@ -170,7 +168,6 @@ <h2 id="Grid_Layout">Grid Layout</h2>

<div id="Grid_1">
<div class="hidden">
<h6 id="Grid_example_1">Grid example 1</h6>

<pre class="brush: css"> * {box-sizing: border-box;}

Expand Down Expand Up @@ -207,7 +204,6 @@ <h6 id="Grid_example_1">Grid example 1</h6>

<div id="Grid_2">
<div class="hidden">
<h6 id="Grid_example_2">Grid example 2</h6>

<pre class="brush: css"> * {box-sizing: border-box;}

Expand Down Expand Up @@ -275,7 +271,6 @@ <h2 id="Floats">Floats</h2>

<div id="Float_1">
<div class="hidden">
<h6 id="Floats_example">Floats example</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down Expand Up @@ -383,7 +378,6 @@ <h3 id="Relative_positioning">Relative positioning</h3>

<div id="Relative_1">
<div class="hidden">
<h6 id="Relative_positioning_example">Relative positioning example</h6>

<pre class="brush: html">&lt;h1&gt;Relative positioning&lt;/h1&gt;

Expand Down Expand Up @@ -433,7 +427,6 @@ <h3 id="Absolute_positioning">Absolute positioning</h3>

<div id="Absolute_1">
<div class="hidden">
<h6 id="Absolute_positioning_example">Absolute positioning example</h6>

<pre class="brush: html">&lt;h1&gt;Absolute positioning&lt;/h1&gt;

Expand Down Expand Up @@ -486,7 +479,6 @@ <h3 id="Fixed_positioning">Fixed positioning</h3>

<div id="Fixed_1">
<div class="hidden">
<h6 id="Fixed_positioning_example">Fixed positioning example</h6>

<pre class="brush: html">&lt;h1&gt;Fixed positioning&lt;/h1&gt;

Expand Down Expand Up @@ -529,7 +521,6 @@ <h3 id="Sticky_positioning">Sticky positioning</h3>

<div id="Sticky_1">
<div class="hidden">
<h6 id="Sticky_positioning_example">Sticky positioning example</h6>

<pre class="brush: html">&lt;h1&gt;Sticky positioning&lt;/h1&gt;

Expand Down Expand Up @@ -661,7 +652,6 @@ <h2 id="Multi-column_layout">Multi-column layout</h2>

<div id="Multicol_1">
<div class="hidden">
<h6 id="Multicol_example">Multicol example</h6>

<pre class="brush: html"> &lt;div class="container"&gt;
&lt;h1&gt;Multi-column Layout&lt;/h1&gt;
Expand Down
5 changes: 0 additions & 5 deletions files/pt-br/learn/css/css_layout/multiple-column_layout/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,6 @@ <h2 id="Um_exemplo_basico">Um exemplo basico</h2>

<div id="Multicol_1">
<div class="hidden">
<h6 id="column-count_example">column-count example</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down Expand Up @@ -92,7 +91,6 @@ <h6 id="column-count_example">column-count example</h6>

<div id="Multicol_2">
<div class="hidden">
<h6 id="column-width_example">column-width example</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down Expand Up @@ -153,7 +151,6 @@ <h2 id="Styling_the_columns">Styling the columns</h2>

<div id="Multicol_3">
<div class="hidden">
<h6 id="Styling_the_columns_2">Styling the columns</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down Expand Up @@ -196,7 +193,6 @@ <h2 id="Columns_and_fragmentation">Columns and fragmentation</h2>

<div id="Multicol_4">
<div class="hidden">
<h6 id="Cards_example">Cards example</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down Expand Up @@ -298,7 +294,6 @@ <h6 id="Cards_example">Cards example</h6>

<div id="Multicol_5">
<div class="hidden">
<h6 id="Multicol_Fragmentation">Multicol Fragmentation</h6>

<pre class="brush: css">body {
width: 90%;
Expand Down
25 changes: 6 additions & 19 deletions files/pt-br/learn/css/css_layout/responsive_design/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,19 +31,15 @@ <h2 id="História_dos_layouts_de_sites">História dos layouts de sites</h2>

<p>Essas duas abordagens, geralmente, resultavam em um site com a melhor aparência na tela da pessoa que o projetava! O site líquido resultou em um design esmagado para telas menores (como visto abaixo) e comprimentos de linha muito longos em telas maiores.</p>

<figure><img alt="A layout with two columns squashed into a mobile size viewport." src="https://mdn.mozillademos.org/files/16834/mdn-rwd-liquid.png" style="display: block; height: 406px; width: 300px;">
<figcaption></figcaption>
</figure>
<img alt="A layout with two columns squashed into a mobile size viewport." src="https://mdn.mozillademos.org/files/16834/mdn-rwd-liquid.png" style="display: block; height: 406px; width: 300px;">

<div class="blockIndicator note">
<p><strong>Nota</strong>: Veja este layout líquido simples: <a href="https://mdn.github.io/css-examples/learn/rwd/liquid-width.html">exemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/liquid-width.html">código-fonte</a>. Ao visualizar o exemplo, arraste a janela do navegador para dentro e para fora para ver como isso fica em tamanhos diferentes.</p>
</div>

<p>O site de largura fixa criava uma barra de rolagem horizontal em telas menores que a largura do site (como mostrado abaixo) e muito espaço em branco nas bordas do design em telas maiores.</p>

<figure><img alt="A layout with a horizontal scrollbar in a mobile viewport." src="https://mdn.mozillademos.org/files/16835/mdn-rwd-fixed.png" style="display: block; height: 411px; width: 300px;">
<figcaption></figcaption>
</figure>
<img alt="A layout with a horizontal scrollbar in a mobile viewport." src="https://mdn.mozillademos.org/files/16835/mdn-rwd-fixed.png" style="display: block; height: 411px; width: 300px;">

<div class="blockIndicator note">
<p><strong>Nota</strong>: Veja este layout simples de largura fixa: <a href="https://mdn.github.io/css-examples/learn/rwd/fixed-width.html">exemplo</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/fixed-width.html">código-fonte</a>. Observe novamente o resultado ao alterar o tamanho da janela do navegador.</p>
Expand Down Expand Up @@ -118,15 +114,10 @@ <h2 id="Grids_Flexíveis">Grids Flexíveis</h2>

<p>The following example demonstrates a simple responsive design using Media Queries and a flexible grid. On narrow screens the layout displays the boxes stacked on top of one another:</p>

<figure><img alt="A mobile view of the layout with boxes stacked on top of each other vertically." src="https://mdn.mozillademos.org/files/16836/mdn-rwd-mobile.png" style="display: block; height: 407px; width: 300px;">
<img alt="A mobile view of the layout with boxes stacked on top of each other vertically." src="https://mdn.mozillademos.org/files/16836/mdn-rwd-mobile.png" style="display: block; height: 407px; width: 300px;">
<p>On wider screens they move to two columns:</p>

<figcaption></figcaption>
</figure>

<figure><img alt="A desktop view of a layout with two columns." src="https://mdn.mozillademos.org/files/16837/mdn-rwd-desktop.png" style="display: block; height: 217px; width: 600px;">
<figcaption></figcaption>
</figure>
<img alt="A desktop view of a layout with two columns." src="https://mdn.mozillademos.org/files/16837/mdn-rwd-desktop.png" style="display: block; height: 217px; width: 600px;">

<div class="blockIndicator note">
<p><strong>Note</strong>: You can find the <a href="https://mdn.github.io/css-examples/learn/rwd/float-based-rwd.html">live example</a> and <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/float-based-rwd.html">source code</a> for this example on GitHub.</p>
Expand Down Expand Up @@ -227,15 +218,11 @@ <h2 id="Responsive_typography">Responsive typography</h2>

<p>On mobile the heading is smaller:</p>

<figure><img alt="A stacked layout with a small heading size." src="https://mdn.mozillademos.org/files/16838/mdn-rwd-font-mobile.png" style="display: block; height: 407px; width: 300px;">
<img alt="A stacked layout with a small heading size." src="https://mdn.mozillademos.org/files/16838/mdn-rwd-font-mobile.png" style="display: block; height: 407px; width: 300px;">
<p>On desktop however we see the larger heading size:</p>

<figcaption></figcaption>
</figure>

<figure><img alt="A two column layout with a large heading." src="https://mdn.mozillademos.org/files/16839/mdn-rwd-font-desktop.png" style="display: block; height: 169px; width: 600px;">
<figcaption></figcaption>
</figure>
<img alt="A two column layout with a large heading." src="https://mdn.mozillademos.org/files/16839/mdn-rwd-font-desktop.png" style="display: block; height: 169px; width: 600px;">

<div class="blockIndicator note">
<p><strong>Note</strong>: See this example in action: <a href="https://mdn.github.io/css-examples/learn/rwd/type-rwd.html">example</a>, <a href="https://github.com/mdn/css-examples/blob/master/learn/rwd/type-rwd.html">source code</a>.</p>
Expand Down
37 changes: 18 additions & 19 deletions files/pt-br/learn/forms/form_validation/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -86,15 +86,14 @@ <h3 id="Validation_constraints_on_input_elements_—_starting_simple">Validation
<p>Let's start with a simple example — an input that allows you to choose your favorite fruit out of a choice of banana or cherry. This involves a simple text {{HTMLElement("input")}} with a matching label, and a submit {{htmlelement("button")}}. You can find the source code on GitHub as <a href="https://github.com/mdn/learning-area/blob/master/html/forms/form-validation/fruit-start.html">fruit-start.html</a>, and a live example below:</p>

<div class="hidden">
<h6 id="Hidden_code">Hidden code</h6>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;label for="choose"&gt;Would you prefer a banana or cherry?&lt;/label&gt;
&lt;input id="choose" name="i_like"&gt;
&lt;button&gt;Submit&lt;/button&gt;
&lt;/form&gt;</pre>

<pre class="brush: css notranslate">input:invalid {
<pre class="brush: css">input:invalid {
border: 2px dashed red;
}

Expand All @@ -113,15 +112,15 @@ <h3 id="The_required_attribute">The required attribute</h3>

<p>Add a <code>required</code> attribute to your input, as shown below:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;label for="choose"&gt;Would you prefer a banana or cherry?&lt;/label&gt;
&lt;input id="choose" name="i_like" required&gt;
&lt;button&gt;Submit&lt;/button&gt;
&lt;/form&gt;</pre>

<p>Also, take note of the CSS included in the example file:</p>

<pre class="brush: css notranslate">input:invalid {
<pre class="brush: css">input:invalid {
border: 2px dashed red;
}

Expand Down Expand Up @@ -149,14 +148,14 @@ <h3 id="Validating_against_a_regular_expression">Validating against a regular ex

<p>Anyway, let's implement an example — update your HTML to add a <code>pattern</code> attribute, like so:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;label for="choose"&gt;Would you prefer a banana or a cherry?&lt;/label&gt;
&lt;input id="choose" name="i_like" required pattern="banana|cherry"&gt;
&lt;button&gt;Submit&lt;/button&gt;
&lt;/form&gt;</pre>

<div class="hidden">
<pre class="brush: css notranslate">input:invalid {
<pre class="brush: css">input:invalid {
border: 2px dashed red;
}

Expand Down Expand Up @@ -189,7 +188,7 @@ <h3 id="Constraining_the_length_of_your_entries">Constraining the length of your

<p>Now delete the contents of the <code>&lt;body&gt;</code> element, and replace it with the following:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;div&gt;
&lt;label for="choose"&gt;Would you prefer a banana or a cherry?&lt;/label&gt;
&lt;input type="text" id="choose" name="i_like" required minlength="6" maxlength="6"&gt;
Expand All @@ -209,7 +208,7 @@ <h3 id="Constraining_the_length_of_your_entries">Constraining the length of your
</ul>

<div class="hidden">
<pre class="notranslate">input:invalid {
<pre class="brush: css">input:invalid {
border: 2px dashed red;
}

Expand All @@ -234,7 +233,7 @@ <h3 id="Full_example">Full example</h3>

<p>Here is a full example to show off usage of HTML's built-in validation features:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;p&gt;
&lt;fieldset&gt;
&lt;legend&gt;Title&lt;abbr title="This field is mandatory"&gt;*&lt;/abbr&gt;&lt;/legend&gt;
Expand Down Expand Up @@ -278,7 +277,7 @@ <h3 id="Full_example">Full example</h3>
&lt;/p&gt;
&lt;/form&gt;</pre>

<pre class="brush: css notranslate">body {
<pre class="brush: css">body {
font: 1em sans-serif;
padding: 0;
margin : 0;
Expand Down Expand Up @@ -365,15 +364,15 @@ <h3 id="Customized_error_messages">Customized error messages</h3>

<p>HTML5 provides the <a href="/en-US/docs/Web/API/Constraint_validation" rel="external">constraint validation API</a> to check and customize the state of a form element. Among other things, it's possible to change the text of the error message. Let's see a quick example:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;label for="mail"&gt;I would like you to provide me an e-mail&lt;/label&gt;
&lt;input type="email" id="mail" name="mail"&gt;
&lt;button&gt;Submit&lt;/button&gt;
&lt;/form&gt;</pre>

<p>In JavaScript, you call the <a href="/en-US/docs/HTML/HTML5/Constraint_validation#Constraint_API's_element.setCustomValidity()"><code>setCustomValidity()</code></a> method:</p>

<pre class="brush: js notranslate">var email = document.getElementById("mail");
<pre class="brush: js">var email = document.getElementById("mail");

email.addEventListener("input", function (event) {
if (email.validity.typeMismatch) {
Expand Down Expand Up @@ -460,7 +459,7 @@ <h4 id="Example_using_the_constraint_validation_API">Example using the constrain

<p>Let's see how to use this API to build custom error messages. First, the HTML:</p>

<pre class="brush: html notranslate">&lt;form novalidate&gt;
<pre class="brush: html">&lt;form novalidate&gt;
&lt;p&gt;
&lt;label for="mail"&gt;
&lt;span&gt;Please enter an email address:&lt;/span&gt;
Expand All @@ -479,7 +478,7 @@ <h5 id="CSS">CSS</h5>

<p>This CSS styles our form and the error output to look more attractive.</p>

<pre class="brush: css notranslate">/* This is just to make the example nicer */
<pre class="brush: css">/* This is just to make the example nicer */
body {
font: 1em sans-serif;
padding: 0;
Expand Down Expand Up @@ -540,7 +539,7 @@ <h5 id="JavaScript">JavaScript</h5>

<p>The following JavaScript code handles the custom error validation.</p>

<pre class="brush: js notranslate">// There are many ways to pick a DOM node; here we get the form itself and the email
<pre class="brush: js">// There are many ways to pick a DOM node; here we get the form itself and the email
// input box, as well as the span element into which we will place the error message.

var form = document.getElementsByTagName('form')[0];
Expand Down Expand Up @@ -603,7 +602,7 @@ <h4 id="An_example_that_doesnt_use_the_constraint_validation_API">An example tha

<p>In order to illustrate this, let's rebuild the previous example so that it works with legacy browsers:</p>

<pre class="brush: html notranslate">&lt;form&gt;
<pre class="brush: html">&lt;form&gt;
&lt;p&gt;
&lt;label for="mail"&gt;
&lt;span&gt;Please enter an email address:&lt;/span&gt;
Expand All @@ -622,7 +621,7 @@ <h5 id="CSS_2">CSS</h5>

<p>Similarly, the CSS doesn't need to change very much; we just turn the {{cssxref(":invalid")}} CSS pseudo-class into a real class and avoid using the attribute selector that does not work on Internet Explorer 6.</p>

<pre class="brush: css notranslate">/* This is just to make the example nicer */
<pre class="brush: css">/* This is just to make the example nicer */
body {
font: 1em sans-serif;
padding: 0;
Expand Down Expand Up @@ -683,7 +682,7 @@ <h5 id="JavaScript_2">JavaScript</h5>

<p>The big changes are in the JavaScript code, which needs to do much more of the heavy lifting.</p>

<pre class="brush: js notranslate">// There are fewer ways to pick a DOM node with legacy browsers
<pre class="brush: js">// There are fewer ways to pick a DOM node with legacy browsers
var form = document.getElementsByTagName('form')[0];
var email = document.getElementById('mail');

Expand Down
Loading