From d16fc5b10702747f10d48abc322496effcee72f5 Mon Sep 17 00:00:00 2001
From: DarkPhoenix2704 <anbarasun123@gmail.com>
Date: Wed, 2 Oct 2024 05:54:25 +0000
Subject: [PATCH] fix: color and font size corrections

---
 packages/nc-gui/assets/nc-icons/nocodb.svg    | 13 +++++++++++++
 .../nc-gui/components/feed/Recents/Card.vue   | 19 ++++++++++---------
 packages/nc-gui/components/feed/Social.vue    |  2 +-
 .../nc-gui/components/feed/Youtube/Player.vue | 12 +++---------
 packages/nc-gui/utils/iconUtils.ts            |  2 ++
 5 files changed, 29 insertions(+), 19 deletions(-)
 create mode 100644 packages/nc-gui/assets/nc-icons/nocodb.svg

diff --git a/packages/nc-gui/assets/nc-icons/nocodb.svg b/packages/nc-gui/assets/nc-icons/nocodb.svg
new file mode 100644
index 0000000000..8e33b7798d
--- /dev/null
+++ b/packages/nc-gui/assets/nc-icons/nocodb.svg
@@ -0,0 +1,13 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g id="Frame">
+<path id="Vector" d="M16.6797 1H3.32031C2.03884 1 1 2.03884 1 3.32031V16.6797C1 17.9612 2.03884 19 3.32031 19H16.6797C17.9612 19 19 17.9612 19 16.6797V3.32031C19 2.03884 17.9612 1 16.6797 1Z" fill="white"/>
+<path id="Vector_2" d="M16.6797 1H3.32031C2.03884 1 1 2.03884 1 3.32031V16.6797C1 17.9612 2.03884 19 3.32031 19H16.6797C17.9612 19 19 17.9612 19 16.6797V3.32031C19 2.03884 17.9612 1 16.6797 1Z" fill="url(#paint0_linear_304_21100)"/>
+<path id="Vector_3" d="M4.86719 9.50131L7.31271 11.9484V15.8224H4.86719V9.50131ZM15.139 4.29891V15.4234C15.139 15.6518 14.9527 15.8365 14.7244 15.8365C14.6148 15.8365 14.51 15.7942 14.4318 15.716L4.86719 7.0902V4.64938C4.86719 4.42094 5.05182 4.23633 5.28025 4.23633H5.30217C5.41169 4.23633 5.51807 4.28014 5.59474 4.35681L12.6919 10.5151V4.29891H15.139Z" fill="white"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_304_21100" x1="9.99859" y1="25.0599" x2="9.99859" y2="-4.04602" gradientUnits="userSpaceOnUse">
+<stop stop-color="#4351E8"/>
+<stop offset="1" stop-color="#2A1EA5"/>
+</linearGradient>
+</defs>
+</svg>
diff --git a/packages/nc-gui/components/feed/Recents/Card.vue b/packages/nc-gui/components/feed/Recents/Card.vue
index 90024fca14..e9521bc1a4 100644
--- a/packages/nc-gui/components/feed/Recents/Card.vue
+++ b/packages/nc-gui/components/feed/Recents/Card.vue
@@ -32,7 +32,7 @@ const renderedText = computedAsync(async () => {
     .use(rehypeStringify)
     .process(
       Description.replace(/!\[.*?\]\(.*?\)/g, '')
-        .substring(0, 300)
+        .substring(0, 250)
         .concat('...')
         .concat(`&nbsp;   [Read more](${Url})`),
     )
@@ -44,11 +44,11 @@ const renderedText = computedAsync(async () => {
     <div class="flex items-center justify-between px-5 py-4">
       <div class="flex items-center gap-3">
         <component :is="feedIcon[source as any]" class="w-4 h-4 stroke-transparent" />
-        <span class="font-weight-medium leading-5 cursor-pointer" @click="openLink(Url)">
+        <span class="font-weight-medium text-nc-content-gray leading-5 cursor-pointer" @click="openLink(Url)">
           {{ source }}
         </span>
       </div>
-      <div class="text-sm text-gray-700 leading-5">
+      <div class="text-sm text-nc-content-gray-muted leading-5">
         {{ timeAgo(CreatedAt) }}
       </div>
     </div>
@@ -63,12 +63,12 @@ const renderedText = computedAsync(async () => {
     </template>
     <template v-else-if="source === 'Youtube'">
       <YoutubeVue3 :videoid="extractYoutubeVideoId(Url)" :controls="1" :height="330" :width="538" :autoplay="0" />
-      <div class="p-5 flex flex-col text-gray-900 gap-4">
-        <div class="text-2xl font-semibold">
+      <div class="p-5 flex flex-col text-nc-content-gray-emphasis gap-4">
+        <div class="text-2xl font-semibold truncate">
           {{ Title }}
         </div>
 
-        <div class="font-weight-base">
+        <div class="font-weight-base text-md">
           {{ Description.substring(0, 200).concat('...') }}
         </div>
       </div>
@@ -85,11 +85,12 @@ const renderedText = computedAsync(async () => {
     }
 
     h1 {
-      @apply text-2xl font-semibold truncate;
-      font-weight: 500;
+      @apply text-2xl text-nc-content-gray-emphasis truncate leading-9 mb-0;
+      font-weight: 700;
     }
     p {
-      @apply text-md text-nc-content-gray-emphasis leading-6;
+      @apply text-nc-content-gray-emphasis leading-5;
+      font-size: 14px !important;
     }
   }
 }
diff --git a/packages/nc-gui/components/feed/Social.vue b/packages/nc-gui/components/feed/Social.vue
index 5ce6ed6958..0085367e57 100644
--- a/packages/nc-gui/components/feed/Social.vue
+++ b/packages/nc-gui/components/feed/Social.vue
@@ -22,7 +22,7 @@ const socialIcons = [
   },
   {
     name: 'Forum',
-    icon: iconMap.langNocodbSdk,
+    icon: iconMap.nocodb,
     link: 'https://forum.nocodb.com/',
   },
 ]
diff --git a/packages/nc-gui/components/feed/Youtube/Player.vue b/packages/nc-gui/components/feed/Youtube/Player.vue
index 2e4684c27d..1714de0b34 100644
--- a/packages/nc-gui/components/feed/Youtube/Player.vue
+++ b/packages/nc-gui/components/feed/Youtube/Player.vue
@@ -24,11 +24,11 @@ const {
       :controls="1"
     />
 
-    <div class="flex flex-col p-5 gap-4">
-      <div class="text-gray-900 font-bold text-2xl">
+    <div class="text-nc-content-gray-emphasis flex flex-col p-5 gap-4">
+      <div class="font-bold leading-9 text-2xl">
         {{ Title }}
       </div>
-      <div class="text-gray-900">
+      <div class="text-md leading-5">
         {{ Description.length > 200 ? `${Description.slice(0, 280)}...` : Description }}
       </div>
     </div>
@@ -36,12 +36,6 @@ const {
 </template>
 
 <style scoped lang="scss">
-.prose {
-  a {
-    @apply !text-gray-900;
-  }
-}
-
 .recent-card {
   box-shadow: 0px 4px 8px -2px rgba(0, 0, 0, 0.08), 0px 2px 4px -2px rgba(0, 0, 0, 0.04);
 }
diff --git a/packages/nc-gui/utils/iconUtils.ts b/packages/nc-gui/utils/iconUtils.ts
index d33a85968f..bb86a06310 100644
--- a/packages/nc-gui/utils/iconUtils.ts
+++ b/packages/nc-gui/utils/iconUtils.ts
@@ -219,6 +219,7 @@ import NcGitCommit from '~icons/nc-icons/git-commit'
 import NcCircle from '~icons/nc-icons/circle'
 import NcServer1 from '~icons/nc-icons/server1'
 import NcThumbsUpOutline from '~icons/nc-icons/thumbs-up-outline'
+import NcNocoDB from '~icons/nc-icons/nocodb'
 
 // Sync data
 import NcAppleSolid from '~icons/nc-icons/apple_solid'
@@ -763,6 +764,7 @@ export const iconMap = {
   cellButton: NcCellButton,
   camera: NcCamera,
   megaPhone: NcMegaPhone,
+  nocodb: NcNocoDB,
 
   office: NcOffice,
   sort: Sort,