digital-theory/sesame-vitejs/sesame/src/components/DisabledSection.vue

<template>







	<section
		id="transactionnal_webdesign"
		class="has-text-centerd"
	>
		<h2 class="title">
			Transactional
		</h2>
		<div class="description has-text-centered">
			Webdesign
		</div>
		<div class="columns">
			<div class="column first">
				<h3 class="sub-title">
					For all your
					<br>
					<span class="color-emphasis"> digital</span> uses.
				</h3>
			</div>
			<div class="column second">
				Our creative competitive edge <br>
				<br>
				We leverage our own studio in Paris equipped to produce all e-formats.
				We power transactional content with our technology. Our content is
				transactional and generate online sales. We produce multi-purpose
				content at scale for all touchpoints to reduce costs.
			</div>
		</div>
	</section>

	<section id="carry">
		<h2 class="title color-emphasis">
			We carry out web design and development
		</h2>
		<p class="description">
			in headless
			<br>
			commerce.
		</p>
		<div class="gradient-bg-yellow" />
		<div class="gradient-bg" />
		<div class="computer-block-item" />
		<div class="bubbles secondary-color">
			<p>Evolutive maintenance</p>
			<p>Front end (ux/ui) development</p>
			<p>Web App (pwa) development</p>
			<p>Consulting</p>
		</div>
	</section>

	<section id="kyc">
		<p class="description2 primary-color">
			We craft e-commerce Ux template based on qualitative and quantitative
			studies
		</p>
		<div class="columns">
			<div class="column left-column">
				<h2 class="title primary-color text-content">
					We help you to know your customer needs
				</h2>
				<p class="description secondary-color text-content">
					With our method
				</p>
				<a
					href="#kyc"
					class="button text-content"
				> Show Sesame method </a>
			</div>
			<div class="column" />
		</div>
		<div class="bubbles secondary-color fat-text">
			<div class="small-bubble" />
			<div class="small-bubble" />
			<div class="small-bubble" />
			<div class="small-bubble" />
			<div class="small-bubble" />
			<p class="bubble">
            <span>

              to Prioritize development effort
            </span>
			</p>
			<p class="bubble">
            <span>

              to improve customer satisfaction
            </span>
			</p>
			<p class="bubble">
            <span>

              to increase conversion rate
            </span>
			</p>
		</div>
	</section>


	<section id="china">
		<h2 class="title primary-color">
			Our China-inspired ui in 4 pillars
		</h2>
		<p class="description secondary-color">
			a quick and smooth consumer journey and never
			<br>
			ending shopping experience at the same time
		</p>
		<div class="line" />
		<div class="block-items columns">
			<div class="block-item column">
				<div class="top block-item-1">
					<p>
						Content driven
					</p>
				</div>
				<div class="bottom block-item-2">
					- Rebound rate
				</div>
			</div>
			<div class="block-item column">
				<div class="top block-item-3">
					<p>
						Experimental
					</p>
				</div>
				<div class="bottom block-item-4">
					- Return rate
				</div>
			</div>
			<div class="block-item column">
				<div class="top block-item-5">
					<p>
						Interactive
					</p>
				</div>
				<div class="bottom block-item-6">
					+Conversion rate
				</div>
			</div>
			<div class="block-item column">
				<div class="top block-item-7">
					<p>
						Agile
					</p>
				</div>
				<div class="bottom block-item-8">
					+ Retention rate
				</div>
			</div>
		</div>
	</section>



	<section id="we_develop">
		<h2 class="title secondary-color">
			We develop custom-made innovative e-commerce features based on your
			brand stakes.
		</h2>
		<div class="phone-container-2">
			<div class="top" />
			<div class="picture" />
			<div class="bottom" />
		</div>
		<div class="container-arrows">
			<div class="circle">
				<img
					class="rotated"
					src="img/arrow.svg"
					alt=""
				>
			</div>
			<div class="circle circle-right">
				<img

					src="img/arrow.svg"
					alt=""
				>
			</div>
		</div>

		<div class="columns light-text">
			<div class="column data">
				Data
			</div>
			<div class="column ar">
				AR
			</div>
		</div>
		<div class="quick secondary-color">
			Quick wins
		</div>
		<div class="long_term secondary-color">
			Long-Term
			<br>
			Project
		</div>
	</section>

	<section id="full_creative">
		<h2 class="title secondary-color">
			A full creative & production Studio in Paris
		</h2>
		<div class="container">
			<div class="tiles columns dark-color">
				<div class="aside column">
					<h3 class="sub-title">
						Sesame Studio Spaces
					</h3>
					<p>
						2 Large Sets for Photos, Videos and Live Shopping Shooting
						Adaptable lighting racks
						Walls and decor for in-apartment style shooting
						LED Screen Background
						<br>
						1 Small Set for Stills Life Shooting
						<br>
						1 Space for 720° with turntable and 720° robot
						<br>Editing Room equipped for voice recording
						<br>Styling Room
						<br>Glam Room
						<br>Separated Storrage Room safe for brand’s products
					</p>
					<h3 class="sub-title">
						Full Service & Adaptative Team
					</h3>
					<p>
						Studio Manager, Lighting Technician.
						<br>Digital Creative Director, Motion Design, UX Designer, 3D Design.
						<br>Large network of freelances specialized in all categories, premium and luxury included.
					</p>
				</div>
				<div class="picture column">
					<img
						src="img/pictures_rooms.png"
						alt="rooms"
					>
				</div>
			</div>
		</div>
	</section>

	<section id="our_team">
		<h2 class="title primary-color">
			Our team.
		</h2>
		<div class="sub-category dark-color">
			<p class="sub-title">
				of experts and directors.
			</p>
			<div class="columns">
				<div class="person column">
					<img
						src="img/Rectangle 6.jpg"
						alt="people"
					>
					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/Rectangle%206-1.jpg"
						alt="people"
					>

					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/people%202.png"
						alt="people"
					>

					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/Rectangle 6-3.jpg"
						alt="people"
					>

					<p class="name">
						Name Surname
					</p>
				</div>
			</div>
		</div>


		<div class="sub-category">
			<h3 class="sub-title">
				and our senior team
			</h3>
			<div class="columns">
				<div class="person column">
					<img
						src="img/Rectangle 6-4.jpg"
						alt="people"
					>
					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/Rectangle%206-5.jpg"
						alt="people"
					>
					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/Rectangle 6-6.jpg"
						alt="people"
					>
					<p class="name">
						Name Surname
					</p>
				</div>
				<div class="person column">
					<img
						src="img/Rectangle%206-7.jpg"
						alt="people"
					>
					<p class="name">
						Name Surname
					</p>
				</div>
			</div>
		</div>
	</section>
	<section
		id="baozun_group"
		class="has-rounded-corners"
	>
		<h2 class="title">
			Baozun Group
			<br>
			and Company.
		</h2>
	</section>
</template>
<script>

</script>