<div class="form-horizontal">
	<div class="legend" data-i18n="TAB_ABOUT/LEGEND_ABOUT"></div>
	<div class="row">
		<div class="span4">
			<div class="rl-logo"></div>
			<div>
				2023 © <span data-i18n="TAB_ABOUT/LABEL_ALL_RIGHTS_RESERVED"></span>
				<br>
				<a class="g-ui-link" href="https://snappymail.eu/" target="_blank" style="padding-left: 0">https://snappymail.eu/</a>
			</div>
		</div>
		<div class="span6">
			<h1 style="margin-bottom: 0;">SnappyMail</h1>
			<h4 style="margin-top: 0;" data-bind="text: version"></h4>
			<h4 style="color: #aaa; font-weight: normal;">An advanced fork of <a class="g-ui-link" href="https://www.rainloop.net/" target="_blank">RainLoop</a></h4>
			<h4 style="color: #aaa; font-weight: normal;" data-i18n="TAB_ABOUT/LABEL_TAG_HINT"></h4>

			<div>
				<hr>
				<div data-bind="visible: 'error' === statusType()">
					<i class="fontastic" style="color:red">⚠</i>
					<span data-bind="text: errorDesc"></span>
				</div>
				<div data-bind="visible: 'available' === statusType()">
					<i class="fontastic" style="color:orange">⚠</i>
					<span data-bind="html: coreVersionHtmlDesc"></span>
					<br />
					<span data-bind="if: coreWarning">
						<br />
						<i class="fontastic" style="color:red">⚠</i>
						<b data-i18n="HINTS/WARNING"></b>
						<span data-i18n="TAB_ABOUT/HINT_READ_CHANGE_LOG"></span>
						<br />
					</span>
					<br />
					<a class="btn" href="https://github.com/the-djmaze/snappymail/releases" target="_blank" data-i18n="TAB_ABOUT/BUTTON_RELEASES"></a>
					<a class="btn" data-bind="visible: coreUpdatable, click: updateCoreData" data-i18n="GLOBAL/UPDATE"></a>
					<a class="btn" href="https://github.com/the-djmaze/snappymail/releases/latest" data-bind="visible: !coreUpdatable()" data-i18n="GLOBAL/UPDATE"></a>
				</div>
				<div data-bind="visible: 'up-to-date' === statusType()">
					<i style="color: green">✔</i>
					<span data-i18n="TAB_ABOUT/HINT_IS_UP_TO_DATE"></span>
				</div>
				<div data-bind="visible: 'updating' === statusType()">
					<i class="icon-spinner"></i>
					<span data-i18n="TAB_ABOUT/LABEL_UPDATING"></span>…
				</div>
				<div data-bind="visible: 'checking' === statusType()">
					<i class="icon-spinner"></i>
					<span data-i18n="TAB_ABOUT/LABEL_CHECKING"></span>…
				</div>
			</div>

			<h3>System</h3>
			<table class="table table-hover table-bordered"><tbody>
				<tr>
					<td>Average load past minute</td>
					<td data-bind="text: load1"></td>
				</tr>
				<tr>
					<td>Average load past 5 minutes</td>
					<td data-bind="text: load5"></td>
				</tr>
				<tr>
					<td>Average load past 15 minutes</td>
					<td data-bind="text: load15"></td>
				</tr>
			</tbody>
			</table>

			<h3>PHP optional extensions</h3>
			<table class="table table-hover table-bordered"><thead><tr>
				<th>Extension</th>
				<th>Loaded</th>
			</tr></thead><tbody data-bind="foreach: phpextensions">
				<tr>
					<td data-bind="text: name"></td>
					<td data-bind="text: loaded ? '✔' : '❌'"></td>
				</tr>
			</tbody>
			</table>
		</div>
	</div>
</div>
