Jelajahi Sumber

agrego estilos para secciones inversas

tati 9 tahun lalu
induk
melakukan
051ea34fca
2 mengubah file dengan 22 tambahan dan 2 penghapusan
  1. 21 1
      client/css/styles.css
  2. 1 1
      client/index.html

+ 21 - 1
client/css/styles.css

@@ -41,11 +41,11 @@ body {
 }
 
 .section > .container {
-    margin-top: 20px;
     text-align: justify;
 }
 
 .section > .container h4 {
+    margin-top: 30px;
     text-transform: uppercase;
     font-size: 30px;
     font-family: ralewayMedium;
@@ -63,6 +63,26 @@ body {
     margin-left: 3px;
 }
 
+.section.inverted {
+    color: #FFF;
+}
+
+.section.inverted > .container h4:before {
+    content: '';
+    width: 50px;
+    border-bottom: 2px solid white;
+    position: absolute;
+    line-height: 30px;
+    height: 45px;
+    margin-left: 3px;
+}
+
+.courses {
+    background-image: url('../images/formacion-bg.jpg');
+    background-repeat: no-repeat;
+    background-size: 100%;
+    color: white;
+}
 .courses-list {
     list-style: none;
 }

+ 1 - 1
client/index.html

@@ -71,7 +71,7 @@
         </div>
     </div>
 
-    <div class="courses section">
+    <div class="courses section inverted">
         <div class="container">
             <div class="row">
                 <div class="one-half column">