about summary refs log tree commit diff
path: root/corp/rih/frontend/src/home.html
blob: 697daf5148f370be8424274a0c15fa17f15ce544 (plain) (blame)
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
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
html! {
<main>
  <script>
    {r#"function captchaOnload(sitekey, callback) {
      if (window.smartCaptcha) {
        const container = document.getElementById('captcha-container');
        const widgetId = window.smartCaptcha.render(container, {
            sitekey: sitekey,
            hl: 'en',
            callback: callback,
        });
      }
    }"#}
  </script>

  <div class="container px-4 pt-5 my-5 text-center">
    <div class="row">
      <div class="col-7 ms-auto">
        <h1 class="display-5 fw-bold text-body-emphasis">{"Russia is Hiring"}</h1>
        <p class="lead my-4">
          {"Are you an IT-specialist on the hunt for a job? Well, "}
          <a href="https://archive.is/SAONj" class="text-black">{"times are tough"}</a>
          {" in Western countries at the moment. Meanwhile tech is booming in Russia, and national support programs make life as an IT-specialist very comfortable. Why not look East?"}
        </p>
        <p class="lead mb-4">{"We can help you find an employer in Russia, sort out the formalities and get you started. Sign up and tell us a bit about your profile, or read on below about the benefits of life in Russia."}</p>

        <div class="d-grid gap-2 d-sm-flex justify-content-sm-center">
          <button type="button" class="btn btn-primary btn-lg px-4 gap-3">{"Sign up"}</button>
        </div>
      </div>
      <div class="col-2 me-auto">
        <img src="/rih-logo.png" height="400px" />
      </div>
    </div>
  </div>
  <div class="b-section-divider"></div>

  <div class="container px-5 py-5">
    <h2 class="pb-2 border-bottom">{"Life in Russia"}</h2>
    <div class="row row-cols-1 row-cols-md-2 align-items-md-center g-5 py-5">
      <div class="col d-flex flex-column align-items-start gap-2">
        <h3 class="fw-bold">{"Moscow is very cool and good indeed"}</h3>
        <p class="text-body-secondary">{"Paragraph of text beneath the heading to explain the heading. We'll add onto it with another sentence and probably just keep going until we run out of words."}</p>
        <a href="#sign-up" class="btn btn-primary btn-lg">{"Primary button"}</a>
      </div>
      <div class="col">
        <div class="row row-cols-1 row-cols-sm-2 g-4">
          <div class="col d-flex flex-column gap-2">
            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
            </div>
            <h4 class="fw-semibold mb-0">{"Look they have banyas"}</h4>
            <p class="text-body-secondary">{"Paragraph of text beneath the heading to explain the heading."}</p>
          </div>

          <div class="col d-flex flex-column gap-2">
            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
            </div>
            <h4 class="fw-semibold mb-0">{"Wow such cultural diversity"}</h4>
            <p class="text-body-secondary">{"Paragraph of text beneath the heading to explain the heading."}</p>
          </div>

          <div class="col d-flex flex-column gap-2">
            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
            </div>
            <h4 class="fw-semibold mb-0">{"Many nice landscapes indeed"}</h4>
            <p class="text-body-secondary">{"Paragraph of text beneath the heading to explain the heading."}</p>
          </div>

          <div class="col d-flex flex-column gap-2">
            <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3">
            </div>
            <h4 class="fw-semibold mb-0">{"And such low taxes!"}</h4>
            <p class="text-body-secondary">{"Paragraph of text beneath the heading to explain the heading."}</p>
          </div>
        </div>
      </div>
    </div>
  </div>
  <div class="b-section-divider"></div>

  <div class="container px-4 py-5">
    <div class="row">
      <div class="mx-auto col-7">
        <a id="sign-up"/>
        <h2 class="pb-2 border-bottom">{"Finding Work in Russia"}</h2>
        <p>
          {"Usually landing the most interesting jobs requires you to have a well-developed network of contacts, but this is tough when you set your eyes on a new country. Luckily we at "}
          <a class="text-black" href={VISTA_URL}>{"Vista Immigration"}</a>
          {" have contacts with many tech companies in Russia, large and small, and can help you with this!"}</p>
        <p>{"Tell us a bit about yourself, the technologies you'd like to work with, and your situation in regards to relocating to Russia. We will then match up your profile with companies that match your interests, and establish contact between you and a potential employer if there is a good fit. No generic recruiter spam, guaranteed - we'd rather not send you anything, than send you something irrelevant!"}</p>
        <p>
          {"If you get hired, our experts can assist you with legal and other support for your move. Добро пожаловать в Россию!"}
        </p>
      </div>
    </div>

    <div class="row my-3">
      <div class="col-7 mx-auto">
        <p>{"Let's get started with you telling us a bit about what kind of job you would like!"}</p>
      </div>

      if !self.submitted {
      <div class="mx-auto col-6 border rounded-3 shadow">
        <form class="m-3">

          <div class="mb-3">
            <label for="job" class="form-label">{"What job(s) are you looking for?"}</label>
            <input
              type="text" class="form-control" id="job"
              placeholder="Backend/frontend engineer, Test automation, DevOps/SRE, UI/UX ..."
              oninput={link.callback(|event| input_message(event, Msg::SetPosition))} />
          </div>

          <div class="mb-3">
            <label for="technologies" class="form-label">{"Which technologies do you want to work with?"}</label>
            <div>{render_technologies(link, &self.record.technologies)}</div>

            <input type="text" class="form-control" id="technologies"
                   aria-describedby="technologiesHelp"
                   onkeypress={link.callback(add_tech)}/>
            <div id="technologiesHelp" class="form-text">{"Press enter after each technology."}</div>
          </div>

          <div class="mb-3">
            <label for="jobDetails" class="form-label">{"What's your work background?"}</label>
            <textarea class="form-control" id="workBackground" rows=3
                      aria-describedby="workBackgroundHelp"
                      oninput={link.callback(|event| textarea_message(event, Msg::SetWorkBackground))} >
            </textarea>
            <div id="workBackgroundHelp" class="form-text">{"Tell us about your work experience, and/or leave links to your CV on your site, LinkedIn or wherever."}</div>
          </div>

          <div class="mb-3">
            <label for="jobDetails" class="form-label">{"Other job details:"}</label>
            <textarea class="form-control" id="jobDetails" rows=3
                      aria-describedby="jobDetailsHelp"
                      oninput={link.callback(|event| textarea_message(event, Msg::SetJobDetails))}>
            </textarea>
            <div id="jobDetailsHelp" class="form-text">{"Tell us a bit about what you're looking for in a job and in an employer."}</div>
          </div>

          <hr/>
          <p>{"Now we also need some personal details about you:"}</p>

          <div class="mb-3">
            <label for="name" class="form-label">{"What's your name?"}</label>
            <input type="text" class="form-control" id="name"
                   oninput={link.callback(|event| input_message(event, Msg::SetName))} />
          </div>

          <div class="mb-3">
            <label for="email" class="form-label">{"What's your email address?"}</label>
            <input type="email" class="form-control" id="email" aria-describedby="emailHelp"
                   oninput={link.callback(|event| input_message(event, Msg::SetEmail))}/>
            <div id="emailHelp" class="form-text">{"No newsletters, no spam - we will only reach out if there's a match!"}</div>
          </div>

          <div class="mb-3">
            <label id="citizenship" class="form-label">{"What citizenship do you hold?"}</label>
            {citizenship_input(self, link)}
            <div id="citizenshipHelp" class="form-text">{"We need to know this to estimate immigration-related bureaucracy. If you hold more than one citizenship, pick the one with which you'd want to receive a work visa."}</div>
          </div>

          <div class="mb-3">
            <label for="personalDetails" class="form-label">{"Other relevant information:"}</label>
            <textarea class="form-control" id="personalDetails" rows=3
                      aria-describedby="personalDetailsHelp"
                      oninput={link.callback(|event| textarea_message(event, Msg::SetPersonalDetails))} >
            </textarea>
            <div id="personalDetailsHelp" class="form-text">{"Any specific places where you'd like to live? Would you be moving with family? Any other assistance required?"}</div>
          </div>

          <div id="captcha-container" class="smart-captcha mb-3" style="height: 100px" />

          <button type="submit" class="btn btn-primary"
                  disabled={!(self.record.is_complete() && self.captcha_token.is_some())}
                  onclick={link.callback(|_| Msg::Submit)}>
            {"Submit"}
          </button>
          <p class="pt-2"><i>{"This page is still under construction! Please reach out at contact@ if you have any questions."}</i></p>
        </form>
      </div>
      } else {
      <div class="mx-auto col-6 border rounded-3 shadow">
        <p>{"Thank you for submitting your data! We will reach out to confirm your email address, and further if any matches are found. You can contact us at contact@russiaishiring.com with any questions you might have."}</p>
      </div>
      }

    </div>
  </div>
  <div class="b-section-divider"></div>

  <footer class="mt-auto text-center">
    <div class="py-3">
      <p>
        {"By "}
        <a href={VISTA_URL} class="text-black">{"Vista Immigration"}</a>
        {", with help from "}
        <a href="https://tvl.su/" class="text-black">{"TVL"}</a>
        {"."}
      </p>
    </div>
  </footer>

</main>
}