Issue #SB-30663 merge: Merge pull request #98 from sri-pusuluri/release-5.0.0_mobile

Issue #SB-30663 fix: Ios: The UI issue in the group discussion forum …

package.json

 {
   "name": "@project-sunbird/sb-themes",
-  "version": "0.0.80",
+  "version": "0.0.81",
   "description": "Sunbird project application themes",
   "main": "index.js",
   "scripts": {

themes/themes-df.scss

@@ -3,7 +3,7 @@
 // Joy Theme
 html[layout="joy"] {
   --primary-hs: 210, 97%; // template primary color // #024f9d
-  --primary: hsl(var(--primary-hs), 31%);  
+  --primary: hsl(var(--primary-hs), 31%);
   --df-common-bg: var(--df-e9e8d9);
 }
 
@@ -14,9 +14,9 @@ html[data-theme="Green"] {
   --df-common-bg: var(--primary-100);
   --df-body-bg: var(--primary-0); // body bg
 
-    img {
-      filter: unset;
-   }
+  img {
+    filter: unset;
+  }
 }
 
 // Orange Theme
@@ -24,15 +24,17 @@ html[data-theme="Orange"] {
   --primary-hs: 32, 91%; // template primary color // #e57f0b
   --primary: hsl(var(--primary-hs), 47%);
   --df-common-bg: var(--primary-100);
-  --df-body-bg: var(--primary-0); // body bg 
+  --df-body-bg: var(--primary-0); // body bg
 
-  .category-card .category-card-main .eye-icon , .bookmark-icon{
+  .category-card .category-card-main .eye-icon,
+  .bookmark-icon {
     filter: invert(1);
   }
 }
 
 // Dark Mode
-html[data-theme="Darkmode"]{
+html[data-theme="Darkmode"],
+html[data-theme="JOYFUL"][data-mode="DARKMODE"] {
   // Dark Theme color variation
   --primary-hs: 49, 100%; // template primary color // #ffd829
   --primary: hsl(var(--primary-hs), 58%);
@@ -53,36 +55,52 @@ html[data-theme="Darkmode"]{
   --df-tab-text: var(--text-color);
   --df-btn-default-color: var(--black);
   --df-tag-bg: var(--black);
-}
 
-//specific classes for dark theme
-html[data-theme="Darkmode"] {
+  --open-btn-bg: var(--df-222);
+  --open-btn-color: var(--white);
+
   lib-lib-entry {
     .df-header img {
       filter: unset !important;
     }
 
-  .discussion-forum-content .discuss-right-panel {
+    .discussion-forum-content .discuss-right-panel {
       background: var(--df-common-bg);
       padding: 1rem;
     }
 
     .df-cancel-btn:hover,
     .df-cancel-btn:active {
-        color: var(--black);
-        background-color: var(--primary-800);
-      }
-    
+      color: var(--black);
+      background-color: var(--primary-800);
+    }
+
     img {
       filter: invert(1);
     }
+
+    .tag-empty-container .tag-empty-label,
+    .tag-empty-container .tag-empty-text {
+      color: var(--white) !important;
+    }
+    .df-dimmer-alert-modal .df-alert-modal .df-alert-modal-buttons {
+      border-top: none;
+    }
+    .df-dimmer-alert-modal .df-alert-modal .df-alert-modal-header {
+      color: #000;
+    }
+    dt-app-loader-container,
+    .dt-app-loader-container .df-dimmer-alert-modal .df-alert-modal,
+    df-alert-modal-buttons {
+      background: #333;
+    }
   }
 }
 
 //specific classes for joy theme
 html[layout="joy"] {
   lib-lib-entry {
-    .df-header{
+    .df-header {
       border-radius: 1.5rem;
     }