Transformace řešení na novou verzi.

Czechitas-podklady-WEB · Aug 24, 2023 · 23fb96a · 23fb96a
1 parent dfef661
commit 23fb96a
Show file tree

Hide file tree

Showing 144 changed files with 434 additions and 146 deletions.
diff --git a/assets/academy.svg b/assets/academy.svg
diff --git a/html-a-css/bem-a-responzivni-design/cvlekce/bem/exercise.md b/html-a-css/bem-a-responzivni-design/cvlekce/bem/exercise.md
@@ -18,7 +18,8 @@ Pokud vám zbyde čas, můžete si odkomentovat obsah a nastylovat i další kar
 
 ::fig[výsledek]{src=assets/BEM_cviceni_result.gif}
 
----solution
+:::solution
+
 V souboru `style.css` se nic neupravuje. Upravuje se poize souboru `index.html`, ve kterém se přidávají třídy (atribut `class`) elementu `article` a vnořeným elementům.
 
 ```html
@@ -46,3 +47,5 @@ V souboru `style.css` se nic neupravuje. Upravuje se poize souboru `index.html`,
   </div>
 </article>
 ```
+
+:::
diff --git a/html-a-css/bem-a-responzivni-design/cvlekce/responsive-layout/exercise.md b/html-a-css/bem-a-responzivni-design/cvlekce/responsive-layout/exercise.md
@@ -17,7 +17,8 @@ Každou variantu si zkontrolujte v devtools a udělejte si printscreen celé str
 Podívejte se na výsledek:
 ::fig[výsledek]{src=assets/result.png}
 
----solution
+:::solution
+
 Varianty pro tři a čtyři sloupce jsou níže uvedeny v blocích `@media(…)` – co znamenají se dozvíte v příští lekci.
 Ve vašem řešení budete mít obsah příslušného bloku přímo u selektoru třídy `.foto`.
 Když použijete níže uvedené řešení s `@media(…)`, bude se počet sloupců měnit v závislosti na šířce okna prohlížeče.
@@ -57,3 +58,5 @@ header {
   }
 }
 ```
+
+:::
diff --git a/html-a-css/flexbox/cvdoma/cardio/exercise.md b/html-a-css/flexbox/cvdoma/cardio/exercise.md
@@ -11,7 +11,7 @@ Nastylujte jednotlivé stránky podle zadání na výsledných obrázcích.
 
 Nezapomeňte, že při spouštění pomocí `npx serve` musíte být v terminálu ve správné složce – v tomto případě tedy ve složce konkrétního cvičení, třeba `flex1`.
 
----solution
+:::solution
 
 V řešení jsou uváděny pouze styly doplněné v rámci cvičení. Původní styly ani HTML kód se nemění.
 
@@ -165,3 +165,5 @@ V řešení jsou uváděny pouze styly doplněné v rámci cvičení. Původní
   */
 }
 ```
+
+:::
diff --git a/html-a-css/flexbox/cvdoma/navbar/exercise.md b/html-a-css/flexbox/cvdoma/navbar/exercise.md
@@ -14,7 +14,7 @@ Nastylujte hlavičku s navigací podle výsledku:
 - Položky v navigaci jsou vedle sebe, mají margin 1px, žadný padding
 - Odkazy v seznamu zabírají celou výšku rodiče a jsou vertikálně vycentrované
 
----solution
+:::solution
 
 ```css
 .hlavicka {
@@ -61,3 +61,5 @@ a {
     */
 }
 ```
