litruv/Docs-Viewer
1
0
Fork 0
mirror of https://github.com/litruv/Docs-Viewer.git synced 2026-07-25 11:16:07 +10:00
Code Issues Packages Projects Releases Wiki Activity

Update viewport settings and enhance layout for better responsiveness

Browse Source
This commit is contained in:
Litruv
2025-01-30 05:30:19 +11:00
parent 612f15f7b4
commit 872cf3082a
2 changed files with 12 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
<title>Documentation Viewer</title> <title>Documentation Viewer</title>
<!-- Dynamic Meta Tags --> <!-- Dynamic Meta Tags -->

18
styles.css
View File

@@ -24,7 +24,12 @@ body {
.container { .container {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100vh; min-height: 100vh;
height: 100%;
position: fixed;
width: 100%;
top: 0;
left: 0;
} }
.title-bar { .title-bar {
@@ -59,6 +64,7 @@ body {
display: flex; display: flex;
flex: 1; flex: 1;
overflow: hidden; overflow: hidden;
height: calc(100% - var(--title-bar-height));
} }
.sidebar { .sidebar {
@@ -74,9 +80,7 @@ body {
border-right: 1px solid var(--ifm-border-color); border-right: 1px solid var(--ifm-border-color);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
min-height: calc(100vh - var(--title-bar-height)); height: 100%;
position: sticky;
top: var(--title-bar-height);
} }
#file-index { #file-index {
@@ -415,11 +419,9 @@ body {
position: fixed; position: fixed;
left: -100%; left: -100%;
top: var(--title-bar-height); top: var(--title-bar-height);
bottom: 0; height: calc(100% - env(safe-area-inset-top) - var(--title-bar-height));
z-index: 100; z-index: 100;
transition: var(--sidebar-transition); transition: var(--sidebar-transition);
min-height: unset; /* Remove min-height for mobile */
height: calc(100% - var(--title-bar-height));
} }
.right-sidebar { .right-sidebar {
@@ -433,6 +435,8 @@ body {
.content { .content {
padding: 1.5rem; padding: 1.5rem;
height: calc(100% - env(safe-area-inset-top));
-webkit-overflow-scrolling: touch; /* For smoother scrolling on iOS */
} }
.social-links { .social-links {