updating theme

.gitignore

@@ -24,3 +24,8 @@ pnpm-debug.log*
 
 # Custom
 src/assets/deck_of_cards
+src/assets/avatars
+src/assets/navbar
+
+# terraform
+*.terraform

.infrastructure/Makefile

@@ -0,0 +1,215 @@
+# Copyright 2016 Philip G. Porada
+#
+# Licensed under the Apache License, Version 2.0 (the "License");
+# you may not use this file except in compliance with the License.
+# You may obtain a copy of the License at
+#
+#  http://www.apache.org/licenses/LICENSE-2.0
+#
+# Unless required by applicable law or agreed to in writing, software
+# distributed under the License is distributed on an "AS IS" BASIS,
+# WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+# See the License for the specific language governing permissions and
+# limitations under the License.
+
+.ONESHELL:
+.SHELL := /usr/bin/bash
+.PHONY: apply destroy-backend destroy destroy-target plan-destroy plan plan-target prep
+
+-include Makefile.env
+# VARS="variables/$(ENV)-$(REGION).tfvars"
+VARS="$(ENV)-$(REGION).tfvars"
+CURRENT_FOLDER=$(shell basename "$$(pwd)")
+S3_BUCKET="$(ENV)-$(REGION)-$(PROJECT)-terraform"
+DYNAMODB_TABLE="$(ENV)-$(REGION)-$(PROJECT)-terraform"
+WORKSPACE="$(ENV)-$(REGION)"
+BOLD=$(shell tput bold)
+RED=$(shell tput setaf 1)
+GREEN=$(shell tput setaf 2)
+YELLOW=$(shell tput setaf 3)
+RESET=$(shell tput sgr0)
+
+help:
+	@grep -E '^[a-zA-Z_-]+:.*?## .*$$' $(MAKEFILE_LIST) | sort | awk 'BEGIN {FS = ":.*?## "}; {printf "\033[36m%-30s\033[0m %s\n", $$1, $$2}'
+
+set-env:
+	@if [ -z $(ENV) ]; then \
+		echo "$(BOLD)$(RED)ENV was not set$(RESET)"; \
+		ERROR=1; \
+	 fi
+	@if [ -z $(REGION) ]; then \
+		echo "$(BOLD)$(RED)REGION was not set$(RESET)"; \
+		ERROR=1; \
+	 fi
+	@if [ -z $(AWS_PROFILE) ]; then \
+		echo "$(BOLD)$(RED)AWS_PROFILE was not set.$(RESET)"; \
+		ERROR=1; \
+	 fi
+	@if [ ! -z $${ERROR} ] && [ $${ERROR} -eq 1 ]; then \
+		echo "$(BOLD)Example usage: \`AWS_PROFILE=whatever ENV=demo REGION=us-east-2 make plan\`$(RESET)"; \
+		exit 1; \
+	 fi
+	@if [ ! -f "$(VARS)" ]; then \
+		echo "$(BOLD)$(RED)Could not find variables file: $(VARS)$(RESET)"; \
+		exit 1; \
+	 fi
+
+prep: set-env ## Prepare a new workspace (environment) if needed, configure the tfstate backend, update any modules, and switch to the workspace
+	@echo "$(BOLD)Verifying that the S3 bucket $(S3_BUCKET) for remote state exists$(RESET)"
+	@if ! aws --profile $(AWS_PROFILE) s3api head-bucket --region $(REGION) --bucket $(S3_BUCKET) > /dev/null 2>&1 ; then \
+		echo "$(BOLD)S3 bucket $(S3_BUCKET) was not found, creating new bucket with versioning enabled to store tfstate$(RESET)"; \
+		aws --profile $(AWS_PROFILE) s3api create-bucket \
+			--bucket $(S3_BUCKET) \
+			--acl private \
+			--region $(REGION) \
+			--create-bucket-configuration LocationConstraint=$(REGION) > /dev/null 2>&1 ; \
+		aws --profile $(AWS_PROFILE) s3api put-bucket-versioning \
+			--bucket $(S3_BUCKET) \
+			--versioning-configuration Status=Enabled > /dev/null 2>&1 ; \
+		echo "$(BOLD)$(GREEN)S3 bucket $(S3_BUCKET) created$(RESET)"; \
+	 else
+		echo "$(BOLD)$(GREEN)S3 bucket $(S3_BUCKET) exists$(RESET)"; \
+	 fi
+	@echo "$(BOLD)Verifying that the DynamoDB table exists for remote state locking$(RESET)"
+	@if ! aws --profile $(AWS_PROFILE) --region $(REGION) dynamodb describe-table --table-name $(DYNAMODB_TABLE) > /dev/null 2>&1 ; then \
+		echo "$(BOLD)DynamoDB table $(DYNAMODB_TABLE) was not found, creating new DynamoDB table to maintain locks$(RESET)"; \
+		aws --profile $(AWS_PROFILE) dynamodb create-table \
+        	--region $(REGION) \
+        	--table-name $(DYNAMODB_TABLE) \
+        	--attribute-definitions AttributeName=LockID,AttributeType=S \
+        	--key-schema AttributeName=LockID,KeyType=HASH \
+        	--provisioned-throughput ReadCapacityUnits=5,WriteCapacityUnits=5 > /dev/null 2>&1 ; \
+		echo "$(BOLD)$(GREEN)DynamoDB table $(DYNAMODB_TABLE) created$(RESET)"; \
+		echo "Sleeping for 10 seconds to allow DynamoDB state to propagate through AWS"; \
+		sleep 10; \
+	 else
+		echo "$(BOLD)$(GREEN)DynamoDB Table $(DYNAMODB_TABLE) exists$(RESET)"; \
+	 fi
+	@aws ec2 --profile=$(AWS_PROFILE) describe-key-pairs | jq -r '.KeyPairs[].KeyName' | grep "$(ENV)_infra_key" > /dev/null 2>&1; \
+	if [ $$? -ne 0 ]; then \
+	    echo "$(BOLD)$(RED)EC2 Key Pair $(INFRA_KEY)_infra_key was not found$(RESET)"; \
+	    read -p '$(BOLD)Do you want to generate a new keypair? [y/Y]: $(RESET)' ANSWER && \
+    	if [ "$${ANSWER}" == "y" ] || [ "$${ANSWER}" == "Y" ]; then \
+	        mkdir -p ~/.ssh; \
+	        ssh-keygen -t rsa -b 4096 -N '' -f ~/.ssh/$(ENV)_infra_key; \
+        	aws ec2 --profile=$(AWS_PROFILE) import-key-pair --key-name "$(ENV)_infra_key" --public-key-material "file://~/.ssh/$(ENV)_infra_key.pub"; \
+    	fi; \
+	  else \
+	      echo "$(BOLD)$(GREEN)EC2 Key Pair $(ENV)_infra_key exists$(RESET)";\
+	  fi
+	@echo "$(BOLD)Configuring the terraform backend$(RESET)"
+	@terraform init \
+		-input=false \
+		-force-copy \
+		-lock=true \
+		-upgrade \
+		-verify-plugins=true \
+		-backend=true \
+		-backend-config="profile=$(AWS_PROFILE)" \
+		-backend-config="region=$(REGION)" \
+		-backend-config="bucket=$(S3_BUCKET)" \
+		-backend-config="key=$(ENV)/$(CURRENT_FOLDER)/terraform.tfstate" \
+		-backend-config="dynamodb_table=$(DYNAMODB_TABLE)"\
+	    -backend-config="acl=private"
+	@echo "$(BOLD)Switching to workspace $(WORKSPACE)$(RESET)"
+	@terraform workspace select $(WORKSPACE) || terraform workspace new $(WORKSPACE)
+
+plan: prep ## Show what terraform thinks it will do
+	@terraform plan \
+		-lock=true \
+		-input=false \
+		-refresh=true \
+		-var-file="$(VARS)"
+
+format: prep ## Rewrites all Terraform configuration files to a canonical format.
+	@terraform fmt \
+		-write=true \
+    -recursive
+
+# https://github.com/terraform-linters/tflint
+lint: prep ## Check for possible errors, best practices, etc in current directory!
+	@tflint
+
+# https://github.com/liamg/tfsec
+check-security: prep ## Static analysis of your terraform templates to spot potential security issues.
+	@tfsec .
+
+documentation: prep ## Generate README.md for a module
+	@terraform-docs \
+		markdown table \
+		--sort-by-required  . > README.md
+
+plan-target: prep ## Shows what a plan looks like for applying a specific resource
+	@echo "$(YELLOW)$(BOLD)[INFO]   $(RESET)"; echo "Example to type for the following question: module.rds.aws_route53_record.rds-master"
+	@read -p "PLAN target: " DATA && \
+		terraform plan \
+			-lock=true \
+			-input=true \
+			-refresh=true \
+			-var-file="$(VARS)" \
+			-target=$$DATA
+
+plan-destroy: prep ## Creates a destruction plan.
+	@terraform plan \
+		-input=false \
+		-refresh=true \
+		-destroy \
+		-var-file="$(VARS)"
+
+apply: prep ## Have terraform do the things. This will cost money.
+	@terraform apply \
+		-lock=true \
+		-input=false \
+		-refresh=true \
+		-var-file="$(VARS)"
+
+destroy: prep ## Destroy the things
+	@terraform destroy \
+		-lock=true \
+		-input=false \
+		-refresh=true \
+		-var-file="$(VARS)"
+
+destroy-target: prep ## Destroy a specific resource. Caution though, this destroys chained resources.
+	@echo "$(YELLOW)$(BOLD)[INFO] Specifically destroy a piece of Terraform data.$(RESET)"; echo "Example to type for the following question: module.rds.aws_route53_record.rds-master"
+	@read -p "Destroy target: " DATA && \
+		terraform destroy \
+		-lock=true \
+		-input=false \
+		-refresh=true \
+		-var-file=$(VARS) \
+		-target=$$DATA
+
+destroy-backend: ## Destroy S3 bucket and DynamoDB table
+	@if ! aws --profile $(AWS_PROFILE) dynamodb delete-table \
+		--region $(REGION) \
+		--table-name $(DYNAMODB_TABLE) > /dev/null 2>&1 ; then \
+			echo "$(BOLD)$(RED)Unable to delete DynamoDB table $(DYNAMODB_TABLE)$(RESET)"; \
+	 else
+		echo "$(BOLD)$(RED)DynamoDB table $(DYNAMODB_TABLE) does not exist.$(RESET)"; \
+	 fi
+	@if ! aws --profile $(AWS_PROFILE) s3api delete-objects \
+		--region $(REGION) \
+		--bucket $(S3_BUCKET) \
+		--delete "$$(aws --profile $(AWS_PROFILE) s3api list-object-versions \
+						--region $(REGION) \
+						--bucket $(S3_BUCKET) \
+						--output=json \
+						--query='{Objects: Versions[].{Key:Key,VersionId:VersionId}}')" > /dev/null 2>&1 ; then \
+			echo "$(BOLD)$(RED)Unable to delete objects in S3 bucket $(S3_BUCKET)$(RESET)"; \
+	 fi
+	@if ! aws --profile $(AWS_PROFILE) s3api delete-objects \
+		--region $(REGION) \
+		--bucket $(S3_BUCKET) \
+		--delete "$$(aws --profile $(AWS_PROFILE) s3api list-object-versions \
+						--region $(REGION) \
+						--bucket $(S3_BUCKET) \
+						--output=json \
+						--query='{Objects: DeleteMarkers[].{Key:Key,VersionId:VersionId}}')" > /dev/null 2>&1 ; then \
+			echo "$(BOLD)$(RED)Unable to delete markers in S3 bucket $(S3_BUCKET)$(RESET)"; \
+	 fi
+	@if ! aws --profile $(AWS_PROFILE) s3api delete-bucket \
+		--region $(REGION) \
+		--bucket $(S3_BUCKET) > /dev/null 2>&1 ; then \
+			echo "$(BOLD)$(RED)Unable to delete S3 bucket $(S3_BUCKET) itself$(RESET)"; \
+	 fi

