d0zingcat/NotionNext
1
0
Fork 0
mirror of https://github.com/d0zingcat/NotionNext.git synced 2026-05-14 07:26:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

theme-heo-hero-layout

Browse Source
This commit is contained in:
tangly1024
2023-07-12 23:31:29 +08:00
parent 109c5d4c52
commit 695164fd51
1 changed files with 20 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
themes/heo/components/Hero.js
View File

@@ -7,18 +7,31 @@
const Hero = props => {
return (
<>
<notice className="max-w-[88rem] w-full mx-auto flex h-16 px-5">
<div className="bg-indigo-100 w-full h-full"></div>
<notice className="max-w-[88rem] w-full mx-auto flex h-12 mb-4 px-5 font-bold">
<div className="bg-white rounded-xl border w-full h-full flex items-center justify-between px-5">
<div>左侧 图表</div>
<div className="w-full h-full hover:text-indigo-600 flex justify-center items-center">这里是公告栏</div>
<div>右侧按钮</div>
</div>
</notice>
<hero id="hero" style={{ zIndex: 1 }} className="max-w-[88rem] w-full mx-auto flex relative px-5" >
<hero id="hero" style={{ zIndex: 1 }} className="max-w-[88rem] w-full mx-auto flex relative space-x-3 px-5" >
<div id='hero-left' className='flex flex-col flex-1 bg-red-200'>
<div className="h-60 bg-blue-200 my-2"></div>
<div className="h-20 bg-yellow-100 my-2"></div>
<div className="h-60 bg-white rounded-xl border my-2"></div>
<div className="h-20 flex flex-nowrap justify-between space-x-3 my-2">
<div className="bg-white rounded-xl border flex-1">
</div>
<div className="bg-white rounded-xl border flex-1">
</div>
<div className="bg-white rounded-xl border flex-1">
</div>
</div>
</div>
<div id='hero-right' className='flex flex-col flex-1 bg-green-200 '>
<div className="my-2 h-full bg-indigo-200"></div>
<div className="my-2 h-full bg-white rounded-xl border "></div>
</div>
</hero>