From 7e0cbd35bf6880802fbf705f50e9a71e5f23347c Mon Sep 17 00:00:00 2001 From: AGulev Date: Sat, 19 Jul 2025 11:40:46 +0200 Subject: [PATCH 1/3] fix issue on mobile --- _scss/defold.scss | 28 ++++++++++++++++++++++++++++ 1 file changed, 28 insertions(+) diff --git a/_scss/defold.scss b/_scss/defold.scss index 1f3e9db5e..7378fe636 100644 --- a/_scss/defold.scss +++ b/_scss/defold.scss @@ -1447,6 +1447,34 @@ dd { grid-column-start: 2; } +/* Mobile-friendly definition lists */ +@media (max-width: 768px) { + dl { + display: block !important; + grid-template-columns: unset !important; + } + + dt { + display: block !important; + grid-column-start: unset !important; + font-weight: bold; + margin: 1em 0 0.5em 0; + } + + dd { + display: block !important; + grid-column-start: unset !important; + margin: 0 0 1.5em 1em; + } +} + +/* Extra small screens */ +@media (max-width: 480px) { + dd { + margin-left: 0.5em; + } +} + /******************************************************************************* * Example page ******************************************************************************/ From 4bc79def12b3b0e88874bd211fca17d121ad6edf Mon Sep 17 00:00:00 2001 From: AGulev Date: Sat, 19 Jul 2025 12:30:53 +0200 Subject: [PATCH 2/3] apply only for manuals and tutorials --- _scss/defold.scss | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/_scss/defold.scss b/_scss/defold.scss index 7378fe636..b59dc84ff 100644 --- a/_scss/defold.scss +++ b/_scss/defold.scss @@ -1447,21 +1447,25 @@ dd { grid-column-start: 2; } -/* Mobile-friendly definition lists */ +/* Mobile-friendly definition lists - only for manual content, not API reference */ @media (max-width: 768px) { - dl { + /* Apply to manual and tutorial pages only */ + .manual dl, + .tutorial dl { display: block !important; grid-template-columns: unset !important; } - dt { + .manual dt, + .tutorial dt { display: block !important; grid-column-start: unset !important; font-weight: bold; margin: 1em 0 0.5em 0; } - dd { + .manual dd, + .tutorial dd { display: block !important; grid-column-start: unset !important; margin: 0 0 1.5em 1em; From 097724d10784c16551ced6c5f99cd5cef91cea70 Mon Sep 17 00:00:00 2001 From: AGulev Date: Sat, 19 Jul 2025 12:47:17 +0200 Subject: [PATCH 3/3] fixes for api documentation --- _scss/defold.scss | 46 +++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 45 insertions(+), 1 deletion(-) diff --git a/_scss/defold.scss b/_scss/defold.scss index b59dc84ff..0b20f56f3 100644 --- a/_scss/defold.scss +++ b/_scss/defold.scss @@ -1448,7 +1448,7 @@ dd { } /* Mobile-friendly definition lists - only for manual content, not API reference */ -@media (max-width: 768px) { +@media (max-width: 1130px) { /* Apply to manual and tutorial pages only */ .manual dl, .tutorial dl { @@ -1472,11 +1472,55 @@ dd { } } +/* Responsive tables for API reference */ +@media (max-width: 1100px) { + .apicontent table { + display: block; + width: 100%; + overflow-x: auto; + white-space: nowrap; + -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */ + } +} + +@media (max-width: 1100px) { + .apicontent th, + .apicontent td { + white-space: nowrap; + min-width: 120px; /* Minimum width to ensure readability */ + } + + /* Ensure first column (usually function names) has more space */ + .apicontent th:first-child, + .apicontent td:first-child { + min-width: 150px; + } + + /* Limit last column width to reduce excessive scrolling */ + .apicontent th:last-child, + .apicontent td:last-child { + max-width: 500px; + white-space: normal; /* Allow text wrapping in description column */ + word-wrap: break-word; + } +} + /* Extra small screens */ @media (max-width: 480px) { dd { margin-left: 0.5em; } + + .apicontent th, + .apicontent td { + min-width: 100px; + font-size: 0.9em; /* Slightly smaller text on very small screens */ + } + + .apicontent th:first-child, + .apicontent td:first-child { + min-width: 130px; + } } /*******************************************************************************