Skip to content

Commit

Permalink
Add files via upload
Browse files Browse the repository at this point in the history
  • Loading branch information
therealtimex authored Nov 30, 2024
1 parent 89aaa46 commit 1a2f6eb
Showing 1 changed file with 55 additions and 29 deletions.
84 changes: 55 additions & 29 deletions css/rt-dmview-css-min.css
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -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;
}

Expand All @@ -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 */
}


Expand Down Expand Up @@ -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 */
Expand All @@ -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);
}

0 comments on commit 1a2f6eb

Please sign in to comment.