From 22ff5ef58293d34b4859e4cf44b080e98eb3159c Mon Sep 17 00:00:00 2001
From: Saviru Kashmira <savirukashmira@gmail.com>
Date: Fri, 8 Aug 2025 18:32:34 +0530
Subject: [PATCH 1/3] Added watchdogGradient Theme

Added watchdogGradient Theme
---
 src/OGCard.tsx      |  6 ++--
 src/decorations.tsx | 74 +++++++++++++++++++++++++++++++++++++++++++++
 src/theme.ts        | 31 ++++++++++++++++++-
 3 files changed, 107 insertions(+), 4 deletions(-)

diff --git a/src/OGCard.tsx b/src/OGCard.tsx
index 78f87a9..fd7b47c 100644
--- a/src/OGCard.tsx
+++ b/src/OGCard.tsx
@@ -1,7 +1,7 @@
 import { Rating } from './rating'
 import { preset, type Theme } from './theme'
 import { GitRollLogo } from './logo'
-import { DarkEmeraldDecoration, KawaiiCatDecoration, RetroThemeDecoration } from './decorations'
+import { DarkEmeraldDecoration, KawaiiCatDecoration, RetroThemeDecoration, WatchdogGradientDecoration } from './decorations'
 
 
 export interface OGCardProps {
@@ -39,7 +39,7 @@ export function OGCard({
         width: '100%',
         height: '100%',
         backgroundColor: theme.backgroundColor,
-        backgroundImage: theme === preset.darkEmerald ? theme.backgroundColor : '',
+        backgroundImage: theme === preset.darkEmerald || theme === preset.WatchdogGradient ? theme.backgroundColor : '',
         color: theme.textColor,
         borderRadius: '10px',
       }}
@@ -153,7 +153,7 @@ export function OGCard({
                 position: 'relative'
               }}
             >
-              {theme === preset.darkEmerald && (<DarkEmeraldDecoration color={bg} rating={overallRating}/>)}
+              {theme === preset.darkEmerald && (<DarkEmeraldDecoration color={bg} rating={overallRating}/>)} || {theme === preset.WatchdogGradient && (<WatchdogGradientDecoration color={bg} rating={overallRating}/>)}
               <div
                 id='overall-rating'
                 style={{
diff --git a/src/decorations.tsx b/src/decorations.tsx
index d71451d..a163811 100644
--- a/src/decorations.tsx
+++ b/src/decorations.tsx
@@ -8,6 +8,12 @@ interface DarkEmeraldDecorationProps {
   color: string;
   rating: string;
 }
+
+interface WatchdogGradientDecorationProps {
+  color: string;
+  rating: string;
+}
+
 export function KawaiiCatDecoration({ color }: KawaiiCatDecorationProps) {
   return (
     <svg
@@ -193,3 +199,71 @@ export function DarkEmeraldDecoration({ color, rating }: DarkEmeraldDecorationPr
     </svg>
   )
 }
+
+export function WatchdogGradientDecoration({ color, rating }: WatchdogGradientDecorationProps) {
+  let endColor=''
+  switch(rating) {
+    case 'S':
+      endColor = '#1e1b4b'
+      break
+    case 'A':
+      endColor = '#052e16'
+      break
+    case 'B':
+      endColor = '#1a2e05'
+      break
+    case 'C':
+      endColor = '#431407'
+      break
+    case 'D':
+      endColor = '#450a0a'
+      break
+    default:
+      endColor = '#030712'
+      break
+  }
+  return (
+    <svg
+      width='80'
+      height='80'
+      viewBox='0 0 80 80'
+      xmlns='http://www.w3.org/2000/svg'
+      style={{
+        position: 'absolute'
+      }}
+    >
+      <defs>
+        <radialGradient id='shine' cx='0.3' cy='0.3' r='0.8'>
+          <stop offset='0%' stop-color={color} />
+          <stop offset='100%' stop-color={endColor} />
+        </radialGradient>
+        <pattern
+          id='retro-grid'
+          width='20'
+          height='20'
+          patternUnits='userSpaceOnUse'
+        >
+          <path
+            d='M 20 0 L 0 0 0 20'
+            fill='none'
+            stroke='white'
+            stroke-width='0.5'
+            opacity='0.2'
+          />
+        </pattern>
+      </defs>
+      <rect width='80' height='80' fill='url(#shine)' rx='1000' />
+      <rect width='80' height='80' fill='url(#retro-grid)' rx='1000' />
+      <g fill='white' opacity='0.4'>
+        <path
+          transform='translate(20, 20) scale(0.3)'
+          d='M10 0 L13 7 L21 7 L15 13 L17 21 L10 17 L3 21 L5 13 L-1 7 L7 7Z'
+        />
+        <path
+          transform='translate(60, 25) scale(0.25)'
+          d='M10 0 L13 7 L21 7 L15 13 L17 21 L10 17 L3 21 L5 13 L-1 7 L7 7Z'
+        />
+      </g>
+    </svg>
+  )
+}
\ No newline at end of file
diff --git a/src/theme.ts b/src/theme.ts
index cdafed4..09c6226 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -336,6 +336,34 @@ const dracula = {
   avatarPlaceholderColor: '#6272A4',
   logoColor: '#F8F8F2',
 }
+
+const WatchdogGradient = {
+  backgroundColor: 'linear-gradient(to top left, #520806, #021D4A, #520806)',
+  textColor: '#ffffffff',
+  textColorSecondary: '#A9FEF7',
+  badgeColors: {
+    [Rating.S]: '#a78bfa',
+    [Rating.A]: '#4ade80',
+    [Rating.B]: '#a3e635',
+    [Rating.C]: '#fb923c',
+    [Rating.D]: '#f87171',
+    [Rating.E]: '#6b7280',
+  },
+  badgeTextColors: {
+    [Rating.S]: '#F8D847',
+    [Rating.A]: '#F8D847',
+    [Rating.B]: '#F8D847',
+    [Rating.C]: '#F8D847',
+    [Rating.D]: '#F8D847',
+    [Rating.E]: '#FF0000',
+  },
+  barBackground: '#F4F4F5',
+  barForeground: '#EB8C30',
+  borderColor: '#E4E2E2',
+  avatarPlaceholderColor: '#FE428E',
+  logoColor: '#EB8C30',
+}
+
 export const preset: Record<string, Theme> = {
   light,
   dark,
@@ -348,5 +376,6 @@ export const preset: Record<string, Theme> = {
   kawaiiCat,
   retro,
   darkEmerald,
-  dracula
+  dracula,
+  WatchdogGradient
 }

From aacc791c9aa3b33526e7afce16090272579fb551 Mon Sep 17 00:00:00 2001
From: Saviru Kashmira <savirukashmira@gmail.com>
Date: Fri, 8 Aug 2025 18:44:29 +0530
Subject: [PATCH 2/3] Rating color update

---
 src/theme.ts | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/theme.ts b/src/theme.ts
index 09c6226..e2f5e51 100644
--- a/src/theme.ts
+++ b/src/theme.ts
@@ -350,11 +350,11 @@ const WatchdogGradient = {
     [Rating.E]: '#6b7280',
   },
   badgeTextColors: {
-    [Rating.S]: '#F8D847',
-    [Rating.A]: '#F8D847',
-    [Rating.B]: '#F8D847',
-    [Rating.C]: '#F8D847',
-    [Rating.D]: '#F8D847',
+    [Rating.S]: '#021029ff',
+    [Rating.A]: '#021029ff',
+    [Rating.B]: '#021029ff',
+    [Rating.C]: '#021029ff',
+    [Rating.D]: '#021029ff',
     [Rating.E]: '#FF0000',
   },
   barBackground: '#F4F4F5',

From 88bf9cdc19ab25bb3a92cfb27d810492a3ef2ff9 Mon Sep 17 00:00:00 2001
From: Saviru Kashmira Atapattu <savirukashmira@gmail.com>
Date: Sun, 10 Aug 2025 16:44:57 +0530
Subject: [PATCH 3/3] WatchdogGradient theme Rank alignment fixes

---
 src/OGCard.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/OGCard.tsx b/src/OGCard.tsx
index fd7b47c..b2ca22a 100644
--- a/src/OGCard.tsx
+++ b/src/OGCard.tsx
@@ -1,7 +1,7 @@
 import { Rating } from './rating'
 import { preset, type Theme } from './theme'
 import { GitRollLogo } from './logo'
-import { DarkEmeraldDecoration, KawaiiCatDecoration, RetroThemeDecoration, WatchdogGradientDecoration } from './decorations'
+import { WatchdogGradientDecoration, DarkEmeraldDecoration, KawaiiCatDecoration, RetroThemeDecoration } from './decorations'
 
 
 export interface OGCardProps {
@@ -153,7 +153,7 @@ export function OGCard({
                 position: 'relative'
               }}
             >
-              {theme === preset.darkEmerald && (<DarkEmeraldDecoration color={bg} rating={overallRating}/>)} || {theme === preset.WatchdogGradient && (<WatchdogGradientDecoration color={bg} rating={overallRating}/>)}
+              {theme === preset.darkEmerald && (<DarkEmeraldDecoration color={bg} rating={overallRating}/>) || theme === preset.WatchdogGradient && (<WatchdogGradientDecoration color={bg} rating={overallRating}/>)}
               <div
                 id='overall-rating'
                 style={{