Skip to content

Commit 5261721

Browse files
sanny32sanny32
committed
Update OpenModSim site
1 parent 79a089f commit 5261721

2 files changed

Lines changed: 125 additions & 28 deletions

File tree

‎docs/index.html‎

Lines changed: 28 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -174,8 +174,8 @@ <h3>Windows Installer</h3>
174174
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
175175
<path d="m7 10 5 5 5-5" />
176176
</svg>
177-
Download Windows x64 Installer
178-
<span class="btn-badge">Qt6</span>
177+
Download Windows Installer
178+
<span class="arch-tag">x64</span><span class="btn-badge">Qt6</span>
179179
</a>
180180
</div>
181181
<div class="download-item">
@@ -185,8 +185,8 @@ <h3>Windows Installer</h3>
185185
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
186186
<path d="m7 10 5 5 5-5" />
187187
</svg>
188-
Download Windows x64 Installer
189-
<span class="btn-badge">Qt5</span>
188+
Download Windows Installer
189+
<span class="arch-tag">x64</span><span class="btn-badge">Qt5</span>
190190
</a>
191191
</div>
192192
<div class="download-item">
@@ -196,8 +196,8 @@ <h3>Windows Installer</h3>
196196
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
197197
<path d="m7 10 5 5 5-5" />
198198
</svg>
199-
Download Windows x86 Installer
200-
<span class="btn-badge">Qt5</span>
199+
Download Windows Installer
200+
<span class="arch-tag">x86</span><span class="btn-badge">Qt5</span>
201201
</a>
202202
</div>
203203
</div>
@@ -239,7 +239,7 @@ <h3>Linux DEB Packages</h3>
239239
<path d="m7 10 5 5 5-5" />
240240
</svg>
241241
Download DEB Package
242-
<span class="btn-badge">Qt6</span>
242+
<span class="arch-tag">amd64</span><span class="btn-badge">Qt6</span>
243243
</a>
244244
</div>
245245
<div class="download-item">
@@ -250,7 +250,7 @@ <h3>Linux DEB Packages</h3>
250250
<path d="m7 10 5 5 5-5" />
251251
</svg>
252252
Download DEB Package
253-
<span class="btn-badge">Qt5</span>
253+
<span class="arch-tag">amd64</span><span class="btn-badge">Qt5</span>
254254
</a>
255255
</div>
256256
</div>
@@ -332,7 +332,7 @@ <h3>Linux RPM Packages</h3>
332332
<path d="m7 10 5 5 5-5" />
333333
</svg>
334334
Download RPM Package
335-
<span class="btn-badge">Qt6</span>
335+
<span class="arch-tag">x86_64</span><span class="btn-badge">Qt6</span>
336336
</a>
337337
</div>
338338
<div class="download-item">
@@ -494,7 +494,7 @@ <h3>Flatpak Packages</h3>
494494
<path d="m7 10 5 5 5-5" />
495495
</svg>
496496
Download Flatpak bundle
497-
<span class="btn-badge">Qt6</span>
497+
<span class="arch-tag">x86_64</span><span class="btn-badge">Qt6</span>
498498
</a>
499499
</div>
500500
</div>
@@ -525,15 +525,24 @@ <h3>Flatpak Packages</h3>
525525
</svg>
526526
</button>
527527
</div>
528-
<p class="note">If you want to use a serial port connection, you must add the user to the <code>dialout</code> group and then log in to the user again or reboot the computer</p>
529-
<div class="code-block">
530-
<pre><code>sudo usermod -a -G dialout $USER</code></pre>
531-
<button class="copy-btn">
532-
<svg viewBox="0 0 16 16">
533-
<path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z" />
534-
<path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z" />
535-
</svg>
536-
</button>
528+
<div class="tip-box">
529+
<svg class="tip-box-icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
530+
<circle cx="12" cy="12" r="10"/>
531+
<path d="M12 16v-4"/>
532+
<path d="M12 8h.01"/>
533+
</svg>
534+
<div class="tip-box-content">
535+
<p>For serial port connections, add the user to the <code>dialout</code> group, then log in again or reboot</p>
536+
<div class="code-block">
537+
<pre><code>sudo usermod -a -G dialout $USER</code></pre>
538+
<button class="copy-btn">
539+
<svg viewBox="0 0 16 16">
540+
<path d="M0 6.75C0 5.784.784 5 1.75 5h1.5a.75.75 0 0 1 0 1.5h-1.5a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-1.5a.75.75 0 0 1 1.5 0v1.5A1.75 1.75 0 0 1 9.25 16h-7.5A1.75 1.75 0 0 1 0 14.25Z" />
541+
<path d="M5 1.75C5 .784 5.784 0 6.75 0h7.5C15.216 0 16 .784 16 1.75v7.5A1.75 1.75 0 0 1 14.25 11h-7.5A1.75 1.75 0 0 1 5 9.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h7.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z" />
542+
</svg>
543+
</button>
544+
</div>
545+
</div>
537546
</div>
538547
</div>
539548
<div class="subtab-panel" data-subtab="remove">

