Browse Source

Banner update

andy 3 years ago
parent
commit
cc84f54922

BIN
.DS_Store


BIN
img/.DS_Store


BIN
img/Group 270/Group 270.png


BIN
img/Group 270/Group 270@2x.png


BIN
img/Union 5/Union 5.png


BIN
img/Union 5/Union 5@2x.png


BIN
img/Union 6/Union 6.png


BIN
img/Union 6/Union 6@2x.png


BIN
img/Union 7/Union 7.png


BIN
img/Union 7/Union 7@2x.png


BIN
img/yt-video/.DS_Store


+ 10 - 1
index.html

@@ -88,28 +88,37 @@
                 <div class="card bg-transparent border-0">
                     <div id="banner-des">
                         <div id="lux-banner" class="px-0">
+                            <div style="position: relative;">
+                                <img style="position:absolute; z-index:10;" class="banner-border1"  src="./img/Union 5/Union 5.png" alt="">
                                 <div id="scene"class="lux-01 px-0">
                                     <div data-depth="0.4">
                                         <img  class="img-fluid" src="./img/2381.png" alt="">
                                     </div>
                                 </div>
+                            </div>
+                            <div style="position: relative;">
+                                <img style="position:absolute; z-index:10;" class="banner-border2"  src="./img/Union 7/Union 7.png" alt="">
                                 <div id="scene1" class="lux-02 px-0">
                                     <div data-depth="0.1">
                                         <img  class="img-fluid" src="./img/2382.png" alt="">
                                     </div>
                                 </div>
+                            </div>
+                            <div style="position: relative;">
+                                <img style="position:absolute; z-index:10;" class="banner-border1"  src="./img/Union 5/Union 5.png" alt="">
                                 <div id="scene2" class="lux-03 px-0 text-center">
                                     <div data-depth="0.4">
                                         <img class="img-fluid" src="./img/238332.png" alt="">
                                     </div>
                                 </div>
+                            </div>
                             
                         </div>
                     </div>
                     <!-- <div>
                         <img id="banner-des" src="./img/banner-img.png" class="card-img" alt="...">
                     </div> -->
-                    <img id="banner-m" src="./img/banner-img-m.png" class="card-img" alt="">
+                    <img id="banner-m" src="./img/Group 270/Group 270.png" class="card-img" alt="">
                     <div class="banner-title card-img-overlay">
                         <img id="title-des" class="img-fluid" src="./img/banner-title.png" alt="">
                         <img id="title-m" class="img-fluid" src="./img/banner-title-m.png" alt="">

+ 15 - 0
style.css

@@ -289,6 +289,19 @@ body {
   margin-left: 5vw;
 }
 
+.banner .banner-content #lux-banner .banner-border2 {
+  width: 85%;
+  top: -2px;
+  left: -6px;
+}
+
+.banner .banner-content #lux-banner .banner-border1 {
+  width: 85%;
+  height: 32vw;
+  top: 30px;
+  left: -5px;
+}
+
 .banner .banner-content #lux-banner .lux-01 {
   overflow: hidden;
   border-radius: 150px 150px 0% 0%;
@@ -358,6 +371,8 @@ body {
 }
 
 .banner .banner-content .banner-title #title-des {
+  position: relative;
+  z-index: 100;
   margin: 0 auto;
   -webkit-animation-name: title;
           animation-name: title;

File diff suppressed because it is too large
+ 0 - 0
style.css.map


+ 17 - 1
style.scss

@@ -223,12 +223,26 @@ body {
             grid-template-columns: 1fr 1fr 1fr;
             width: 65vw;
             margin-left: 5vw;
+
+            .banner-border2{
+                width: 85%;
+                // height:32vw;
+                top:-2px;
+                left:-6px;
+            }
+            .banner-border1{
+                width: 85%;
+                height:32vw;
+                top:30px;
+                left:-5px;
+            }
             .lux-01{
                 overflow: hidden;
                 border-radius:150px 150px 0% 0%;
-              margin-top: 3vw;
+                margin-top: 3vw;
                 width: 17vw;
                 height:30vw;
+              
                 img{
                     position: relative;
                     bottom:30px;
@@ -280,6 +294,8 @@ body {
                 margin-left:0vw;
             }
             #title-des {
+                position: relative;
+                z-index: 100;
                 margin: 0 auto;
                 animation-name: title;
                 animation-duration: 2s;

Some files were not shown because too many files changed in this diff