From 81f54040c2cb65537c6c6e1db8358a39a57dea0d Mon Sep 17 00:00:00 2001
From: mayisheng <admin>
Date: Mon, 15 Aug 2022 16:14:01 +0800
Subject: [PATCH] 1
---
src/styles/divforms/panoramaBox.scss | 163 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 162 insertions(+), 1 deletions(-)
diff --git a/src/styles/divforms/panoramaBox.scss b/src/styles/divforms/panoramaBox.scss
index 699e72a..084b5af 100644
--- a/src/styles/divforms/panoramaBox.scss
+++ b/src/styles/divforms/panoramaBox.scss
@@ -8,6 +8,140 @@
overflow: hidden;
padding: 30px;
+
+
+ .content-wrap {
+ padding: 0 20px 20px 20px;
+
+ background-image: linear-gradient(180deg, transparent 0px, #28bbf06c 0px, #28bbf06c 50%, transparent 50%), linear-gradient(0deg, transparent 0px, #28bbf06c 0px, #28bbf06c 50.1%, transparent 50%);
+ border: 1px solid #29baf1;
+ box-shadow: 0 0px 12px #29b8f1e5;
+
+ box-sizing: border-box;
+
+ .title {
+ position: relative;
+ height: 36px;
+ line-height: 36px;
+ color: #fff;
+ text-align: center;
+
+ .return-btn {
+ position: absolute;
+ top: 0;
+ left: 8px;
+ bottom: 0;
+ right: auto;
+ margin: auto;
+ width: 18px;
+ height: 18px;
+ cursor: pointer;
+ }
+
+ .full-srceen-btn {
+ position: absolute;
+ top: 0;
+ right: 34px;
+ bottom: 0;
+ left: auto;
+ margin: auto;
+ width: 18px;
+ height: 18px;
+ cursor: pointer;
+ }
+
+ .close-box {
+ position: absolute;
+ top: 0;
+ right: 8px;
+ bottom: 0;
+ left: auto;
+ margin: auto;
+ width: 18px;
+ height: 18px;
+ cursor: pointer;
+ }
+ }
+
+ .content {
+ position: relative;
+ min-width: 460px;
+ min-height: 320px;
+ height: calc(100% - 36px);
+
+ button {
+ padding: 2px;
+ position: absolute;
+ top: 4px;
+ right: 4px;
+ width: 32px;
+ height: 32px;
+ background: rgba(0, 0, 0, .2) !important;
+ z-index: 1;
+ border: 0;
+ border-radius: 5px;
+
+ img {
+ width: 100%;
+ }
+ }
+
+ iframe {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+
+
+ }
+
+ .arrow {
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ width: 45px;
+ height: 2px;
+ transform: rotate(-45deg) translate(5px, -15px);
+ background-color: #28bbf0;
+ }
+
+ .change-full {
+ position: fixed !important;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ z-index: 99;
+ background: #fff;
+ transform: translate3d(0, 0, 0) !important;
+ }
+
+ &.change-full {
+ position: fixed !important;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: #fff;
+ transform: translate3d(0, 0, 0) !important;
+ z-index: 22 !important;
+ }
+}
+
+.monitor-dom {
+ position: fixed;
+ left: 0;
+ z-index: 1 !important;
+
+ .monitor-wrap {
+ position: relative;
+ overflow: hidden;
+ padding: 30px;
+
.content-wrap {
padding: 0 20px 20px 20px;
@@ -16,15 +150,42 @@
box-shadow: 0 0px 12px #29b8f1e5;
.title {
+ position: relative;
+ height: 36px;
line-height: 36px;
color: #fff;
text-align: center;
+
+ .return-btn {
+ position: absolute;
+ top: 0;
+ left: 8px;
+ bottom: 0;
+ right: auto;
+ margin: auto;
+ width: 18px;
+ height: 18px;
+ cursor: pointer;
+ }
+
+ .close-box {
+ position: absolute;
+ top: 0;
+ right: 8px;
+ bottom: 0;
+ left: auto;
+ margin: auto;
+ width: 18px;
+ height: 18px;
+ cursor: pointer;
+ }
}
}
- iframe {
+ video {
width: 460px;
height: 320px;
+ object-fit: fill;
}
}
--
Gitblit v1.9.3