From 29316d6f9366057244e8a17ea9af5400a4f58591 Mon Sep 17 00:00:00 2001
From: wangqi <magical1908@outlook.com>
Date: 星期一, 29 三月 2021 17:59:17 +0800
Subject: [PATCH] 添加弹窗模块边框角高亮
---
src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue | 72 +++++++++++++++++++++++++++++------
1 files changed, 59 insertions(+), 13 deletions(-)
diff --git a/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue b/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue
index b317b1c..eb83145 100644
--- a/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue
+++ b/src/components/BaseNav/PublicBounced/GasComponents/GasVideo.vue
@@ -1,16 +1,19 @@
<template>
-<div>
-<!-- <video>-->
- <video width="100%" height="100%" controls>
- <source src="movie.mp4" type="video/mp4">
- <source src="movie.ogg" type="video/ogg">
-<!-- 鎮ㄧ殑娴忚鍣ㄤ笉鏀寔 HTML5 video 鏍囩銆�-->
- </video>
-<!-- <span class="ico ico-sound" :class="{ active: isMute }" v-on:click="closeSoundClick()"></span>-->
-<!-- <span class="ico ico-skip"></span>-->
-<!-- <span class="ico ico-video" :class="{ hide: isPlay }" v-on:click="playClick()"></span>-->
-<!-- </video>-->
-</div>
+ <div class="win">
+ <!-- 鍥涗釜瑙掔殑杈规鏁堟灉 -->
+ <div class="border_corner border_corner_left_top"></div>
+ <div class="border_corner border_corner_right_top"></div>
+ <div class="border_corner border_corner_left_bottom"></div>
+ <div class="border_corner border_corner_right_bottom"></div>
+ <div class="main">
+ <div>
+ <video width="100%" height="100%" controls>
+ <source src="movie.mp4" type="video/mp4">
+ <source src="movie.ogg" type="video/ogg">
+ </video>
+ </div>
+ </div>
+ </div>
</template>
<script>
@@ -20,5 +23,48 @@
</script>
<style scoped>
-
+.win {
+ width: 100%;
+ /*height: 100%;*/
+ position: relative;
+ display: inline-block;
+//border: 1px solid #396d83;
+}
+.main {
+ width: 100%;
+ height: 100%;
+}
+.border_corner{
+ z-index: 2500;
+ position: absolute;
+ width: 14px;
+ height: 14px;
+ background: rgba(0,0,0,0);
+ border: 2px solid #47d5ea;
+}
+.border_corner_left_top{
+ top: 0;
+ left: 0;
+ border-right: none;
+ border-bottom: none;
+}
+.border_corner_right_top{
+ top: 0;
+ right: 0;
+ border-left: none;
+ border-bottom: none;
+}
+.border_corner_left_bottom{
+ bottom: 0;
+ left: 0;
+ border-right: none;
+ border-top: none;
+ border-bottom-left-radius: 4px;
+}
+.border_corner_right_bottom{
+ bottom: 0;
+ right: 0;
+ border-left: none;
+ border-top: none;
+}
</style>
--
Gitblit v1.8.0