Copy environment

Practice Form

<div class="practice-form  ">
    <form class="practice-form__form">
        <div class="text">
            <h2 class="color-green">Praktika taotlus</h2>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field1">
        Eesnimi
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field1" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field2">
        Perekonnanimi
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field2" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field3">
        Elukoht
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field3" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field4">
        Telefon
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="tel" id="field4" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field5">
        Õppeasutus
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field5" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field6">
        Eriala
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field6" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field7">
        Kursus
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field7" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required textarea">
                <label class="textfield__label " for="field8">
        Varem sooritatud praktikad (nimetada ettevõtted)
    </label>
                <div class="textfield__inner">
                    <textarea class="textfield__input textarea__input     " type="text" id="field8" name=""></textarea>

                </div>
            </div>

            <div class="textfield textfield--required select">
                <label class="textfield__label select__label" for="field9">
        Kas soovid vaatluspraktikat või osaluspraktikat (vaatluspraktika on alati tasuta)
    </label>
                <div class="textfield__inner">
                    <select name="" id="field9" class="textfield__input select__input">
                    <option
                value="1"
                            >Option 1</option>
                    <option
                value="2"
                 selected             >Option 2</option>
                    <option
                value="3"
                            >Option 3</option>
                    <option
                value="4"
                            >Option 4</option>
            </select>
                    <svg class="icon textfield--required select__icon">
    <use xlink:href="../../inc/svg/global.48b54b5802220943f9ae21d3bf31136a.svg#arrow-down"></use>
</svg>

                </div>
            </div>
            <div class="datepicker-field  textfield--required" id="field10">

                <div class="textfield textfield--required">
                    <label class="textfield__label " for="datepicker-input1">
        Algus (päev, kuu)
    </label>
                    <div class="textfield__inner">
                        <input class="textfield__input" type="text" id="datepicker-input1" name="datepicker" value="" placeholder="" autocomplete="off" readonly>
                    </div>
                </div>
            </div>
            <div class="datepicker-field  textfield--required" id="field11">

                <div class="textfield textfield--required">
                    <label class="textfield__label " for="datepicker-input2">
        Lõpp (päev, kuu)
    </label>
                    <div class="textfield__inner">
                        <input class="textfield__input" type="text" id="datepicker-input2" name="datepicker" value="" placeholder="" autocomplete="off" readonly>
                    </div>
                </div>
            </div>

            <div class="textfield textfield--required select">
                <label class="textfield__label select__label" for="field12">
        Millisesse kontserni ettevõttesse soovid praktikale tulla?
    </label>
                <div class="textfield__inner">
                    <select name="" id="field12" class="textfield__input select__input">
                    <option
                value="1"
                            >Option 1</option>
                    <option
                value="2"
                 selected             >Option 2</option>
                    <option
                value="3"
                            >Option 3</option>
                    <option
                value="4"
                            >Option 4</option>
            </select>
                    <svg class="icon textfield--required select__icon">
    <use xlink:href="../../inc/svg/global.48b54b5802220943f9ae21d3bf31136a.svg#arrow-down"></use>
</svg>

                </div>
            </div>

            <div class="textfield textfield--required textarea">
                <label class="textfield__label " for="field13">
        Praktika eesmärk (tulenevalt õppeasutuse praktika juhendist)
    </label>
                <div class="textfield__inner">
                    <textarea class="textfield__input textarea__input     " type="text" id="field13" name=""></textarea>

                </div>
            </div>

            <div class="textfield textfield--required textarea">
                <label class="textfield__label " for="field14">
        Miks soovid praktikale tulla Viru Keemia Grupi ettevõtetesse?
    </label>
                <div class="textfield__inner">
                    <textarea class="textfield__input textarea__input     " type="text" id="field14" name=""></textarea>

                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field15">
        Sinu emakeel
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field15" name="" value="" placeholder="">
                </div>
            </div>

            <div class="textfield textfield--required">
                <label class="textfield__label " for="field16">
        Kas saad hakkama mõnes muus keeles?
    </label>
                <div class="textfield__inner">
                    <input class="textfield__input" type="text" id="field16" name="" value="" placeholder="">
                </div>
            </div>
        </div>
        <button type="button" class="button button--block practice-form__button">
                    <span class="button__text">Saada</span>
                            <span class="button__icon-container">
                <svg class="icon  button__icon">
    <use xlink:href="../../inc/svg/global.48b54b5802220943f9ae21d3bf31136a.svg#arrow"></use>
</svg>
            </span>
            </button>
    </form>

</div>
{
  "language": "en-US",
  "data": {
    "title": "Praktika taotlus",
    "fields": [
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Eesnimi",
          "id": "field1"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Perekonnanimi",
          "id": "field2"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Elukoht",
          "id": "field3"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Telefon",
          "id": "field4",
          "type": "tel"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Õppeasutus",
          "id": "field5"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Eriala",
          "id": "field6"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Kursus",
          "id": "field7"
        }
      },
      {
        "component": "textarea",
        "modifier": "textfield--required",
        "data": {
          "label": "Varem sooritatud praktikad (nimetada ettevõtted)",
          "id": "field8"
        }
      },
      {
        "component": "select",
        "modifier": "textfield--required",
        "data": {
          "label": "Kas soovid vaatluspraktikat või osaluspraktikat (vaatluspraktika on alati tasuta)",
          "id": "field9",
          "options": [
            {
              "name": "Option 1",
              "value": "1"
            },
            {
              "name": "Option 2",
              "value": "2",
              "isSelected": true
            },
            {
              "name": "Option 3",
              "value": "3"
            },
            {
              "name": "Option 4",
              "value": "4"
            }
          ]
        }
      },
      {
        "component": "datepicker-field",
        "modifier": "textfield--required",
        "data": {
          "id": "field10",
          "input": {
            "id": "datepicker-input1",
            "name": "datepicker",
            "label": "Algus (päev, kuu)"
          }
        }
      },
      {
        "component": "datepicker-field",
        "modifier": "textfield--required",
        "data": {
          "id": "field11",
          "input": {
            "id": "datepicker-input2",
            "name": "datepicker",
            "label": "Lõpp (päev, kuu)"
          }
        }
      },
      {
        "component": "select",
        "modifier": "textfield--required",
        "data": {
          "label": "Millisesse kontserni ettevõttesse soovid praktikale tulla?",
          "id": "field12",
          "options": [
            {
              "name": "Option 1",
              "value": "1"
            },
            {
              "name": "Option 2",
              "value": "2",
              "isSelected": true
            },
            {
              "name": "Option 3",
              "value": "3"
            },
            {
              "name": "Option 4",
              "value": "4"
            }
          ]
        }
      },
      {
        "component": "textarea",
        "modifier": "textfield--required",
        "data": {
          "label": "Praktika eesmärk (tulenevalt õppeasutuse praktika juhendist)",
          "id": "field13"
        }
      },
      {
        "component": "textarea",
        "modifier": "textfield--required",
        "data": {
          "label": "Miks soovid praktikale tulla Viru Keemia Grupi ettevõtetesse?",
          "id": "field14"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Sinu emakeel",
          "id": "field15"
        }
      },
      {
        "component": "textfield",
        "modifier": "textfield--required",
        "data": {
          "label": "Kas saad hakkama mõnes muus keeles?",
          "id": "field16"
        }
      }
    ],
    "button": {
      "text": "Saada",
      "icon": "arrow"
    }
  }
}