Projets/ObsiGate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refine mobile styles and improve search, sidebar, and layout

Browse Source
This commit is contained in:
Bruno Charest 2026-05-27 12:55:46 -04:00
parent a7c719afb1
commit b879163052
1 changed files with 119 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

142
frontend/style.css
View File

@ -2754,47 +2754,46 @@ body.resizing-v {
}
.search-input-wrapper input {
padding: 10px 80px 10px 40px;
font-size: 0.95rem; /* Plus grand pour mobile */
border-radius: 12px; /* Plus moderne */
padding: 10px 40px 10px 40px;
font-size: 1rem;
border-radius: 12px;
}
.search-wrapper .search-icon {
left: 14px;
top: 14px;
width: 18px !important;
height: 18px !important;
}
.search-actions {
gap: 2px;
}
.search-btn {
min-width: 28px;
height: 28px;
font-size: 0.65rem;
padding: 0 3px;
}
/* Mobile: hide advanced search toggles by default, show only clear */
.search-actions .tog,
.search-actions .icon-only:not(#search-clear-btn),
.search-actions .search-sep,
.search-actions .search-count { display: none; }
.search-actions { gap: 0; }
.search-actions .search-btn#search-clear-btn { display: flex; }
.search-dropdown {
position: fixed;
top: 105px; /* Ajusté pour la nouvelle position du header */
left: 10px;
right: 10px;
width: calc(100vw - 20px);
top: 100px;
left: 8px;
right: 8px;
width: calc(100vw - 16px);
max-height: calc(100vh - 120px);
border-radius: 12px;
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}
.search-dropdown__item {
padding: 12px 16px; /* Plus d'espace pour le tactile */
font-size: 0.9rem;
padding: 14px 16px;
font-size: 0.95rem;
}
.search-dropdown__icon {
width: 16px;
height: 16px;
width: 18px;
height: 18px;
margin-right: 8px;
}
.header-menu-btn {
@ -2855,6 +2854,16 @@ body.resizing-v {
box-shadow: 4px 0 20px rgba(0, 0, 0, 0.3);
}
/* Mobile sidebar overlay */
.sidebar-overlay {
display: none;
position: fixed;
inset: 0;
background: rgba(0,0,0,0.4);
z-index: 199;
}
.sidebar-overlay.active { display: block; }
/* Right Sidebar handling on mobile */
.right-sidebar {
position: fixed;
@ -2925,15 +2934,102 @@ body.resizing-v {
}
.content-area {
padding: 16px 12px 60px;
padding: 12px 8px 24px;
width: 100%;
}
.file-title {
font-size: 1.2rem;
font-size: 1.15rem;
}
.file-actions {
flex-wrap: wrap;
gap: 4px;
}
.file-actions .btn-action {
padding: 6px 8px;
font-size: 0.75rem;
}
/* Full-width search results */
.search-result-item {
padding: 12px 14px;
border-radius: 8px;
margin-bottom: 8px;
}
.search-result-title {
font-size: 0.9rem;
padding-right: 40px;
}
.search-result-ext {
top: 6px;
right: 8px;
font-size: 0.6rem;
}
.search-results-header {
flex-wrap: wrap;
gap: 6px;
}
/* Full-width dashboard */
.dashboard-stats-grid {
grid-template-columns: repeat(2, 1fr);
gap: 8px;
}
.stat-card {
padding: 12px 8px;
}
.dashboard-tab {
padding: 8px 8px;
font-size: 0.7rem;
gap: 3px;
}
.dashboard-tab i, .dashboard-tab svg {
width: 12px !important;
height: 12px !important;
}
.breadcrumb {
font-size: 0.75rem;
flex-wrap: wrap;
}
/* Mobile tab bar */
.tab-bar {
padding: 0 4px;
}
.tab-item {
padding: 6px 10px;
font-size: 0.7rem;
}
.tab-item .tab-name { max-width: 80px; }
.tab-item .tab-close { opacity: 0.6; width: 14px; height: 14px; }
.md-content {
padding: 0 4px;
}
.md-content h1 { font-size: 1.4rem; }
.md-content h2 { font-size: 1.15rem; }
.md-content h3 { font-size: 1rem; }
.md-content pre {
margin: 8px -4px;
border-radius: 6px;
padding: 10px 12px;
font-size: 0.8rem;
}
/* Full-width content wrapper */
.content-wrapper {
margin-left: 0 !important;
}
}