Merge pull request #13 from wonj1012/develop

Develop
0xwonj · Apr 4, 2024 · f4223c0 · f4223c0
2 parents a0dde01 + fc84f28
commit f4223c0
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 38 deletions.
diff --git a/app/head.js b/app/head.js
@@ -11,6 +11,10 @@ export default function Head() {
         crossOrigin="anonymous"
         referrerPolicy="no-referrer"
       />
+      <meta
+        name="google-site-verification"
+        content="50OAz5UzJPoaYB4mRjcYuuwyDVDIQc1mCbuqZgO2PYQ"
+      />
     </head>
   );
 }
diff --git a/components/BackLink.js b/components/BackLink.js
@@ -11,7 +11,7 @@ export default function BackLink(props) {
       href={backLink}
       className={`${titleColorClasses['after-bg-500']} group relative mr-auto overflow-hidden text-blue-100 after:absolute after:right-full after:top-0 after:z-[-1] after:size-full after:duration-200 hover:after:translate-x-full`}
     >
-      <p className="font-press-start duration-200 group-hover:text-[#030615]">
+      <p className="px-0.5 font-press-start duration-200 group-hover:text-[#030615]">
         <i className="fa-solid fa-arrow-left text-xl"></i>
         <span className="ml-3 text-sm">Back</span>
       </p>

diff --git a/components/LinkSection.js b/components/LinkSection.js
@@ -21,7 +21,7 @@ export default function LinkSection(props) {
               href={link.link}
               target={link.target}
               key={linkIndex}
-              className={`${color}BtnBorder relative grid place-items-center rounded-lg ${colorClasses['button-bg']} ${colorClasses['hover-bg-950']} p-4 text-blue-100 ${colorClasses['hover-200']}`}
+              className={`${color}BtnBorder relative grid place-items-center rounded-lg ${colorClasses['button-bg']} ${colorClasses['hover-button-bg']} p-4 text-blue-100 ${colorClasses['hover-200']}`}
             >
               <i
                 className={`absolute left-4 top-1/2 -translate-y-1/2 text-xl ${

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -21,9 +21,15 @@ export default {
   },
   plugins: [typography],
   safelist: [
-    'bg-[#090d2a]', // blue
-    'bg-[#2a1b10]', // orange
-    'bg-[#1d1329]', // purple
+    /** @blue */
+    'bg-[#111e62]',
+    'hover:bg-[#080e2e]',
+    /** @purple */
+    'bg-[#32214e]',
+    'hover:bg-[#181026]',
+    /** @orange */
+    'bg-[#a14200]',
+    'hover:bg-[#502207]',
     {
       pattern:
         /text-(purple|pink|blue|orange)-(50|100|200|300|400|500|600|700)/,

diff --git a/utils/colors.js b/utils/colors.js
@@ -1,3 +1,20 @@
+const blueClasses = {
+  50: 'text-blue-50',
+  100: 'text-blue-100',
+  200: 'text-blue-200',
+  300: 'text-blue-300',
+  400: 'text-blue-400',
+  500: 'text-blue-500',
+  'hover-200': 'hover:text-blue-200',
+  'hover-700': 'hover:text-blue-700',
+  'after-bg-500': 'after:bg-blue-500',
+  'hover-bg-950': 'hover:bg-blue-950',
+  'border-100': 'border-blue-100',
+  'border-400': 'border-blue-400',
+  'button-bg': 'bg-[#111e62]',
+  'hover-button-bg': 'hover:bg-[#080e2e]',
+};
+
 const purpleClasses = {
   50: 'text-purple-50',
   100: 'text-purple-100',
@@ -11,7 +28,25 @@ const purpleClasses = {
   'hover-bg-950': 'hover:bg-purple-950',
   'border-100': 'border-purple-100',
   'border-400': 'border-purple-400',
-  'button-bg': 'bg-[#1d1329]',
+  'button-bg': 'bg-[#32214e]',
+  'hover-button-bg': 'hover:bg-[#181026]',
+};
+
+const orangeClasses = {
+  50: 'text-orange-50',
+  100: 'text-orange-100',
+  200: 'text-orange-200',
+  300: 'text-orange-300',
+  400: 'text-orange-400',
+  500: 'text-orange-500',
+  'hover-200': 'hover:text-orange-200',
+  'hover-700': 'hover:text-orange-700',
+  'after-bg-500': 'after:bg-orange-500',
+  'hover-bg-950': 'hover:bg-orange-950',
+  'border-100': 'border-orange-100',
+  'border-400': 'border-orange-400',
+  'button-bg': 'bg-[#a14200]',
+  'hover-button-bg': 'hover:bg-[#502207]',
 };
 
 const pinkClasses = {
@@ -28,38 +63,7 @@ const pinkClasses = {
   'border-100': 'border-pink-100',
   'border-400': 'border-pink-400',
   'button-bg': 'bg-pink-950',
-};
-
-const blueClasses = {
-  50: 'text-blue-50',
-  100: 'text-blue-100',
-  200: 'text-blue-200',
-  300: 'text-blue-300',
-  400: 'text-blue-400',
-  500: 'text-blue-500',
-  'hover-200': 'hover:text-blue-200',
-  'hover-700': 'hover:text-blue-700',
-  'after-bg-500': 'after:bg-blue-500',
-  'hover-bg-950': 'hover:bg-blue-950',
-  'border-100': 'border-blue-100',
-  'border-400': 'border-blue-400',
-  'button-bg': 'bg-[#090d2a]',
-};
-
-const orangeClasses = {
-  50: 'text-orange-50',
-  100: 'text-orange-100',
-  200: 'text-orange-200',
-  300: 'text-orange-300',
-  400: 'text-orange-400',
-  500: 'text-orange-500',
-  'hover-200': 'hover:text-orange-200',
-  'hover-700': 'hover:text-orange-700',
-  'after-bg-500': 'after:bg-orange-500',
-  'hover-bg-950': 'hover:bg-orange-950',
-  'border-100': 'border-orange-100',
-  'border-400': 'border-orange-400',
-  'button-bg': 'bg-[#2a1b10]',
+  'hover-button-bg': 'hover:bg-[#111111]',
 };
 
 export const colorMappings = {