summaryrefslogtreecommitdiff
path: root/rannak/mangud/uliopilane/tSark/index.html
blob: 382c382927d6b1a5b0db886cdd2d87ae86151448 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
<html lang"ee">
  <head>
    <title>Särgi Kujundus</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <link href="style.css" rel="stylesheet"/>
     <!-- 
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
      -->
  </head>

  <body>

    <div class="containeraa">


      <!-- Tshirt SVG -->
      <svg viewBox="0 0 512 512">
        <g transform="translate(0,448)">
          <path id="sark" d="m114.43-400.52-98.703 78.981 66.018 88.962 30.599-23.608v272.7h288.51v-272.7l29.397 23.608 66.026-88.282-95.992-76.942-74.453-0.70374c-0.58384 37.58-35.742 54.937-68.92 67.881-32.896-13.591-68.984-30.886-68.984-68.969 0.00036-0.0748-0.00033-0.14911 0-0.22393z" />
          <text class="sarkTekst doneTekst" x="200" y="-200" transform="rotate(0)" >Tekst</text>
        </g>
      </svg>



      <!-- Side panel stuff-->

      <div class="side">

          <h1>T-särgi Kujundamine</h1>
	      <p>
            Kujunda enda T-särk. Edasi liikumiseks peab olema
            kasutatud kõik kujundamise võimalused. Kui arvad, et särk on valmis,
            siis kontorlli nupuga, kas särk on valmis".
          </p>

          <div>
            <button class="checkMoveOn">Kontrolli, kas särk valmis</button>
            <button class="moveOn" disabled>Liigu Edasi</button>

            <div class="messageBox">
            </div>
          </div>

          <div class="muutused">

            <div class="sargiVarv">
              <h4>Vali Värv</h4>
              <label for="colorFiller">Särgi värv:</label>
              <input id="colorFiller"type="color" value="#ffffff"/>

              <label for="colorStroke">Särgi äär:</label>
              <input id="colorStroke" type="color" value="#000000"/>
            </div>


            <div class="fileUpload">
              <h4>Lisa Pilt</h4>
              <label for="image_input">Vali Pilt:</label>
              <input type="file" id="image_input" accept="image/jpg, image/png"/>
            </div>


            <div class="textPos">
              <h4>Tekst</h4>

              <label for="sargiText">Vali tekst:</label>
              <input id="sargiText" type="text" placeholder="Sinu tekst siia"/>
              <!-- 
              <button id="tekstBtn" onclick="getInputValue();">Muuda Teksti</button>
              -->
              <button id="nextTekstBtn" onclick="nextText();">Veel üks Tekst</button>

              <div class="textAddWrapper">
                <span class="ules">&uarr;</span>
                <span class="alla">&darr;</span>
                <span class="vasak">&larr;</span>
                <span class="parem">&rarr;</span>

                <span class="vertVasak">&cularr;</span>
                <span class="vertParem">&curarr;</span>

                <span class="plus">+</span>
                <span class="minus">-</span>

                <input id="colorText" type="color" value="#000000"/>

              </div>

            </div>  <!-- TextPos End -->

            <div class="nulliBtn">
              <label for="nulliBtn">Nulli Särk:</label>
              <button class="nulliBtn">Nulli särk</button>
            </div>
            
          </div>

      </div>

      <!-- Resizable Img -->
          <div class="item">
            <div class="resizer ne"></div>
            <div class="resizer nw"></div>
            <div class="resizer se"></div>
            <div class="resizer sw"></div>
          </div>

    </div>

    
    <script src="main.js"></script>
     <!-- 
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
      -->
 </body>
</html>