Update component text color, update snapshots

adamplesnik · May 16, 2024 · 7457d88 · 7457d88
1 parent 3079b02
commit 7457d88
Show file tree

Hide file tree

Showing 6 changed files with 12 additions and 21 deletions.
diff --git a/index.html b/index.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html lang="en" class="bg-zinc-900 text-gray-400">
+<html lang="en" class="bg-zinc-100 text-zinc-700">
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />

diff --git a/src/components/Heading.tsx b/src/components/Heading.tsx
@@ -7,7 +7,7 @@ const Heading = ({
   children,
   id = '',
 }: PropsWithChildren<TitleProps>) => {
-  const defaultClasses = 'relative w-full font-medium text-zinc-200' + addWithSpace(className)
+  const defaultClasses = 'relative w-full font-medium text-zinc-950' + addWithSpace(className)
   const anchor = id ? <a id={id} className={'absolute -top-32'} /> : ''
   if (size === 1) {
     return (
@@ -32,7 +32,7 @@ const Heading = ({
     )
   } else {
     return (
-      <h4 className={defaultClasses + ' pb-6 text-sm opacity-50'}>
+      <h4 className={defaultClasses + ' pb-4 font-serif text-sm italic opacity-50'}>
         {children}
         {anchor}
       </h4>

diff --git a/src/components/Tile.tsx b/src/components/Tile.tsx
@@ -9,12 +9,7 @@ const Tile = ({
   subTitle,
 }: PropsWithChildren<TileWrapperProps>) => {
   return (
-    <div
-      className={
-        'overflow-hidden rounded-lg border border-zinc-600/20 bg-gradient-to-tr from-zinc-800/20 to-zinc-800/40 px-6 pb-4 pt-8 shadow-2xl' +
-        addWithSpace(className)
-      }
-    >
+    <div className={'' + addWithSpace(className)}>
       <Heading size={3}>{title}</Heading>
       <Heading size={4}>{subTitle}</Heading>
       {children}

diff --git a/src/components/__snapshots__/Tile.test.tsx.snap b/src/components/__snapshots__/Tile.test.tsx.snap
@@ -2,15 +2,15 @@
 
 exports[`Tile 1`] = `
 <div
-  className="overflow-hidden rounded-lg border border-zinc-600/20 bg-gradient-to-tr from-zinc-800/20 to-zinc-800/40 px-6 pb-4 pt-8 shadow-2xl"
+  className=""
 >
   <h3
-    className="relative w-full font-medium text-zinc-200 pb-4 text-xl opacity-90"
+    className="relative w-full font-medium text-zinc-950 pb-4 text-xl opacity-90"
   >
     Test Title
   </h3>
   <h4
-    className="relative w-full font-medium text-zinc-200 pb-6 text-sm opacity-50"
+    className="relative w-full font-medium text-zinc-950 pb-6 text-sm opacity-50"
   >
     Test Subtitle
   </h4>
@@ -20,15 +20,15 @@ exports[`Tile 1`] = `
 
 exports[`Tile with class name 1`] = `
 <div
-  className="overflow-hidden rounded-lg border border-zinc-600/20 bg-gradient-to-tr from-zinc-800/20 to-zinc-800/40 px-6 pb-4 pt-8 shadow-2xl test-class"
+  className=" test-class"
 >
   <h3
-    className="relative w-full font-medium text-zinc-200 pb-4 text-xl opacity-90"
+    className="relative w-full font-medium text-zinc-950 pb-4 text-xl opacity-90"
   >
     Test Title
   </h3>
   <h4
-    className="relative w-full font-medium text-zinc-200 pb-6 text-sm opacity-50"
+    className="relative w-full font-medium text-zinc-950 pb-6 text-sm opacity-50"
   >
     Test Subtitle
   </h4>

diff --git a/src/content/InfoTile.tsx b/src/content/InfoTile.tsx
@@ -9,10 +9,8 @@ const InfoTile = () => {
     <div className="flex flex-col items-start gap-4 p-2 sm:flex-row">
       <Photo />
       <div>
-        <Heading size={1} className="text-slate-300">
-          Adam Plesník, design engineer based in Bratislava, Slovakia.
-        </Heading>
-        <Heading size={1} className="text-slate-300">
+        <Heading size={1}>Adam Plesník, design engineer based in Bratislava, Slovakia.</Heading>
+        <Heading size={1}>
           I love creating, polishing and improving user interfaces, with focus on{' '}
           <span className="stroke relative whitespace-nowrap">
             <ScratchAnim />

diff --git a/src/layouts/Page.tsx b/src/layouts/Page.tsx
@@ -1,11 +1,9 @@
 import { PropsWithChildren } from 'react'
-import PageBackground from '../components/PageBackground'
 import Footer from '../content/Footer'
 
 const Page = ({ children }: PropsWithChildren<PageProps>) => {
   return (
     <div className="flex w-screen justify-center">
-      <PageBackground />
       <div className="relative mb-12 flex w-full max-w-screen-md flex-col gap-8 overflow-hidden p-8 pt-12 md:gap-12">
         {children}
         <Footer />