.infrastructure/Makefile.env

@@ -0,0 +1,4 @@
+ENV="prod"
+REGION="eu-west-1"
+PROJECT="onmyojideckbuilder"
+AWS_PROFILE="admin"

.infrastructure/lambda/main.js

@@ -0,0 +1,29 @@
+"use strict";
+
+exports.handler = (event, context, callback) => {
+  // Extract the request from the Cloudfront event that is sent to Lambda@Edge
+  var request = event.Records[0].cf.request;
+
+  // Extract the URI from the request
+  var oldURI = request.uri;
+
+  // Match any '/' that occurs at the end of a URI. Replace it with a default index
+  function replace_uri(uri) {
+    uri = uri.replace(/\/$/, "/index.html");
+    // uri = uri.replace(/\.io\/search\?q\=(.*)/, ".io/search/index.html?q=$1");
+    // console.log(uri)
+    return uri;
+  }
+  // var newURI = oldURI.replace(/\/$/, "/index.html");
+  var newURI = replace_uri(oldURI);
+
+  // Log the URI as received by Cloudfront and the new URI to be used to fetch from the origin
+  console.log(`Old URI: ${oldURI}`);
+  console.log(`New URI: ${newURI}`);
+
+  // Replace the received URI with the URI that includes the index page
+  request.uri = newURI;
+
+  // Return to Cloudfront
+  return callback(null, request);
+};

.infrastructure/main.tf

@@ -0,0 +1,134 @@
+# aws config
+provider "aws" {
+  region  = var.region
+  profile = var.profile
+  version = "~> 2.66"
+}
+
+provider "aws" {
+  alias   = "us_east_1"
+  profile = var.profile
+  region  = "us-east-1"
+}
+
+# tags
+locals {
+  tags = {
+    "Project"     = "onmyoji-deck-builder"
+    "Description" = "website to build and share onmyoji decks"
+  }
+}
+
+# cloudfront
+module "cloudfront_s3_cdn" {
+  source                   = "git::https://github.com/cloudposse/terraform-aws-cloudfront-s3-cdn.git?ref=tags/0.52.0"
+  stage                    = var.stage
+  name                     = var.name
+  parent_zone_id           = var.parent_zone_id
+  dns_alias_enabled        = true
+  acm_certificate_arn      = var.acm_certificate_arn
+  use_regional_s3_endpoint = true
+  origin_force_destroy     = true
+  compress                 = true
+  cors_allowed_headers     = ["*"]
+  cors_allowed_methods     = ["GET", "HEAD", "PUT", "POST"]
+  cors_allowed_origins     = var.allowed_origins
+  tags                     = local.tags
+  aliases                  = var.aliases
+  index_document           = "index.html"
+  lambda_function_association = [
+    {
+      event_type : "origin-request",
+      lambda_arn : aws_lambda_function.directory_indexes.qualified_arn,
+      include_body : false
+    }
+  ]
+
+  # this policy sets the bucket to be public for all newly created files
+  additional_bucket_policy = <<-EOT
+  {
+    "Version": "2012-10-17",
+    "Statement": [
+      {
+        "Sid":"PublicRead",
+        "Effect":"Allow",
+        "Principal":"*",
+        "Action":["s3:GetObject"],
+        "Resource":"arn:aws:s3:::${module.cloudfront_s3_cdn.s3_bucket}/*"
+      }
+    ]
+  }
+  EOT
+}
+
+data "archive_file" "lambda_main" {
+  type        = "zip"
+  source_file = var.source_file
+  output_path = "${var.source_file}.zip"
+}
+
+resource "aws_lambda_function" "directory_indexes" {
+  provider         = aws.us_east_1
+  function_name    = "${var.stage}-${var.name}-directory_indexes"
+  filename         = "${var.source_file}.zip"
+  source_code_hash = data.archive_file.lambda_main.output_base64sha256
+  # s3_bucket     = aws_s3_bucket.lambda_s3.id
+  # s3_key        = var.lambda_key
+  handler = var.handler
+  runtime = var.runtime
+  role    = aws_iam_role.lambda_role.arn
+  publish = true
+  tags    = local.tags
+
+  depends_on = [aws_iam_role_policy_attachment.lambda_logging]
+}
+
+## Lambda iam role & policies
+
+resource "aws_iam_role" "lambda_role" {
+  name = "${var.stage}-${var.name}-lambda"
+  tags = local.tags
+
+  assume_role_policy = <<-EOT
+  {
+    "Version": "2012-10-17",
+    "Statement": [
+        {
+          "Effect": "Allow",
+          "Principal": {
+              "Service": [
+                "lambda.amazonaws.com",
+                "edgelambda.amazonaws.com"
+              ]
+          },
+          "Action": "sts:AssumeRole"
+        }
+    ]
+  }
+  EOT
+}
+
+resource "aws_iam_policy" "lambda_logging" {
+  name   = "${var.stage}-${var.name}-lambda_logging"
+  policy = <<-EOT
+  {
+    "Version": "2012-10-17",
+    "Statement": [
+      {
+        "Action": [
+          "logs:CreateLogGroup",
+          "logs:CreateLogStream",
+          "logs:PutLogEvents"
+        ],
+        "Resource": "arn:aws:logs:*:*:*",
+        "Effect": "Allow"
+      }
+    ]
+  }
+  EOT
+}
+
+resource "aws_iam_role_policy_attachment" "lambda_logging" {
+  role       = aws_iam_role.lambda_role.name
+  policy_arn = aws_iam_policy.lambda_logging.arn
+}

.infrastructure/outputs.tf

@@ -0,0 +1,39 @@
+output "cf_id" {
+  value       = module.cloudfront_s3_cdn.cf_id
+  description = "ID of AWS CloudFront distribution"
+}
+
+output "cf_arn" {
+  value       = module.cloudfront_s3_cdn.cf_arn
+  description = "ARN of AWS CloudFront distribution"
+}
+
+output "cf_status" {
+  value       = module.cloudfront_s3_cdn.cf_status
+  description = "Current status of the distribution"
+}
+
+output "cf_domain_name" {
+  value       = module.cloudfront_s3_cdn.cf_domain_name
+  description = "Domain name corresponding to the distribution"
+}
+
+output "cf_etag" {
+  value       = module.cloudfront_s3_cdn.cf_etag
+  description = "Current version of the distribution's information"
+}
+
+output "cf_hosted_zone_id" {
+  value       = module.cloudfront_s3_cdn.cf_hosted_zone_id
+  description = "CloudFront Route 53 zone ID"
+}
+
+output "s3_bucket" {
+  value       = module.cloudfront_s3_cdn.s3_bucket
+  description = "Name of S3 bucket"
+}
+
+output "s3_bucket_domain_name" {
+  value       = module.cloudfront_s3_cdn.s3_bucket_domain_name
+  description = "Domain of S3 bucket"
+}

.infrastructure/prod-eu-west-1.tfvars

@@ -0,0 +1,19 @@
+# module
+name    = "onmyojideckbuilder"
+region  = "eu-west-1"
+stage   = "prod"
+profile = "admin"
+
+# cloudfront
+acm_certificate_arn = "arn:aws:acm:us-east-1:745437999005:certificate/11502ff4-7851-426f-92ac-27db7c44825f"
+parent_zone_id      = "Z0511918V1SF3MCG22JU"
+aliases             = ["onmyojideckbuilder.com"]
+allowed_origins     = ["*.onmyojideckbuilder.com"]
+
+# s3 & lambda
+acl         = "private"
+lambda_key  = "main.zip"
+source_file = "./lambda/main.js"
+handler     = "main.handler"
+runtime     = "nodejs12.x"
+s3_region   = "us-east-1"

.infrastructure/terraform.tfstate.d/prod-eu-west-1/terraform.tfstate

