Pakobbix/rpg-companion-sillytavern
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(mobile): prevent Info tab from rendering over other tabs

Browse Source 
Changed selector from .rpg-mobile-tab-content[data-tab-content="info"]
to include .active class, preventing the info tab from always being
visible regardless of which tab is selected.

The display: flex !important was overriding the base tab switching
logic (.rpg-mobile-tab-content { display: none; }), causing the info
tab to render on top of all other tabs.
This commit is contained in:
Lucas 'Paperboy' Rose-Winters
2025-10-17 16:59:45 +11:00
parent b3ca2960d8
commit 26acee3a70
1 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
style.css
+12 -10
View File
@@ -3449,18 +3449,18 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
to { opacity: 1; transform: translateY(0); }
}
/* Combined Info & Characters wrapper */
.rpg-mobile-combined-content {
display: flex;
/* Info tab contains Info Box and Characters with 50/50 split */
.rpg-mobile-tab-content[data-tab-content="info"].active {
flex-direction: column;
gap: 0;
height: 100%;
min-height: 0;
}
/* Info Box takes fixed 50% of vertical space */
.rpg-mobile-combined-content > #rpg-info-box {
flex: 0 0 50%;
/* Info Box takes 50% of vertical space */
.rpg-mobile-tab-content[data-tab-content="info"] > #rpg-info-box,
.rpg-mobile-tab-content[data-tab-content="info"] > .rpg-info-section {
flex: 1 1 50% !important;
min-height: 0;
overflow-y: auto;
padding-bottom: 16px;
@@ -3469,16 +3469,17 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
gap: 0.5em;
}
/* Characters section takes remaining 50% */
.rpg-mobile-combined-content > #rpg-thoughts {
flex: 1;
/* Characters section takes 50% of vertical space */
.rpg-mobile-tab-content[data-tab-content="info"] > #rpg-thoughts,
.rpg-mobile-tab-content[data-tab-content="info"] > .rpg-thoughts-section {
flex: 1 1 50% !important;
min-height: 0;
overflow-y: auto;
padding-bottom: 16px;
}
/* Add divider between Info and Characters */
.rpg-mobile-combined-content > .rpg-section:not(:last-child) {
.rpg-mobile-tab-content[data-tab-content="info"] > .rpg-section:not(:last-child) {
border-bottom: 1px solid var(--SmartThemeBorderColor);
margin-bottom: 16px;
}
@@ -3495,6 +3496,7 @@ body:has(.rpg-panel.rpg-position-left) #sheld {
/* Rows scale proportionally to fill Info Box */
.rpg-dashboard-row-1 {
flex: 1.2 !important; /* Slightly more space for 4 widgets */
height: auto !important; /* Remove desktop height constraint */
display: flex !important;
gap: 0.25em;
}