Initial commit 🚀

4-natours/after-section-14/views/overview.pug

@@ -0,0 +1,45 @@
+extends base
+
+block content
+  main.main
+    .card-container
+    
+      each tour in tours
+        .card
+          .card__header
+            .card__picture
+              .card__picture-overlay  
+              img.card__picture-img(src=`/img/tours/${tour.imageCover}`, alt=`${tour.name}`)
+            h3.heading-tertirary
+              span= tour.name
+
+          .card__details
+            h4.card__sub-heading= `${tour.difficulty} ${tour.duration}-day tour`
+            p.card__text= tour.summary
+            .card__data
+              svg.card__icon
+                use(xlink:href='/img/icons.svg#icon-map-pin')
+              span= tour.startLocation.description
+            .card__data
+              svg.card__icon
+                use(xlink:href='/img/icons.svg#icon-calendar')
+              span= tour.startDates[0].toLocaleString('en-us', {month: 'long', year: 'numeric'})
+            .card__data
+              svg.card__icon
+                use(xlink:href='/img/icons.svg#icon-flag')
+              span= `${tour.locations.length} stops`
+            .card__data
+              svg.card__icon
+                use(xlink:href='/img/icons.svg#icon-user')
+              span= `${tour.maxGroupSize} people`
+
+          .card__footer
+            p
+              span.card__footer-value= `$${tour.price}`
+              | 
+              span.card__footer-text per person
+            p.card__ratings
+              span.card__footer-value= tour.ratingsAverage
+              | 
+              span.card__footer-text= `rating (${tour.ratingsQuantity})`
+            a.btn.btn--green.btn--small(href=`/tour/${tour.slug}`) Details