@@ -0,0 +1,904 @@
+{
+  "version": 4,
+  "terraform_version": "0.13.5",
+  "serial": 41,
+  "lineage": "baf13f49-a91e-4ef3-40f8-b010f53cf030",
+  "outputs": {
+    "cf_arn": {
+      "value": "arn:aws:cloudfront::745437999005:distribution/E8811LTEVQX71",
+      "type": "string"
+    },
+    "cf_domain_name": {
+      "value": "duzt5fbttumv4.cloudfront.net",
+      "type": "string"
+    },
+    "cf_etag": {
+      "value": "EWX7K6JLLQ02T",
+      "type": "string"
+    },
+    "cf_hosted_zone_id": {
+      "value": "Z2FDTNDATAQYW2",
+      "type": "string"
+    },
+    "cf_id": {
+      "value": "E8811LTEVQX71",
+      "type": "string"
+    },
+    "cf_status": {
+      "value": "Deployed",
+      "type": "string"
+    },
+    "s3_bucket": {
+      "value": "prod-onmyojideckbuilder-origin",
+      "type": "string"
+    },
+    "s3_bucket_domain_name": {
+      "value": "prod-onmyojideckbuilder-origin.s3.eu-west-1.amazonaws.com",
+      "type": "string"
+    }
+  },
+  "resources": [
+    {
+      "mode": "data",
+      "type": "archive_file",
+      "name": "lambda_main",
+      "provider": "provider[\"registry.terraform.io/hashicorp/archive\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "excludes": null,
+            "id": "320d4868dd37d1674e98bd790b8a54b006838d04",
+            "output_base64sha256": "5EVmwQDkgGfYMpMXNaWHUz3cmb/dSssoWl8mM8o3aMs=",
+            "output_md5": "611fc9e8b494e4b399217f632b8e35ed",
+            "output_path": "./lambda/main.js.zip",
+            "output_sha": "320d4868dd37d1674e98bd790b8a54b006838d04",
+            "output_size": 601,
+            "source": [],
+            "source_content": null,
+            "source_content_filename": null,
+            "source_dir": null,
+            "source_file": "./lambda/main.js",
+            "type": "zip"
+          }
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_policy",
+      "name": "lambda_logging",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "description": "",
+            "id": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "name": "prod-onmyojideckbuilder-lambda_logging",
+            "name_prefix": null,
+            "path": "/",
+            "policy": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Action\": [\n        \"logs:CreateLogGroup\",\n        \"logs:CreateLogStream\",\n        \"logs:PutLogEvents\"\n      ],\n      \"Resource\": \"arn:aws:logs:*:*:*\",\n      \"Effect\": \"Allow\"\n    }\n  ]\n}\n"
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_role",
+      "name": "lambda_role",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:iam::745437999005:role/prod-onmyojideckbuilder-lambda",
+            "assume_role_policy": "{\"Version\":\"2012-10-17\",\"Statement\":[{\"Effect\":\"Allow\",\"Principal\":{\"Service\":[\"edgelambda.amazonaws.com\",\"lambda.amazonaws.com\"]},\"Action\":\"sts:AssumeRole\"}]}",
+            "create_date": "2021-03-18T00:54:31Z",
+            "description": "",
+            "force_detach_policies": false,
+            "id": "prod-onmyojideckbuilder-lambda",
+            "max_session_duration": 3600,
+            "name": "prod-onmyojideckbuilder-lambda",
+            "name_prefix": null,
+            "path": "/",
+            "permissions_boundary": null,
+            "tags": {
+              "Description": "website to build and share onmyoji decks",
+              "Project": "onmyoji-deck-builder"
+            },
+            "unique_id": "AROA23D4RF6OTBMEPSDVE"
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_role_policy_attachment",
+      "name": "lambda_logging",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "id": "prod-onmyojideckbuilder-lambda-20210318005433729100000002",
+            "policy_arn": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "role": "prod-onmyojideckbuilder-lambda"
+          },
+          "private": "bnVsbA==",
+          "dependencies": [
+            "aws_iam_policy.lambda_logging",
+            "aws_iam_role.lambda_role"
+          ]
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_lambda_function",
+      "name": "directory_indexes",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"].us_east_1",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes",
+            "dead_letter_config": [],
+            "description": "",
+            "environment": [],
+            "file_system_config": [],
+            "filename": "./lambda/main.js.zip",
+            "function_name": "prod-onmyojideckbuilder-directory_indexes",
+            "handler": "main.handler",
+            "id": "prod-onmyojideckbuilder-directory_indexes",
+            "invoke_arn": "arn:aws:apigateway:us-east-1:lambda:path/2015-03-31/functions/arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes/invocations",
+            "kms_key_arn": "",
+            "last_modified": "2021-03-18T00:54:40.108+0000",
+            "layers": [],
+            "memory_size": 128,
+            "publish": true,
+            "qualified_arn": "arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes:1",
+            "reserved_concurrent_executions": -1,
+            "role": "arn:aws:iam::745437999005:role/prod-onmyojideckbuilder-lambda",
+            "runtime": "nodejs12.x",
+            "s3_bucket": null,
+            "s3_key": null,
+            "s3_object_version": null,
+            "source_code_hash": "5EVmwQDkgGfYMpMXNaWHUz3cmb/dSssoWl8mM8o3aMs=",
+            "source_code_size": 601,
+            "tags": {
+              "Description": "website to build and share onmyoji decks",
+              "Project": "onmyoji-deck-builder"
+            },
+            "timeout": 3,
+            "timeouts": null,
+            "tracing_config": [
+              {
+                "mode": "PassThrough"
+              }
+            ],
+            "version": "1",
+            "vpc_config": []
+          },
+          "dependencies": [
+            "aws_iam_policy.lambda_logging",
+            "aws_iam_role.lambda_role",
+            "aws_iam_role_policy_attachment.lambda_logging",
+            "data.archive_file.lambda_main"
+          ]
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "data",
+      "type": "aws_iam_policy_document",
+      "name": "origin",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "id": "637012258",
+            "json": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\": \"S3GetObjectForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:GetObject\",\n      \"Resource\": \"arn:aws:s3:::${bucket_name}${origin_path}*\",\n      \"Principal\": {\n        \"AWS\": \"${cloudfront_origin_access_identity_iam_arn}\"\n      }\n    },\n    {\n      \"Sid\": \"S3ListBucketForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:ListBucket\",\n      \"Resource\": \"arn:aws:s3:::${bucket_name}\",\n      \"Principal\": {\n        \"AWS\": \"${cloudfront_origin_access_identity_iam_arn}\"\n      }\n    },\n    {\n      \"Sid\": \"PublicRead\",\n      \"Effect\": \"Allow\",\n      \"Action\": [\n        \"s3:GetObject\"\n      ],\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": \"*\"\n    }\n  ]\n}",
+            "override_json": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\":\"PublicRead\",\n      \"Effect\":\"Allow\",\n      \"Principal\":\"*\",\n      \"Action\":[\"s3:GetObject\"],\n      \"Resource\":\"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\"\n    }\n  ]\n}\n",
+            "policy_id": null,
+            "source_json": null,
+            "statement": [
+              {
+                "actions": [
+                  "s3:GetObject"
+                ],
+                "condition": [],
+                "effect": "Allow",
+                "not_actions": [],
+                "not_principals": [],
+                "not_resources": [],
+                "principals": [
+                  {
+                    "identifiers": [
+                      "${cloudfront_origin_access_identity_iam_arn}"
+                    ],
+                    "type": "AWS"
+                  }
+                ],
+                "resources": [
+                  "arn:aws:s3:::${bucket_name}${origin_path}*"
+                ],
+                "sid": "S3GetObjectForCloudFront"
+              },
+              {
+                "actions": [
+                  "s3:ListBucket"
+                ],
+                "condition": [],
+                "effect": "Allow",
+                "not_actions": [],
+                "not_principals": [],
+                "not_resources": [],
+                "principals": [
+                  {
+                    "identifiers": [
+                      "${cloudfront_origin_access_identity_iam_arn}"
+                    ],
+                    "type": "AWS"
+                  }
+                ],
+                "resources": [
+                  "arn:aws:s3:::${bucket_name}"
+                ],
+                "sid": "S3ListBucketForCloudFront"
+              }
+            ],
+            "version": "2012-10-17"
+          }
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "data",
+      "type": "aws_iam_policy_document",
+      "name": "origin_website",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "id": "2989024212",
+            "json": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\": \"S3GetObjectForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:GetObject\",\n      \"Resource\": \"arn:aws:s3:::${bucket_name}${origin_path}*\",\n      \"Principal\": {\n        \"AWS\": \"*\"\n      }\n    },\n    {\n      \"Sid\": \"PublicRead\",\n      \"Effect\": \"Allow\",\n      \"Action\": [\n        \"s3:GetObject\"\n      ],\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": \"*\"\n    }\n  ]\n}",
+            "override_json": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\":\"PublicRead\",\n      \"Effect\":\"Allow\",\n      \"Principal\":\"*\",\n      \"Action\":[\"s3:GetObject\"],\n      \"Resource\":\"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\"\n    }\n  ]\n}\n",
+            "policy_id": null,
+            "source_json": null,
+            "statement": [
+              {
+                "actions": [
+                  "s3:GetObject"
+                ],
+                "condition": [],
+                "effect": "Allow",
+                "not_actions": [],
+                "not_principals": [],
+                "not_resources": [],
+                "principals": [
+                  {
+                    "identifiers": [
+                      "*"
+                    ],
+                    "type": "AWS"
+                  }
+                ],
+                "resources": [
+                  "arn:aws:s3:::${bucket_name}${origin_path}*"
+                ],
+                "sid": "S3GetObjectForCloudFront"
+              }
+            ],
+            "version": "2012-10-17"
+          }
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "data",
+      "type": "aws_s3_bucket",
+      "name": "selected",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:s3:::prod-onmyojideckbuilder-origin",
+            "bucket": "prod-onmyojideckbuilder-origin",
+            "bucket_domain_name": "prod-onmyojideckbuilder-origin.s3.amazonaws.com",
+            "bucket_regional_domain_name": "prod-onmyojideckbuilder-origin.s3.eu-west-1.amazonaws.com",
+            "hosted_zone_id": "Z1BKCTXD74EZPE",
+            "id": "prod-onmyojideckbuilder-origin",
+            "region": "eu-west-1",
+            "website_domain": null,
+            "website_endpoint": null
+          }
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "data",
+      "type": "template_file",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/template\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "filename": null,
+            "id": "541c995169040d9ea986cc60699d59e5d5514e3b475898df8051e5638f80277c",
+            "rendered": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\": \"S3GetObjectForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:GetObject\",\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": {\n        \"AWS\": \"arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U\"\n      }\n    },\n    {\n      \"Sid\": \"S3ListBucketForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:ListBucket\",\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin\",\n      \"Principal\": {\n        \"AWS\": \"arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U\"\n      }\n    },\n    {\n      \"Sid\": \"PublicRead\",\n      \"Effect\": \"Allow\",\n      \"Action\": [\n        \"s3:GetObject\"\n      ],\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": \"*\"\n    }\n  ]\n}",
+            "template": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\": \"S3GetObjectForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:GetObject\",\n      \"Resource\": \"arn:aws:s3:::${bucket_name}${origin_path}*\",\n      \"Principal\": {\n        \"AWS\": \"${cloudfront_origin_access_identity_iam_arn}\"\n      }\n    },\n    {\n      \"Sid\": \"S3ListBucketForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:ListBucket\",\n      \"Resource\": \"arn:aws:s3:::${bucket_name}\",\n      \"Principal\": {\n        \"AWS\": \"${cloudfront_origin_access_identity_iam_arn}\"\n      }\n    },\n    {\n      \"Sid\": \"PublicRead\",\n      \"Effect\": \"Allow\",\n      \"Action\": [\n        \"s3:GetObject\"\n      ],\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": \"*\"\n    }\n  ]\n}",
+            "vars": {
+              "bucket_name": "prod-onmyojideckbuilder-origin",
+              "cloudfront_origin_access_identity_iam_arn": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U",
+              "origin_path": "/"
+            }
+          }
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "managed",
+      "type": "aws_cloudfront_distribution",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 1,
+          "attributes": {
+            "active_trusted_signers": {
+              "enabled": "false",
+              "items.#": "0"
+            },
+            "aliases": [
+              "onmyojideckbuilder.com"
+            ],
+            "arn": "arn:aws:cloudfront::745437999005:distribution/E8811LTEVQX71",
+            "cache_behavior": [],
+            "caller_reference": "terraform-20210318012218188400000002",
+            "comment": "Managed by Terraform",
+            "custom_error_response": [],
+            "default_cache_behavior": [
+              {
+                "allowed_methods": [
+                  "DELETE",
+                  "GET",
+                  "HEAD",
+                  "OPTIONS",
+                  "PATCH",
+                  "POST",
+                  "PUT"
+                ],
+                "cached_methods": [
+                  "GET",
+                  "HEAD"
+                ],
+                "compress": true,
+                "default_ttl": 60,
+                "field_level_encryption_id": "",
+                "forwarded_values": [
+                  {
+                    "cookies": [
+                      {
+                        "forward": "none",
+                        "whitelisted_names": null
+                      }
+                    ],
+                    "headers": [
+                      "Access-Control-Request-Headers",
+                      "Access-Control-Request-Method",
+                      "Origin"
+                    ],
+                    "query_string": false,
+                    "query_string_cache_keys": null
+                  }
+                ],
+                "lambda_function_association": [
+                  {
+                    "event_type": "origin-request",
+                    "include_body": false,
+                    "lambda_arn": "arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes:1"
+                  }
+                ],
+                "max_ttl": 31536000,
+                "min_ttl": 0,
+                "smooth_streaming": false,
+                "target_origin_id": "prod-onmyojideckbuilder",
+                "trusted_signers": [],
+                "viewer_protocol_policy": "redirect-to-https"
+              }
+            ],
+            "default_root_object": "index.html",
+            "domain_name": "duzt5fbttumv4.cloudfront.net",
+            "enabled": true,
+            "etag": "EWX7K6JLLQ02T",
+            "hosted_zone_id": "Z2FDTNDATAQYW2",
+            "http_version": "http2",
+            "id": "E8811LTEVQX71",
+            "in_progress_validation_batches": 0,
+            "is_ipv6_enabled": true,
+            "last_modified_time": "2021-03-18 01:22:20.572 +0000 UTC",
+            "logging_config": [
+              {
+                "bucket": "prod-onmyojideckbuilder-logs.s3.amazonaws.com",
+                "include_cookies": false,
+                "prefix": ""
+              }
+            ],
+            "ordered_cache_behavior": [],
+            "origin": [
+              {
+                "custom_header": [],
+                "custom_origin_config": [],
+                "domain_name": "prod-onmyojideckbuilder-origin.s3.eu-west-1.amazonaws.com",
+                "origin_id": "prod-onmyojideckbuilder",
+                "origin_path": "",
+                "s3_origin_config": [
+                  {
+                    "origin_access_identity": "origin-access-identity/cloudfront/E3899P9Y5AOS3U"
+                  }
+                ]
+              }
+            ],
+            "origin_group": [],
+            "price_class": "PriceClass_100",
+            "restrictions": [
+              {
+                "geo_restriction": [
+                  {
+                    "locations": null,
+                    "restriction_type": "none"
+                  }
+                ]
+              }
+            ],
+            "retain_on_delete": false,
+            "status": "Deployed",
+            "tags": {
+              "Description": "website to build and share onmyoji decks",
+              "Name": "prod-onmyojideckbuilder",
+              "Project": "onmyoji-deck-builder",
+              "Stage": "prod"
+            },
+            "viewer_certificate": [
+              {
+                "acm_certificate_arn": "arn:aws:acm:us-east-1:745437999005:certificate/11502ff4-7851-426f-92ac-27db7c44825f",
+                "cloudfront_default_certificate": false,
+                "iam_certificate_id": "",
+                "minimum_protocol_version": "TLSv1",
+                "ssl_support_method": "sni-only"
+              }
+            ],
+            "wait_for_deployment": true,
+            "web_acl_id": ""
+          },
+          "private": "eyJzY2hlbWFfdmVyc2lvbiI6IjEifQ==",
+          "dependencies": [
+            "aws_lambda_function.directory_indexes",
+            "module.cloudfront_s3_cdn.aws_cloudfront_origin_access_identity.default",
+            "module.cloudfront_s3_cdn.aws_s3_bucket.origin",
+            "module.cloudfront_s3_cdn.data.aws_s3_bucket.selected",
+            "module.cloudfront_s3_cdn.module.logs.aws_s3_bucket.default"
+          ]
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "managed",
+      "type": "aws_cloudfront_origin_access_identity",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "caller_reference": "terraform-20210318012209443100000001",
+            "cloudfront_access_identity_path": "origin-access-identity/cloudfront/E3899P9Y5AOS3U",
+            "comment": "prod-onmyojideckbuilder",
+            "etag": "E1OBPL8GJS1IFK",
+            "iam_arn": "arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U",
+            "id": "E3899P9Y5AOS3U",
+            "s3_canonical_user_id": "c6ca7e493807b1f8d4d0384bd9afb42dd1fae658b306d8e2acb0953a4f7d8d8edb3a33810cf86f79c01990e91c97e112"
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "managed",
+      "type": "aws_s3_bucket",
+      "name": "origin",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "acceleration_status": "",
+            "acl": "private",
+            "arn": "arn:aws:s3:::prod-onmyojideckbuilder-origin",
+            "bucket": "prod-onmyojideckbuilder-origin",
+            "bucket_domain_name": "prod-onmyojideckbuilder-origin.s3.amazonaws.com",
+            "bucket_prefix": null,
+            "bucket_regional_domain_name": "prod-onmyojideckbuilder-origin.s3.eu-west-1.amazonaws.com",
+            "cors_rule": [
+              {
+                "allowed_headers": [
+                  "*"
+                ],
+                "allowed_methods": [
+                  "GET",
+                  "HEAD",
+                  "PUT",
+                  "POST"
+                ],
+                "allowed_origins": [
+                  "*.onmyojideckbuilder.com"
+                ],
+                "expose_headers": [
+                  "ETag"
+                ],
+                "max_age_seconds": 3600
+              },
+              {
+                "allowed_headers": [
+                  "*"
+                ],
+                "allowed_methods": [
+                  "GET",
+                  "HEAD",
+                  "PUT",
+                  "POST"
+                ],
+                "allowed_origins": [
+                  "onmyojideckbuilder.com"
+                ],
+                "expose_headers": [
+                  "ETag"
+                ],
+                "max_age_seconds": 3600
+              }
+            ],
+            "force_destroy": true,
+            "grant": [],
+            "hosted_zone_id": "Z1BKCTXD74EZPE",
+            "id": "prod-onmyojideckbuilder-origin",
+            "lifecycle_rule": [],
+            "logging": [],
+            "object_lock_configuration": [],
+            "policy": null,
+            "region": "eu-west-1",
+            "replication_configuration": [],
+            "request_payer": "BucketOwner",
+            "server_side_encryption_configuration": [
+              {
+                "rule": [
+                  {
+                    "apply_server_side_encryption_by_default": [
+                      {
+                        "kms_master_key_id": "",
+                        "sse_algorithm": "AES256"
+                      }
+                    ]
+                  }
+                ]
+              }
+            ],
+            "tags": {
+              "Attributes": "origin",
+              "Description": "website to build and share onmyoji decks",
+              "Name": "prod-onmyojideckbuilder-origin",
+              "Project": "onmyoji-deck-builder",
+              "Stage": "prod"
+            },
+            "versioning": [
+              {
+                "enabled": true,
+                "mfa_delete": false
+              }
+            ],
+            "website": [],
+            "website_domain": null,
+            "website_endpoint": null
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn",
+      "mode": "managed",
+      "type": "aws_s3_bucket_policy",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "bucket": "prod-onmyojideckbuilder-origin",
+            "id": "prod-onmyojideckbuilder-origin",
+            "policy": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Sid\": \"S3GetObjectForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:GetObject\",\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": {\n        \"AWS\": \"arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U\"\n      }\n    },\n    {\n      \"Sid\": \"S3ListBucketForCloudFront\",\n      \"Effect\": \"Allow\",\n      \"Action\": \"s3:ListBucket\",\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin\",\n      \"Principal\": {\n        \"AWS\": \"arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity E3899P9Y5AOS3U\"\n      }\n    },\n    {\n      \"Sid\": \"PublicRead\",\n      \"Effect\": \"Allow\",\n      \"Action\": [\n        \"s3:GetObject\"\n      ],\n      \"Resource\": \"arn:aws:s3:::prod-onmyojideckbuilder-origin/*\",\n      \"Principal\": \"*\"\n    }\n  ]\n}"
+          },
+          "private": "bnVsbA==",
+          "dependencies": [
+            "module.cloudfront_s3_cdn.aws_cloudfront_origin_access_identity.default",
+            "module.cloudfront_s3_cdn.aws_s3_bucket.origin",
+            "module.cloudfront_s3_cdn.data.aws_iam_policy_document.origin",
+            "module.cloudfront_s3_cdn.data.aws_iam_policy_document.origin_website",
+            "module.cloudfront_s3_cdn.data.template_file.default"
+          ]
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn.module.dns",
+      "mode": "data",
+      "type": "aws_route53_zone",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "caller_reference": "481ca519-c2ac-4885-b585-8283334987f7",
+            "comment": "",
+            "id": "Z0511918V1SF3MCG22JU",
+            "linked_service_description": null,
+            "linked_service_principal": null,
+            "name": "onmyojideckbuilder.com.",
+            "name_servers": [
+              "ns-1501.awsdns-59.org",
+              "ns-1652.awsdns-14.co.uk",
+              "ns-176.awsdns-22.com",
+              "ns-530.awsdns-02.net"
+            ],
+            "private_zone": false,
+            "resource_record_set_count": 3,
+            "tags": {},
+            "vpc_id": null,
+            "zone_id": "Z0511918V1SF3MCG22JU"
+          }
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn.module.dns",
+      "mode": "managed",
+      "type": "aws_route53_record",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 2,
+          "attributes": {
+            "alias": [
+              {
+                "evaluate_target_health": false,
+                "name": "duzt5fbttumv4.cloudfront.net",
+                "zone_id": "Z2FDTNDATAQYW2"
+              }
+            ],
+            "allow_overwrite": false,
+            "failover_routing_policy": [],
+            "fqdn": "onmyojideckbuilder.com",
+            "geolocation_routing_policy": [],
+            "health_check_id": null,
+            "id": "Z0511918V1SF3MCG22JU_onmyojideckbuilder.com_A",
+            "latency_routing_policy": [],
+            "multivalue_answer_routing_policy": null,
+            "name": "onmyojideckbuilder.com",
+            "records": null,
+            "set_identifier": null,
+            "ttl": null,
+            "type": "A",
+            "weighted_routing_policy": [],
+            "zone_id": "Z0511918V1SF3MCG22JU"
+          },
+          "private": "eyJzY2hlbWFfdmVyc2lvbiI6IjIifQ==",
+          "dependencies": [
+            "aws_lambda_function.directory_indexes",
+            "module.cloudfront_s3_cdn.aws_cloudfront_distribution.default",
+            "module.cloudfront_s3_cdn.aws_cloudfront_origin_access_identity.default",
+            "module.cloudfront_s3_cdn.aws_s3_bucket.origin",
+            "module.cloudfront_s3_cdn.data.aws_s3_bucket.selected",
+            "module.cloudfront_s3_cdn.module.dns.data.aws_route53_zone.default",
+            "module.cloudfront_s3_cdn.module.logs.aws_s3_bucket.default"
+          ]
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn.module.dns",
+      "mode": "managed",
+      "type": "aws_route53_record",
+      "name": "ipv6",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 2,
+          "attributes": {
+            "alias": [
+              {
+                "evaluate_target_health": false,
+                "name": "duzt5fbttumv4.cloudfront.net",
+                "zone_id": "Z2FDTNDATAQYW2"
+              }
+            ],
+            "allow_overwrite": false,
+            "failover_routing_policy": [],
+            "fqdn": "onmyojideckbuilder.com",
+            "geolocation_routing_policy": [],
+            "health_check_id": null,
+            "id": "Z0511918V1SF3MCG22JU_onmyojideckbuilder.com_AAAA",
+            "latency_routing_policy": [],
+            "multivalue_answer_routing_policy": null,
+            "name": "onmyojideckbuilder.com",
+            "records": null,
+            "set_identifier": null,
+            "ttl": null,
+            "type": "AAAA",
+            "weighted_routing_policy": [],
+            "zone_id": "Z0511918V1SF3MCG22JU"
+          },
+          "private": "eyJzY2hlbWFfdmVyc2lvbiI6IjIifQ==",
+          "dependencies": [
+            "aws_lambda_function.directory_indexes",
+            "module.cloudfront_s3_cdn.aws_cloudfront_distribution.default",
+            "module.cloudfront_s3_cdn.aws_cloudfront_origin_access_identity.default",
+            "module.cloudfront_s3_cdn.aws_s3_bucket.origin",
+            "module.cloudfront_s3_cdn.data.aws_s3_bucket.selected",
+            "module.cloudfront_s3_cdn.module.dns.data.aws_route53_zone.default",
+            "module.cloudfront_s3_cdn.module.logs.aws_s3_bucket.default"
+          ]
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn.module.logs",
+      "mode": "managed",
+      "type": "aws_s3_bucket",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "acceleration_status": "",
+            "acl": "log-delivery-write",
+            "arn": "arn:aws:s3:::prod-onmyojideckbuilder-logs",
+            "bucket": "prod-onmyojideckbuilder-logs",
+            "bucket_domain_name": "prod-onmyojideckbuilder-logs.s3.amazonaws.com",
+            "bucket_prefix": null,
+            "bucket_regional_domain_name": "prod-onmyojideckbuilder-logs.s3.eu-west-1.amazonaws.com",
+            "cors_rule": [],
+            "force_destroy": true,
+            "grant": [],
+            "hosted_zone_id": "Z1BKCTXD74EZPE",
+            "id": "prod-onmyojideckbuilder-logs",
+            "lifecycle_rule": [
+              {
+                "abort_incomplete_multipart_upload_days": 5,
+                "enabled": true,
+                "expiration": [
+                  {
+                    "date": "",
+                    "days": 90,
+                    "expired_object_delete_marker": false
+                  }
+                ],
+                "id": "prod-onmyojideckbuilder-logs",
+                "noncurrent_version_expiration": [
+                  {
+                    "days": 90
+                  }
+                ],
+                "noncurrent_version_transition": [
+                  {
+                    "days": 30,
+                    "storage_class": "GLACIER"
+                  }
+                ],
+                "prefix": "",
+                "tags": null,
+                "transition": [
+                  {
+                    "date": "",
+                    "days": 30,
+                    "storage_class": "STANDARD_IA"
+                  },
+                  {
+                    "date": "",
+                    "days": 60,
+                    "storage_class": "GLACIER"
+                  }
+                ]
+              }
+            ],
+            "logging": [],
+            "object_lock_configuration": [],
+            "policy": "",
+            "region": "eu-west-1",
+            "replication_configuration": [],
+            "request_payer": "BucketOwner",
+            "server_side_encryption_configuration": [
+              {
+                "rule": [
+                  {
+                    "apply_server_side_encryption_by_default": [
+                      {
+                        "kms_master_key_id": "",
+                        "sse_algorithm": "AES256"
+                      }
+                    ]
+                  }
+                ]
+              }
+            ],
+            "tags": {
+              "Attributes": "logs",
+              "Description": "website to build and share onmyoji decks",
+              "Name": "prod-onmyojideckbuilder-logs",
+              "Project": "onmyoji-deck-builder",
+              "Stage": "prod"
+            },
+            "versioning": [
+              {
+                "enabled": false,
+                "mfa_delete": false
+              }
+            ],
+            "website": [],
+            "website_domain": null,
+            "website_endpoint": null
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "module": "module.cloudfront_s3_cdn.module.logs",
+      "mode": "managed",
+      "type": "aws_s3_bucket_public_access_block",
+      "name": "default",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "index_key": 0,
+          "schema_version": 0,
+          "attributes": {
+            "block_public_acls": true,
+            "block_public_policy": true,
+            "bucket": "prod-onmyojideckbuilder-logs",
+            "id": "prod-onmyojideckbuilder-logs",
+            "ignore_public_acls": true,
+            "restrict_public_buckets": true
+          },
+          "private": "bnVsbA==",
+          "dependencies": [
+            "module.cloudfront_s3_cdn.module.logs.aws_s3_bucket.default"
+          ]
+        }
+      ]
+    }
+  ]
+}

