diff options
author | Rasmus Luha <rasmus.luha@gmail.com> | 2022-09-19 18:44:57 +0300 |
---|---|---|
committer | Rasmus Luha <rasmus.luha@gmail.com> | 2022-09-19 18:44:57 +0300 |
commit | ffdb767de352bb82253e241b6ad996e7b06fee17 (patch) | |
tree | 54db5f88b38025db883a2a6ef46be32edba2ec67 /rannak/mangud/perenaine/ristsona | |
parent | 40d015a15bee7d0a51c28e20c29ff7045419b8f5 (diff) |
ristsõna css done
Diffstat (limited to 'rannak/mangud/perenaine/ristsona')
-rw-r--r-- | rannak/mangud/perenaine/ristsona/index.html | 417 | ||||
-rw-r--r-- | rannak/mangud/perenaine/ristsona/script.js | 8 | ||||
-rw-r--r-- | rannak/mangud/perenaine/ristsona/style.css | 58 |
3 files changed, 299 insertions, 184 deletions
diff --git a/rannak/mangud/perenaine/ristsona/index.html b/rannak/mangud/perenaine/ristsona/index.html index 96df3bc..9089c33 100644 --- a/rannak/mangud/perenaine/ristsona/index.html +++ b/rannak/mangud/perenaine/ristsona/index.html @@ -10,21 +10,27 @@ <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous"> </head> -<body class="bg-dark"> +<body> + <div class="container text-white text-center"> <h1>Ristsõna</h1> <p>Lahenda ristsõna, vastuseks tuleb retsept?</p> - <div class="align-items-center text-center"> + <div class="text-center"> + <div class="col"> <a href="" class="btn-success btn disabled" role="button" aria-disabled="true">Liigu Edasi</a> </div> - </div> - <form onsubmit="javascript:checkAnswer()" action="javascript:null"> - <input placeholder="vastus..."/> - </form> - </div> + <div class="text-center inputBox"> + <label for="quantity">Nr:</label> + <input type="number" id="number" name="number" placeholder="1" min="1" max="12"> + + <input type="text" placeholder="Vastus " id="inputId"> + <button type="button" onclick="getInputValue();">Proovi</button> + </div> + </div> + </div> <!-- Crossword --> @@ -33,206 +39,267 @@ <div class="left text-center text-white"> <ol> - <li></li> - <li></li> - <li></li> - <li></li> - <li></li> - <li></li> + <li> + Köögivili, mida kasvatatakse nii kasvuhoones kui avamaal. Selles toidus kasutatakse nii + värskelt, marineeritult kui hapendatult. + </li> + + <li> + Valmistatakse õlist, munakollasest ja äädikast (või sidrunimahlast). + </li> + + <li> + Piklik oranžikas juurvili, mis sisaldab rikkalikult beeta-karoteeni. + </li> + + <li> + Lihatoode, maitseb hästi võileival. + </li> + + <li> + Puuvili, mis sai Lumivalgukesele saatuslikuks. + </li> + + <li> + Sellel maitseainele olevat ehitatud keskaegne Tallinn. + </li> + </ol> </div> <table class="text-center text-white"> + <!-- Essa Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hernes"><sup>8</sup><span>H</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> </tr> + + <!-- Teine Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="vorst"><sup>4</sup><span>V</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hernes"><span>E</span></td> + <td></span></td> + <td class="sibul"><sup>10</sup><span>S</span></td> + <td></span></td> + <td></span></td> </tr> + + <!-- Kolmas Rida--> <tr> - <td></td> - <td class="kurk"><sup>1</sup>K</td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td class="kurk"><sup>1</sup><span>K</span></td> + <td></span></td> + <td></span></td> + <td class="vorst"><span>O</span></td> + <td></span></td> + <td class="sool"><sup>6</sup><span>S</span></td> + <td></span></td> + <td class="hernes"><span>R</span></td> + <td class="muna"><sup>9</sup><span>M</span></td> + <td class="sibul"><span>I</span></td> + <td></span></td> + <td class="kartul"><sup>12</sup><span>K</span></td> </tr> + + <!-- Neljas Rida--> <tr> - <td></td> - <td class="kurk">U</td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td class="kurk"><span>U</span></td> + <td></span></td> + <td class="porgand"><sup>3</sup><span>P</span></td> + <td class="vorst"><span>R</span></td> + <td></span></td> + <td class="sool"><span>O</span></td> + <td></span></td> + <td class="hernes"><span>N</span></td> + <td class="muna"><span>U</span></td> + <td class="sibul"><span>B</span></td> + <td></span></td> + <td class="kartul"><span>A</span></td> </tr> + + <!-- Viies Rida--> <tr> - <td></td> - <td class="kurk">R</td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td class="kurk"><span>R</span></td> + <td class="majonees"><sup>2</sup><span>M</span></td> + <td class="porgand"><span>O</span></td> + <td class="vorst"><span>S</span></td> + <td class="õun"><sup>5</sup><span>Õ</span></td> + <td class="sool"><span>O</span></td> + <td class="pipar"><sup>7</sup><span>P</span></td> + <td class="hernes"><span>E</span></td> + <td class="muna"><span>N</span></td> + <td class="sibul"><span>U</span></td> + <td class="hapukoor"><sup>11</sup><span>H</span></td> + <td class="kartul"><span>R</span></td> </tr> + + <!-- Kuues Rida--> <tr class="vastus"> - <td>→</td> - <td class="kurk">K</td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td>→</span></td> + <td class="kurk"><span>K</span></td> + <td class="majonees"><span>A</span></td> + <td class="porgand"><span>R</span></td> + <td class="vorst"><span>T</span></td> + <td class="õun"><span>U</span></td> + <td class="sool"><span>L</span></td> + <td class="pipar"><span>I</span></td> + <td class="hernes"><span>S</span></td> + <td class="muna"><span>A</span></td> + <td class="sibul"><span>L</span></td> + <td class="hapukoor"><span>A</span></td> + <td class="kartul"><span>T</span></td> </tr> + + <!-- Seitsmes Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>J</span></td> + <td class="porgand"><span>G</span></td> + <td></span></td> + <td class="õun"><span>N</span></td> + <td></span></td> + <td class="pipar"><span>P</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>P</span></td> + <td class="kartul"><span>U</span></td> </tr> + + <!-- Kaheksas Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>O</span></td> + <td class="porgand"><span>A</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="pipar"><span>A</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>U</span></td> + <td class="kartul"><span>L</span></td> </tr> + + <!-- Üheksas Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>N</span></td> + <td class="porgand"><span>N</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="pipar"><span>R</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>K</span></td> + <td></span></td> </tr> + + <!-- Kümnes Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>E</span></td> + <td class="porgand"><span>D</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>O</span></td> + <td></span></td> </tr> + + <!-- 11 Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>E</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>O</span></td> + <td></span></td> </tr> + + <!-- 12 Rida--> <tr> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> - <td></td> + <td></span></td> + <td></span></td> + <td class="majonees"><span>S</span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td></span></td> + <td class="hapukoor"><span>R</span></td> + <td></span></td> + </tr> </table> <div class="right text-white"> <ol start="7"> - <li></li> - <li></li> - <li></li> - <li></li> - <li></li> - <li></li> + <li> + Kõige tuntum vürts. + </li> + + <li> + Seitse poissi ühes kindas? Eesti mõistatus + </li> + + <li> + Kas enne oli kana või see toiduaine? + </li> + + <li> + Siiruviiruline köögivili, mis paneb nutma. + </li> + + <li> + Hapendatud piimatoode, mida eestlased armastavad süüa iga roaga. + </li> + + <li> + Köögivili, mille Kolumbus Ameerikast Euroopasse tõi. + </li> + </ol> </div> diff --git a/rannak/mangud/perenaine/ristsona/script.js b/rannak/mangud/perenaine/ristsona/script.js index eac2fc2..01f4ad5 100644 --- a/rannak/mangud/perenaine/ristsona/script.js +++ b/rannak/mangud/perenaine/ristsona/script.js @@ -1,6 +1,14 @@ console.log("Brrrr");; let counter = 0; +function getInputValue() { + // Selecting the input element and get its value + let inputVal = document.getElementById("inputId").value; + // Displaying the value + alert(inputVal); + } + + // Button func function moveOnEnable(){ diff --git a/rannak/mangud/perenaine/ristsona/style.css b/rannak/mangud/perenaine/ristsona/style.css index 00c55b6..dab40f7 100644 --- a/rannak/mangud/perenaine/ristsona/style.css +++ b/rannak/mangud/perenaine/ristsona/style.css @@ -2,26 +2,66 @@ box-sizing: border-box; } -table{ - margin: 20px auto; +body{ + background-color: #212121 !important; } +/* Input Box styles */ -.vastus td{ - border: 5px solid lime !important; +.inputBox{ + margin-top: 10px !important; } -td { - border: 4px solid white !important; - width: 40px !important; - height: 40px !important; - font-weight: bold; +#number { + width: 3em !important; } + +/* Kusimusi */ + +.main li{ + margin: 10px; +} + + + +/* Main styles*/ + .main{ display: flex; } +table{ + margin: 20px auto; +} + +td { + border: 4px solid #212121 !important; + width: 40px !important; + height: 40px !important; + font-weight: bold; +} + .left, .right{ margin: 10px; width: calc((100vw - (13*40px) - 40px) / 2) !important; } + +/* Ristsõna */ + +.vastus td{ + border: 5px solid lime !important; +} + +.kurk, .majonees, .vorst, +.porgand, .õun, .sool, .pipar, .hernes, +.muna, .sibul, .hapukoor, .kartul { + border: 5px solid white !important; + color: white; +} + +.kurk span, .majonees span, .vorst span, +.porgand span, .õun span, .sool span, +.pipar span, .hernes span, .muna span, +.sibul span, .hapukoor span, .kartul span{ + display: none; +} |