Explorar el Código

made a general block

DevVad hace 3 años
padre
commit
2487fd6349

+ 39 - 35
src/assets/styles/blocks/header.styl

@@ -1,40 +1,44 @@
 .header
 .header
-    display flex
-    padding-left 135px
-    padding-right 135px
-    padding-top 16px
-    padding-bottom 64px
-    background-color #F7F2E2
+  display flex
+  padding-left 135px
+  padding-right 135px
+  padding-top 16px
+  padding-bottom 64px
+  background-color #F7F2E2
+  
+.logo-wrapper
+  &__logo
+    width 133px
+    height 48px
+    margin-left 16px
+
+    +below(mobile-breakpoint)
+      width 30
+      height 20
 
 
-    &__icon
-        margin auto
-    &__logo
-        width 133px
-        height 48px
-        margin-left 16px
-        +below(mobile-breakpoint)
-            width: 
+.menu-wrapper
+  &__button-menu
+    height 48px
+    width 48px
+    border-radius 50%
+    background-color white
+    border none
 
 
-    &__menu
-        height 48px
-        width 48px
-        border-radius 50%
-        background-color white
-        border none
+.social-icons
+  display flex
+  margin auto
+  margin-right 0
 
 
-    &__social-icon
-        display flex
-        height 48px
-        width 48px
-        border-radius 50%
-        background-color white
-        border none
-        margin-right 8px
-        &:last-child
-            margin-right 0
+  &__social-icon
+    display flex
+    height 48px
+    width 48px
+    border-radius 50%
+    background-color white
+    border none
+    margin-right 8px
+    &:last-child
+      margin-right 0
 
 
-    &__social-icons
-        display flex
-        margin auto
-        margin-right 0
-        flex-direction row
+  &__icon
+    margin auto

+ 1 - 1
src/assets/styles/main.styl

@@ -3,4 +3,4 @@
 @import 'settings'
 @import 'settings'
 @import 'typography'
 @import 'typography'
 @import 'layout'
 @import 'layout'
-@import '/blocks/**/*'
+@import '/blocks/**/*'

+ 15 - 14
src/templates/blocks/general/general.pug

@@ -1,15 +1,16 @@
 mixin general()
 mixin general()
-    section.general
-        .general__column
-            h2.general__subtitle Architect for You
-            h1.general__title
-                | We Develop
-                | Great Designs
-    button.general__button(type='submit')
-      img(src='../../../assets/images/button-contacts.svg' alt='Contacts')
-    div
-        img.general__main-illustration(src='../../../assets/images/Bitmap.png' alt='Chandelier')
-        img.general__button-play(src='../../../assets/images/button-play.svg' alt='Button Play')
-        button.general__button(type='submit')
-            img.general__button-triangle(src='../../../assets/images/button-play-triangle.svg' alt='Button Play')
-        img.general__shape(src='../../../assets/images/general-shape.svg' alt='shape')
+  +b.SECTION.general
+    +e.column
+      +e.H3.subtitle Architect for You
+      +e.H2.title
+        | We Develop
+        br
+        | Great Designs
+      +e.BUTTON.button(type='submit')
+        IMG(src='../../../assets/images/button-contacts.svg' alt='Contacts')
+    div 
+      +e.IMG.main-illustration(src='../../../assets/images/Bitmap.png' alt='Chandelier')
+      +e.IMG.button-play(src='../../../assets/images/button-play.svg' alt='Button Play')
+      +e.button.button(type='submit')
+        +e.IMG.button-triangle(src='../../../assets/images/button-play-triangle.svg' alt='Button Play')
+      +e.IMG.shape(src='../../../assets/images/general-shape.svg' alt='shape')

+ 5 - 4
src/templates/blocks/header/header.pug

@@ -1,10 +1,11 @@
 mixin header()
 mixin header()
   +b.HEADER.header
   +b.HEADER.header
-    +b.nav
-      +e.BUTTON.menu(type='submit')
+    +b.menu-wrapper
+      +e.BUTTON.button-menu(type='submit')
         +e.IMG(src='../../../assets/images/header/menu.svg')
         +e.IMG(src='../../../assets/images/header/menu.svg')
-    +e.IMG.logo(src='/assets/images/header/logo.svg' alt='Logo ARCH')
-    +b.nav.social-icons
+    +b.logo-wrapper
+      +e.IMG.logo(src='/assets/images/header/logo.svg' alt='Logo ARCH')
+    +b.NAV.social-icons
       +e.social-icon
       +e.social-icon
         +e.A.icon(target='_blank' href='#')
         +e.A.icon(target='_blank' href='#')
           +e.IMG(src='../../../assets/images/header/facebook.svg' alt='Facebook')
           +e.IMG(src='../../../assets/images/header/facebook.svg' alt='Facebook')

+ 4 - 3
src/templates/pages/index.pug

@@ -6,9 +6,10 @@ include ../blocks/experts/experts
 include ../blocks/general/general
 include ../blocks/general/general
 
 
 block content
 block content
-  +b.page--main 
+  .page--main 
+    +general()
+    
     +achievements()
     +achievements()
     +architect()
     +architect()
     +blog()
     +blog()
-    +experts()
-    +general()
+    +experts()