.infrastructure/terraform.tfstate.d/prod-eu-west-1/terraform.tfstate.backup

@@ -0,0 +1,157 @@
+{
+  "version": 4,
+  "terraform_version": "0.13.5",
+  "serial": 28,
+  "lineage": "baf13f49-a91e-4ef3-40f8-b010f53cf030",
+  "outputs": {},
+  "resources": [
+    {
+      "mode": "data",
+      "type": "archive_file",
+      "name": "lambda_main",
+      "provider": "provider[\"registry.terraform.io/hashicorp/archive\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "excludes": null,
+            "id": "320d4868dd37d1674e98bd790b8a54b006838d04",
+            "output_base64sha256": "5EVmwQDkgGfYMpMXNaWHUz3cmb/dSssoWl8mM8o3aMs=",
+            "output_md5": "611fc9e8b494e4b399217f632b8e35ed",
+            "output_path": "./lambda/main.js.zip",
+            "output_sha": "320d4868dd37d1674e98bd790b8a54b006838d04",
+            "output_size": 601,
+            "source": [],
+            "source_content": null,
+            "source_content_filename": null,
+            "source_dir": null,
+            "source_file": "./lambda/main.js",
+            "type": "zip"
+          }
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_policy",
+      "name": "lambda_logging",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "description": "",
+            "id": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "name": "prod-onmyojideckbuilder-lambda_logging",
+            "name_prefix": null,
+            "path": "/",
+            "policy": "{\n  \"Version\": \"2012-10-17\",\n  \"Statement\": [\n    {\n      \"Action\": [\n        \"logs:CreateLogGroup\",\n        \"logs:CreateLogStream\",\n        \"logs:PutLogEvents\"\n      ],\n      \"Resource\": \"arn:aws:logs:*:*:*\",\n      \"Effect\": \"Allow\"\n    }\n  ]\n}\n"
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_role",
+      "name": "lambda_role",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:iam::745437999005:role/prod-onmyojideckbuilder-lambda",
+            "assume_role_policy": "{\"Version\":\"2012-10-17\",\"Statement\":[{\"Effect\":\"Allow\",\"Principal\":{\"Service\":[\"lambda.amazonaws.com\",\"edgelambda.amazonaws.com\"]},\"Action\":\"sts:AssumeRole\"}]}",
+            "create_date": "2021-03-18T00:54:31Z",
+            "description": "",
+            "force_detach_policies": false,
+            "id": "prod-onmyojideckbuilder-lambda",
+            "max_session_duration": 3600,
+            "name": "prod-onmyojideckbuilder-lambda",
+            "name_prefix": null,
+            "path": "/",
+            "permissions_boundary": null,
+            "tags": {
+              "Description": "website to build and share onmyoji decks",
+              "Project": "onmyoji-deck-builder"
+            },
+            "unique_id": "AROA23D4RF6OTBMEPSDVE"
+          },
+          "private": "bnVsbA=="
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_iam_role_policy_attachment",
+      "name": "lambda_logging",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"]",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "id": "prod-onmyojideckbuilder-lambda-20210318005433729100000002",
+            "policy_arn": "arn:aws:iam::745437999005:policy/prod-onmyojideckbuilder-lambda_logging",
+            "role": "prod-onmyojideckbuilder-lambda"
+          },
+          "private": "bnVsbA==",
+          "dependencies": [
+            "aws_iam_policy.lambda_logging",
+            "aws_iam_role.lambda_role"
+          ]
+        }
+      ]
+    },
+    {
+      "mode": "managed",
+      "type": "aws_lambda_function",
+      "name": "directory_indexes",
+      "provider": "provider[\"registry.terraform.io/hashicorp/aws\"].us_east_1",
+      "instances": [
+        {
+          "schema_version": 0,
+          "attributes": {
+            "arn": "arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes",
+            "dead_letter_config": [],
+            "description": "",
+            "environment": [],
+            "file_system_config": [],
+            "filename": "./lambda/main.js.zip",
+            "function_name": "prod-onmyojideckbuilder-directory_indexes",
+            "handler": "main.handler",
+            "id": "prod-onmyojideckbuilder-directory_indexes",
+            "invoke_arn": "arn:aws:apigateway:us-east-1:lambda:path/2015-03-31/functions/arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes/invocations",
+            "kms_key_arn": "",
+            "last_modified": "2021-03-18T00:54:40.108+0000",
+            "layers": [],
+            "memory_size": 128,
+            "publish": true,
+            "qualified_arn": "arn:aws:lambda:us-east-1:745437999005:function:prod-onmyojideckbuilder-directory_indexes:1",
+            "reserved_concurrent_executions": -1,
+            "role": "arn:aws:iam::745437999005:role/prod-onmyojideckbuilder-lambda",
+            "runtime": "nodejs12.x",
+            "s3_bucket": null,
+            "s3_key": null,
+            "s3_object_version": null,
+            "source_code_hash": "5EVmwQDkgGfYMpMXNaWHUz3cmb/dSssoWl8mM8o3aMs=",
+            "source_code_size": 601,
+            "tags": {
+              "Description": "website to build and share onmyoji decks",
+              "Project": "onmyoji-deck-builder"
+            },
+            "timeout": 3,
+            "timeouts": null,
+            "tracing_config": [
+              {
+                "mode": "PassThrough"
+              }
+            ],
+            "version": "1",
+            "vpc_config": []
+          }
+        }
+      ]
+    }
+  ]
+}

