Pagina Galeria

alterações feitas na pagina galeria

Author: NandoDev-lab

css/styles.css

@@ -119,4 +119,32 @@ svg text {
 		fill: rgba(179,174,23,1); stroke: rgba(179,174,23,0);
 		stroke-dashoffset: -25%; stroke-dasharray: 50% 0; stroke-width: 0;
 	}
+}
+
+
+/*pagina de Galeria*/
+.container{
+    width: 100%;
+    height: 82vh;   
+    display: flex;
+    flex-direction: column;
+    color: azure;
+    
+
+}
+.galeria{
+    display: inline-flex;   
+    gap: 15px;
+    margin: 10px 20px 10px 20px;
+
+}
+
+.video_wrapper{
+    width: 250px;
+    height: 300px;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    border: 2px solid blue;
 }

frontend/css/style.css

@@ -103,7 +103,6 @@ body{
     width: 80%;
     height: 40px;
 }
-
 .chat-button{
     width: 40px;
     height: 40px;
@@ -128,7 +127,6 @@ body{
     border-radius: 10px 10px 0px 10px;
     align-self: flex-end;
 }
-
 .message-other{
     display: flex;
     flex-direction: column;
@@ -144,4 +142,6 @@ body{
     text-shadow:1px 1px #fcec17;
     font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
 
-}
+}
+
+/*fim mensagem do chat*/

galeria.html

@@ -40,12 +40,19 @@
           <li><a href="/contato.html">Fale Conosco</a></li>
         </ul>
         <ul class="nav navbar-nav navbar-right">
-          <li><a href="#"><span class="glyphicon glyphicon-log-in"></span> Login</a></li>
+          <li><a href="#"><span class="glyphicon glyphicon-log-in"></span>Login</a></li>
         </ul>
       </div>
     </div>
   </nav>
+<div class="container"> <h1>Galeria do Canal</h1>
+  <p>Aqui você consegue achar nossos videos sem distrações extras e aquele monte de anúncios da playlistdo youtube  </p>
+  <div class="galeria">  
 
+    <div class="video_wrapper" id="ultimo-video"><iframe width="240" height="280" src="https://www.youtube.com/embed/-5dHUJtY9_8?si=5aBQTPXbCuNv5Xun" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe><h3>Data Revelada</h3></div>
+    
+  </div>
+</div>
 
 
   <footer class="container-fluid text-center">