From 4ccb4daf7e2e8b457a212ef64255961e09d6eb44 Mon Sep 17 00:00:00 2001 From: rayelliott Date: Mon, 20 Apr 2020 17:19:18 +0000 Subject: [PATCH] add services section --- site/layouts/partials/services.html | 123 +++------------------------- src/css/imports/services.scss | 7 ++ src/css/main.css | 58 +------------ 3 files changed, 20 insertions(+), 168 deletions(-) create mode 100644 src/css/imports/services.scss diff --git a/site/layouts/partials/services.html b/site/layouts/partials/services.html index ce699a0..ec59066 100644 --- a/site/layouts/partials/services.html +++ b/site/layouts/partials/services.html @@ -1,114 +1,15 @@
-
-

Services

-
    -
  • -
      -
    • - SERVICE IMAGE -
    • -
    • -

      Service Heading One

      -

      Service Sub-Heading

      -
    • -
    • -

      - Dolor ad velit illum adipisicing laborum! Unde assumenda corporis dolore iure earum Sit ipsum exercitationem nisi dolore a repellendus! Nostrum accusamus laborum in sapiente velit Recusandae facere esse et natus. -

      -

      - Deleniti debitis reprehenderit est magni modi Veniam cumque officia quas ex veniam Voluptates molestias eaque dolorem ratione. -

      -
    • -
    • - -
    • -
    -
  • -
  • -
      -
    • - SERVICE IMAGE -
    • -
    • -

      Service Heading Two

      -

      Service Sub-Heading

      -
    • -
    • -

      - Dolor ad velit illum adipisicing laborum! Unde assumenda corporis dolore iure earum Sit ipsum exercitationem nisi dolore a repellendus! Nostrum accusamus laborum in sapiente velit Recusandae facere esse et natus. -

      -

      - Dolor ad velit illum adipisicing laborum! Unde assumenda corporis dolore iure earum Sit ipsum exercitationem nisi dolore a repellendus! Nostrum accusamus laborum in sapiente velit Recusandae facere esse et natus. -

      -

      - Deleniti debitis reprehenderit est magni modi Veniam cumque officia quas ex veniam Voluptates molestias eaque dolorem ratione. -

      -
    • -
    • - -
    • -
    -
  • -
  • -
      -
    • - SERVICE IMAGE -
    • -
    • -

      Service Heading Three

      -

      Service Sub-Heading

      -
    • -
    • -

      - Deleniti debitis reprehenderit est magni modi Veniam cumque officia quas ex veniam Voluptates molestias eaque dolorem ratione. -

      -
    • -
    • - -
    • -
    -
  • -
  • -
      -
    • - SERVICE IMAGE -
    • -
    • -

      Service Heading Four

      -

      Service Sub-Heading

      -
    • -
    • -

      - Dolor ad velit illum adipisicing laborum! Unde assumenda corporis dolore iure earum Sit ipsum exercitationem nisi dolore a repellendus! Nostrum accusamus laborum in sapiente velit Recusandae facere esse et natus. -

      -

      - Deleniti debitis reprehenderit est magni modi Veniam cumque officia quas ex veniam Voluptates molestias eaque dolorem ratione. -

      -
    • -
    • - -
    • -
    -
  • -
-
+ +
+ +

services

+ +
+ A Services Section. +
+ +
+ Another services Section. +
diff --git a/src/css/imports/services.scss b/src/css/imports/services.scss new file mode 100644 index 0000000..6f267b8 --- /dev/null +++ b/src/css/imports/services.scss @@ -0,0 +1,7 @@ +.services-bg { + background-color: rgba(green, 0.5); +} + +.services-section { + background-color: rgba(green, 0.5); +} diff --git a/src/css/main.css b/src/css/main.css index 02757cf..eec1b5e 100644 --- a/src/css/main.css +++ b/src/css/main.css @@ -14,6 +14,7 @@ @import "imports/header.scss"; @import "imports/hero.scss"; @import "imports/about.scss"; +@import "imports/services.scss"; @import "mapbox-gl/dist/mapbox-gl.css"; @@ -142,63 +143,6 @@ html.is-animating .transition-fade { } } -// services - -.services-bg { - color: var(--neutral-300); - background-color: var(--primary-700); -} - -.service-list { - flex-wrap: wrap; - justify-content: space-between; -} - -.service { - flex: 0 0 100%; - text-align: center; - margin-bottom: 2.5rem; - - &:last-child { - margin-bottom: 0; - } - - @media (min-width: $bp-m) { - flex: 0 0 calc(50% - 2.5rem); - } - - @media (min-width: $bp-l) { - flex: 0 0 calc(25% - 2.5rem); - } -} - -.service__header { - display: inline-block; - width: 7em; - height: 7em; - margin-bottom: 1.25rem; -} - -.service__img { - width: 100%; - height: auto; - border-radius: 50%; -} - -.service__heading { - margin-bottom: 0.125em; -} - -.service__body { - @media (min-width: $bp-s) { - font-size: 0.9em; - } -} - -.service__social-list { - font-size: 2em; -} - // contact .contact-bg {