Refactor: Ohli24 UI refinement and mobile responsiveness fixes

This commit is contained in:
2026-01-05 02:45:40 +09:00
parent bda7d16c1c
commit 883b8d172b
11 changed files with 75 additions and 40 deletions

View File

@@ -73,8 +73,18 @@
flex-wrap: wrap; /* allow wrap on small screens */
justify-content: center;
width: auto !important; /* Prevent full width */
margin-bottom: 20px;
margin-top: 50px !important; /* Mobile spacing */
margin-bottom: 5px; /* Reduced for modularity */
margin-top: 50px !important; /* Mobile spacing - fallback for first menu */
}
/* Tighten spacing between 2nd and 3rd level menus */
#menu_module_div ul.nav.nav-pills.bg-light {
margin-bottom: 5px !important;
}
#menu_page_div ul.nav.nav-pills.bg-light {
margin-top: 0 !important;
margin-bottom: 20px !important;
}
ul.nav.nav-pills .nav-item {

View File

@@ -98,7 +98,7 @@ body {
color: #94a3b8;
}
/* Nav Pills Customization */
/* Nav Pills Customization (Shared styling, overrides in mobile_custom.css) */
ul.nav.nav-pills.bg-light {
background-color: rgba(30, 41, 59, 0.6) !important;
backdrop-filter: blur(10px);
@@ -110,7 +110,7 @@ ul.nav.nav-pills.bg-light {
flex-wrap: wrap;
justify-content: center;
width: auto !important;
margin-bottom: 20px;
margin-bottom: 5px; /* Default for modular stacking */
}
ul.nav.nav-pills .nav-link {
@@ -155,6 +155,29 @@ ul.nav.nav-pills .nav-link.active {
border: none !important;
}
/* Responsive Input Group for Search */
.input-group-responsive {
height: 50px;
}
.input-group-responsive .form-control {
height: 100% !important;
font-size: 1.1rem;
}
.input-group-responsive .btn {
height: 100% !important;
}
@media (max-width: 768px) {
.input-group-responsive {
height: 42px;
}
.input-group-responsive .form-control {
font-size: 0.95rem;
}
}
.btn-search { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); color: white !important; }
.btn-reset { background: rgba(148, 163, 184, 0.1); color: #94a3b8 !important; }