Refactor settings components for better reusability

This commit is contained in:
Marcus Quinn
2025-03-16 03:15:17 +00:00
parent 71564d0444
commit 15c3ada0fa
3 changed files with 150 additions and 83 deletions

View File

@ -83,7 +83,7 @@
font-weight: 600;
}
/* Toggle Switches */
/* Base Toggle Switch Component */
.wp-toggle-switch {
position: relative;
display: inline-block;
@ -135,25 +135,48 @@ input:checked + .wp-toggle-slider:before {
transform: translateX(16px);
}
/* Settings Container */
.wpa-settings-container {
padding: 0;
max-width: none;
/* Simple Setting Row (No Panel) */
.wp-setting-row {
display: flex;
align-items: center;
padding: 15px;
background: #fff;
border: 1px solid #ccc;
border-radius: 8px;
margin-bottom: 15px;
}
.wp-setting-row:hover {
border-color: #2271b1;
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}
.wp-setting-content {
flex-grow: 1;
margin-left: 10px;
}
.wp-setting-title {
font-size: 14px;
font-weight: 600;
color: #1d2327;
margin: 0;
line-height: 1.4;
}
.wpa-settings-content {
margin-top: 25px;
padding: 0 20px;
.wp-setting-description {
margin: 4px 0 0;
color: #50575e;
font-size: 13px;
line-height: 1.5;
}
/* Toggle Sections */
/* Expandable Panel Component */
.wp-allstars-toggle {
background: #fff;
border: 1px solid #ccc;
border-radius: 8px;
margin-bottom: 15px;
position: relative;
}
.wp-allstars-toggle:hover {