From 718f6b50bd33a5a4e4600e698679310d6b52c1bb Mon Sep 17 00:00:00 2001
From: JATIN <Jatin04072005@gmail.com>
Date: Wed, 15 Apr 2026 02:21:03 +0530
Subject: [PATCH 1/2] adding new class and tab setting enable for this

---
 .../IDE/components/SketchListRowBase.jsx      | 22 +++++++++++++++++--
 client/styles/abstracts/_variables.scss       |  1 +
 client/styles/components/_sketch-list.scss    |  5 +++++
 3 files changed, 26 insertions(+), 2 deletions(-)

diff --git a/client/modules/IDE/components/SketchListRowBase.jsx b/client/modules/IDE/components/SketchListRowBase.jsx
index a12ce5dee5..b6afc0f0b7 100644
--- a/client/modules/IDE/components/SketchListRowBase.jsx
+++ b/client/modules/IDE/components/SketchListRowBase.jsx
@@ -126,8 +126,26 @@ const SketchListRowBase = ({
   return (
     <tr className="sketches-table__row">
       <th scope="row">{name}</th>
-      <td>{formatDateCell(sketch.createdAt, mobile)}</td>
-      <td>{formatDateCell(sketch.updatedAt, mobile)}</td>
+      <td
+        className="sketches-table__date-cell"
+        tabIndex={0}
+        aria-label={`${t('SketchList.HeaderCreatedAt')}: ${formatDateCell(
+          sketch.createdAt,
+          mobile
+        )}`}
+      >
+        {formatDateCell(sketch.createdAt, mobile)}
+      </td>
+      <td
+        className="sketches-table__date-cell"
+        tabIndex={0}
+        aria-label={`${t('SketchList.HeaderUpdatedAt')}: ${formatDateCell(
+          sketch.updatedAt,
+          mobile
+        )}`}
+      >
+        {formatDateCell(sketch.updatedAt, mobile)}
+      </td>
       <td hidden={!userIsOwner || mobile}>
         <VisibilityDropdown
           sketch={sketch}
diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss
index b1eebc3011..19f956ac93 100644
--- a/client/styles/abstracts/_variables.scss
+++ b/client/styles/abstracts/_variables.scss
@@ -53,6 +53,7 @@ $themes: (
     console-header-background-color: $medium-light,
     console-header-color: $darker,
     console-input-background-color: $lightest,
+    date-created-updated: $outline-color,
     editor-gutter-color: $lighter,
     error-color: $p5js-pink,
     file-hover-color: $light,
diff --git a/client/styles/components/_sketch-list.scss b/client/styles/components/_sketch-list.scss
index e49b5eeffa..e5e93bb94e 100644
--- a/client/styles/components/_sketch-list.scss
+++ b/client/styles/components/_sketch-list.scss
@@ -297,4 +297,9 @@
     color: getThemifyVariable("logo-color");
   }
   text-decoration-thickness: 0.1em;
+}
+.sketches-table__date-cell:focus-visible {
+  outline: 2px solid #53d2f7;
+  outline-offset: 2px;
+  border-radius: 2px;
 }
\ No newline at end of file

From 891dc6066b89ac8b6d870155210b0486dc331bb2 Mon Sep 17 00:00:00 2001
From: JATIN <Jatin04072005@gmail.com>
Date: Wed, 15 Apr 2026 02:29:37 +0530
Subject: [PATCH 2/2] adding color  to ring

---
 client/styles/abstracts/_variables.scss    | 2 +-
 client/styles/components/_sketch-list.scss | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/client/styles/abstracts/_variables.scss b/client/styles/abstracts/_variables.scss
index 19f956ac93..40996c75f8 100644
--- a/client/styles/abstracts/_variables.scss
+++ b/client/styles/abstracts/_variables.scss
@@ -53,7 +53,6 @@ $themes: (
     console-header-background-color: $medium-light,
     console-header-color: $darker,
     console-input-background-color: $lightest,
-    date-created-updated: $outline-color,
     editor-gutter-color: $lighter,
     error-color: $p5js-pink,
     file-hover-color: $light,
@@ -152,6 +151,7 @@ $themes: (
     console-header-background-color: $medium-dark,
     console-header-color: $lightest,
     console-input-background-color: $darker,
+    date-created-updated:$outline-color,
     editor-gutter-color: $darker,
     error-color: $p5js-pink,
     file-hover-color: $dark,
diff --git a/client/styles/components/_sketch-list.scss b/client/styles/components/_sketch-list.scss
index e5e93bb94e..9f24d196ec 100644
--- a/client/styles/components/_sketch-list.scss
+++ b/client/styles/components/_sketch-list.scss
@@ -299,7 +299,7 @@
   text-decoration-thickness: 0.1em;
 }
 .sketches-table__date-cell:focus-visible {
-  outline: 2px solid #53d2f7;
+  outline: 2px solid #0F9DD7;
   outline-offset: 2px;
   border-radius: 2px;
 }
\ No newline at end of file