Skip to content

Commit e96407d

Browse files
sanny32sanny32
committed
Update OpenModSim site for mobile devices
1 parent f7d6ef4 commit e96407d

3 files changed

Lines changed: 65 additions & 43 deletions

File tree

‎docs/index.html‎

Lines changed: 43 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -21,45 +21,49 @@
2121
<img src="logo.png" alt="OpenModSim Logo" class="logo">
2222
<span class="brand-name">OpenModSim</span>
2323
</div>
24-
<ul class="nav-menu">
25-
<li><a href="#features" data-i18n="nav.features">Features</a></li>
26-
<li><a href="#screenshots" data-i18n="nav.screenshots">Screenshots</a></li>
27-
<li><a href="#download" data-i18n="nav.download">Download</a></li>
28-
<li>
29-
<a href="https://github.com/sanny32/OpenModSim" target="_blank" class="nav-github">
30-
<svg width="20" height="20" viewBox="0 0 16 16" fill="currentColor">
31-
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
32-
</svg>
33-
</a>
34-
</li>
35-
<li class="lang-dropdown" id="langDropdown">
36-
<button class="lang-dropdown-btn" id="langDropdownBtn" aria-haspopup="listbox" aria-expanded="false">
37-
<img class="lang-flag lang-current-flag" src="https://flagcdn.com/w20/us.png" width="20" height="15" alt="EN">
38-
<span class="lang-current-name">English</span>
39-
<svg class="lang-chevron" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
40-
<path d="M6 9l6 6 6-6"/>
41-
</svg>
42-
</button>
43-
<ul class="lang-dropdown-menu" id="langDropdownMenu" role="listbox">
44-
<li class="lang-option" data-lang="en" role="option">
45-
<img class="lang-flag" src="https://flagcdn.com/w20/us.png" width="20" height="15" alt="EN">
46-
<span>English</span>
47-
</li>
48-
<li class="lang-option" data-lang="ru" role="option">
49-
<img class="lang-flag" src="https://flagcdn.com/w20/ru.png" width="20" height="15" alt="RU">
50-
<span>Русский</span>
51-
</li>
52-
<li class="lang-option" data-lang="zh_CN" role="option">
53-
<img class="lang-flag" src="https://flagcdn.com/w20/cn.png" width="20" height="15" alt="CN">
54-
<span>简体中文</span>
55-
</li>
56-
<li class="lang-option" data-lang="zh_TW" role="option">
57-
<img class="lang-flag" src="https://flagcdn.com/w20/tw.png" width="20" height="15" alt="TW">
58-
<span>繁體中文</span>
59-
</li>
60-
</ul>
61-
</li>
62-
</ul>
24+
<div class="nav-right">
25+
<ul class="nav-menu" id="navMenu">
26+
<li><a href="#features" data-i18n="nav.features">Features</a></li>
27+
<li><a href="#screenshots" data-i18n="nav.screenshots">Screenshots</a></li>
28+
<li><a href="#download" data-i18n="nav.download">Download</a></li>
29+
<li>
30+
<a href="https://github.com/sanny32/OpenModSim" target="_blank" class="nav-github">
31+
<svg width="20" height="20" viewBox="0 0 16 16" fill="currentColor">
32+
<path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/>
33+
</svg>
34+
</a>
35+
</li>
36+
</ul>
37+
<div class="nav-actions">
38+
<div class="lang-dropdown" id="langDropdown">
39+
<button class="lang-dropdown-btn" id="langDropdownBtn" aria-haspopup="listbox" aria-expanded="false">
40+
<img class="lang-flag lang-current-flag" src="https://flagcdn.com/w20/us.png" width="20" height="15" alt="EN">
41+
<span class="lang-current-name">English</span>
42+
<svg class="lang-chevron" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
43+
<path d="M6 9l6 6 6-6"/>
44+
</svg>
45+
</button>
46+
<ul class="lang-dropdown-menu" id="langDropdownMenu" role="listbox">
47+
<li class="lang-option" data-lang="en" role="option">
48+
<img class="lang-flag" src="https://flagcdn.com/w20/us.png" width="20" height="15" alt="EN">
49+
<span>English</span>
50+
</li>
51+
<li class="lang-option" data-lang="ru" role="option">
52+
<img class="lang-flag" src="https://flagcdn.com/w20/ru.png" width="20" height="15" alt="RU">
53+
<span>Русский</span>
54+
</li>
55+
<li class="lang-option" data-lang="zh_CN" role="option">
56+
<img class="lang-flag" src="https://flagcdn.com/w20/cn.png" width="20" height="15" alt="CN">
57+
<span>简体中文</span>
58+
</li>
59+
<li class="lang-option" data-lang="zh_TW" role="option">
60+
<img class="lang-flag" src="https://flagcdn.com/w20/tw.png" width="20" height="15" alt="TW">
61+
<span>繁體中文</span>
62+
</li>
63+
</ul>
64+
</div>
65+
</div>
66+
</div>
6367
</div>
6468
</nav>
6569
</header>

‎docs/screenshots.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ document.addEventListener('DOMContentLoaded', function() {
2626
// Add click event to all screenshots
2727
screenshots.forEach((screenshot, index) => {
2828
screenshot.addEventListener('click', function() {
29+
if (window.innerWidth <= 768) return;
2930
showModal(index);
3031
});
3132
});

‎docs/style.css‎

Lines changed: 21 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -98,6 +98,18 @@ body {
9898
opacity: 1;
9999
}
100100

101+
.nav-right {
102+
display: flex;
103+
align-items: center;
104+
}
105+
106+
.nav-actions {
107+
display: flex;
108+
align-items: center;
109+
gap: 0.5rem;
110+
margin-left: 1.5rem;
111+
}
112+
101113
/* Language Dropdown */
102114
.lang-dropdown {
103115
position: relative;
@@ -984,8 +996,11 @@ footer {
984996

985997
@media (max-width: 768px) {
986998
.nav-menu {
987-
gap: 1rem;
988-
font-size: 0.9rem;
999+
display: none;
1000+
}
1001+
1002+
.screenshots {
1003+
display: none;
9891004
}
9901005

9911006
.hero-content h1 {
@@ -1088,8 +1103,10 @@ button:focus {
10881103
}
10891104

10901105
/* Screenshot modal cursor */
1091-
.screenshot-item img {
1092-
cursor: pointer;
1106+
@media (min-width: 769px) {
1107+
.screenshot-item img {
1108+
cursor: pointer;
1109+
}
10931110
}
10941111

10951112
/* Modal - Windows 11 style */

0 commit comments

Comments
 (0)