<mvc:View
	controllerName="sap.ui.demo.cart.controller.Comparison"
	xmlns="sap.m"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns:core="sap.ui.core"
	xmlns:form="sap.ui.layout.form"
	displayBlock="true">
	<Page
		id="page"
		backgroundDesign="Solid">
		<customHeader>
			<Bar>
				<contentMiddle>
					<Title
						level="H2"
						text="{i18n>comparisonTitle}"/>
				</contentMiddle>
				<contentRight>
					<Button
						icon="sap-icon://customer"
						press=".onAvatarPress"
						tooltip="{i18n>avatarButtonTooltip}"/>
					<ToggleButton
						icon="sap-icon://cart"
						pressed="{= ${appView>/layout}.startsWith('ThreeColumns') }"
						tooltip="{i18n>toCartButtonTooltip}"
						press=".onToggleCart">
					</ToggleButton>
				</contentRight>
			</Bar>
		</customHeader>
		<content>
			<ScrollContainer
				height="100%"
				width="100%"
				horizontal="false"
				vertical="true"
				focusable="false">
				<HBox
					class="comparebox"
					id="comparisonContainer">
					<core:Fragment
						fragmentName="sap.ui.demo.cart.view.ComparisonItem"
						type="XML"/>
					<core:Fragment
						fragmentName="sap.ui.demo.cart.view.ComparisonItem"
						type="XML"/>
					<Panel id="placeholder" visible="false">
						<headerToolbar>
							<Toolbar>
								<Text text="{i18n>HowToTitle}"/>
							</Toolbar>
						</headerToolbar>
						<form:Form editable="false">
							<form:layout>
								<form:ResponsiveGridLayout
										labelSpanXL="12"
										labelSpanL="12"
										labelSpanM="12"
										labelSpanS="12"
										adjustLabelSpan="false"
										emptySpanXL="4"
										emptySpanL="4"
										emptySpanM="4"
										emptySpanS="0"
										singleContainerFullSize="false"/>
							</form:layout>
							<form:formContainers>
								<form:FormContainer>
									<form:FormElement label="{i18n>HowTo1Label}">
										<form:fields>
											<Text text="{i18n>HowTo1Text}"/>
										</form:fields>
									</form:FormElement>
									<form:FormElement label="{i18n>HowTo2Label}">
										<form:fields>
											<Text text="{i18n>HowTo2Text}"/>
										</form:fields>
									</form:FormElement>
									<form:FormElement label="{i18n>HowTo3Label}">
										<form:fields>
											<Text text="{i18n>HowTo3Text}"/>
										</form:fields>
									</form:FormElement>
								</form:FormContainer>
							</form:formContainers>
						</form:Form>
					</Panel>
				</HBox>
			</ScrollContainer>
		</content>
	</Page>
</mvc:View>