Kumi
ae3d7ffc98
Enhanced UI element visibility and interaction across the editor and scene components. By switching to classList manipulation for showing and hiding UI elements, the approach aligns better with modern best practices, ensuring smooth transitions and consistency in user experience. The addition of `!important` in the CSS for the `.hide` class guarantees the override of conflicting styles, addressing potential visibility issues. Adjustments in HTML formatting enhance readability and maintainability without altering functionality. This change, while seemingly minor, significantly improves the user's ability to intuitively navigate and interact with the UI, potentially reducing frustration and increasing overall user satisfaction.
50 lines
744 B
CSS
50 lines
744 B
CSS
#sceneNavbar {
|
|
z-index: 99999;
|
|
position: fixed;
|
|
width: 100%;
|
|
}
|
|
|
|
#sceneSidebar {
|
|
z-index: 99999;
|
|
position: fixed;
|
|
width: 250px;
|
|
height: 100%;
|
|
background-color: #f8f9fa;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.btn-close-sidebar {
|
|
width: 100%;
|
|
padding: 10px;
|
|
background-color: #ff4081;
|
|
color: white;
|
|
border: none;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
border-radius: 0;
|
|
}
|
|
|
|
.btn-close-sidebar:hover {
|
|
background-color: #e03570;
|
|
}
|
|
|
|
.hide {
|
|
display: none !important;
|
|
}
|
|
|
|
.btn-open-sidebar {
|
|
z-index: 99999;
|
|
position: fixed;
|
|
width: 250px;
|
|
background-color: #40ffbe;
|
|
color: black;
|
|
border: none;
|
|
cursor: pointer;
|
|
font-size: 16px;
|
|
border-radius: 0;
|
|
opacity: 0.7;
|
|
}
|
|
|
|
.btn-open-sidebar:hover {
|
|
background-color: #0dffad;
|
|
}
|