Skip to content

Commit 053d150

Browse files
committed
style: video object fit
1 parent 57af424 commit 053d150

File tree

3 files changed

+7522
-4994
lines changed

3 files changed

+7522
-4994
lines changed

assets/images/logo.png

-28.8 KB
Loading

components/Banner/index.vue

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="banner">
33
<header>
44
<div class="logo-burger">
5-
<a href="/" class="logo"></a>
5+
<!-- <a href="/" class="logo"></a>-->
66
</div>
77
<div class="btn-operation">
88
<a href="https://cloud.iotsharp.net/" target="_blank" class="n-button try">Try it now</a>
@@ -16,7 +16,7 @@
1616
data-vide-bg="mp4: ~images/iotsharp.mp4"
1717
data-vide-options="bgColor: #000000, loop: true, muted: true, posterType: jpg">
1818
<div style="position: absolute; z-index: -1; inset: 0px; overflow: hidden; background-size: cover; background-color: rgb(0, 0, 0); background-repeat: no-repeat; background-position: 50% 50%; background-image: none;">
19-
<video autoplay="" loop="" preload="auto" muted="" style="height: 100%;weight:100% margin: auto; position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: visible; opacity: 1;" class="md-opjjpmhoiojifppkkcdabiobhakljdgm">
19+
<video autoplay="" loop="" preload="auto" muted="" style="margin: auto; position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%, -50%); visibility: visible; opacity: 1;" class="md-opjjpmhoiojifppkkcdabiobhakljdgm">
2020
<source src="~images/iotsharp.mp4" type="video/mp4" class="md-opjjpmhoiojifppkkcdabiobhakljdgm">
2121
Your browser does not support the video tag.
2222
</video>
@@ -43,16 +43,15 @@ export default {
4343
position: relative;
4444
overflow: hidden;
4545
}
46-
.btn-operation {
47-
width: 200px;
48-
}
46+
4947
header,
5048
#thingsboard-paas header,
5149
#thingsboard-pe header,
5250
#trendz header,
5351
#thingsboard-edge header {
5452
background-color: unset;
5553
box-shadow: unset;
54+
overflow: hidden;
5655
}
5756
5857
.logo {
@@ -66,23 +65,20 @@ header,
6665
}
6766
6867
@media screen and (min-width: 750px) {
69-
section,
70-
header {
68+
section {
7169
padding-left: 30px;
7270
padding-right: 30px;
7371
}
7472
}
7573
@media screen and (max-width: 1500px) {
7674
header {
7775
margin: unset;
78-
width: 100%;
7976
}
8077
}
8178
8279
header {
8380
position: absolute;
8481
top: 0;
85-
padding: 0 40px;
8682
left: 0;
8783
transition-duration: 0.3s;
8884
z-index: 8888;
@@ -129,4 +125,8 @@ header {
129125
color: #ffffff !important;
130126
}
131127
}
128+
129+
video {
130+
object-fit: fill;
131+
}
132132
</style>

0 commit comments

Comments
 (0)