+
+:::
diff --git a/html-a-css/opakovani-a-position/cvlekce/kocici-domecek/exercise.md b/html-a-css/opakovani-a-position/cvlekce/kocici-domecek/exercise.md
@@ -20,7 +20,7 @@ Každá z pěti kočiček si musí najít svoje místo.
 
 V souboru style.css je také přímo u daných tříd návod. Na počítání některých vzdáleností se bude hodit použití funkce [calc](https://www.vzhurudolu.cz/prirucka/css3-calc).
 
----solution
+:::solution
 
 Níže jsou uvedené pouze přidané styly. Mohou však být klidně přidané přímo k původním stylům.
 
@@ -104,3 +104,5 @@ Níže jsou uvedené pouze přidané styly. Mohou však být klidně přidané p
   bottom: 0;
 }
 ```
+
+:::
diff --git a/html-a-css/selektory-a-specificita/cvselektory/exercise.md b/html-a-css/selektory-a-specificita/cvselektory/exercise.md
@@ -26,7 +26,7 @@ Uvidíte podobnou stránku s kontakty jako ze cvičení flexboxu. V tomto cviče
 
 Pro plynulé zvětšení si můžete najít použití CSS vlastnosti `transition`.
 
----solution
+:::solution
 
 ```css
 /*
@@ -57,3 +57,5 @@ div img:hover {
   transition: 0.2s ease-in-out;
 }
 ```
+
+:::
diff --git a/js1/chyby-pole/cvdoma/minutka2/exercise.md b/js1/chyby-pole/cvdoma/minutka2/exercise.md
@@ -13,7 +13,7 @@ Zařiďte, aby minutka správně odpočítávala vteřiny a začala zvonit ve ch
 1. Při kliknutí na :i[Start] nastavte časovač pomocí `setInterval`. Ten se bude opakovat každou vteřinu a pokaždé sníží hodnotu v proměnné `time` o jedna.
 1. Jakmile proměnná `time` dosáhne nuly, zapněte zvonění a zrušte časovač aby nezačal počítat do mínusu.
 
----solution
+:::solution
 
 ```js
 const nastartujMinutku = (e) => {
@@ -46,3 +46,5 @@ const nastartujMinutku = (e) => {
 const formularElm = document.querySelector('.controls');
 formularElm.addEventListener('submit', nastartujMinutku);
 ```
+
+:::
diff --git a/js1/chyby-pole/cvdoma/minutka3.md b/js1/chyby-pole/cvdoma/minutka3.md
@@ -7,7 +7,7 @@ Vylepšete program naší kuchyňské minutky tak, aby zobrazovala nejen vteřin
 
 Dejte pozor na správné formátování, kdy jednociferné hodnoty je zvykem zobrazovat s nulou na začátku. Vzpomeňte si, že na řetězcích máme metodu `padStart`, která nám s tímto může velmi pomoct.
 
----solution
+:::solution
 
 ```js
 const nastartujMinutku = (e) => {
@@ -49,3 +49,5 @@ const nastartujMinutku = (e) => {
 const formularElm = document.querySelector('.controls');
 formularElm.addEventListener('submit', nastartujMinutku);
 ```
+
+:::
diff --git a/js1/chyby-pole/cvdoma/pocitadlo/exercise.md b/js1/chyby-pole/cvdoma/pocitadlo/exercise.md
@@ -8,6 +8,8 @@ Vytvořte si repozitář ze šablony [cviceni-pocitadlo](https://github.com/Czec
 1. Bez použítí `console.log` opravte všechny chyby, které runtime vypisuje do konzole.
 1. Když vyřešíte všechna chybová hlášení, program stejně nebude fungovat. Použijte tedy své detektivní schopnosti spolu s funkcí `console.log` a odhalte poslední problémy, které brání programu ve správném fungování.
 
----solution
+:::solution
 
 [index.js](https://github.com/Czechitas-podklady-WEB/cviceni-pocitadlo/blob/reseni/index.js)
+
+:::
diff --git a/js1/chyby-pole/cvlekce/pole-v-divadle.md b/js1/chyby-pole/cvlekce/pole-v-divadle.md
@@ -10,7 +10,7 @@ Celé toto cvičení provádějte v JavaScript konzoli.
 1. Vytvořte nějaké pole řetězců, například seznam názvů několika divadelních představení, která divadlo hraje. Uložte toto pole do proměnné `plays`. Uložte do nějaké proměnné druhou položku tohoto pole. Pomocí metody `shift` odstraňte z pole první představení, které už divadlo nehraje.
 1. Do proměnné `reviews` uložte pole hodnocení, které obdržela divadelní hra :i[Plyšáci na útěku] v různých recenzních časopisech. Hodnocení je vždy dvouprvkové pole obsahující název recenzního časopisu jako řetězec a samotné hodnocení jako číslo mezi 1 až 10. Pomocí metody `unshift` přidejte na začátek nové hodnocení z časopisu :i[Divadelní oběžník].
 
----solution
+:::solution
 
 ```js
 // Vytvořte nějaké pole celých čísel, například počty diváků na několika po sobě jdoucích divadelních představeních. Použije metodu push a přidejte do pole počet diváků na novém představení.
@@ -36,3 +36,5 @@ const reviews = [
 ];
 reviews.unshift(['Divadelní oběžník', 5]);
 ```
+
+:::
diff --git a/js1/chyby-pole/cvlekce/recitaly.md b/js1/chyby-pole/cvlekce/recitaly.md
@@ -34,7 +34,7 @@ U všech následujících úryvků kódů vytvořte technický popis jejich fung
     });
     ```
 
----solution
+:::solution
 
 ### 1
 
@@ -117,3 +117,5 @@ document.addEventListener('keyup', (event) => {
 1. Pokud je podmínka splněna, zavolá se metoda `log` na objektu `console` s parametrem – textem „paused“.
 
 Pokaždé, když uživatel kdekoli v dokumentu stiskne a pak pustí klávesu „P“, vypíše se do konzole v DevTools text „paused“.
+
+:::
diff --git a/js1/chyby-pole/cvlekce/sachovnice/exercise.md b/js1/chyby-pole/cvlekce/sachovnice/exercise.md
@@ -57,7 +57,7 @@ Sem přijde váš kód, který na poli sachovnice provede tah koněm.
 zobraz(sachovnice);
 ```
 
----solution
+:::solution
 
 ```js
 const zobraz = (data) => {
@@ -82,3 +82,5 @@ sachovnice[5][5] = 0;
 
 zobraz(sachovnice);
 ```
+
+:::
diff --git a/js1/cykly/cvdoma/algoritmy-fajnsmekri.md b/js1/cykly/cvdoma/algoritmy-fajnsmekri.md
@@ -17,7 +17,7 @@ const numbers = [
 1. Najděte druhý největší prvek v seznamu.
 1. Najděte nejnižší vrchol a nejvyšší údolí. Údolí je číslo, které je menší než jeho předchůdce i následovník.
 
----solution
+:::solution
 
 **a. Vypište na výstup délku nejdelší rostoucí sekvence čísel, které v poli následují přímo po sobě.**
 
@@ -122,3 +122,5 @@ for (let i = 0; i < numbers.length; i++) {
 
 console.log(`Druhý největší prvek v seznamu je ${secondMaximumNumber}`);
 ```
+
+:::
diff --git a/js1/cykly/cvdoma/cekani-na-sestku.md b/js1/cykly/cvdoma/cekani-na-sestku.md
@@ -9,7 +9,7 @@ Založte JavaScriptový program a splňte následující úkoly.
 1. Váš program nechť hází kostkou tak dlouho, až poprvé padne šestka. Vypište na výstup na kolikátý pokus šestka padla.
 1. Spusťte váš program desetkrát za sebou a zaznamenejte výsledky. Sdílejte vaše výsledky s ostatními abychom nasbírali co nejvíce dat.
 
----solution
+:::solution
 
 ```js
 const roll = () => {
@@ -26,3 +26,5 @@ while (rolledNumber !== 6) {
 
 console.log(`Šestka se hodila na ${counter}. pokus`);
 ```
+
+:::
diff --git a/js1/cykly/cvdoma/for-each-cisla.md b/js1/cykly/cvdoma/for-each-cisla.md
@@ -31,7 +31,7 @@ const shoppingList = [
    'moukamáslocukrjablkaskořicemlékocibule'
    ```
 
----solution
+:::solution
 
 1. ```js
    const shoppingList = [
@@ -58,3 +58,5 @@ const shoppingList = [
 
    console.log(shoppingListString);
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/male-algoritmy.md b/js1/cykly/cvdoma/male-algoritmy.md
@@ -25,7 +25,7 @@ const numbers = [
 1. Spočítejte průměr všech čísel v poli.
 1. Spočítejte součet všech kladných čísel v poli.
 
----solution
+:::solution
 
 1. Vypište na výstup všechna čísla.
    ```js
@@ -151,3 +151,5 @@ const numbers = [
    });
    console.log('Průměr všech:', positiveSum);
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/nakupni-seznam-funkce.md b/js1/cykly/cvdoma/nakupni-seznam-funkce.md
@@ -14,7 +14,7 @@ demand: 2
 
 1. Upravte výsledek předchozího cvičení tak, že obsah číslovaného seznamu vytvoříte voláním funkce `shoppingList`.
 
----solution
+:::solution
 
 1. ```js
    const shoppingList = (polozky) => {
@@ -30,3 +30,5 @@ demand: 2
    const list = ['mouka', 'máslo', 'cukr', 'jablka', 'skořice'];
    document.querySelector('ol').innerHTML = shoppingList(list);
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/nakupni-seznam.md b/js1/cykly/cvdoma/nakupni-seznam.md
@@ -29,7 +29,7 @@ const list = ['mouka', 'máslo', 'cukr', 'jablka', 'skořice'];
 
 1. Vytvořte někde na stránce prázdný číslovaný seznam `ol` a pomocí vlastnosti `innerHTML` do něj vložte řetězec sestavený v předchozím kroku.
 
----solution
+:::solution
 
 1. ```js
    const list = ['mouka', 'máslo', 'cukr', 'jablka', 'skořice'];
@@ -64,3 +64,5 @@ const list = ['mouka', 'máslo', 'cukr', 'jablka', 'skořice'];
 1. ```js
    document.querySelector('ol').innerHTML = vysledek;
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/pocitani-for.md b/js1/cykly/cvdoma/pocitani-for.md
@@ -5,7 +5,7 @@ demand: 2
 
 Přepište všechny WHILE cykly z předchozího cvičení na FOR cykly.
 
----solution
+:::solution
 
 1. ```js
    console.log('První FOR cyklus');
@@ -25,3 +25,5 @@ Přepište všechny WHILE cykly z předchozího cvičení na FOR cykly.
      console.log(i);
    }
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/pocitani-hodin.md b/js1/cykly/cvdoma/pocitani-hodin.md
@@ -16,7 +16,7 @@ Napište cyklus **WHILE**, který do konzole postupně vypíše všechny časov
 23:59
 ```
 
----solution
+:::solution
 
 #### WHILE
 
@@ -41,3 +41,5 @@ for (let hodiny = 0; hodiny < 24; hodiny++) {
   }
 }
 ```
+
+:::
diff --git a/js1/cykly/cvdoma/pocitani-while.md b/js1/cykly/cvdoma/pocitani-while.md
@@ -9,7 +9,7 @@ Založte JavaScriptový program, který provede následující instrukce.
 1. Vypište do konzole text `Druhý WHILE cyklus`. Pomocí cyklu WHILE vypište všechna **sudá čísla od jedné až do sta**.
 1. Vypište do konzole text `Třetí WHILE cyklus`. Pomocí cyklu WHILE vypište všechna **sudá čísla pozpátku od sta až k nule**.
 
----solution
+:::solution
 
 1. ```js
    console.log('První WHILE cyklus');
@@ -35,3 +35,5 @@ Založte JavaScriptový program, který provede následující instrukce.
      i -= 2;
    }
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/pohyby-na-uctu.md b/js1/cykly/cvdoma/pohyby-na-uctu.md
@@ -14,7 +14,7 @@ const amounts = [2500, -550, 1000, -1200, -3000, 1270, 2300];
 1. Napište cyklus WHILE, který zjistí číslo pohybu, ve kterém se účet dostal poprvé do mínusu. Vypište jak číslo pohybu, tak výši záporného zůstatku.
 1. Výpis se spočtenými hodnotami by měl obsahovat zmínku, že se účet dostal na hodnotu **-1250** po **páté** transakci.
 
----solution
+:::solution
 
 1. ```js
    const amounts = [2500, -550, 1000, -1200, -3000, 1270, 2300];
@@ -39,3 +39,5 @@ const amounts = [2500, -550, 1000, -1200, -3000, 1270, 2300];
      `Zůstatek se poprvé dostal do záporné hodnoty ${zustatek} po transakci číslo ${i}.`
    );
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/registrace.md b/js1/cykly/cvdoma/registrace.md
@@ -8,6 +8,8 @@ Vytvořte si repozitář ze šablony [cviceni-registrace](https://github.com/Cze
 1. Pokud uživatel zadá uživatelské jméno, které je již obsaženo v poli `users`, vypište do prvku s třídou `reg-form__error` chybovou hlášku ve smyslu, že zadané uživatelské jméno je již zabráno.
 1. Zkontrolujte, že heslo zadané do prvního políčka je dostatečně bezpečené. Heslo považujeme za bezpečné, pokud má alespoň 10 znaků nebo obsahuje alespoň jeden ze znaků pomlčka `-`, podtržítko `_` nebo dvojtečka `:`.
 
----solution
+:::solution
 
 [index.js](https://github.com/Czechitas-podklady-WEB/cviceni-registrace/blob/reseni/index.js)
+
+:::
diff --git a/js1/cykly/cvdoma/tezsi-algoritmy.md b/js1/cykly/cvdoma/tezsi-algoritmy.md
@@ -19,7 +19,7 @@ const numbers = [
 1. Najděte v seznamu největší prvek.
 1. Najděte v seznamu největší prvek, který je menší než číslo 16.
 
----solution
+:::solution
 
 1. Vypište na výstup všechna čísla, která jsou větší než jejich předchůdce.
    ```js
@@ -84,3 +84,5 @@ const numbers = [
    });
    console.log('Největší číslo je:', max);
    ```
+
+:::
diff --git a/js1/cykly/cvdoma/uzivatele.md b/js1/cykly/cvdoma/uzivatele.md
@@ -13,7 +13,7 @@ const users = ['paja', 'kaja', 'vlasta', 'peta', 'alex', 'ja', 'misa'];
 1. Do konzole vypište všechna jména jako emailové adresy z domény `gmail.com`. Uživatel 'paja' tak bude `[email protected]`.
 1. Vypište do konzole e-maily pouze těch uživatelů, jejichž jméno má nejvýše **4 znaky**.
 
----solution
+:::solution
 
 ```js
 const users = ['paja', 'kaja', 'vlasta', 'peta', 'alex', 'ja', 'misa'];
@@ -26,3 +26,5 @@ for (let i = 0; i < users.length; i++) {
   }
 }
 ```
+
+:::
diff --git a/js1/cykly/cvdoma/xylofon.md b/js1/cykly/cvdoma/xylofon.md
@@ -7,6 +7,8 @@ Vytvořte si repozitář ze šablony [cviceni-xylofon](https://github.com/Czechi
 
 ::fig[ukázka]{src=https://raw.githubusercontent.com/Czechitas-podklady-WEB/cviceni-xylofon/main/zadani/xylofon.gif}
 
----solution
+:::solution
 
 [index.js](https://github.com/Czechitas-podklady-WEB/cviceni-xylofon/blob/reseni/index.js)
+
+:::
-Original file line number
+Diff line change
@@ Expand Up @@
 :59
     ```
-    ---solution
+    :::solution
     #### WHILE
@@ Expand All / @@ -41,3 +41,5 @@ for (let hodiny = 0; hodiny < 24; hodiny++) { @@
       }
     }
     ```
+    :::