update:样式调整
parent
854641b4fc
commit
b3a8d2abee
|
@ -48,13 +48,13 @@ export default async function Home (props: PropsType) {
|
|||
<div className='main'>
|
||||
<div className="w-full h-[770px] pl-[72px] relative" id="home">
|
||||
<img
|
||||
className="absolute right-0 w-[1520px] h-[770px]"
|
||||
className="absolute right-[-40px] w-[1520px] h-[770px]"
|
||||
src="/home/img_header.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div
|
||||
className="text-[46px] leading-[62px] w-[585px] text-center pt-[279px]"
|
||||
className="text-[46px] leading-[62px] w-[639px] text-center pt-[279px]"
|
||||
>
|
||||
<div
|
||||
className="font-black"
|
||||
|
@ -78,71 +78,71 @@ export default async function Home (props: PropsType) {
|
|||
</div>
|
||||
<div className="w-full h-[428px] relative" id="service">
|
||||
<img
|
||||
className="absolute left-[-140px] w-[745px] h-[428px]"
|
||||
className="absolute left-[-214px] w-[969px] h-[428px]"
|
||||
src="/home/img_bg2.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div className="absolute w-[770px] text-[32px] top-[184px] right-[115px] text-[#333333] text-right font-semibold">
|
||||
<div className="absolute w-[770px] text-[32px] top-[184px] right-[95px] text-[#333333] text-right font-semibold">
|
||||
{ dict.customized }
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full h-[403px] relative">
|
||||
<img
|
||||
className="absolute right-[-30px] w-[787px] h-[403px]"
|
||||
className="absolute right-[-100px] w-[888px] h-[403px]"
|
||||
src="/home/img_AB.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div className="absolute w-[662px] text-[32px] top-[160px] left-[165px] text-[#333333] text-left font-semibold">
|
||||
<div className="absolute w-[662px] text-[32px] top-[160px] left-[105px] text-[#333333] text-left font-semibold">
|
||||
{ dict.ABTesting}
|
||||
</div>
|
||||
<div className="absolute w-[680px] text-[32px] top-[204px] left-[165px] text-[#333333] text-left font-semibold">
|
||||
<div className="absolute w-[680px] text-[32px] top-[204px] left-[105px] text-[#333333] text-left font-semibold">
|
||||
{ dict.iterateGameplay }
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full h-[392px] relative">
|
||||
<img
|
||||
className="absolute w-[731px] h-[392px]"
|
||||
className="absolute w-[731px] h-[392px] left-[-33px]"
|
||||
src="/home/img_mutilan.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div className="absolute w-[520px] text-[32px] top-[197px] right-[115px] text-[#333333] text-right font-semibold">
|
||||
<div className="absolute w-[520px] text-[32px] top-[197px] right-[95px] text-[#333333] text-right font-semibold">
|
||||
{ dict.multiLanguage }
|
||||
</div>
|
||||
<div className="absolute w-[510px] text-[32px] top-[242px] right-[115px] text-[#333333] text-right font-semibold">
|
||||
<div className="absolute w-[520px] text-[32px] top-[242px] right-[95px] text-[#333333] text-right font-semibold">
|
||||
{ dict.breakingGeographical }
|
||||
</div>
|
||||
</div>
|
||||
<div className="w-full h-[317px] relative mt-[83px]">
|
||||
<img
|
||||
className="absolute right-[20px] w-[742px] h-[317px]"
|
||||
className="absolute right-0 w-[742px] h-[317px]"
|
||||
src="/home/img_Omnichannel.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div className="absolute w-[680px] text-[32px] top-[124px] left-[165px] text-[#333333] text-left font-semibold">
|
||||
<div className="absolute w-[680px] text-[32px] top-[124px] left-[105px] text-[#333333] text-left font-semibold">
|
||||
{ dict.allChannel }
|
||||
</div>
|
||||
<div className="absolute w-[680px] text-[32px] top-[169px] left-[165px] text-[#333333] text-left font-semibold">
|
||||
<div className="absolute w-[680px] text-[32px] top-[169px] left-[105px] text-[#333333] text-left font-semibold">
|
||||
{ dict.expandInfluence }
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="w-full h-[317px] relative mt-[83px]">
|
||||
<img
|
||||
className="absolute left-[-194px] w-[881px] h-[357px]"
|
||||
className="absolute left-[-329px] w-[1250px] h-[357px]"
|
||||
src="/home/img_3.png"
|
||||
alt=""
|
||||
|
||||
/>
|
||||
<div className="absolute w-[691px] text-[32px] top-[100px] right-[115px] text-[#333333] text-right font-semibold">
|
||||
<div className="absolute w-[691px] text-[32px] top-[100px] right-[95px] text-[#333333] text-right font-semibold">
|
||||
{ dict.lightweightDeployment }
|
||||
</div>
|
||||
|
||||
<div className="absolute w-[712px] text-[32px] top-[145px] right-[115px] text-[#333333] text-right font-semibold">
|
||||
<div className="absolute w-[712px] text-[32px] top-[145px] right-[95px] text-[#333333] text-right font-semibold">
|
||||
{ dict.simplifyProcess }
|
||||
</div>
|
||||
</div>
|
||||
|
@ -163,14 +163,12 @@ export default async function Home (props: PropsType) {
|
|||
<div className="w-full px-[40px] flex flex-wrap justify-between mt-[34px] mb-[83px]">
|
||||
{
|
||||
caseList.map((item: CaseType, index: number) => {
|
||||
return <div key={'key'+index} className="cursor-pointer relative group mb-[50px]" style={{ width: 'calc(25% - 37.5px)' }}>
|
||||
<div className='hover:scale-[1.17] hover:shadow-[0px_0px_20px_8px_#0988FF] rounded-[60px] h-full'>
|
||||
return <div key={'key'+index} className="cursor-pointer relative group mb-[60px]">
|
||||
<div className='hover:scale-[1.25] hover:shadow-[0px_0px_20px_8px_#0988FF] rounded-[60px] w-[280px] h-[280px]'>
|
||||
<img
|
||||
className="rounded-[60px] w-full
|
||||
transition ease-in-out duration-300"
|
||||
transition ease-in-out duration-300 w-[280px] h-[280px]"
|
||||
src={item.img}
|
||||
width={300}
|
||||
height={300}
|
||||
alt=""
|
||||
/>
|
||||
<div className='absolute bottom-0 w-full h-[81px] bg-[#002653] text-center
|
||||
|
|
|
@ -19,10 +19,8 @@ export default function Header(props: { dict: Record<string, string>, lang: stri
|
|||
useEffect(() => {
|
||||
const designWidth = 1440;
|
||||
const deviceWidth = window.innerWidth;
|
||||
let scale = 1920 / designWidth
|
||||
if (deviceWidth >= 1440 && deviceWidth <= 1920) {
|
||||
scale = deviceWidth / designWidth;
|
||||
} else if (deviceWidth < 1440) {
|
||||
let scale = 1
|
||||
if (deviceWidth <= 1440) {
|
||||
scale = deviceWidth / designWidth;
|
||||
}
|
||||
document.documentElement.style.fontSize = `${scale * 14.4}px`;
|
||||
|
@ -80,7 +78,7 @@ export default function Header(props: { dict: Record<string, string>, lang: stri
|
|||
},
|
||||
]
|
||||
return (<>
|
||||
<div className={`flex items-center px-[55px] h-[80px] border-b-1 border-solid
|
||||
<div className={`flex items-center px-[40px] h-[80px] border-b-1 border-solid
|
||||
border-[#D8D8D8] fixed bg-white z-[900] w-[1440px] justify-between`}
|
||||
style={{ borderBottom: '1px solid #D8D8D8' }}
|
||||
>
|
||||
|
|
|
@ -2,12 +2,12 @@
|
|||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
/* ::-webkit-scrollbar {
|
||||
::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.main {
|
||||
-ms-overflow-style: none;
|
||||
scrollbar-width: none;
|
||||
} */
|
||||
}
|
||||
|
Loading…
Reference in New Issue