{namespace i=TYPO3\CMS\Install\ViewHelpers}

<f:layout name="Step" />

<f:section name="Content">
	<f:render partial="Action/Step/StepCounter.html" arguments="{steps: steps}" />

	<h3>Create user and import base data</h3>

	<p>
		Import basic database structure and create a backend administrator user.
		The password can be used to log in to the <strong>install tool</strong> and the <strong>TYPO3 CMS backend</strong>
		(default username is "admin").
	</p>

	<form method="post" id="stepInstaller-databaseData" class="t3-install-form-label-before">
		<f:render partial="Action/Common/HiddenFormFields" arguments="{_all}" />
		<input type="hidden" value="execute" name="install[set]" />

		<fieldset class="t3-install-form-label-width-10">
			<ol>
				<li>
					<label for="password">Username</label>
					<input
						class="t3-install-form-input-text"
						name="install[values][username]"
						id="username"
						placeholder="admin"
					/>
				</li>

				<li>
					<label for="password">Password</label>
					<input
						class="t3-install-form-input-text t3-install-form-password-strength"
						name="install[values][password]"
						id="password"
						type="password"
					/>
				</li>

				<li>
					<label for="show-password">Show password</label>
					<input
						type="checkbox"
						id="show-password"
						onchange="if (this.checked==true) { document.getElementById('password').type='text'; } else { document.getElementById('password').type='password'; }"
					/>
				</li>
			</ol>
		</fieldset>
		<div class="typo3-message message-warning">
			This password gives an attacker full control over your instance if cracked. It should be strong (include lower and upper case characters, special characters and numbers) and must be at least eight characters long.
		</div>
		<hr />

		<fieldset class="t3-install-form-label-width-10">
			<ol>
				<li>
					<label for="sitename">Site name</label>
					<input
						class="t3-install-form-input-text"
						name="install[values][sitename]"
						id="sitename"
						type="text"
						value="{siteName}"
					/>
				</li>
			</ol>
		</fieldset>

		<button type="submit">
			Continue
		</button>
	</form>
</f:section>
