+
@@ -65,7 +65,7 @@ const { t } = useI18n()
-
+
@@ -198,4 +198,28 @@ const { t } = useI18n()
padding-right: 0.75rem/* 12px */;
padding-left: 2rem/* 32px */;
}
+
+.stack {
+ display: inline-grid;
+ place-items: center;
+ align-items: flex-end;
+}
+.stack > * {
+ grid-column-start: 1;
+ grid-row-start: 1;
+ transform: translateX(10%) scale(0.9);
+ z-index: 1;
+ width: 100%;
+ opacity: 0.6;
+}
+.stack > *:nth-child(2) {
+ transform: translateX(5%) scale(0.95);
+ z-index: 2;
+ opacity: 0.8;
+}
+.stack > *:nth-child(1) {
+ transform: translateX(0) scale(1);
+ z-index: 3;
+ opacity: 1;
+}
diff --git a/src/pages/index.vue b/src/pages/index.vue
index fbef9f0..3a76e55 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -1,31 +1,71 @@
-
@@ -40,12 +80,12 @@ const { t } = useI18n()
-
-
-
+
+
+
@@ -63,9 +103,19 @@ const { t } = useI18n()
-
+
+
+
+
+
+
![image description]()
+
+
+
- 实时图像
+ {{ isShowImgOnTime ? '实时图像' : '当前图像' }}