marcus/wpa-superstar-plugin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix tab navigation styling to match reference plugin exactly: correct spacing, remove unwanted background, fix active tab color, and ensure proper styling of toggle elements

Browse Source
This commit is contained in:
Marcus Quinn
2025-03-24 04:10:20 +00:00
parent 4cf485041f
commit 84525b07b9
1 changed files with 21 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
admin/css/seoprostack-admin.css
View File

@ -33,7 +33,7 @@
} }
.seoprostack-version { .seoprostack-version {
color: #d35400; /* Updated to dark orange */ color: #646970; /* Neutral gray color */
font-size: 13px; font-size: 13px;
font-weight: 400; font-weight: 400;
} }
@ -42,7 +42,7 @@
.nav-tab-wrapper, .nav-tab-wrapper,
.wrap h2.nav-tab-wrapper { .wrap h2.nav-tab-wrapper {
border-bottom: 1px solid #c3c4c7; border-bottom: 1px solid #c3c4c7;
margin: 0 -20px; margin: 15px -20px 0;
padding: 0 20px; padding: 0 20px;
background: #fff; background: #fff;
position: sticky; position: sticky;
@ -89,10 +89,23 @@
font-weight: 600; font-weight: 600;
} }
/* Improve tab content container */ /* Tab content container */
.tab-content { .tab-content {
padding: 20px 0; padding: 20px 0;
animation: fadeIn 0.3s ease-in-out; animation: fadeIn 0.3s ease-in-out;
background: transparent;
}
/* Ensure tab content containers don't have a background color */
.seoprostack-settings-content {
background: transparent;
}
/* Make sure toggle containers have background */
.seoprostack-toggle, .seoprostack-setting-base, .seoprostack-setting-row {
background: #fff;
border: 1px solid #c3c4c7;
box-shadow: 0 1px 1px rgba(0,0,0,0.04);
} }
@keyframes fadeIn { @keyframes fadeIn {
@ -882,7 +895,7 @@ input:checked + .seoprostack-toggle-slider:before {
.nav-tab-wrapper, .nav-tab-wrapper,
.wrap h2.nav-tab-wrapper { .wrap h2.nav-tab-wrapper {
border-bottom: 1px solid #c3c4c7; border-bottom: 1px solid #c3c4c7;
margin: 0 -20px; margin: 15px -20px 0;
padding: 0 20px; padding: 0 20px;
background: #fff; background: #fff;
position: sticky; position: sticky;
@ -923,10 +936,10 @@ input:checked + .seoprostack-toggle-slider:before {
} }
.seoprostack-settings-content { .seoprostack-settings-content {
background: #fff; background: transparent;
border: 1px solid #c3c4c7; border: none;
border-radius: 4px; border-radius: 0;
padding: 20px; padding: 0;
margin-bottom: 20px; margin-bottom: 20px;
} }