diff options
Diffstat (limited to 'rannak/mangud/arimees/pood/index.html')
| -rwxr-xr-x | rannak/mangud/arimees/pood/index.html | 278 |
1 files changed, 254 insertions, 24 deletions
diff --git a/rannak/mangud/arimees/pood/index.html b/rannak/mangud/arimees/pood/index.html index 6c2f7b5..1e83723 100755 --- a/rannak/mangud/arimees/pood/index.html +++ b/rannak/mangud/arimees/pood/index.html @@ -1,30 +1,39 @@ +<!DOCTYPE html> <html lang="en"> <head> - <meta charset="UTF-8"> - <meta http-equiv="X-UA-Compatible" content="IE=edge"> - <meta name="viewport" content="width=device-width, initial-scale=1.0"> - <title> Pood </title> - <!-- Bootstrap - CSS only --> - <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"> - <link rel="stylesheet" href="styles.css"> + <meta charset="UTF-8"> + <meta name="viewport" content="width=device-width, initial-scale=1" /> + + <title>Pood</title> + <!-- Bootstrap - CSS only --> + <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"> + + <link rel="stylesheet" href="style.css"> </head> -<body class="text-white"> +<body> + + + <!-- Button trigger modal --> + <button id="testModal" type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal"> + Sissejuhatus + </button> + + <div class="container text-white text-center"> + <h1>Pood</h1> + <p> + Vali kataloogidest erineivaid tooteid, mida soovid osta + <br/> + ning arvuta ka nende kurss + </p> - <div class="container text-center text-white align-items-center pb-1"> - <h1 class="pb-1 pt-2"> Pood </h1> - <p> Leia toodete tolleaegne hind Eesti Markades, kasutades Rubla ja Marga vahelist kurssi.</p> - <div class="row"> - <div> - <button class="moveOn" disabled>Liigu Edasi</button> - </div> + <div class="text-center"> + <div class="col"> + <button class="moveOn" disabled>Liigu Edasi</button> </div> - <!-- Button trigger modal --> - <button type="button" class="btn btn-primary modalButton" data-bs-toggle="modal" data-bs-target="#myModal"> - Sissejuhatus - </button> + </div> </div> @@ -41,10 +50,22 @@ </div> <div class="modal-body"> - Lähen siin varsti Georg Otsaga Helsinki ostoksille. + + <p> + Lähen siin varsti Georg Otsaga Helsinki ostoksille. Uut kaupa oleks vaja. + Mul täie kuumaga äri käib praegu! Sirvisin veits uusi katalooge, ikka on + hea kaubal silm peal hoida. Äkki saate nats aidata mul plaani pidada, + mida oleks kõige kasulikum 12 000 rutsiga ära tuua? Kurss on praegu päris + ilus - 1 FIM= 7,356 rubla. Põhiline, et oleks palju erinevaid kaupu ja + kogu raha saaks ära kulutatud! Aga sellega vist problat ei tule. + Äkki tahate ise ka midagi, võin soodsalt tuua! + </p> <br/> <strong> - Äkki saate vähe aidata mul plaani pidada, mida kõige kasulikum oleks 10 000 rutsiga ära tuua? Äkki tahate ise ka midagi, võin soodsalt tuua! + Selleks lappa katalooge, vali omale sobiv nodi välja ja pane + tabelisse - mida, kui palju, mis rahaga siin ja sealpool lahte arvestama peab. + Ole hea, vali erinevat kraami - ega ma kohalik kaubamaja ole, + et kümmet ühesugust kitlit müüma hakkan! Ole nüüd! </strong> </div> @@ -53,10 +74,219 @@ </div> + <!-- Main Stuff --> + <div class="main"> + <h3>Sirvi ajakirja</h3> + + <div class="ajakiriWrapper"> + + + + <ul class="nav nav-tabs" id="myTab" role="tablist"> + + <li class="nav-item" role="presentation"> + <button class="nav-link active" id="tab1" data-bs-toggle="tab" data-bs-target="#tab-pane1" type="button" role="tab" aria-controls="tab-pane1" aria-selected="true">1</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab2" data-bs-toggle="tab" data-bs-target="#tab-pane2" type="button" role="tab" aria-controls="tab-pane2" aria-selected="false">2</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab3" data-bs-toggle="tab" data-bs-target="#tab-pane3" type="button" role="tab" aria-controls="tab-pane3" aria-selected="false">3</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab4" data-bs-toggle="tab" data-bs-target="#tab-pane4" type="button" role="tab" aria-controls="tab-pane4" aria-selected="false" >4</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab5" data-bs-toggle="tab" data-bs-target="#tab-pane5" type="button" role="tab" aria-controls="tab-pane5" aria-selected="false" >5</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab6" data-bs-toggle="tab" data-bs-target="#tab-pane6" type="button" role="tab" aria-controls="tab-pane6" aria-selected="false" >6</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab7" data-bs-toggle="tab" data-bs-target="#tab-pane7" type="button" role="tab" aria-controls="tab-pane7" aria-selected="false" >7</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab8" data-bs-toggle="tab" data-bs-target="#tab-pane8" type="button" role="tab" aria-controls="tab-pane8" aria-selected="false" >8</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab9" data-bs-toggle="tab" data-bs-target="#tab-pane9" type="button" role="tab" aria-controls="tab-pane9" aria-selected="false" >9</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab10" data-bs-toggle="tab" data-bs-target="#tab-pane10" type="button" role="tab" aria-controls="tab-pane10" aria-selected="false" >10</button> + </li> + + <li class="nav-item" role="presentation"> + <button class="nav-link" id="tab11" data-bs-toggle="tab" data-bs-target="#tab-pane11" type="button" role="tab" aria-controls="tab-pane11" aria-selected="false" >11</button> + </li> + + </ul> + + + + + + <div class="tab-content" id="myTabContent"> + + <div class="tab-pane fade show active" id="tab-pane1" role="tabpanel" aria-labelledby="tab1" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/1.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane2" role="tabpanel" aria-labelledby="2-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/2.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane3" role="tabpanel" aria-labelledby="3-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/3.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane4" role="tabpanel" aria-labelledby="4-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/4.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane5" role="tabpanel" aria-labelledby="5-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/5.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane6" role="tabpanel" aria-labelledby="6-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/6.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane7" role="tabpanel" aria-labelledby="7-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/7.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane8" role="tabpanel" aria-labelledby="8-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/8.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane9" role="tabpanel" aria-labelledby="9-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/9.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane10" role="tabpanel" aria-labelledby="10-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/10.jpg"/> + </div> + + <div class="tab-pane fade" id="tab-pane11" role="tabpanel" aria-labelledby="11-tab" tabindex="0"> + <img alt="Ajakirja lehekülg" src="pildid/11.jpg"/> + </div> + + </div> + + + + </div> + <!-- Ajakirja Wrapper End --> + + + + <!-- Tabel --> + <h3>Ostunimekiri</h3> + + <div class="tabelWrapper"> + <table class="table table-dark table-striped"> + <tr> + <th><strong>Toode</strong></th> + <th><strong>Hind(FIM)</strong></th> + <th><strong>Hind(Rubla)</strong></th> + <th><strong>Tükki</strong></th> + <th><strong>Summa(Rubla)</strong></th> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + <tr> + <td></td> + <td></td> + <td></td> + <td></td> + <td></td> + </tr> + </table> + + + </div> + + <!-- Tabeli lõpp --> + + + </div> + <!-- Main End --> + + + <script src="script.js"></script> - <script src="script.js"></script> + <!-- JavaScript Bundle with Popper --> + <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script> - <!-- JavaScript Bundle with Popper --> - <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa" crossorigin="anonymous"></script> </body> </html> |