[chore] Merge LLZBranch into main

css/index.css

@@ -50,7 +50,6 @@ main {
 
 /*-| Texto |-*/
 .banner-text-container {
-    height: 90%;
     width: 90%;
     position: relative;
     flex-direction: column;
@@ -85,6 +84,12 @@ main {
     font-size: 16px;
 }
 
+.video-pitch {
+    min-width: 50vw;
+    height: auto;
+    aspect-ratio: 16/9;
+}
+
 /*-----===| EFEITOS |===-----*/
 /*---=| Hover |=---*/
 .btn-contact:hover {
@@ -100,7 +105,7 @@ main {
 
     .banner-text-title {
         width: 100%;
-        font-size: 64px;
+        font-size: 48px;
     }
 
     .btn-contact-container{
@@ -119,7 +124,7 @@ main {
 
     .banner-text-title {
         width: 80%;
-        font-size: 48px;
+        font-size: 32px;
     }
 
     .btn-contact-container{
@@ -131,8 +136,9 @@ main {
     }
 }
 
-.video-pitch {
-    min-width: 50vw;
-    height: auto;
-    aspect-ratio: 16/9;
+@media (max-width: 576px) {
+    .banner-text-title {
+        width: 100%;
+        font-size: 24px;
+    }
 }

index.html

@@ -52,22 +52,18 @@
                 <div class="banner-text-title">
                     <span class>NÓS ESTAMOS CONSTRUINDO UM NOVO FUTURO</span>
                 </div>
-
-                <div class="btn-contact-container">
-                    <button class="btn-contact">ENTRE EM CONTATO</button>
-                </div>
             </section>
         </article>
 
-        <div id="eco-shield-explanation"></div>
+        <article id="eco-shield-explanation"></article>
 
-        <div class="container mb-5">
-            <div class="row text-center">
+        <article class="container mb-5">
+            <section class="row text-center">
                 <h3 class="text-uppercase mt-5">A final o que é o</h3>
                 <h3><span class="blue-text">Eco</span>Shield</h3>
-            </div>
+            </section>
 
-            <div class="row d-flex">
+            <section class="row d-flex">
                 <div class="row align-items-start text-start mt-5 mb-5">
                     <div class="col-lg-6 order-lg-2">
                         <h4>
@@ -100,27 +96,27 @@ <h4>
             <!-- PLACEHOLDER CHART SECTION -->
 
             <!-- VIDEO PITCH START -->
-            <div class="row text-center">
+            <section class="row text-center">
                 <h3 class="text-uppercase mt-5">
                     QUER TER CONHECIMENTO DE UM CASE REAL?
                 </h3>
                 <h3>Nos assista no <span class="blue-text">Youtube!</span></h3>
-            </div>
+            </section>
 
-            <div class="row d-flex">
+            <section class="row d-flex">
                 <div class="row align-items-start text-center mt-5 mb-5">
                     <iframe class="video-pitch col-md-6 mx-auto" src="https://www.youtube.com/embed/ipnBPEQviUM"
                         title="Pitch Softtek - Grupo xFive" frameborder="0"
                         allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
                         referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
                 </div>
-            </div>
+            </section>
             <!-- VIDEO PITCH END -->
 
             <hr class="featurette-divider" />
 
             <!-- FOUNDERS SECTION START -->
-            <div class="text-center">
+            <section class="text-center">
                 <h1 class="my-5">Fundadores</h1>
                 <div class="row">
                     <div class="col-lg-2 col-md-3 col-sm-4 ms-auto">
@@ -167,9 +163,9 @@ <h1 class="my-5">Fundadores</h1>
                         </p>
                     </div>
                 </div>
-            </div>
+            </section>
             <!-- FOUNDERS SECTION END -->
-        </div>
+        </article>
     </main>
 
     <!-- FOOTER START -->
@@ -183,6 +179,8 @@ <h1 class="my-5">Fundadores</h1>
     </footer>
     <!-- FOOTER START -->
 </body>
-<script></script>
+
+<script src="./js/universal.js"></script>
+<script src="./js/index.js"></script>
 
 </html>

js/index.js

@@ -0,0 +1,13 @@
+/*-----===| VARIÁVEIS |===-----*/
+var headerHeight;
+var bannerTextContainer = document.getElementsByClassName('banner-text-container')[0];
+
+/*-----===| EVENTOS |===-----*/
+window.onload = calcBannerTextHeight;
+window.addEventListener('resize', calcBannerTextHeight);
+
+/*-----===| FUNÇÕES |===-----*/
+function calcBannerTextHeight() {
+    headerHeight = document.getElementsByTagName('header')[0].offsetHeight;
+    bannerTextContainer.style.height = "calc(100% - " + headerHeight + "px)";
+}

js/universal.js

@@ -0,0 +1,5 @@
+/*-----===| VARIÁVEIS |===-----*/
+
+/*-----===| EVENTOS |===-----*/
+
+/*-----===| FUNÇÕES |===-----*/