<div class="buttons big_single_button">
	<span href="javascript: void(0)" class="button" id="selenium_new_message_button" data-test-id="mail-compose-fab" data-bind="command: $parent.bigButtonCommand">
		<span class="icon"></span>
		<span data-bind="text: $parent.bigButtonText"></span>
	</span>
	<span href="javascript: void(0)" class="button add_new_folder" data-bind="click: addNewFolder, visible: visibleNewFolderButton">
		<span class="icon"></span>
		<span data-bind="i18n: {'key': 'MAILWEBCLIENT/HEADING_NEW_FOLDER'}"></span>
	</span>
</div>

<!-- ko foreach: underNewMessageButtonControllers -->
	<!-- ko template: { name: $data.ViewTemplate, data: $data} --><!-- /ko -->
<!-- /ko -->

<div class="middle_bar" data-bind="css: {'quota_visible': -1 < quotaProc(), 'quota_has_text_below': !bShowQuotaBarTextAsTooltip}">
	<div class="panel_center" data-bind="customScrollbar: {x: false}">
		<div class="scroll-inner">
			<div class="items_list collapsible">
				<div class="folders" style="margin-bottom: 10px;" data-bind="visible: unifiedInboxAllowed">
					<!-- ko template: {name: '%ModuleName%_FolderView', data: oUnifiedInbox} --><!-- /ko -->
				</div>
				<div class="folders">
					<!-- ko template: {name: '%ModuleName%_FolderView', foreach: folderList().collection} --><!-- /ko -->
				</div>
			</div>
		</div>
	</div>
	<div class="panel_bottom">
		<div class="manage_folders" data-bind="visible: manageFoldersHash() !== '#'">
			<a href="javascript: void(0)" data-test-id="mail-manage-folders" data-bind="i18n: {'key': '%MODULENAME%/ACTION_MANAGE_FOLDERS'}, attr: {href: manageFoldersHash}"></a>
		</div>
		<span class="volumer" data-bind="visible: -1 < quotaProc()">
			<span class="volumer_container" data-bind="customTooltip: bShowQuotaBarTextAsTooltip ? quotaDesc() : false">
				<span class="used" data-bind="style: {'width': '' + (-1 < quotaProc() ? quotaProc() : 0) + '%' }"></span>
			</span>
			<span data-bind="visible: !bShowQuotaBarTextAsTooltip, text: quotaDesc"></span>
		</span>
	</div>
</div>
