Add nodejs and yarn

...Terraform

.envrc

@@ -0,0 +1 @@
+use flake

.gitignore

@@ -11,11 +11,10 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-# Editor directories and files
-.idea
-.vscode
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw*
+/.terraform.lock.hcl
+/.terraform/
+/terraform.tfstate
+/terraform.tfstate.*
+
+# Nix
+/.direnv/

flake.lock

@@ -0,0 +1,27 @@
+{
+  "nodes": {
+    "nixpkgs": {
+      "locked": {
+        "lastModified": 1659446231,
+        "narHash": "sha256-hekabNdTdgR/iLsgce5TGWmfIDZ86qjPhxDg/8TlzhE=",
+        "owner": "NixOS",
+        "repo": "nixpkgs",
+        "rev": "eabc38219184cc3e04a974fe31857d8e0eac098d",
+        "type": "github"
+      },
+      "original": {
+        "owner": "NixOS",
+        "ref": "nixos-21.11",
+        "repo": "nixpkgs",
+        "type": "github"
+      }
+    },
+    "root": {
+      "inputs": {
+        "nixpkgs": "nixpkgs"
+      }
+    }
+  },
+  "root": "root",
+  "version": 7
+}

flake.nix

@@ -0,0 +1,23 @@
+{
+  inputs.nixpkgs.url = "github:NixOS/nixpkgs/nixos-21.11";
+
+  outputs =
+    { nixpkgs, ... }:
+    let
+      system = "x86_64-linux";
+      pkgs = nixpkgs.legacyPackages.${system};
+
+      inherit (pkgs) mkShell nodejs;
+      inherit (pkgs.nodePackages) yarn;
+    in
+    {
+      devShells.${system}.default = mkShell {
+        buildInputs = [
+          nodejs
+          yarn
+        ];
+      };
+
+      formatter.${system} = pkgs.nixfmt-rfc-style;
+    };
+}

main.tf

@@ -0,0 +1,111 @@
+terraform {
+  required_providers {
+    aws = {
+      source  = "hashicorp/aws"
+      version = "~> 4.0"
+    }
+
+    cloudflare = {
+      source  = "cloudflare/cloudflare"
+      version = "~> 3.0"
+    }
+  }
+}
+
+provider "aws" {
+  region = "eu-west-2"
+}
+
+provider "aws" {
+  alias  = "us-east-1"
+  region = "us-east-1"
+}
+
+resource "aws_s3_bucket" "rebuilding-acquia" {
+  bucket = "rebuilding-acquia"
+}
+
+resource "aws_s3_bucket_acl" "rebuilding-acquia" {
+  acl    = "private"
+  bucket = aws_s3_bucket.rebuilding-acquia.id
+}
+
+locals {
+  s3_origin_id = "rebuilding-acquia"
+  zone_name    = "oliverdavies.uk"
+}
+
+resource "aws_cloudfront_origin_access_control" "rebuilding-acquia" {
+  name                              = "rebuilding-acquia"
+  description                       = "rebuilding-acquia"
+  origin_access_control_origin_type = "s3"
+  signing_behavior                  = "always"
+  signing_protocol                  = "sigv4"
+}
+
+data "cloudflare_zone" "rebuilding-acquia" {
+  name = local.zone_name
+}
+
+data "aws_acm_certificate" "rebuilding-acquia" {
+  domain   = local.zone_name
+  provider = aws.us-east-1
+  statuses = ["ISSUED"]
+}
+
+resource "aws_cloudfront_distribution" "s3_distribution" {
+  origin {
+    domain_name              = aws_s3_bucket.rebuilding-acquia.bucket_regional_domain_name
+    origin_access_control_id = aws_cloudfront_origin_access_control.rebuilding-acquia.id
+    origin_id                = local.s3_origin_id
+  }
+
+  comment             = "Rebuilding Acquia - Tailwind CSS example"
+  default_root_object = "index.html"
+  enabled             = true
+  is_ipv6_enabled     = true
+
+  aliases = ["rebuilding-acquia.${local.zone_name}"]
+
+  default_cache_behavior {
+    allowed_methods  = ["GET", "HEAD"]
+    cached_methods   = ["GET", "HEAD"]
+    target_origin_id = local.s3_origin_id
+
+    forwarded_values {
+      query_string = false
+
+      cookies {
+        forward = "none"
+      }
+    }
+
+    default_ttl            = 3600
+    max_ttl                = 86400
+    min_ttl                = 0
+    viewer_protocol_policy = "allow-all"
+  }
+
+  price_class = "PriceClass_100"
+
+  restrictions {
+    geo_restriction {
+      locations        = []
+      restriction_type = "none"
+    }
+  }
+
+  viewer_certificate {
+    acm_certificate_arn = data.aws_acm_certificate.rebuilding-acquia.arn
+    ssl_support_method  = "sni-only"
+  }
+}
+
+resource "cloudflare_record" "rebuilding-acquia" {
+  name    = "rebuilding-acquia"
+  proxied = false
+  ttl     = 0
+  type    = "CNAME"
+  value   = aws_cloudfront_distribution.s3_distribution.domain_name
+  zone_id = data.cloudflare_zone.rebuilding-acquia.id
+}

netlify.toml

@@ -5,4 +5,4 @@ yarn test:unit
 yarn build
 """
 publish = "dist"
-environment = { YARN_VERSION = "1.13.0" }
+environment = { NODE_VERSION = "v12.6.0", YARN_VERSION = "1.13.0" }

src/components/Environment/EnvironmentCards.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="-mx-4 flex flex-wrap">
-    <div v-for="(environment, key) in application.environments" class="w-full md:w-1/2 xl:w-1/3 px-4" :key="key">
+  <div class="grid gap-6 grid-cols-1 md:grid-cols-2 xl:grid-cols-3">
+    <div v-for="(environment, key) in application.environments" :key="key">
       <div class="border border-gray-400 rounded overflow-hidden shadow">
          <div class="bg-white">
           <div class="border-t-4 border-teal p-3">