[chore] Merge LLZBranch into main

Adicionando grafico iframe
TeamXFive · Jun 8, 2024 · 0d03949 · 0d03949
2 parents 5841dea + ceff090
commit 0d03949
Show file tree

Hide file tree

Showing 3 changed files with 55 additions and 7 deletions.
diff --git a/css/solucoes.css b/css/solucoes.css
@@ -9,16 +9,47 @@
 
 /*-----===| MAIN |===-----*/
 /*---=| DISPLAY FLEX |=---*/
-main {
+main,
+#ecoshield-charts-container,
+.charts-chart-container {
     display: flex;
     align-items: center;
     justify-content: center;
-    position: relative;
 }
 
 main {
     width: 100%;
+    position: relative;
     flex-direction: column;
     align-items: flex-start;
     z-index: 100;
+}
+
+/*---=| EcoShield Charts |=---*/
+#ecoshield-charts-container {
+    height: 60vh;
+    width: 100%;
+}
+
+.charts-chart-container {
+    height: 100%;
+    width: 100%;
+    position: relative;
+    flex-direction: column;
+}
+
+.infogram-embed {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%!important;
+    aspect-ratio: 1 / 1;
+}
+
+.infogram-embed iframe {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%!important;
+    aspect-ratio: 1 / 1;
 }
diff --git a/html/solucoes.html b/html/solucoes.html
@@ -43,6 +43,25 @@
     </header>
 
     <main>
+        <article id="ecoshield-charts-container">
+            <section class="charts-chart-container">
+
+                <div class="infogram-embed" data-id="168d3b14-bd64-4c4c-8695-c2ed68b45185" data-type="interactive" data-title="pH Médio Anual da Água do Mar de Superfície Relatado em Escala Total"></div>
+
+                <script>
+                    !function (e, n, i, s) { var d = "InfogramEmbeds"; var o = e.getElementsByTagName(n)[0]; if (window[d] && window[d].initialized) window[d].process && window[d].process(); else if (!e.getElementById(i)) { var r = e.createElement(n); r.async = 1, r.id = i, r.src = s, o.parentNode.insertBefore(r, o) } }(document, "script", "infogram-async", "https://e.infogram.com/js/dist/embed-loader-min.js");
+                </script>
+
+                <div style="padding:8px 0; font-family:Arial!important; font-size:13px!important; line-height:15px!important; text-align:center; border-top:1px solid #dadada; margin:0 30px">
+                    <a href="https://infogram.com/168d3b14-bd64-4c4c-8695-c2ed68b45185" style="color:#989898!important;text-decoration:none!important;" target="_blank">pH Médio Anual da Água do Mar de Superfície Relatado em Escala Total</a>
+
+                    <br>
+
+                    <a href="https://infogram.com/" style="color:#989898!important;text-decoration:none!important;" target="_blank" rel="nofollow">Infogram</a>
+                </div>
+
+            </section>
+        </article>
     </main>
 
     <!-- FOOTER START -->

diff --git a/index.html b/index.html
@@ -55,8 +55,6 @@
             </section>
         </article>
 
-        <article id="eco-shield-explanation"></article>
-
         <article class="container mb-5">
             <section class="row text-center">
                 <h3 class="text-uppercase mt-5">A final o que é o</h3>
@@ -81,12 +79,12 @@ <h4>
                         <img class="lg featurette-image img-fluid mx-auto" src="./assets/img/drone.jpeg" />
                     </div>
                 </div>
-            </div>
+            </section>
 
             <hr class="featurette-divider" />
+        </article>
 
-            <!-- PLACEHOLDER CHART SECTION -->
-
+        <article class="container mb-5">
             <!-- VIDEO PITCH START -->
             <section class="row text-center">
                 <h3 class="text-uppercase mt-5">