Styling changes.

itsjesski · Aug 18, 2024 · b72cd17 · b72cd17
1 parent aa82f4d
commit b72cd17
Show file tree

Hide file tree

Showing 6 changed files with 22 additions and 14 deletions.
diff --git a/src/components/GameAwardGallery.tsx b/src/components/GameAwardGallery.tsx
@@ -27,9 +27,9 @@ const GameAwardGallery: React.FC<{ year: string }> = ({ year }) => (
   <>
     <section className="game-gallery gallery-widget flex-auto w-2/5 md:w--full m-2">
       <div className="gallery-title mb-3 border-b-slate-700 border-solid border-b-2 pb-2 pl-2 pr-2">
-        <h1 className="mb-0">
+        <h2 className="mb-0">
           Best Games of <span className="text-cstyle-highlight">{year}</span>
-        </h1>
+        </h2>
       </div>
       <div className="gallery-content">
         <GameCardList year={year}></GameCardList>

diff --git a/src/components/GameGallery.tsx b/src/components/GameGallery.tsx
@@ -38,9 +38,9 @@ const GameGallery = () => (
   <>
     <section className="game-gallery gallery-widget mb-32">
       <div className="gallery-title mb-3 flex justify-between items-end flex-wrap pl-2 pr-2">
-        <h1 className="mb-0">
+        <h2 className="mb-0">
           Recent <span className="text-cstyle-highlight">Games</span>
-        </h1>
+        </h2>
         <div className="text-sm text-gray-400 font-bold">
           <Link href="/games">View All Games {'>'}</Link>
         </div>

diff --git a/src/components/PageIntroBox.tsx b/src/components/PageIntroBox.tsx
@@ -65,7 +65,7 @@ const PageIntroBox: React.FC<{}> = (props) => {
       {streamIsOnline && (
         <div className="pl-2 grid grid-cols-12 gap-4">
           <div className="col-span-12 md:col-span-9 lg:col-span-10">
-            <h1 className="text-cstyle-highlight">Jesski is live!</h1>
+            <h1 className="text-cstyle-highlight">Jesski is live on Twitch!</h1>
             <p>
               The Twitch stream is on air right now, and you&apos;re missing
               out! If you&apos;d like to join in and become part of the

diff --git a/src/pages/games/[slug].tsx b/src/pages/games/[slug].tsx
@@ -107,7 +107,7 @@ const GameDetailsPage: React.FC<{ post: GameDetails }> = (props) => {
         }}
       >
         <div className="bg-cstyle-text pl-20 pr-20 pt-10 pb-10 shadow-steam">
-          <h1 className="text-center font-bold text-3xl text-cstyle-highlight text-shadow-lg">
+          <h1 className="text-center font-bold text-3xl text-cstyle-highlight text-shadow-lg before:content-none">
             {props.post?.title}
           </h1>
         </div>

diff --git a/src/pages/index.tsx b/src/pages/index.tsx
@@ -11,13 +11,13 @@ const Index = () => (
   <Main meta={<Meta title="Home" description={AppConfig.description} />}>
     <Content>
       <PageIntroBox>
-        <h1 className="text-cstyle-highlight">Hello!</h1>
+        <h1 className="text-cstyle-highlight">Hi, my name is Jessica.</h1>
         <p>
-          You&apos;ve entered the world of Jesski. Here you&apos;ll find tidbits
-          from all of my different passions from video games, to development,
-          books, entertainment, and more. This site serves as a hub for my
-          ramblings and sharing info with amazing friends I&apos;ve met while
-          pursuing all of these fun hobbies.
+          You&apos;ve entered the world of Jesski, aka Jessica. Here you&apos;ll
+          find tidbits from all of my different passions from video games, to
+          web development, books, entertainment, and more. This site serves as a
+          hub for my ramblings and sharing info with amazing friends I&apos;ve
+          met while pursuing all of these fun hobbies.
         </p>
       </PageIntroBox>
       <GameGallery></GameGallery>

diff --git a/src/styles/main.css b/src/styles/main.css
@@ -5,11 +5,19 @@ h1 {
 }
 
 h2 {
-  @apply text-xl font-semibold
+  @apply text-xl font-semibold before:content-[url('/assets/images/stickers/5.png')] before:object-contain before:inline-block before:relative before:-bottom-3
 }
 
 h3 {
-  @apply text-base font-semibold;
+  @apply text-base font-semibold before:content-[url('/assets/images/stickers/8.png')] before:object-contain before:inline-block before:relative before:-bottom-3;
+}
+
+h4 {
+  @apply text-base font-semibold before:content-[url('/assets/images/stickers/7.png')] before:object-contain before:inline-block before:relative before:-bottom-3;
+}
+
+h5 {
+  @apply text-base font-semibold before:content-[url('/assets/images/stickers/6.png')] before:object-contain before:inline-block before:relative before:-bottom-3;
 }
 
 a {