aerotech/ate0004
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip:

Browse Source
This commit is contained in:
Alexey Zholtikov
2026-01-11 09:52:46 +03:00
parent 4b5db1d472
commit 629ab310b6
8 changed files with 805 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
html/index/index.html Executable file
View File

@@ -0,0 +1,93 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>be1.ru</title>
<link rel="stylesheet" href="index_style.css">
<link rel="icon" href="favicon.ico" />
<script src="index_script.js"></script>
</head>
<body>
<input type="checkbox" id="nav-toggle" hidden>
<nav class="nav">
<label for="nav-toggle" class="nav-toggle" onclick></label>
<!-- <h2 class="logo"> -->
<p style="text-align:center"> ATE0004
<!-- </h2> -->
<ul>
<li><a href="#1">About</a>
<li><a href="#2">Statistics</a>
<li><a href="#3">Update</a>
<li><a href="#3">Manual</a>
<!-- <li><a href="#4">Четыре</a>
<li><a href="#5">Пять</a>
<li><a href="#6">Шесть</a>
<li><a href="#7">Семь</a> -->
</ul>
</nav>
<!-- Маска (затемнение) основного контента при включенной панели
по-умолчанию данная фишка не используется, если оно вам надо,
просто расккоментируйте div-контейнер ниже -->
<div class="mask-content"></div>
<p class="aligncenter"><img alt="logo" src="logo.png" style="height:120px; width:300px" /></p>
<p style="text-align:center"><span style="font-size:24px">ATE0004</span></p>
<p style="text-align:center">Honeywell Retractable Landing Light CMM 33-42-07 P/N 45-0351-X Motor Test Box by
@rick_professor</p>
</div>
<div class="content">
<div class="card">
<h2>ONBOARD LED GPIO2</h2>
<p style="text-align:center" class="no-select"> <button id="button" class="button">Toggle LED</button></p>
<p class="state">State: <span id="state">%s</span></p>
</div>
</div>
</div>
<main role="main">
<div class="content">
<div class="card">
<!-- <h2>ONBOARD LED GPIO2</h2> -->
<p style="text-align:center" class="no-select"> <button id="button" class="button">Thermostat</button>
<p style="text-align:center" class="no-select"> <button id="button" class="button">Retract</button>
<p style="text-align:center" class="no-select"> <button id="button" class="button">Extend</button>
<!-- </p> -->
<!-- <p class="state">State: <span id="state">%s</span></p> -->
</div>
</div>
<!-- <article>
<header>
<h1 class="header__title">Просто Демо:</h1>
<h2>Выдвигающееся боковое меню на чистом CSS</h2>
</header>
<section>
<p style="text-align: center;">
<a href="index.html" class="btn btn-primary">Меню Слева</a>
<a href="right-slide-panel.html" class="btn btn-secondary">Меню Справа</a>
<p>Нажмите на "гамбургер-иконку" в левом или правом верхнем углу, в зависимости от выбранного вами
варианта, и вы увидите выдвигающуюся боковую панель в действии. Чаще всего в таких панельках
размещают меню навигации по сайту, что собственно мы и сделали. Вы же можете использовать боковую
панель, для любого другого элемента, который по вашему разумению, должен быть изначально скрыт,
например, форму подписки, блок кнопок социальных сетей, и т.д. и т.п...
<p>Работа данного меню построена на чистом CSS, без подключения javascript. Переключение осуществляется
с помощью скрытого флажка (checkbox) с использованием псевдокласса :checked из обоймы CSS3</p>
<p>С переклюателем панели особо не стал заморачиваться и использовал символ Unicode 'TRIGRAM FOR HEAVEN'
(U+2630), с простейшей заменой символа на 'Знак Умножения' (U+2715), когда панель раскрыта. Вам
ничего не мешает испльзовать любой другой значок, иконку или просто текст.
</section>
<hr>
<footer>
<p><a href="http://dbmast.ru/vydvigayushheesya-bokovoe-menyu-na-chistom-css">← Изучить Детали</a>
<p>сделано с любовью - <a href="https://twitter.com/dobrovoi">@dobrovoi</a>
</footer>
</article> -->
</main>
</body>
</html>