From 1a2f6eb839ba08948b305ea93878f604698d7f4e Mon Sep 17 00:00:00 2001
From: RealTimeX <154565560+therealtimex@users.noreply.github.com>
Date: Sun, 1 Dec 2024 04:41:12 +0700
Subject: [PATCH] Add files via upload

---
 css/rt-dmview-css-min.css | 84 +++++++++++++++++++++++++--------------
 1 file changed, 55 insertions(+), 29 deletions(-)

diff --git a/css/rt-dmview-css-min.css b/css/rt-dmview-css-min.css
index 29d340a..e70381d 100644
--- a/css/rt-dmview-css-min.css
+++ b/css/rt-dmview-css-min.css
@@ -28,7 +28,9 @@ body {
 }
 
 /* Box Sizing Reset */
-*, *:before, *:after {
+*,
+*:before,
+*:after {
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
     box-sizing: border-box;
@@ -102,7 +104,7 @@ body {
 }
 
 /* Tab Pill Styles */
-#dm-tab-pill .nav-pills > li > a {
+#dm-tab-pill .nav-pills>li>a {
     border-radius: 6px 6px 0 0;
 }
 
@@ -111,22 +113,28 @@ body {
     padding: 0 0;
 }
 
-#dm-tab-pill .nav-pills > li > a {
+#dm-tab-pill .nav-pills>li>a {
     border-radius: 6px 6px 0 0;
-    background-color: var(__color_theme_surface); /* Inactive tab background */
-    color: var(__color_theme_link); /* Inactive tab text */
+    background-color: var(__color_theme_surface);
+    /* Inactive tab background */
+    color: var(__color_theme_link);
+    /* Inactive tab text */
 }
 
-#dm-tab-pill .nav-pills > li.active > a,
-#dm-tab-pill .nav-pills > li.active > a:focus,
-#dm-tab-pill .nav-pills > li.active > a:hover {
-    background-color: var(__color_theme_accent); /* Active tab background */
-    color: var(__color_theme_text_primary); /* Active tab text */
+#dm-tab-pill .nav-pills>li.active>a,
+#dm-tab-pill .nav-pills>li.active>a:focus,
+#dm-tab-pill .nav-pills>li.active>a:hover {
+    background-color: var(__color_theme_accent);
+    /* Active tab background */
+    color: var(__color_theme_text_primary);
+    /* Active tab text */
 }
 
-#dm-tab-pill .nav-pills > li > a:hover {
-    background-color: var(__color_theme_surface); /* Hover tab background */
-    color: var(__color_theme_accent); /* Hover tab text */
+#dm-tab-pill .nav-pills>li>a:hover {
+    background-color: var(__color_theme_surface);
+    /* Hover tab background */
+    color: var(__color_theme_accent);
+    /* Hover tab text */
 }
 
 
@@ -162,23 +170,29 @@ label::before {
 }
 
 
-   /* Tab Navigation Styles */
-   .nav-pills .nav-link {
-    background-color: var(--color_theme_surface);  /* Inactive tabs use secondary color */
-    color: var(--color_theme_primary);                     /* White text for contrast */
-   /* margin-right: 0.5rem;               /* Space between tabs */
-   /* transition: all 0.2s ease-in-out;   /* Smooth transition for interactions */
+/* Tab Navigation Styles */
+.nav-pills .nav-link {
+    background-color: var(--color_theme_neutral_light);
+    color: var(--color_theme_text_secondary);
+    padding: var(--spacing-small);
+    border-radius: 4px 4px 0 0;
+    border-bottom: 2px solid transparent;
 }
 
 .nav-pills .nav-link.active {
-    background-color: var(--color_theme_primary);    /* Active tab uses primary red */
-    color: var(--color_theme_text_primary);                      /* White text for contrast */
+    background-color: var(--color_theme_accent);
+    /* Active tab uses primary red */
+    color: var(--color_theme_text_primary);
+    /* White text for contrast */
 }
 
 /* Hover states */
 .nav-pills .nav-link:hover {
-    opacity: 0.9;                        /* Subtle hover effect */
-    transform: translateY(-1px);         /* Slight lift effect */
+    background-color: var(--color_theme_neutral_medium);
+    opacity: 0.9;
+    /* Subtle hover effect */
+    transition: background-color 0.2s ease;
+    /* Slight lift effect */
 }
 
 /* Focus visible styles */
@@ -195,28 +209,40 @@ label::before {
 
 .nav-pills {
     margin-bottom: 1rem;
-    gap: 0.5rem;                         /* Consistent spacing between tabs */
+    gap: 0.5rem;
+    /* Consistent spacing between tabs */
 }
 
 .tab-content {
-    height: 40vh; /* 40% of viewport height */
+    height: 40vh;
+    /* 40% of viewport height */
 }
 
 .tab-pane {
-    height: 100%; /* Make all tab panes same height */
-    overflow-y: auto; /* Add scrolling if content overflows */
+    height: 100%;
+    /* Make all tab panes same height */
+    overflow-y: auto;
+    /* Add scrolling if content overflows */
 }
 
 .content-scroll {
-    height: 100%; /* Ensure content fills tab pane */
+    height: 100%;
+    /* Ensure content fills tab pane */
 }
 
 .media-container {
-    height: 100%; /* Make media container fill tab pane */
+    height: 100%;
+    /* Make media container fill tab pane */
 }
+
 .content-scroll {
     background-color: var(--color_theme_surface);
     height: 100%;
     overflow-y: auto;
     padding: 1rem;
+}
+
+.content-section {
+    padding: var(--spacing-medium);
+    margin: var(--spacing-small);
 }
\ No newline at end of file