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

[FUNCTIONAL] Add Basic Admin UI Enhancements feature with toggle switch fixes

Browse Source
This commit is contained in:
Marcus Quinn
2025-04-08 01:23:31 +01:00
parent cd48fcada2
commit a4c69999f6
2 changed files with 192 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
admin/css/wp-allstars-ui-enhancements.css
View File

@ -198,6 +198,62 @@
/*
* Enhanced Toggle Styles
*/
/* Base toggle styles that apply even without enhanced UI */
.wp-toggle-switch {
position: relative;
display: inline-block;
width: 40px;
height: 20px;
vertical-align: middle;
margin-right: 8px;
}
.wp-toggle-switch input {
opacity: 0;
width: 0;
height: 0;
position: absolute;
z-index: 1;
cursor: pointer;
}
.wp-toggle-slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
transition: .3s;
border-radius: 34px;
}
.wp-toggle-slider:before {
position: absolute;
content: "";
height: 16px;
width: 16px;
left: 2px;
bottom: 2px;
background-color: white;
transition: .3s;
border-radius: 50%;
}
input:checked + .wp-toggle-slider {
background-color: #2271b1;
}
input:focus + .wp-toggle-slider {
box-shadow: 0 0 1px #2271b1;
}
input:checked + .wp-toggle-slider:before {
transform: translateX(20px);
}
/* Enhanced UI specific toggle styles - only apply additional styling */
.wp-allstars-enhanced-ui .wp-toggle-switch {
width: 46px;
height: 24px;
@ -215,7 +271,6 @@
left: 3px;
bottom: 3px;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
transition: all 0.3s cubic-bezier(0.4, 0.0, 0.2, 1);
}
.wp-allstars-enhanced-ui input:checked + .wp-toggle-slider {