‎docs/style.css‎

Lines changed: 97 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -455,6 +455,27 @@ body {
455455
flex-shrink: 0;
456456
}
457457

458+
.arch-tag {
459+
font-family: 'Consolas', 'Monaco', 'Courier New', monospace;
460+
font-size: 0.7rem;
461+
font-weight: 700;
462+
padding: 0.15rem 0.5rem;
463+
border-radius: 100px;
464+
border: 1px solid currentColor;
465+
opacity: 0.75;
466+
letter-spacing: 0;
467+
flex-shrink: 0;
468+
}
469+
470+
.btn-download .arch-tag,
471+
.btn-download-alt .arch-tag {
472+
margin-left: auto;
473+
}
474+
475+
.arch-tag + .btn-badge {
476+
margin-left: 0.3rem;
477+
}
478+
458479
.btn-download-alt .btn-badge {
459480
background: rgba(24, 119, 200, 0.1);
460481
color: var(--primary-color);
@@ -557,18 +578,23 @@ body {
557578
}
558579

559580
.subtab-panel {
560-
display: none;
581+
grid-area: 1 / 1;
582+
visibility: hidden;
583+
pointer-events: none;
561584
}
562585

563586
.subtab-panel.active {
564-
display: block;
587+
visibility: visible;
588+
pointer-events: auto;
565589
}
566590

567591
/* Install instructions */
568592
.install-instructions {
569593
margin: 0;
570594
padding: 0;
571595
border: none;
596+
display: grid;
597+
grid-template-columns: minmax(0, 1fr);
572598
}
573599

574600
.install-instructions h4 {
@@ -595,29 +621,91 @@ body {
595621
margin-top: 0.5rem;
596622
}
597623

624+
/* Tip / info box */
625+
.tip-box {
626+
display: flex;
627+
gap: 0.65rem;
628+
align-items: flex-start;
629+
background: rgba(24, 119, 200, 0.06);
630+
border: 1px solid rgba(24, 119, 200, 0.25);
631+
border-radius: 6px;
632+
padding: 0.75rem 1rem;
633+
margin-bottom: 0.75rem;
634+
}
635+
636+
.tip-box-icon {
637+
flex-shrink: 0;
638+
width: 18px;
639+
height: 18px;
640+
color: var(--primary-color);
641+
margin-top: 0.1rem;
642+
}
643+
644+
.tip-box-content {
645+
flex: 1;
646+
min-width: 0;
647+
}
648+
649+
.tip-box-content p {
650+
font-size: 0.85rem;
651+
color: var(--text-light);
652+
margin-bottom: 0.5rem;
653+
}
654+
655+
.tip-box-content p:last-child {
656+
margin-bottom: 0;
657+
}
658+
659+
.tip-box-content .code-block {
660+
margin-top: 0.5rem;
661+
}
662+
598663
/* Copy button for install instructions */
599664
.install-instructions .code-block {
600665
position: relative;
601-
display: inline-block;
666+
display: flex;
667+
align-items: flex-start;
668+
gap: 0.5rem;
669+
background: #1e1e1e;
670+
border-radius: 8px;
671+
margin-bottom: 0.75rem;
602672
width: 100%;
603673
}
604674

605675
.install-instructions .code-block pre {
606-
padding: 0.65rem 2.5rem 0.65rem 1rem;
607-
background: #1e1e1e;
676+
padding: 0.65rem 1rem;
677+
background: transparent;
608678
color: #e8e8e8;
609679
font-size: 0.82rem;
610680
line-height: 1.5;
611681
overflow-x: auto;
612-
margin-bottom: 0.75rem;
682+
flex: 1;
683+
min-width: 0;
684+
margin-bottom: 0;
613685
border-radius: 8px;
686+
scrollbar-width: thin;
687+
scrollbar-color: #555 transparent;
688+
}
689+
690+
.install-instructions .code-block pre::-webkit-scrollbar {
691+
height: 4px;
692+
}
693+
694+
.install-instructions .code-block pre::-webkit-scrollbar-track {
695+
background: transparent;
696+
}
697+
698+
.install-instructions .code-block pre::-webkit-scrollbar-thumb {
699+
background: #555;
700+
border-radius: 2px;
614701
}
615702

616703
/* Copy button styling — GitHub-style */
617704
.install-instructions .copy-btn {
618-
position: absolute;
619-
top: 6px;
620-
right: 6px;
705+
position: relative;
706+
flex-shrink: 0;
707+
margin-top: 6px;
708+
margin-right: 6px;
621709
border: 1px solid transparent;
622710
background: transparent;
623711
padding: 4px;

0 commit comments

Comments
 (0)