add layout

src/components/yx-dark/styles/bottom.module.css

@@ -0,0 +1,3 @@
+.bottom {
+    background: #f0f3;
+}

src/components/yx-dark/styles/header.module.css

@@ -0,0 +1,53 @@
+header {
+	height: 121px;
+	width: 100%;
+	position: absolute;
+	z-index: 10000;
+	background: url(../images/header.png) 100% 100% / contain no-repeat;
+	display: grid;
+	place-content: center;
+}
+header > div {
+	display: flex;
+	align-items: center;
+	margin-bottom: 0;
+}
+header > div .header--logo {
+	margin-top: 12px;
+	width: 48px;
+	height: 67px;
+	background: url(../images/logo.png) center/contain no-repeat;
+}
+
+header h1 {
+	margin-bottom: 0;
+	margin-left: 36px;
+	font-size: 52px;
+	/* line-height: 97px; */
+	user-select: none;
+	letter-spacing: 9px;
+	font-weight: 400;
+	color: #6bf2ff;
+	font-family: '微软雅黑', sans-serif;
+}
+
+.header--wing {
+	left: 0;
+	bottom: -12px;
+	height: 48px;
+	font-size: 28px;
+	line-height: 48px;
+	color: #51f0ff;
+}
+
+.company {
+	margin-left: 960px;
+	letter-spacing: 1px;
+}
+
+.datetime {
+	text-align: center;
+	left: unset;
+	right: 1100px; 
+	letter-spacing: 1px;
+}

src/components/yx-dark/styles/left.module.css

@@ -0,0 +1,7 @@
+.left-content {
+    height: 100%;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+    background: #fcc3;
+}

src/components/yx-dark/styles/main.module.css

@@ -0,0 +1,47 @@
+.main-container {
+	height: 1px;
+	flex: 1;
+	background: #ccc4;
+	display: grid;
+	grid-template-columns: 626px 576px 580px 626px 626px 450px 626px;
+	grid-template-rows: 600px 306px;
+	gap: 20px;
+	grid-template-areas:
+		'left    main    main    main    main    main    right' 
+		'left    bottom1 bottom2 bottom3 bottom4 bottom5 right';
+	place-content: end center;
+	margin-bottom: 20px;
+}
+
+.main-center {
+	grid-area: main;
+	background: #0f93;
+}
+
+.left {
+	grid-area: left;
+}
+
+.bottom-1 {
+	grid-area: bottom1;
+}
+
+.bottom-2 {
+	grid-area: bottom2;
+}
+
+.bottom-3 {
+	grid-area: bottom3;
+}
+
+.bottom-4 {
+	grid-area: bottom4;
+}
+
+.bottom-5 {
+	grid-area: bottom5;
+}
+
+.right {
+	grid-area: right;
+}

src/components/yx-dark/styles/right.module.css

@@ -0,0 +1,3 @@
+.right {
+    background: #03f3;
+}