some styles refactored

This commit is contained in:
Bogdan Pilyugin 2022-08-28 13:37:13 +02:00
parent 2a8e2ae715
commit b4f0781b1e
5 changed files with 33 additions and 42 deletions

View File

@ -14,10 +14,9 @@
<!--========== CONTENTS ==========-->
<main>
<section>
<div class="masonry-layout">
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="ml">
<div class="mlp">
<div class="mlpc">
<form name="eth" method="post">
<div class="mlhdr">ETHERNET</div>
<table class='cntr'><tr>
@ -38,18 +37,14 @@
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="wifi" method="post">
<div class="mlhdr">WiFi</div>
<table class='cntr'>
<tr><td class='rl'>Включить WiFi</td><td><input type="checkbox" name="wifien" value="1" ~wfen~/></td></tr>
<tr><td class='rl'>Режим WiFi:</td><td><input name="netm" type="radio" value="2" onclick="configIPBoxes()" ~cln~>Клиент(CLN)</input></br>
<input name="netm" type="radio" value="1" onclick="configIPBoxes()" ~apn~>Точка доступа(AP)</input></td></tr>
<script>PrintTextInput('Имя WiFi сети(AP):','wfiap','~ssidap~',3,31);
PrintTextInput('Ключ WiFi сети(AP):','wfpap','~wkeyap~',8,31);
PrintIPInput('IP адрес(AP):','ipaap','~ipap~');
@ -72,8 +67,8 @@
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<div class="mlhdr">GPRS</div>
<form name="gprs" method="post">
<table class='cntr'>
@ -94,10 +89,8 @@
</form>
</div>
</div>
</div>
</section>
</main>
<script>
showMenu('header-toggle','navbar');

View File

@ -16,24 +16,22 @@
<section>
<div class="masonry-layout">
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="ml">
<div class="mlp">
<div class="mlpc">
<div class="mlhdr">Application 1</div>
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<div class="mlhdr">Application 2</div>
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<div class="mlhdr">Application 3</div>
</div>
</div>

View File

@ -14,10 +14,10 @@
<!--========== CONTENTS ==========-->
<main>
<section>
<div class="masonry-layout">
<div class="ml">
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="conf1" method="post">
<div class="mlhdr">SNTP</div>
@ -42,8 +42,8 @@
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="conf2" method="post">
<div class="mlhdr">MQTT</div>
<table class='cntr'>

View File

@ -351,29 +351,29 @@ textarea {
margin: auto;
}
.masonry-layout__panel {
.mlp {
break-inside: avoid;
padding:5px;
}
.masonry-layout__panel-content {
.mlpc {
margin: 10px 0;
padding: 10px;
border-radius: 10px;
border:solid 1px #CCCCCC;
}
.masonry-layout {
.ml {
column-count: 1;
column-gap: 0;
}
@media (min-width: 768px) {
.masonry-layout {
.ml {
column-count: 2;
}
}
@media (min-width: 1200px) {
.masonry-layout {
.ml {
column-count: 3;
}
}

View File

@ -14,10 +14,10 @@
<!--========== CONTENTS ==========-->
<main>
<section>
<div class="masonry-layout">
<div class="ml">
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="conf1" method="post">
<div class="mlhdr">SYSTEM</div>
<table class='cntr'><script>PrintTextInputNoReg('Имя устройства:','nam','~dname~', 3, 31 );
@ -41,8 +41,8 @@
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="conf2" method="post">
<div class="mlhdr">STAT</div>
<table class='cntr'>
@ -62,8 +62,8 @@
</div>
</div>
<div class="masonry-layout__panel">
<div class="masonry-layout__panel-content">
<div class="mlp">
<div class="mlpc">
<form name="conf2" method="post">
<div class="mlhdr">CONTROL</div>
<div style='margin:auto;text-align:center'>