Browse Source

conjured experts

DevVad 3 years ago
parent
commit
e83cf89068

+ 99 - 0
src/assets/styles/blocks/experts.styl

@@ -0,0 +1,99 @@
+.experts
+    display flex
+    background-color #F7F2E2
+    padding 144px 135px
+    justify-content space-between
+
+    &__arrows
+        display flex
+
+    &__arrow_back
+        height 48px
+        width 48px
+        border-radius 100%
+        border none
+
+    &__arrow_forward
+        height 48px
+        width 48px
+        border-radius 100%
+        border none
+
+    &__arrow_right
+        margin-right 8px
+
+    &__cards
+        display flex
+        flex-direction row
+
+    &__card
+        width 370px
+        height 592px
+        padding-bottom -50px
+        position relative
+        z-index 1
+        object-fit cover
+        border-radius 20px
+
+        &_figcaption
+            width 370px
+            height 160px
+            background-color white
+            border-radius 20px
+            justify-content center
+            margin-top -160px
+            position relative
+            z-index 1
+
+        &_right
+            margin-right 30px
+
+        &_subtitle
+            font-size 16px
+            line-height 32px
+            font-weight 400
+            text-align left
+            margin 19px 32px 36px
+            color #333333
+
+        &_title
+            margin-top 40px
+            margin-right 167px
+            margin-left 32px
+            text-align left
+            padding-top 40px
+            font-size 24px
+            line-height 32px
+            font-weight 700
+
+    &__shape
+        z-index 1
+        position absolute
+        width 176px
+        height 176px
+        left 550px
+        top 3830px
+        object-position left top
+        object-fit cover
+        margin 0
+        padding 0
+
+    &__subtitle
+        font-size 18px
+        line-height 32px
+        font-weight 700
+        margin 0
+        text-align left
+        padding-bottom 18px
+
+    &__text
+        margin-top 106px
+
+    &__title
+        font-size 56px
+        line-height 64px
+        font-weight 800
+        margin 0
+        padding 0
+        padding-bottom 36px
+        text-align left

+ 27 - 0
src/templates/blocks/experts/experts.pug

@@ -0,0 +1,27 @@
+mixin experts()
+    section.experts
+        .experts__text
+            h3.experts__subtitle Our Experts
+            h2.experts__title
+            | Meet our
+            | passionate
+            | crew
+            nav.experts__arrows
+            button.experts__arrow_back.experts__arrow_right(type='submit')
+                img(src='./images/service/back.svg' alt='back')
+            button.experts__arrow_forward(type='submit')
+                img(src='./images/service/forward.svg' alt='forward')
+        .experts__cards
+            div
+            img.experts__card.experts__card_right(src='./images/experts/Tamas.png' alt='Tamas Bunce')
+            img.experts__shape(src='./images/experts/shape.svg' alt='shape')
+            div
+                .experts__card_figcaption
+                h2.experts__card_title Tamas Bunce
+                h3.experts__card_subtitle Architect Designer
+            div
+            img.experts__card(src='./images/experts/Jafaris.png' alt='Jafaris Long')
+            div
+                .experts__card_figcaption
+                h2.experts__card_title Jafaris Long
+                h3.experts__card_subtitle Architect Designer

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

@@ -2,9 +2,12 @@ extends ../layouts/main
 include ../blocks/achievements/achievements
 include ../blocks/architect/architect
 include ../blocks/blog/blog
+include ../blocks/experts/experts
+
 
 block content
   +b.page--main 
     +achievements()
     +architect()
-    +blog()
+    +blog()
+    +experts()