.infrastructure/variables.tf

@@ -0,0 +1,55 @@
+variable "name" {
+
+}
+
+variable "region" {
+
+}
+
+variable "stage" {
+
+}
+
+variable "profile" {
+
+}
+
+variable "acm_certificate_arn" {
+
+}
+
+variable "parent_zone_id" {
+
+}
+
+variable "aliases" {
+
+}
+
+variable "allowed_origins" {
+
+}
+
+variable "acl" {
+
+}
+
+variable "lambda_key" {
+
+}
+
+variable "source_file" {
+
+}
+
+variable "handler" {
+
+}
+
+variable "runtime" {
+
+}
+
+variable "s3_region" {
+
+}

commands.md

@@ -7,3 +7,9 @@
 - Sort lines by natural
 - Add `"id": ""`
 - Generate GUID and remove the tails
+
+## Deploy to S3
+
+<https://github.com/bep/s3deploy>
+
+`s3deploy -source=./dist -region=eu-west-1 -bucket=prod-onmyojideckbuilder-origin -distribution-id=E8811LTEVQX71`

package.json

@@ -5,13 +5,14 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "vue-cli-service lint",
+    "deploy": "aws s3 sync ./dist s3://prod-onmyojideckbuilder-origin --profile admin"
   },
   "dependencies": {
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
-    "vuetify": "^2.2.11",
+    "vuetify": "^2.4",
     "vuex": "^3.4.0"
   },
   "devDependencies": {

src/App.vue

@@ -8,7 +8,7 @@
       app
       :expand-on-hover="true"
       overflow
-      color="#070042"
+      color="#272935"
     >
       <v-list>
         <v-list-item
@@ -18,28 +18,31 @@
           :to="item.link"
         >
           <v-list-item-icon>
-            <v-icon >{{ item.icon }}</v-icon>
+            <!-- <v-icon>{{ item.icon }}</v-icon> -->
+            <v-img :src="item.icon" width="50"></v-img>
           </v-list-item-icon>
 
-          <v-list-item-content >
+          <v-list-item-content>
-            <v-list-item-title>{{ item.title }}</v-list-item-title>
+            <v-list-item-title class="text-button">{{
+              item.title
+            }}</v-list-item-title>
           </v-list-item-content>
         </v-list-item>
       </v-list>
     </v-navigation-drawer>
 
-    <v-app-bar :clipped-left="false" app color="#070042" >
+    <v-app-bar :clipped-left="false" app color="#272935">
       <v-app-bar-nav-icon
         @click.stop="primaryDrawer.model = !primaryDrawer.model"
       ></v-app-bar-nav-icon>
-      <v-toolbar-title >Onmyoji Deck Builder</v-toolbar-title>
+      <v-toolbar-title>Onmyoji Deck Builder</v-toolbar-title>
     </v-app-bar>
 
     <v-main>
       <router-view></router-view>
     </v-main>
 
-    <v-footer :inset="false" color="#04002E" app>
+    <v-footer :inset="false" color="#272935" app>
       <!-- <span class="px-4"
         >&copy; {{ new Date().getFullYear() }} Daniel Tomlinson</span
       >
@@ -53,12 +56,13 @@
 
 <script>
 import {
-  mdiViewDashboard,
-  mdiCalculator,
-  mdiHelpBox,
   mdiGithub,
 } from "@mdi/js";
 
+const home_icon = require(`@/assets/navbar/0000034a.png`);
+const deck_icon = require(`@/assets/navbar/00000047.png`);
+const help_icon = require(`@/assets/navbar/00000121.png`);
+
 export default {
   name: "App",
 
@@ -66,9 +70,9 @@ export default {
     primaryDrawer: {
       model: true,
       items: [
-        { title: "Home", icon: mdiViewDashboard, link: "/" },
+        { title: "Home", icon: home_icon, link: "/" },
-        { title: "Deck Builder", icon: mdiCalculator, link: "deck-builder" },
+        { title: "Deck Builder", icon: deck_icon, link: "deck-builder" },
-        { title: "Help", icon: mdiHelpBox, link: "help" },
+        { title: "Help", icon: help_icon, link: "help" },
       ],
     },
     icons: {

src/data/chains_headers.json

@@ -1,12 +0,0 @@
-[
-  { "text": "Building", "value": "building", "groupable": false },
-  { "text": "Number Needed", "value": "number_needed", "groupable": false },
-  {
-    "text": "Electricity Supplied?",
-    "value": "electricity_supplied",
-    "groupable": false
-  },
-  { "text": "Chain", "value": "chain", "groupable": true },
-  { "text": "Final Building?", "value": "final_building", "groupable": false },
-  { "text": "Base Duration", "value": "base_duration", "groupable": false }
-]

src/data/old_chains_headers.json

@@ -1,18 +0,0 @@
-[
-  { "text": "Building", "value": "building", "groupable": false },
-  {
-    "text": "Electricity Supplied?",
-    "value": "electricity_supplied",
-    "groupable": false
-  },
-  { "text": "Feeds Into", "value": "feeds_into", "groupable": false },
-  { "text": "Chain", "value": "chain", "groupable": true },
-  { "text": "Tier", "value": "tier", "groupable": false },
-  { "text": "Final Building?", "value": "final_building", "groupable": false },
-  {
-    "text": "Improved By Electricity?",
-    "value": "improved_by_electricity",
-    "groupable": false
-  },
-  { "text": "Base Duration", "value": "base_duration", "groupable": false },
-]

src/data/shikigami_cards.json

@@ -22,51 +22,51 @@
       { "id": "e715a175", "name": "shiki_0_card_7", "url": "7S.png" },
       { "id": "0b19a276", "name": "shiki_0_card_7", "url": "7S.png" }
     ],
-    "avatar": "https://cdn.vuetifyjs.com/images/lists/1.jpg"
+    "avatar": "avatar_0.png"
   },
   {
     "name": "Shiki_1",
     "cards": [
-      { "id": "a1731031", "name": "shiki_1_card_0", "url": "https://shiki_1_card_0.png" },
+      { "id": "a1731031", "name": "shiki_1_card_0", "url": "Untitled_0.png" },
-      { "id": "e7e726da", "name": "shiki_1_card_0", "url": "https://shiki_1_card_0.png" },
+      { "id": "e7e726da", "name": "shiki_1_card_0", "url": "Untitled_0.png" },
-      { "id": "78a98586", "name": "shiki_1_card_1", "url": "https://shiki_1_card_1.png" },
+      { "id": "78a98586", "name": "shiki_1_card_1", "url": "Untitled_0.png" },
-      { "id": "d86c45ad", "name": "shiki_1_card_1", "url": "https://shiki_1_card_1.png" },
+      { "id": "d86c45ad", "name": "shiki_1_card_1", "url": "Untitled_0.png" },
-      { "id": "8bc7bd43", "name": "shiki_1_card_2", "url": "https://shiki_1_card_2.png" },
+      { "id": "8bc7bd43", "name": "shiki_1_card_2", "url": "Untitled_0.png" },
-      { "id": "7189320d", "name": "shiki_1_card_2", "url": "https://shiki_1_card_2.png" },
+      { "id": "7189320d", "name": "shiki_1_card_2", "url": "Untitled_0.png" },
-      { "id": "b497c29d", "name": "shiki_1_card_3", "url": "https://shiki_1_card_3.png" },
+      { "id": "b497c29d", "name": "shiki_1_card_3", "url": "Untitled_0.png" },
-      { "id": "ef18f102", "name": "shiki_1_card_3", "url": "https://shiki_1_card_3.png" },
+      { "id": "ef18f102", "name": "shiki_1_card_3", "url": "Untitled_0.png" },
-      { "id": "9bcc73a4", "name": "shiki_1_card_4", "url": "https://shiki_1_card_4.png" },
+      { "id": "9bcc73a4", "name": "shiki_1_card_4", "url": "Untitled_0.png" },
-      { "id": "1303292a", "name": "shiki_1_card_4", "url": "https://shiki_1_card_4.png" },
+      { "id": "1303292a", "name": "shiki_1_card_4", "url": "Untitled_0.png" },
-      { "id": "746a7c46", "name": "shiki_1_card_5", "url": "https://shiki_1_card_5.png" },
+      { "id": "746a7c46", "name": "shiki_1_card_5", "url": "Untitled_0.png" },
-      { "id": "e36abe58", "name": "shiki_1_card_5", "url": "https://shiki_1_card_5.png" },
+      { "id": "e36abe58", "name": "shiki_1_card_5", "url": "Untitled_0.png" },
-      { "id": "0e70898a", "name": "shiki_1_card_6", "url": "https://shiki_1_card_6.png" },
+      { "id": "0e70898a", "name": "shiki_1_card_6", "url": "Untitled_0.png" },
-      { "id": "a703e2e1", "name": "shiki_1_card_6", "url": "https://shiki_1_card_6.png" },
+      { "id": "a703e2e1", "name": "shiki_1_card_6", "url": "Untitled_0.png" },
-      { "id": "2a9cbb60", "name": "shiki_1_card_7", "url": "https://shiki_1_card_7.png" },
+      { "id": "2a9cbb60", "name": "shiki_1_card_7", "url": "Untitled_0.png" },
-      { "id": "90770c78", "name": "shiki_1_card_7", "url": "https://shiki_1_card_7.png" }
+      { "id": "90770c78", "name": "shiki_1_card_7", "url": "Untitled_0.png" }
     ],
-    "avatar": "https://cdn.vuetifyjs.com/images/lists/2.jpg"
+    "avatar": "avatar_0.png"
   },
   {
     "name": "Shiki_2",
     "cards": [
-      { "id": "01ccb58e", "name": "shiki_2_card_0", "url": "https://shiki_2_card_0.png" },
+      { "id": "01ccb58e", "name": "shiki_2_card_0", "url": "AD.png" },
-      { "id": "14f56042", "name": "shiki_2_card_0", "url": "https://shiki_2_card_0.png" },
+      { "id": "14f56042", "name": "shiki_2_card_0", "url": "AD.png" },
-      { "id": "9a254d1b", "name": "shiki_2_card_1", "url": "https://shiki_2_card_1.png" },
+      { "id": "9a254d1b", "name": "shiki_2_card_1", "url": "KD.png" },
-      { "id": "69f4fdb2", "name": "shiki_2_card_1", "url": "https://shiki_2_card_1.png" },
+      { "id": "69f4fdb2", "name": "shiki_2_card_1", "url": "KD.png" },
-      { "id": "df6c5fed", "name": "shiki_2_card_2", "url": "https://shiki_2_card_2.png" },
+      { "id": "df6c5fed", "name": "shiki_2_card_2", "url": "2D.png" },
-      { "id": "bb45fa3d", "name": "shiki_2_card_2", "url": "https://shiki_2_card_2.png" },
+      { "id": "bb45fa3d", "name": "shiki_2_card_2", "url": "2D.png" },
-      { "id": "b542a22d", "name": "shiki_2_card_3", "url": "https://shiki_2_card_3.png" },
+      { "id": "b542a22d", "name": "shiki_2_card_3", "url": "3D.png" },
-      { "id": "9c456857", "name": "shiki_2_card_3", "url": "https://shiki_2_card_3.png" },
+      { "id": "9c456857", "name": "shiki_2_card_3", "url": "3D.png" },
-      { "id": "dff9a535", "name": "shiki_2_card_4", "url": "https://shiki_2_card_4.png" },
+      { "id": "dff9a535", "name": "shiki_2_card_4", "url": "4D.png" },
-      { "id": "aafef844", "name": "shiki_2_card_4", "url": "https://shiki_2_card_4.png" },
+      { "id": "aafef844", "name": "shiki_2_card_4", "url": "4D.png" },
-      { "id": "32afefe6", "name": "shiki_2_card_5", "url": "https://shiki_2_card_5.png" },
+      { "id": "32afefe6", "name": "shiki_2_card_5", "url": "5D.png" },
-      { "id": "2883340a", "name": "shiki_2_card_5", "url": "https://shiki_2_card_5.png" },
+      { "id": "2883340a", "name": "shiki_2_card_5", "url": "5D.png" },
-      { "id": "a3272322", "name": "shiki_2_card_6", "url": "https://shiki_2_card_6.png" },
+      { "id": "a3272322", "name": "shiki_2_card_6", "url": "6D.png" },
-      { "id": "4cce0001", "name": "shiki_2_card_6", "url": "https://shiki_2_card_6.png" },
+      { "id": "4cce0001", "name": "shiki_2_card_6", "url": "6D.png" },
-      { "id": "5f36e966", "name": "shiki_2_card_7", "url": "https://shiki_2_card_7.png" },
+      { "id": "5f36e966", "name": "shiki_2_card_7", "url": "7D.png" },
-      { "id": "aceb124d", "name": "shiki_2_card_7", "url": "https://shiki_2_card_7.png" }
+      { "id": "aceb124d", "name": "shiki_2_card_7", "url": "7D.png" }
     ],
-    "avatar": "https://cdn.vuetifyjs.com/images/lists/3.jpg"
+    "avatar": "avatar_0.png"
   },
   {
     "header": "Group 2"
@@ -77,24 +77,24 @@
   {
     "name": "Shiki_3",
     "cards": [
-      { "id": "a2d14b50", "name": "shiki_3_card_0", "url": "https://shiki_3_card_0.png" },
+      { "id": "a2d14b50", "name": "shiki_3_card_0", "url": "AC.png" },
-      { "id": "5e781f61", "name": "shiki_3_card_0", "url": "https://shiki_3_card_0.png" },
+      { "id": "5e781f61", "name": "shiki_3_card_0", "url": "AC.png" },
-      { "id": "3ac7b446", "name": "shiki_3_card_1", "url": "https://shiki_3_card_1.png" },
+      { "id": "3ac7b446", "name": "shiki_3_card_1", "url": "KC.png" },
-      { "id": "ed75a6d1", "name": "shiki_3_card_1", "url": "https://shiki_3_card_1.png" },
+      { "id": "ed75a6d1", "name": "shiki_3_card_1", "url": "KC.png" },
-      { "id": "e3fa8e21", "name": "shiki_3_card_2", "url": "https://shiki_3_card_2.png" },
+      { "id": "e3fa8e21", "name": "shiki_3_card_2", "url": "2C.png" },
-      { "id": "5de5f2f5", "name": "shiki_3_card_2", "url": "https://shiki_3_card_2.png" },
+      { "id": "5de5f2f5", "name": "shiki_3_card_2", "url": "2C.png" },
-      { "id": "cfaff11f", "name": "shiki_3_card_3", "url": "https://shiki_3_card_3.png" },
+      { "id": "cfaff11f", "name": "shiki_3_card_3", "url": "3C.png" },
-      { "id": "7dc06ad2", "name": "shiki_3_card_3", "url": "https://shiki_3_card_3.png" },
+      { "id": "7dc06ad2", "name": "shiki_3_card_3", "url": "3C.png" },
-      { "id": "f3eac1e9", "name": "shiki_3_card_4", "url": "https://shiki_3_card_4.png" },
+      { "id": "f3eac1e9", "name": "shiki_3_card_4", "url": "4C.png" },
-      { "id": "d6063473", "name": "shiki_3_card_4", "url": "https://shiki_3_card_4.png" },
+      { "id": "d6063473", "name": "shiki_3_card_4", "url": "4C.png" },
-      { "id": "b982300e", "name": "shiki_3_card_5", "url": "https://shiki_3_card_5.png" },
+      { "id": "b982300e", "name": "shiki_3_card_5", "url": "5C.png" },
-      { "id": "099e6321", "name": "shiki_3_card_5", "url": "https://shiki_3_card_5.png" },
+      { "id": "099e6321", "name": "shiki_3_card_5", "url": "5C.png" },
-      { "id": "cac026ec", "name": "shiki_3_card_6", "url": "https://shiki_3_card_6.png" },
+      { "id": "cac026ec", "name": "shiki_3_card_6", "url": "6C.png" },
-      { "id": "28d709ad", "name": "shiki_3_card_6", "url": "https://shiki_3_card_6.png" },
+      { "id": "28d709ad", "name": "shiki_3_card_6", "url": "6C.png" },
-      { "id": "e37841b5", "name": "shiki_3_card_7", "url": "https://shiki_3_card_7.png" },
+      { "id": "e37841b5", "name": "shiki_3_card_7", "url": "7C.png" },
-      { "id": "8a7a1fe6", "name": "shiki_3_card_7", "url": "https://shiki_3_card_7.png" }
+      { "id": "8a7a1fe6", "name": "shiki_3_card_7", "url": "7C.png" }
     ],
-    "avatar": "https://cdn.vuetifyjs.com/images/lists/4.jpg"
+    "avatar": "avatar_0.png"
   },
   {
     "name": "Shiki_4",
@@ -116,6 +116,6 @@
       { "id": "c6607d02", "name": "shiki_4_card_7", "url": "https://shiki_4_card_7.png" },
       { "id": "32f4bcb3", "name": "shiki_4_card_7", "url": "https://shiki_4_card_7.png" }
     ],
-    "avatar": "https://cdn.vuetifyjs.com/images/lists/5.jpg"
+    "avatar": "avatar_0.png"
   }
 ]

src/router/index.js

@@ -30,6 +30,7 @@ const routes = [
 ];
 
 const router = new VueRouter({
+  mode: 'history',
   routes,
 });
 

src/styles/variables.scss

@@ -1,3 +1,3 @@
 $material-dark: (
-  'background': #04002E
+  'background': #16192B
 );

src/views/DeckBuilder.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- <v-container fluid px-16 pb-10> -->
   <v-container>
     <v-row>
       <v-col cols="12">
@@ -9,6 +10,19 @@
         </div>
       </v-col>
     </v-row>
+    <v-row>
+      <v-textarea
+        v-model="deck_title"
+        label="Deck Title"
+        class="user-deck-title"
+        rows="1"
+        row-height="80"
+      ></v-textarea>
+    </v-row>
+    <v-row>
+      <v-textarea v-model="deck_description" label="Deck Description">
+      </v-textarea>
+    </v-row>
     <v-row>
       <v-col cols="12">
         <v-select
@@ -31,10 +45,12 @@
               x-large
               @click="data.select"
               @click:close="remove_shikigami(data.item)"
-              color="#070042"
+              color="#C0B094"
             >
               <v-avatar size="90" left>
-                <v-img :src="data.item.avatar"></v-img>
+                <v-img
+                  :src="require(`@/assets/avatars/${data.item.avatar}`)"
+                ></v-img>
               </v-avatar>
               {{ data.item.name }}
             </v-chip>
@@ -42,7 +58,7 @@
           <template v-slot:item="data">
             <template>
               <v-list-item-avatar>
-                <img :src="data.item.avatar" />
+                <img :src="require(`@/assets/avatars/${data.item.avatar}`)" />
               </v-list-item-avatar>
               <v-list-item-content>
                 <v-list-item-title v-html="data.item.name"></v-list-item-title>
@@ -54,27 +70,33 @@
           </template>
         </v-select>
       </v-col>
-      selected_shikigami_names: {{ selected_shikigami_names }} <br />
+      <!-- selected_shikigami_names: {{ selected_shikigami_names }} <br /> -->
-      selected_shikigami_data: {{ selected_shikigami_data }} <br />
+      <!-- selected_shikigami_data: {{ selected_shikigami_data }} <br /> -->
-      selected_shikigami_decks: {{ selected_shikigami_decks }}
+      <!-- selected_shikigami_decks: {{ selected_shikigami_decks }} -->
+      <!-- deck_title: {{ deck_title }} -->
     </v-row>
     <v-row v-for="(_, index) in selected_shikigami_names" :key="index">
-      <v-card elevation="2" width="100%" class="py-4" flat tile color="#070042">
+      <v-card elevation="2" width="100%" class="pa-3" flat tile color="#171D29">
         <v-row>
           <v-col cols="2">
             <div cols="12">
               <div cols="12" class="text-h5 text-center">
-                {{ `${selected_shikigami_data[index].name}` }}
+                <!-- {{ `${selected_shikigami_data[index].name}` }} -->
               </div>
               <div cols="12">
                 <v-img
-                  :src="`${selected_shikigami_data[index].avatar}`"
+                  :src="
-                  aspect-ratio="1"
+                    require(`@/assets/avatars/${selected_shikigami_data[index].avatar}`)
+                  "
                   width="100%"
                 ></v-img>
               </div>
-              <div cols="12">
+            </div>
-                {{ index }}
+          </v-col>
+          <v-col cols="10" class="d-flex flex-column"
+            ><v-row cols="12">
+              <!-- {{ index }} -->
+              <!-- {{ selected_shikigami_decks[index][index].length }} -->
               <v-select
                 v-model="selected_shikigami_decks[index][index]"
                 v-on:input="limit_decks"
@@ -86,6 +108,7 @@
                 hint="Choose 8 cards for your deck."
                 persistent-hint
                 return-object
+                clearable
               >
                 <template v-slot:selection="data">
                   <v-chip
@@ -93,40 +116,40 @@
                     :input-value="data.selected"
                     close
                     label
-                      x-small
                     @click="data.select"
                     @click:close="remove_decks(index, data.index)"
-                      color="#04002E"
+                    color="#C0B094"
                     >{{ data.item.name }}</v-chip
                   ></template
                 >
               </v-select>
-              </div>
+            </v-row>
-            </div>
+            <!-- <div cols="12">
-          </v-col>
+              {{ selected_shikigami_decks[index][index] }}
-          <v-col cols="10">
+            </div> -->
-            <div cols="12">
+            <v-row cols="12">
-              <!-- {{ selected_shikigami_decks[index][index] }} -->
-            </div>
-            <v-row cols="12" class="d-flex">
               <v-card
                 v-for="i in selected_shikigami_decks[index][index]"
                 :key="i.id"
-                width="12.4%"
+                width="12.3%"
+                color="#171D29"
               >
-                <div class="text-center">
+                <!-- <div class="text-center">
                   {{ i.name }}
-                </div>
+                </div> -->
+                <div class="">
                   <v-img
                     :src="require(`@/assets/deck_of_cards/${i.url}`)"
                     class="deck-card"
-                ></v-img
+                  ></v-img></div
-              ></v-card>
+              ></v-card> </v-row
-            </v-row>
+          ></v-col>
-          </v-col>
         </v-row>
       </v-card>
     </v-row>
+    <v-row>
+      <!-- <v-textarea :value="construct_url()" color="teal"> </v-textarea> -->
+    </v-row>
   </v-container>
 </template>
 
@@ -138,6 +161,8 @@ export default {
     selected_shikigami_data: [],
     selected_shikigami_decks: [{ 0: [] }, { 1: [] }, { 2: [] }, { 3: [] }],
     shikigami: shikigami,
+    deck_title: "",
+    deck_description: "",
   }),
   methods: {
     get_chosen_shikigami_data: function (shikigami_name) {
@@ -163,7 +188,28 @@ export default {
     },
     remove_shikigami(item) {
       const index = this.selected_shikigami_names.indexOf(item.name);
-      if (index >= 0) this.selected_shikigami_names.splice(index, 1);
+      if (index >= 0) {
+        this.selected_shikigami_names.splice(index, 1);
+        this.selected_shikigami_decks[index][index].splice(0);
+        // shuffle shikigami down by 1
+        if (index <= 3) {
+          for (let j = index; j <= 2; j++) {
+            for (
+              let i = 0;
+              i < this.selected_shikigami_decks[j + 1][j + 1].length;
+              i++
+            ) {
+              // this if is optional?
+              if (index < 3) {
+                this.selected_shikigami_decks[j][j].push(
+                  this.selected_shikigami_decks[j + 1][j + 1][i]
+                );
+              }
+            }
+            this.selected_shikigami_decks[j + 1][j + 1] = [];
+          }
+        }
+      }
     },
     remove_decks(shiki_index, card_index) {
       ``;
@@ -174,8 +220,97 @@ export default {
       console.log(this.selected_shikigami_decks[shiki_index].shiki_index);
       console.log(shiki_index, card_index);
     },
+    construct_url: function () {
+      const saved_selected_shikigami_names = btoa(
+        JSON.stringify(this.selected_shikigami_names)
+      );
+      const saved_selected_shikigami_decks = btoa(
+        JSON.stringify(this.selected_shikigami_decks)
+      );
+      const saved_deck_title = btoa(JSON.stringify(this.deck_title));
+      const saved_deck_description = btoa(
+        JSON.stringify(this.deck_description)
+      );
+      const url = `?deck_title=${saved_deck_title}&deck_description=${saved_deck_description}&selected_shikigami_names=${saved_selected_shikigami_names}&selected_shikigami_decks=${saved_selected_shikigami_decks}`;
+      return url;
+    },
   },
   computed: {},
+  mounted() {
+    if (this.$route.query.selected_shikigami_names) {
+      const saved_selected_shikigami_names = JSON.parse(
+        atob(this.$route.query.selected_shikigami_names)
+      );
+
+      if (typeof saved_selected_shikigami_names != "object") {
+        this.selected_shikigami_names = [];
+      } else {
+        this.selected_shikigami_names = [];
+        for (let i = 0; i < saved_selected_shikigami_names.length; i++) {
+          this.selected_shikigami_names.push(saved_selected_shikigami_names[i]);
+        }
+      }
+    } else {
+      this.selected_shikigami_names = [];
+    }
+
+    if (this.$route.query.selected_shikigami_decks) {
+      const saved_selected_shikigami_decks = JSON.parse(
+        atob(this.$route.query.selected_shikigami_decks)
+      );
+
+      if (typeof saved_selected_shikigami_decks != "object") {
+        this.selected_shikigami_decks = [
+          { 0: [] },
+          { 1: [] },
+          { 2: [] },
+          { 3: [] },
+        ];
+      } else {
+        this.selected_shikigami_decks = [];
+        for (let i = 0; i < saved_selected_shikigami_decks.length; i++) {
+          this.selected_shikigami_decks.push(saved_selected_shikigami_decks[i]);
+        }
+      }
+    } else {
+      this.selected_shikigami_decks = [
+        { 0: [] },
+        { 1: [] },
+        { 2: [] },
+        { 3: [] },
+      ];
+    }
+
+    if (this.$route.query.deck_title) {
+      const saved_deck_title = JSON.parse(atob(this.$route.query.deck_title));
+
+      if (typeof saved_deck_title != "string") {
+        this.deck_title = "";
+      } else {
+        this.deck_title = "";
+        for (let i = 0; i < saved_deck_title.length; i++) {
+          this.deck_title = saved_deck_title;
+        }
+      }
+    } else {
+      this.deck_title = "";
+    }
+
+    if (this.$route.query.deck_description) {
+      const saved_deck_description = JSON.parse(atob(this.$route.query.deck_description));
+
+      if (typeof saved_deck_description != "string") {
+        this.deck_description = "";
+      } else {
+        this.deck_description = "";
+        for (let i = 0; i < saved_deck_description.length; i++) {
+          this.deck_description = saved_deck_description;
+        }
+      }
+    } else {
+      this.deck_description = "";
+    }
+  },
   watch: {
     selected_shikigami_names: function () {
       this.selected_shikigami_data = [];
@@ -203,13 +338,31 @@ export default {
 
 .deck-card:hover {
   position: relative;
-  animation: scaleMe 500ms ease-in-out 0s forwards;
+  animation: card-zoom 500ms ease-in-out 0s forwards;
   z-index: 100;
 }
 
-@keyframes scaleMe {
+@keyframes card-zoom {
   100% {
     transform: scale(1.25);
   }
 }
+
+.v-textarea textarea {
+  padding: 50px 0px 0px 0px !important;
+}
+
+.user-deck-title {
+  font-size: 50px !important;
+  // margin-top: 50px !important;
+  // margin-bottom: -50px !important;
+}
+</style>
+
+<style lang="scss">
+.user-deck-title textarea {
+  padding-top: 10px !important;
+  padding-bottom: 15px !important;
+  text-align: center;
+}
 </style>

src/views/Home.vue

@@ -3,18 +3,18 @@
     <v-row class="text-center">
       <v-col cols="12">
         <v-img
-          :src="require('../assets/logo.svg')"
+          :src="require('../assets/000000c6.png')"
           class="my-3"
           contain
-          height="200"
+          height="500"
         />
       </v-col>
 
       <v-col class="mb-4">
-        <h1 class="display-2 font-weight-bold mb-3">Onymoji Deck Builder</h1>
+        <h1 class="display-2 font-weight-bold mb-3">Onmyoji Deck Builder</h1>
 
-        <p class="subheading font-weight-regular">Share and build decks.</p>
+        <p class="subheading font-weight-regular">Build and share decks.</p>
-        <v-btn elevation="1" x-large color="#EA6F1A">Get started</v-btn>
+        <v-btn elevation="1" x-large color="#C0B094">Get started</v-btn>
       </v-col>
     </v-row>
     <!-- <v-row class="text-center">

yarn.lock

@@ -8743,10 +8743,10 @@ vuetify-loader@^1.3.0:
     file-loader "^6.2.0"
     loader-utils "^2.0.0"
 
-vuetify@^2.2.11:
+vuetify@^2.4:
-  version "2.4.6"
+  version "2.4.7"
-  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-2.4.6.tgz#127b37bd36c7a63f61615e0cd6f97e8b203e7a07"
+  resolved "https://registry.yarnpkg.com/vuetify/-/vuetify-2.4.7.tgz#341f16950475466a7fa43f4cb507cc8c3ef170b9"
-  integrity sha512-oqAWKAin07ip/QuT/p4bL1LegE3MYPbfojrOcj80RATZDSnJyco2PZD8QuIzd0RhYfdAuSTkY8elvHsLu90RuQ==
+  integrity sha512-4RvdZ+BO23fPq8JCEdo9ENjE1AoMqDe1bm+4M57wNTfvW4djScxQnVYeUSE/7PHuzdSW/nROR5oyLQnGDB+DIA==
 
 vuex@^3.4.0:
   version "3.6.2"