mirror of
https://github.com/mofeng-git/One-KVM.git
synced 2025-12-12 09:10:30 +08:00
refactoring
This commit is contained in:
Devaev Maxim
parent
325bf6b587
commit
6bd4fc769f
@ -328,6 +328,7 @@
|
||||
<li class="right"><a class="menu-button" href="#"><img class="led-gray" data-dont-hide-menu id="hid-recorder-led" src="/share/svg/led-gear.svg">Macro ↴</a>
|
||||
<div class="menu" data-dont-hide-menu>
|
||||
<div class="text"><b>Record and play keyboard & mouse actions<br></b><sub>For security reasons, the record will not saved on Pi-KVM</sub></div>
|
||||
<hr>
|
||||
<div class="buttons buttons-row">
|
||||
<button class="row25" disabled data-force-hide-menu id="hid-recorder-record">• Rec</button>
|
||||
<button class="row25" disabled id="hid-recorder-stop">Stop</button>
|
||||
@ -1188,56 +1189,59 @@
|
||||
</tr>
|
||||
</table><br>
|
||||
<div class="tabs">
|
||||
<input checked type="radio" name="about-tab-button" id="about-tab-meta-button">
|
||||
<label for="about-tab-meta-button">Meta</label>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-hw-button">
|
||||
<label for="about-tab-hw-button">Hardware</label>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-version-button">
|
||||
<label for="about-tab-version-button">Version</label>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-thanks-button">
|
||||
<label for="about-tab-thanks-button">Thanks</label>
|
||||
<div id="about-tab-meta-content">
|
||||
<div class="code" id="about-meta"><span class="code-comment">No data</span></div>
|
||||
</div>
|
||||
<div id="about-tab-hw-content">
|
||||
<div class="code" id="about-hw"><span class="code-comment">No data</span></div>
|
||||
</div>
|
||||
<div id="about-tab-version-content">
|
||||
<div class="code" id="about-version"><span class="code-comment">No data</span></div>
|
||||
</div>
|
||||
<div id="about-tab-thanks-content">
|
||||
<div class="code" id="about-thanks"><span class="code-comment">// These kind people donated money to the Pi-KVM project<br>
|
||||
// and supported the work on it. We are very grateful<br>
|
||||
// for their help, and memorializing their names<br>
|
||||
// is the least we can do in gratitude.<br>
|
||||
// If you also want to support this project,<br>
|
||||
// you can use one of these services:
|
||||
<a target="_blank" href="https://www.patreon.com/pikvm">Patreon</a>
|
||||
or <a target="_blank" href="https://www.paypal.me/mdevaev">PayPal</a>.</span>
|
||||
<ul>
|
||||
<li>Aleksei Brusianskii</li>
|
||||
<li>Arthur Woimbée</li>
|
||||
<li>Ben Gordon</li>
|
||||
<li>Branden Shaulis</li>
|
||||
<li>Christof Maluck</li>
|
||||
<li>Corey Lista</li>
|
||||
<li>David Howell</li>
|
||||
<li>Denis Yatsenko</li>
|
||||
<li>Ge Men</li>
|
||||
<li>Grey Cynic</li>
|
||||
<li>Jason Toland</li>
|
||||
<li>Jeff Bowman</li>
|
||||
<li>John McGovern</li>
|
||||
<li>Mark Gilbert</li>
|
||||
<li>Mark Robinson</li>
|
||||
<li>Mauricio Allende</li>
|
||||
<li>Michael Lynch</li>
|
||||
<li>Samed Ozoglu</li>
|
||||
<li>Truman Kilen</li>
|
||||
<li>Walter_Ego</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<input checked type="radio" name="about-tab-button" id="about-tab-meta-button">
|
||||
<label for="about-tab-meta-button">Meta</label>
|
||||
<div class="tab">
|
||||
<div class="code" id="about-meta"><span class="code-comment">No data</span>
|
||||
</div>
|
||||
</div>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-hw-button">
|
||||
<label for="about-tab-hw-button">Hardware</label>
|
||||
<div class="tab">
|
||||
<div class="code" id="about-hw"><span class="code-comment">No data</span>
|
||||
</div>
|
||||
</div>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-version-button">
|
||||
<label for="about-tab-version-button">Version</label>
|
||||
<div class="tab">
|
||||
<div class="code" id="about-version"><span class="code-comment">No data</span>
|
||||
</div>
|
||||
</div>
|
||||
<input type="radio" name="about-tab-button" id="about-tab-thanks-button">
|
||||
<label for="about-tab-thanks-button">Thanks</label>
|
||||
<div class="tab">
|
||||
<div class="code" id="about-thanks"><span class="code-comment">// These kind people donated money to the Pi-KVM project<br>
|
||||
// and supported the work on it. We are very grateful<br>
|
||||
// for their help, and memorializing their names<br>
|
||||
// is the least we can do in gratitude.<br>
|
||||
// If you also want to support this project,<br>
|
||||
// you can use one of these services:
|
||||
<a target="_blank" href="https://www.patreon.com/pikvm">Patreon</a>
|
||||
or <a target="_blank" href="https://www.paypal.me/mdevaev">PayPal</a>.</span>
|
||||
<ul>
|
||||
<li>Aleksei Brusianskii</li>
|
||||
<li>Arthur Woimbée</li>
|
||||
<li>Ben Gordon</li>
|
||||
<li>Branden Shaulis</li>
|
||||
<li>Christof Maluck</li>
|
||||
<li>Corey Lista</li>
|
||||
<li>David Howell</li>
|
||||
<li>Denis Yatsenko</li>
|
||||
<li>Ge Men</li>
|
||||
<li>Grey Cynic</li>
|
||||
<li>Jason Toland</li>
|
||||
<li>Jeff Bowman</li>
|
||||
<li>John McGovern</li>
|
||||
<li>Mark Gilbert</li>
|
||||
<li>Mark Robinson</li>
|
||||
<li>Mauricio Allende</li>
|
||||
<li>Michael Lynch</li>
|
||||
<li>Samed Ozoglu</li>
|
||||
<li>Truman Kilen</li>
|
||||
<li>Walter_Ego</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div><br>
|
||||
<p class="text">
|
||||
Full documentation, source code, hardware schematics and legal information
|
||||
|
||||
@ -6,6 +6,7 @@ li(class="right")
|
||||
div(class="text")
|
||||
b Record and play keyboard & mouse actions#[br]
|
||||
sub For security reasons, the record will not saved on Pi-KVM
|
||||
hr
|
||||
div(class="buttons buttons-row")
|
||||
button(disabled data-force-hide-menu id="hid-recorder-record" class="row25") • Rec
|
||||
button(disabled id="hid-recorder-stop" class="row25") Stop
|
||||
|
||||
@ -1,3 +1,14 @@
|
||||
mixin about_tab(name, title, checked=false)
|
||||
- let button_id = `about-tab-${name}-button`
|
||||
input(checked=checked type="radio" name="about-tab-button", id=button_id)
|
||||
label(for=button_id) #{title}
|
||||
div(class="tab")
|
||||
div(id=`about-${name}` class="code")
|
||||
if block
|
||||
block
|
||||
else
|
||||
span(class="code-comment") No data
|
||||
|
||||
+window("about-window", "About", true, false)
|
||||
div(id="about")
|
||||
table
|
||||
@ -10,48 +21,41 @@
|
||||
tr #[td(colspan="2" class="copyright") Copyright © 2018 Pi-KVM Developers Team]
|
||||
br
|
||||
div(class="tabs")
|
||||
each tab, index in ["Meta", "Hardware", "Version", "Thanks"]
|
||||
- tab_id = `about-tab-${tab != "Hardware" ? tab.toLowerCase() : "hw"}-button`
|
||||
if index == 0
|
||||
input(checked type="radio" name="about-tab-button" id=tab_id)
|
||||
else
|
||||
input(type="radio" name="about-tab-button" id=tab_id)
|
||||
label(for=tab_id) #{tab}
|
||||
each tab in ["meta", "hw", "version"]
|
||||
div(id=`about-tab-${tab}-content`)
|
||||
div(id=`about-${tab}` class="code") #[span(class="code-comment") No data]
|
||||
div(id="about-tab-thanks-content")
|
||||
div(id="about-thanks" class="code")
|
||||
span(class="code-comment")
|
||||
| // These kind people donated money to the Pi-KVM project#[br]
|
||||
| // and supported the work on it. We are very grateful#[br]
|
||||
| // for their help, and memorializing their names#[br]
|
||||
| // is the least we can do in gratitude.#[br]
|
||||
| // If you also want to support this project,#[br]
|
||||
| // you can use one of these services:
|
||||
| #[a(target="_blank" href="https://www.patreon.com/pikvm") Patreon]
|
||||
| or #[a(target="_blank" href="https://www.paypal.me/mdevaev") PayPal].
|
||||
ul
|
||||
li Aleksei Brusianskii
|
||||
li Arthur Woimbée
|
||||
li Ben Gordon
|
||||
li Branden Shaulis
|
||||
li Christof Maluck
|
||||
li Corey Lista
|
||||
li David Howell
|
||||
li Denis Yatsenko
|
||||
li Ge Men
|
||||
li Grey Cynic
|
||||
li Jason Toland
|
||||
li Jeff Bowman
|
||||
li John McGovern
|
||||
li Mark Gilbert
|
||||
li Mark Robinson
|
||||
li Mauricio Allende
|
||||
li Michael Lynch
|
||||
li Samed Ozoglu
|
||||
li Truman Kilen
|
||||
li Walter_Ego
|
||||
+about_tab("meta", "Meta", true)
|
||||
+about_tab("hw", "Hardware")
|
||||
+about_tab("version", "Version")
|
||||
|
||||
+about_tab("thanks", "Thanks")
|
||||
span(class="code-comment")
|
||||
| // These kind people donated money to the Pi-KVM project#[br]
|
||||
| // and supported the work on it. We are very grateful#[br]
|
||||
| // for their help, and memorializing their names#[br]
|
||||
| // is the least we can do in gratitude.#[br]
|
||||
| // If you also want to support this project,#[br]
|
||||
| // you can use one of these services:
|
||||
| #[a(target="_blank" href="https://www.patreon.com/pikvm") Patreon]
|
||||
| or #[a(target="_blank" href="https://www.paypal.me/mdevaev") PayPal].
|
||||
ul
|
||||
li Aleksei Brusianskii
|
||||
li Arthur Woimbée
|
||||
li Ben Gordon
|
||||
li Branden Shaulis
|
||||
li Christof Maluck
|
||||
li Corey Lista
|
||||
li David Howell
|
||||
li Denis Yatsenko
|
||||
li Ge Men
|
||||
li Grey Cynic
|
||||
li Jason Toland
|
||||
li Jeff Bowman
|
||||
li John McGovern
|
||||
li Mark Gilbert
|
||||
li Mark Robinson
|
||||
li Mauricio Allende
|
||||
li Michael Lynch
|
||||
li Samed Ozoglu
|
||||
li Truman Kilen
|
||||
li Walter_Ego
|
||||
br
|
||||
p(class="text")
|
||||
| Full documentation, source code, hardware schematics and legal information
|
||||
|
||||
@ -41,13 +41,6 @@ div#about td.copyright {
|
||||
font-size: 0.8em;
|
||||
}
|
||||
|
||||
div#about div#about-meta, div#about-hw, div#about-version, div#about-thanks {
|
||||
div#about div.tabs div.tab div.code {
|
||||
height: 250px;
|
||||
}
|
||||
|
||||
#about-tab-meta-button:checked~#about-tab-meta-content,
|
||||
#about-tab-hw-button:checked~#about-tab-hw-content,
|
||||
#about-tab-version-button:checked~#about-tab-version-content,
|
||||
#about-tab-thanks-button:checked~#about-tab-thanks-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@ -20,28 +20,45 @@
|
||||
*****************************************************************************/
|
||||
|
||||
|
||||
div.tabs>input[type="radio"] {
|
||||
div.tabs {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
div.tabs input[type="radio"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div.tabs>div {
|
||||
div.tabs div.tab {
|
||||
order: 99;
|
||||
display: none;
|
||||
border: var(--border-default-thin);
|
||||
padding: 10px 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
div.tabs>label {
|
||||
display: inline-block;
|
||||
div.tabs label {
|
||||
order: 1;
|
||||
display: block;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
user-select: none;
|
||||
border: var(--border-default-thin);
|
||||
border-top: var(--border-default-thin);
|
||||
border-left: var(--border-default-thin);
|
||||
padding: 4px 8px;
|
||||
cursor: pointer;
|
||||
position: relative;
|
||||
top: 1px;
|
||||
}
|
||||
|
||||
div.tabs>input[type="radio"]:checked+label {
|
||||
div.tabs label:last-of-type {
|
||||
border-right: var(--border-default-thin);
|
||||
}
|
||||
|
||||
div.tabs input[type="radio"]:checked+label {
|
||||
background-color: var(--cs-control-default-bg);
|
||||
}
|
||||
|
||||
div.tabs input[type="radio"]:checked+label+.tab {
|
||||
display: block;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user