From 6230dd84c05901556ac949f709b87c77e5962039 Mon Sep 17 00:00:00 2001
From: EmptyWork <22065214+EmptyWork@users.noreply.github.com>
Date: Sun, 27 Aug 2023 08:59:34 +0900
Subject: [PATCH 1/8] =?UTF-8?q?update:=20`=5Ferror.scss`=20=E2=80=94=20fol?=
=?UTF-8?q?lows=20design=20from=20`=5Fcontact.scss`?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/assets/scss/modules/component/_error.scss | 140 ++++++++++++++----
1 file changed, 109 insertions(+), 31 deletions(-)
diff --git a/src/assets/scss/modules/component/_error.scss b/src/assets/scss/modules/component/_error.scss
index 112f1cd..fd23b3d 100644
--- a/src/assets/scss/modules/component/_error.scss
+++ b/src/assets/scss/modules/component/_error.scss
@@ -1,42 +1,120 @@
.error {
- &-notice {
- max-width: 40em;
- border-radius: 1em;
- padding: 1.5em 1.5em;
- transition-delay: 200ms;
- position: relative;
- margin-top: 2em;
+ &-container {
+ @extend .contact-container;
+ }
- * {
- position: relative;
- z-index: 1;
+ &-summary {
+ @extend .contact-summary;
+
+ h2 {
+ line-height: 1;
+ font-size: 1.8rem;
+ font-variant: all-small-caps;
+ margin-bottom: 1rem;
}
+ }
- &::after {
+ &-decorative {
+ aspect-ratio: 10/1;
+ width: 100%;
+ margin-bottom: 1em;
+ border-radius: 0.7em;
+ background-image: linear-gradient(-45deg, var(--clr-accent) 2%, transparent var(--_transparent-limit), var(--clr-accent));
+ position: relative;
+ box-shadow: inset 0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5);
+
+ .decorative {
+ user-select: none;
position: absolute;
- content: "";
- background-color: var(--clr-background);
- z-index: 0;
- border-radius: 1em;
- width: 100%;
- height: 100%;
- left: 50%;
- top: 50%;
- z-index: 0;
- translate: -50% -50%;
+ filter: drop-shadow(0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5));
+
+ &-left {
+ position: absolute;
+ font-size: 9rem;
+ font-variant: all-small-caps;
+ font-weight: 900;
+ height: 100%;
+
+ animation: bounce-up-down 1.5s infinite forwards;
+
+ @include breakpoint-down('small') {
+ font-size: 7rem;
+ }
+ }
+
+ &-exclamation {
+ top: 50%;
+ translate: 0% -50%;
+ rotate: -20deg;
+ }
+
+ &-question {
+ top: 0%;
+ left: 0.2em;
+ translate: 0% -50%;
+ rotate: 15deg;
+ }
}
- &::before {
+ svg {
position: absolute;
- content: "";
- background-color: red;
- background-image: linear-gradient(90deg, var(--clr-background-900), var(--clr-accent-light));
- border-radius: 1em;
- width: calc(100% + 1em);
- height: calc(100% + 2em);
- left: 50%;
+ aspect-ratio: 1/1;
+ height: 120%;
+ width: auto;
+ rotate: -20deg;
top: 50%;
- translate: -50% -51%;
+ right: 0;
+ translate: 0% -50%;
+ animation: svg-move 4s infinite forwards;
+
+ filter: drop-shadow(0 0.3125rem 0.625rem hsla(0, 0%, 0%, 0.5));
+ }
+
+ @include breakpoint-down('small') {
+ aspect-ratio: 4/1;
}
+
+ @keyframes svg-move {
+ 40% {
+ rotate: 30deg;
+ }
+
+ 50% {
+ rotate: 20deg;
+ }
+
+ 90% {
+ rotate: -30deg;
+ }
+
+ 100% {
+ rotate: -20deg;
+ }
+ }
+
+ @keyframes bounce-up-down {
+ 50% {
+ margin-top: -0.6rem;
+ rotate: 2deg;
+ }
+
+ 100% {
+ margin-top: 0;
+ rotate: 0;
+ }
+ }
+ }
+
+ &-button {
+ @extend .social-container;
+ @extend .social-container__small;
+
+ li:first-of-type .error-link:first-of-type:after {
+ background-image: linear-gradient(-45deg, var(--clr-accent) 2%, transparent var(--_transparent-limit), var(--clr-accent));
+ }
+ }
+
+ &-link {
+ @extend .social-item;
}
-}
+}
\ No newline at end of file
From 7e0c7ab217ac27a9b9009598fd4adad2169b0614 Mon Sep 17 00:00:00 2001
From: EmptyWork <22065214+EmptyWork@users.noreply.github.com>
Date: Sun, 27 Aug 2023 09:00:16 +0900
Subject: [PATCH 2/8] =?UTF-8?q?update:=20`=5Fcontact.scss`=20=E2=80=94=20l?=
=?UTF-8?q?ink=20more=20brighter?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/assets/scss/modules/component/_contact.scss | 2 +-
1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/src/assets/scss/modules/component/_contact.scss b/src/assets/scss/modules/component/_contact.scss
index d867435..17389b8 100644
--- a/src/assets/scss/modules/component/_contact.scss
+++ b/src/assets/scss/modules/component/_contact.scss
@@ -48,7 +48,7 @@
}
a {
- color: var(--clr-accent);
+ color: var(--clr-accent-light);
text-decoration: underline;
text-underline-offset: 0.2em;
font-weight: 500;
From b199e4647d0fb243bc689aadd19adb26068f0f5c Mon Sep 17 00:00:00 2001
From: EmptyWork <22065214+EmptyWork@users.noreply.github.com>
Date: Sun, 27 Aug 2023 09:00:43 +0900
Subject: [PATCH 3/8] =?UTF-8?q?update:=20`primary.njk`=20=E2=80=94=20new?=
=?UTF-8?q?=20front-matter=20variable?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/_includes/layouts/primary.njk | 9 ++++++---
1 file changed, 6 insertions(+), 3 deletions(-)
diff --git a/src/_includes/layouts/primary.njk b/src/_includes/layouts/primary.njk
index cb497c5..33ed0e3 100644
--- a/src/_includes/layouts/primary.njk
+++ b/src/_includes/layouts/primary.njk
@@ -11,10 +11,13 @@
{{ title }}
-
- {{ title }}
+
+