bruh linux fix

adding bootstrap
adding resources
2025-11-13 16:55:05 +10:00 · 2025-11-01 01:21:25 +10:00 · 2025-10-31 12:05:20 +10:00 · 2025-10-31 10:27:11 +10:00 · 2025-10-31 00:22:54 +10:00 · 2025-10-30 23:45:38 +10:00
49 changed files with 3368 additions and 44 deletions
--- a/convert_to_html.py
+++ b/convert_to_html.py
@@ -0,0 +1,37 @@
 import csv
 def create_html_table_from_csv(csv_path, html_path):
    try:
        with open(csv_path, 'r', newline='', encoding='utf-8') as csv_file:
            reader = csv.reader(csv_file)
            header = next(reader)
            with open(html_path, 'w', encoding='utf-8') as html_file:
                html_file.write('<table class="data-table">\n')
                html_file.write('<thead>\n')
                html_file.write('<tr>\n')
                for column_header in header:
                    html_file.write(f'<th>{column_header}</th>\n')
                html_file.write('</tr>\n')
                html_file.write('</thead>\n')
                html_file.write('<tbody>\n')
                for row in reader:
                    html_file.write('<tr>\n')
                    for cell in row:
                        html_file.write(f'<td>{cell}</td>\n')
                    html_file.write('</tr>\n')
                html_file.write('</tbody>\n')
                html_file.write('</table>\n')
        print(f"Successfully created {html_path} from {csv_path}")
    except:
        pass
 if __name__ == '__main__':
    csv_file_name = 'temp_sensor_data.csv'
    html_file_name = 'test.html'
    create_html_table_from_csv(csv_file_name, html_file_name)
--- a/embeded_details.html
+++ b/embeded_details.html
@@ -0,0 +1,104 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>
       Embedded Details
    </title>
 </head>
 <body bgcolor="#F0F8FF">
    <details>
        <summary>Menu</summary>
        <ul>
            <li><a href="./index.html">Home</a></li>
            <li><a href="./embeded_details.html"><h4>Embeded Details</h4></a></li>
            <li><a href="./opencv_details.html">OpenCV Details</a></li>
            <li><a href="./photography_details.html">Photography Details</a></li>
            <li><a href="./table.html">Table with filters (not working yet)</a></li>
            <li><a href="./images/institute.png">Institute</a></li>
        </ul>
    </details>
    <h2 align="center">Embedded Details</h2>
    <hr width="800" align="center">
    <p align="center">
        <img src="./images/esp32.png" alt="ESP32" height="150">
        <img src="./images/arduino.png" alt="Arduino" height="150">
        <img src="./images/stm32.png" alt="STM32" height="150">
    </p>
    <p align="justify">My programming path started with embeded systems,
        i love all the low level things that Mcu could do with just a little bit of code,
        sometimes build or flashing progress could take some time to get a hand of , but after that everething usualy
        goes smooth</p>
    <p align="justify">The first MCU i tried was a ATmega328P,
        after some time i was surprised with the debug capabilities on the Stm32
        and now i'm working with esp32-s3 , that's a good chip, has internal JTAG and all the shiny wireless interfaces
        but feels faulty
        for some reason <i> regular segfaults with CDC</i></p>
    <h3 align="center">Microcontroller Comparison Table</h3>
    <table border="1" align="center" cellpadding="6" cellspacing="0">
        <tr>
            <th>Board/MCU</th>
            <th>UART Count</th>
            <th>Dynamic UART Assignment</th>
            <th>ADC Channels</th>
            <th>Debug Support</th>
            <th>Flash Size</th>
            <th>Wireless Connectivity</th>
        </tr>
        <tr>
            <td>ESP32</td>
            <td>3</td>
            <td>Yes (via IO MUX)</td>
            <td>18</td>
            <td>JTAG, Serial</td>
            <td>4MB (typical)</td>
            <td>Wi-Fi, Bluetooth</td>
        </tr>
        <tr>
            <td>ESP32-S3</td>
            <td>3</td>
            <td>Yes (via IO MUX)</td>
            <td>20</td>
            <td>JTAG, Serial</td>
            <td>8MB (typical)</td>
            <td>Wi-Fi, Bluetooth LE</td>
        </tr>
        <tr>
            <td>ESP-01</td>
            <td>1</td>
            <td>No</td>
            <td>1</td>
            <td>Serial only</td>
            <td>512KB/1MB</td>
            <td>Wi-Fi</td>
        </tr>
        <tr>
            <td>Arduino Uno (ATmega328P)</td>
            <td>1</td>
            <td>No</td>
            <td>6</td>
            <td>Serial, DebugWire</td>
            <td>32KB</td>
            <td>None</td>
        </tr>
        <tr>
            <td>Blue Pill (STM32F103C8T6)</td>
            <td>3</td>
            <td>Yes (remappable)</td>
            <td>10</td>
            <td>SWD, Serial</td>
            <td>64KB/128KB</td>
            <td>None</td>
        </tr>
    </table>
    <p align="right"> no rpi pico here , the build system has won over my temper</p>
 </body>
 </html>
--- a/images/16x9/AQ_monitor.png
+++ b/images/16x9/AQ_monitor.png
--- a/images/16x9/esp32.png
+++ b/images/16x9/esp32.png
--- a/images/16x9/image0.png
+++ b/images/16x9/image0.png
--- a/images/16x9/opencv.png
+++ b/images/16x9/opencv.png
--- a/images/opencv.png
+++ b/images/opencv.png
--- a/images/photos/image0.png
+++ b/images/photos/image0.png
--- a/images/photos/image1.png
+++ b/images/photos/image1.png
--- a/images/photos/image2.png
+++ b/images/photos/image2.png
--- a/images/photos/image3.png
+++ b/images/photos/image3.png
--- a/images/photos/image4.png
+++ b/images/photos/image4.png
--- a/images/photos/image5.png
+++ b/images/photos/image5.png
--- a/images/sqarucos.png
+++ b/images/sqarucos.png
--- a/images/sqstm32.png
+++ b/images/sqstm32.png
--- a/index.css
+++ b/index.css
@@ -0,0 +1,214 @@
 /* menu part */
 .menu {
    border-top: double 4px silver;
    border-bottom: double 4px silver;
    text-align: right;
    font-size:  0;
 }
 .menu-item {
    display: inline-block;
    width: 8%;
    height: 3em;
    line-height: 3em; /* to align to center */
    text-align: center;
    vertical-align: middle;
    margin: 0 1%;
    overflow: hidden;
    text-overflow: ellipsis ;
    font-size:  medium;
 }
 .menu .selected {
    color: green;
    font-weight: bold;
    border-left: double 4px silver;
    border-right: double 4px silver;
 }
 .menu .menu-header {
    color: green;
    font-weight: bold;
    float: left;
 }
 .menu a {
    color: black;
 }
 /* 4 images part */
 .images-container  *{
    border:solid thin black;
 }
 .images-container {
    width: 90%;
    height: 200pt;
    margin: auto;
    overflow: hidden;
 }
 .half-size {
    width: 49%;
    margin: 0.2%;
    float: left;
 }
 .quarter-size {
    width: 24%;
    margin: 0.2%;
    float: left;
 }
 .image-column-container {
    width: 24%;
    height:100%;
    margin: 0.15%;
    float: left;
 }
 .image-column-container > div {
    width: 100%;
    height: 50%;
    margin-bottom: 1.4%;
    overflow: hidden;
    /* text-align: center; */
 }
 .images-container img{
    width:100% 
 }
 /* main block part */
 .main-block{
    width:80%;
    margin:1.2% auto;
 }
 .main-column{
    display: inline-block;
    width:25%;
 }
 .main-center{
    vertical-align: top;
    width: 48%;
    height:100%;
    display: inline-block;
 }
 .img-margin-fix {
    margin-right:10px;
 }
 .info-block{
    height:10%;
    padding: 5%;
 }
 .bg-aqua{
    background: #80DEEA;
 }
 .bg-grey{
    background: #B0BFC6;
 }
 .bg-blue{
    background: #BBDEFA;
 }
 .bg-yellow{
    background: #FFE0B2;
 }
 .info-block-header{
    display: block;
    margin:auto;
    text-align: center;
    font-size: 1.5em;
    font-weight: bold;
 }
 .info-block-text{
    display: block;
    text-align: justify;
 }
 .info-block-image{
    margin: 0% 5% 5%;
    width:90%;
    overflow: hidden;
 }
 .info-block-image >img{
    width: 100%;
 }
 .rounded{
    border-radius: 20px;
    overflow: hidden;
 }
 .info-block-button{
    float: right;
    color:white;
    background-color: #2294F4;
    border-radius: 5px;
 }
 .button-left{
    float: left;
 }
 .pad-down{
    margin-top: 40%;
    bottom: 0;
 }
 /* main block center part */
 .center-upper, .center-lower, .center-center{
    /* background-color: lightblue; DEBUG*/
    margin:5%;
 }
 .info-block-image-small{
    display: inline-block;
    width: 20%;
    height: 100%;
    background-color:black ;
    overflow: hidden;
    vertical-align: top;
 }
 .info-block-image-small >img{
    width: 100%;
 }
 .align-left{
    text-align: left;
 }
 .align-right{
    text-align: right;
 }
 .inline {
    display: inline-block;
 }
 .info-block-wide-text-container{
    width: 75%;
    margin: 0 1%;
 }
 .link{
    display: block;
    color:gray;
    margin-bottom: 0px;
    white-space: nowrap;
 }
 .info-block-image-center{
    display: inline-block;
    width: 50%;
    /* height: 100px; */
    background-color:black ;
    overflow: hidden;
    vertical-align: top;
 }
 .info-block-image-center >img{
    width: 100%;
 }
 .small-w{
    vertical-align: top;
    width: 23%;
 }
--- a/index.html
+++ b/index.html
@@ -6,61 +6,164 @@
    <title>
        "Portfolio"
    </title>
    <link rel="stylesheet" href="./index.css">
 </head>
 <body>
-
+    <div class="menu">
-    <h2 align="center">OkunElya's Portfolio</h2>
+        <div class="menu-item menu-header">Portfolio Site </div>
-    <p align="center">
+        <a href="./index.html">
-        <b>Q:</b> What's this site for? <br>
+            <div class="menu-item selected">Home</div>
-        <b>A:</b> Just to show progress in education ( check git)
+        </a>
    </p>
    <p align="center">
        <b>Q:</b> Why? <br>
        <b>A:</b> Because.
    </p>
    <hr width="80%" align="center">
    <h3>Experience:</h3>
        <a href="./embeded_details.html">
-        <h4><i>Embedded Systems:</i></h4>
+            <div class="menu-item">Embedded</div>
        </a>
    <p> Had a serval projects with different MCUs and wrote firmware for them. <br>
        My main stack consists of Platformio+EspIdf or Arduino, also tried STM32</p>
    <a href="https://github.com/OkunElya/Air-Quality-Monitor-Device">
        <img src="./images/AQ_monitor.png" width="50%" border="2" alt="Air Quality Monitor Device"><br>
        <p><i>Click the image to check GitHub Project</i></p>
    </a>
    <hr width="80%" align="center">
        <a href="./opencv_details.html">
-        <h4><i>OpenCV:</i></h4>
+            <div class="menu-item">OpenCV</div>
        </a>
-    <p> I love when programs are able to <i>see</i> things or recognise them<br>
+        <a href="./photography_details.html">
-        so i had serval projects involding image processing <br>
+            <div class="menu-item">Photography</div>
-        Sadly i'm used to opencv binding in python and not C++ , but that is solvable)</p>
+        </a>
        <a href="./table.html">
            <div class="menu-item">Table</div>
        </a>
        <a href="./images/institute.png">
            <div class="menu-item">Institute</div>
        </a>
    </div>
    <p>
        <img src="./images/arucos.png" width="50%" border="2" alt="Image of a table with arucos sheet"><br>
        <i>Random image from the internet (not mine)</i>
    </p>
-    <hr width="80%" align="center">
+    <div class="images-container">
-    <h3>Hobbies:</h3>
+        <div class="half-size">
-    <ol>
+            <img src="./images/arduino.png" alt="Arduino">
-        <li>
+        </div>
            <p>Reading:<br> I love stephen king books , especially "<a href="./images/institute.png">Insitite</a>"</p>
        </li>
        <li>
            <p><a href="./photography_details.html">Photography:</a><br> If I have some <i>free time</i> I may take some pictures and post them <a
                    href="https://t.me/iTakePhotosOnTapok">here</a> </p>
        </li>
    </ol>
    <hr width="80%" align="center">
-    <h3><a href="./table.html"> Table!!!! With Filters!!! (not working yet)</a></h3>
+        <div class="quarter-size">
            <img src="./images/esp32.png" alt="ESP32">
        </div>
        <div class="image-column-container">
            <div>
                <img src="./images/institute.png" alt="ESP32">
            </div>
            <div>
                <img src="./images/arucos.png" alt="ESP32">
            </div>
        </div>
    </div>
    <div class="main-block">
        <div class="main-column">
            <div class="info-block rounded bg-aqua">
                <span class="info-block-header">Embedded Systems</span>
                <span class="info-block-text">THad a serval projects with different MCUs and wrote firmware for them.
                    My main stack consists of Platformio+EspIdf or Arduino, also tried STM32
                </span>
                <div class="info-block-image rounded">
                    <img src="./images/16x9/esp32.png" alt="ESP32">
                </div>
                <button type="button" class="info-block-button">More info»</button>
            </div>
            <div class="info-block rounded bg-grey pad-down">
                <span class="info-block-header">OpenCV</span>
                <span class="info-block-text">I love when programs are able to see things or recognise them
                    so i had serval projects involding image processing
                    Sadly i'm used to opencv binding in python and not C++ , but that is solvable)
                </span>
                <div class="info-block-image rounded">
                    <img src="./images/16x9/opencv.png" alt="ESP32">
                </div>
                <button type="button" class="info-block-button">More info»</button>
            </div>
        </div>
        <div class="main-center">
            <div class="center-upper">
                <div class="info-block-image-small ">
                    <img src="./images/sqstm32.png" alt="stm32">
                </div>
                <div class="inline info-block-wide-text-container ">
                    <span class="info-block-header align-left">STM 32</span>
                    <span class="info-block-text ">Chinese STM32 microcontrollers are affordable and compatible with
                        STM32 tools but may face flashing issues due to bootloader differences. Proper connections and
                        reliable tools can help resolve these.</span>
                    </span>
                    <a class="link align-left" href="./index.html">More info»</a>
                </div>
            </div>
            <div class="center-center">
                <span class="info-block-header">Stephen King's books</span>
                <span class="info-block-text inline small-w">Stephen King's books are a fascinating blend of horror,
                    suspense, and deep
                    character development. His storytelling captivates readers and keeps them on the edge of their
                    seats.</span>
                <div class="info-block-image-center">
                    <img src="./images/institute.png" alt="ESP32">
                </div>
                <span class="info-block-text inline small-w">
                    Especially I love the institute, its architecture, and the vibrant community it fosters. The
                    institute has been a source of inspiration and growth for me, providing countless opportunities to
                    learn and collaborate.
                    <a class="link small-w" href="./index.html">More info»</a>
                </span>
            </div>
            <div class="center-lower">
                <div class="inline info-block-wide-text-container">
                    <span class="info-block-header align-right">Arucos</span>
                    <span class="info-block-text ">ArUco markers are widely used in computer vision for camera
                        calibration, pose estimation, and augmented reality applications. They are square fiducial
                        markers with a unique binary pattern that can be easily detected and identified in
                        images.</span>
                    </span>
                    <a class="link align-right" href="./index.html">More info»</a>
                </div>
                <div class="info-block-image-small">
                    <img src="./images/sqarucos.png" alt="ESP32">
                </div>
            </div>
        </div>
        <div class="main-column">
            <div class="info-block rounded bg-blue">
                <div class="info-block-image rounded">
                    <img src="./images/16x9/image0.png" alt="Photography">
                </div>
                <span class="info-block-header">Photography</span>
                <span class="info-block-text">Capturing moments through the lens is a passion of mine. I enjoy exploring
                    different perspectives and techniques to create different visuals.</span>
                <button type="button" class="info-block-button button-left">More info»</button>
            </div>
            <div class="info-block rounded bg-yellow pad-down">
                <div class="info-block-image rounded">
                    <img src="./images/16x9/AQ_monitor.png" alt="Air Quality Monitor">
                </div>
                <span class="info-block-header">IoT and Air Quality Monitoring</span>
                <span class="info-block-text">The Internet of Things (IoT) enables devices to communicate and share data
                    seamlessly. One of the applications is air quality monitoring, where sensors collect data on
                    pollutants and environmental conditions, providing real-time insights to improve health and
                    safety.</span>
                <button type="button" class="info-block-button button-left">More info»</button>
            </div>
        </div>
    </div>
    <p>Author: Kulesh <br>
        Group: Б9123-09.03.04</p>
 </body>
 </html>
--- a/labs/images/c.jpg
+++ b/labs/images/c.jpg
--- a/labs/images/java.jpg
+++ b/labs/images/java.jpg
--- a/labs/images/javascript.jpg
+++ b/labs/images/javascript.jpg
--- a/labs/images/prolog.jpg
+++ b/labs/images/prolog.jpg
--- a/labs/images/python.jpg
+++ b/labs/images/python.jpg
--- a/labs/images/ruby.jpg
+++ b/labs/images/ruby.jpg
--- a/labs/lab2/lab2.css
+++ b/labs/lab2/lab2.css
@@ -0,0 +1,23 @@
 .main-block{
    margin: auto;
    width: 90%;
    background-color: lightgreen;
 }
 .info-block{
    display: inline-block;
    margin:15px;
    width: 180px;
 }
 .info-block-header{
    padding: 5px;
    background-color: white;
    display: inline-block;
    font-weight: bold;
 }
 .info-block-text{
    padding: 5px;
    background-color: white;
 }
--- a/labs/lab2/lab2.html
+++ b/labs/lab2/lab2.html
@@ -0,0 +1,42 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>
        Lab 2
    </title>
    <link rel="stylesheet" href="./lab2.css">
 </head>
 <body>
    <div class="main-block">
        <div class="info-block">
            <div class="info-block-header">C</div>
            <div class="info-block-text">разработан в 1969–1973 годах сотрудником Bell Labs Деннисом Ритчи.</div>
        </div>
         <div class="info-block">
            <div class="info-block-header">JavaScript </div>
            <div class="info-block-text">разработан в 1996 году, автор - американский программист Брендан Айк.</div>
        </div>
         <div class="info-block">
            <div class="info-block-header">Prolog </div>
            <div class="info-block-text">разработан в 1972 году, автор - французский программист Ален Колмероэ.</div>
        </div>
         <div class="info-block">
            <div class="info-block-header">Python </div>
            <div class="info-block-text">создан в 1989–1991 годах голландским программистом Гвидо ван Россумом.</div>
        </div>
         <div class="info-block">
            <div class="info-block-header">Java </div>
            <div class="info-block-text">разработан в 1990–1996 годах канадским программистом  Джеймсом Гослингом.</div>
        </div>
         <div class="info-block">
            <div class="info-block-header">Ruby </div>
            <div class="info-block-text">разработан в 1993-1995 годах, автор - японский программист Юкихиро Мацумото.</div>
        </div>
    </div>
 </body>
--- a/labs/lab3/lab3.css
+++ b/labs/lab3/lab3.css
@@ -0,0 +1,55 @@
 h3{
    text-align: center;
    margin: 1vh;
 }
 .content{
    background-color: lightgreen;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    padding:10px;
 }
 .topic > b{
    display: block;
    width: 40%;
 }
 .topic * {
    display: inline-block;
 }
 .content :first-child b, .content :first-child  a{
    background-color: lightgreen;
 }
 .topic{
    /* width:calc(50%-10px); */
    padding:5px 10px;
    margin: 10px ;
    background-color: white;
 }
@media (max-width:800px) {
    .content{
        flex-direction: column;
    }
 }
 /* grid part */
 p{
    margin:  5px auto;
    max-width: 600px;
    display: grid;
    grid-template-rows: 1fr 1fr; 
    grid-template-columns: 1fr 1fr; 
    grid-gap: 5px;
 }
 p > a{
    background-color: lightgray;
    text-decoration: none;
    color: black;
    text-align: center;
 }
 p> :first-child{
    background-color: lightgreen;
 }
--- a/labs/lab3/lab3.html
+++ b/labs/lab3/lab3.html
@@ -0,0 +1,34 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>
        Lab 3
    </title>
    <link rel="stylesheet" href="./lab3.css">
 </head>
 <body>
    <h3>Языки программирования</h3>
    <p>
        <a href="#">Python</a>
        <a href="#">C</a>
        <a href="#">Java</a>
        <a href="#">JavaScript</a>
    </p>
    <div class="content">
        <div class="topic">
            <b>Python</b> создан в 1989–1991 годах голландским программистом <a href="#"> Гвидо ван Россумом</a>.
        </div>
        <div class="topic"> 
            <b>C</b> разработан в 1969–1973 годах сотрудником Bell Labs <a href="#"> Деннисом Ритчи</a>.
        </div>
        <div class="topic">
            <b>Java</b> разработан в 1990–1996 годах канадским программистом <a href="#"> Джеймсом Гослингом</a>.
        </div>
        <div class="topic">
            <b>JavaScript</b> разработан в 1996 году, автор - американский программист <a href="#">Брендан Айк</a>.
        </div>
    </div>
 </body>
--- a/labs/lab4/content.txt
+++ b/labs/lab4/content.txt
@@ -0,0 +1,40 @@
        CN Tower, Торонто, Канада
            553,3-метровая телевизионная башня. Была самым высоким свободно стоящим сооружением в мире с 1976 по 2007 год, 
 		    а также до сих пор остаётся таковым в Западном полушарии. Является символом Торонто.
            Земляные работы для сооружения железобетонной конструкции с последующим 
 		    натяжением арматуры весом 130 000 т начались 12 февраля 1973 г., а уже 2 апреля 1975 г. возведение башни было завершено.  
 		   Башня используется для телекоммуникационных нужд. Кроме того, башня используется как обзорная площадка. 
 		   Также на башне имеется вращающийся ресторан.
           На высоте 447 м находится астрономическая обсерватория.
         Бурдж-Халифа, Дубай, ОАЭ
            Небоскрёб высотой 828 метров, самое высокое сооружение в мире. Форма здания напоминает сталагмит.
            Строительство небоскрёба началось в 2004 году и шло со скоростью 1—2 этажа в неделю. Ежедневно на строительстве 
 			работало до 12 000 рабочих. На его создание ушло около 320 тыс. м³ бетона и более 60 тыс. тонн стальной арматуры. 
 			Бетонные работы были завершены после возведения 160 этажа, далее шла сборка 180-метрового шпиля из металлических 
 			конструкций.
            Специально для «Бурдж-Халифа» была разработана особая марка бетона, который выдерживает температуру до +50 °C.
 			Бетонную смесь укладывали только ночью, а в раствор добавляли лёд.
        Небесное дерево, Токио, Япония
            Телевизионная башня в районе Сумида самая высокая среди телебашен мира. Высота телебашни вместе с антенной составляет 634 метра. 
 			Высота башни была выбрана так, чтобы цифры: 6 (на старом японском «му»), 3 («са»), 4 («си») были созвучны «Мусаси» — 
 			названию исторической области, где находится современный Токио.
            Здание напоминает пятиярусную пагоду, что хорошо сочетается с историческим районом Асакуса на другом берегу реки. 
 			Основание башни напоминает штатив; с высоты примерно 350 м она имеет цилиндрическую форму, позволяющую наслаждаться 
 			панорамными видами реки и города. 
             Имеются две наблюдательные площадки: одна на высоте 350 м (вместимостью 2000 человек), другая на высоте 450 м 
 		     (вместимостью 900 человек). 
--- a/labs/lab4/css/bootstrap.min.css
+++ b/labs/lab4/css/bootstrap.min.css
--- a/labs/lab4/images/image1.jpg
+++ b/labs/lab4/images/image1.jpg
--- a/labs/lab4/images/image10.jpg
+++ b/labs/lab4/images/image10.jpg
--- a/labs/lab4/images/image11.jpg
+++ b/labs/lab4/images/image11.jpg
--- a/labs/lab4/images/image12.jpg
+++ b/labs/lab4/images/image12.jpg
--- a/labs/lab4/images/image13.jpg
+++ b/labs/lab4/images/image13.jpg
--- a/labs/lab4/images/image2.jpg
+++ b/labs/lab4/images/image2.jpg
--- a/labs/lab4/images/image3.jpg
+++ b/labs/lab4/images/image3.jpg
--- a/labs/lab4/images/image4.jpg
+++ b/labs/lab4/images/image4.jpg
--- a/labs/lab4/images/image5.jpg
+++ b/labs/lab4/images/image5.jpg
--- a/labs/lab4/images/image6.jpg
+++ b/labs/lab4/images/image6.jpg
--- a/labs/lab4/images/image7.jpg
+++ b/labs/lab4/images/image7.jpg
--- a/labs/lab4/images/image8.jpg
+++ b/labs/lab4/images/image8.jpg
--- a/labs/lab4/images/image9.jpg
+++ b/labs/lab4/images/image9.jpg
--- a/labs/lab4/index.html
+++ b/labs/lab4/index.html
@@ -0,0 +1,208 @@
 <!DOCTYPE html>
 <html lang="ru">
 <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Лабораторная работа Bootstrap</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <script src="js/bootstrap.bundle.min.js"></script>
    <style>
        .lead{
            text-align: justify;
        }
        @media (max-width: 576px) {
            .lead{
            font-size: 1rem;
            }
        }
    </style>
 </head>
 <body>
    <header>
        <nav class="navbar navbar-expand-md bg-light navbar-light">
            <!-- Заголовок -->
            <a class="navbar-brand" href="#">Топ высотных зданий</a>
            <!-- Кнопка для свернутого меню -->
            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#menu">
                <span class="navbar-toggler-icon"></span>
            </button>
            <!-- меню -->
            <div class="collapse navbar-collapse" id="menu">
                <ul class="navbar-nav">
                    <li class="nav-item">
                        <a class="nav-link active" href="#">Главная</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="#">Список зданий</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link disabled" href="#">Контакты</a>
                    </li>
                </ul>
                <!-- форма для поиска -->
                <form class="d-flex">
                    <input class="form-control" type="text" placeholder="Найти">
                    <button class="btn btn-outline-success" type="submit">Найти</button>
                </form>
            </div>
        </nav>
    </header>
    <div class="row gy-3 text-center d-none d-md-flex">
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image1.jpg" alt="">
        </div>
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image2.jpg" alt="">
        </div>
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image12.jpg" alt="">
        </div>
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image4.jpg" alt="">
        </div>
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image5.jpg" alt="">
        </div>
        <div class="col-lg-2 col-md-4 col-6 img-fluid img-thumbnail">
            <img src="images/image6.jpg" alt="">
        </div>
    </div>
    <div id="gallery" class="carousel slide carousel-dark d-block d-md-none " data-bs-ride="carousel">
        <!-- Содержимое галереи -->
        <div class="carousel-inner">
            <div class="carousel-item active">
            </div>
            <div class="carousel-item ">
                <img src="images/image1.jpg" class="d-block mx-auto" alt="">
            </div>
            <div class="carousel-item">
                <img src="images/image2.jpg" class="d-block mx-auto" alt="">
            </div>
            <div class="carousel-item">
                <img src="images/image12.jpg" class="d-block mx-auto" alt="">
            </div>
            <div class="carousel-item">
                <img src="images/image4.jpg" class="d-block mx-auto" alt="">
            </div>
            <div class="carousel-item">
                <img src="images/image5.jpg" class="d-block mx-auto" alt="">
            </div>
            <div class="carousel-item">
                <img src="images/image6.jpg" class="d-block mx-auto" alt="">
            </div>
        </div>
        <!-- Кнопки управления -->
        <button class="carousel-control-prev" type="button" data-bs-target="#gallery" data-bs-slide="prev">
            <span class="carousel-control-prev-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Предыдущий</span>
        </button>
        <button class="carousel-control-next" type="button" data-bs-target="#gallery" data-bs-slide="next">
            <span class="carousel-control-next-icon" aria-hidden="true"></span>
            <span class="visually-hidden">Следующий</span>
        </button>
    </div>
    <main class="container">
        <div class="row">
            <div class="col-md-9">
                <h2>
                    CN Tower, <span class="text-muted">Торонто, Канада</span>
                </h2>
                <p class="lead">
                    553,3-метровая телевизионная башня. Была самым высоким свободно стоящим сооружением в мире с 1976 по
                    2007 год,
                    а также до сих пор остаётся таковым в Западном полушарии. Является символом Торонто.
                </p>
                <p class="lead">
                    Земляные работы для сооружения железобетонной конструкции с последующим
                    натяжением арматуры весом 130 000 т начались 12 февраля 1973 г., а уже 2 апреля 1975 г. возведение
                    башни было завершено.
                </p>
                <p class="lead">
                    Башня используется для телекоммуникационных нужд. Кроме того, башня используется как обзорная
                    площадка.
                    Также на башне имеется вращающийся ресторан.
                </p>
                <p class="lead">
                    На высоте 447 м находится астрономическая обсерватория.
                </p>
            </div>
            <div class="col-md-3">
                <img src="images/image9.jpg">
            </div>
        </div>
        <div class="row order flex-row-reverse">
            <div class="col-md-9">
            <h2>
                Бурдж-Халифа, <span class="text-muted">Дубай, ОАЭ</span>
            </h2>
            <p class="lead">
                Небоскрёб высотой 828 метров, самое высокое сооружение в мире. Форма здания напоминает сталагмит.
            </p>
            <p class="lead">
                Строительство небоскрёба началось в 2004 году и шло со скоростью 1—2 этажа в неделю. Ежедневно на строительстве 
                работало до 12 000 рабочих. На его создание ушло около 320 тыс. м³ бетона и более 60 тыс. тонн стальной арматуры. 
                Бетонные работы были завершены после возведения 160 этажа, далее шла сборка 180-метрового шпиля из металлических 
                конструкций.
            </p>
            <p class="lead">
                Специально для «Бурдж-Халифа» была разработана особая марка бетона, который выдерживает температуру до +50 °C.
                Бетонную смесь укладывали только ночью, а в раствор добавляли лёд.
            </p>
            </div>
             <div class="col-md-3">
            <img src="images/image13.jpg">
            </div>
        </div>
        <div class="row">
            <div class="col-md-9">
            <h2>
                Небесное дерево, <span class="text-muted">Токио, Япония</span>
            </h2>
            <p class="lead">
                Телевизионная башня в районе Сумида самая высокая среди телебашен мира. Высота телебашни вместе с антенной составляет 634 метра.
                Высота башни была выбрана так, чтобы цифры: 6 (на старом японском «му»), 3 («са»), 4 («си») были созвучны «Мусаси» —
                названию исторической области, где находится современный Токио.
            </p>
            <p class="lead">
                Здание напоминает пятиярусную пагоду, что хорошо сочетается с историческим районом Асакуса на другом берегу реки.
                Основание башни напоминает штатив; с высоты примерно 350 м она имеет цилиндрическую форму, позволяющую наслаждаться
                панорамными видами реки и города.
            </p>
            <p class="lead">
                Имеются две наблюдательные площадки: одна на высоте 350 м (вместимостью 2000 человек), другая на высоте 450 м
                (вместимостью 900 человек).
            </p>
            </div>
            <div class="col-md-3">
            <img src="images/image11.jpg">
            </div>
        </div>
    </main>
 </body>
 </html>
--- a/labs/lab4/js/bootstrap.bundle.min.js
+++ b/labs/lab4/js/bootstrap.bundle.min.js
--- a/labs/lab4/js/bootstrap.bundle.min.js.map
+++ b/labs/lab4/js/bootstrap.bundle.min.js.map
--- a/last_git_commits.csv
+++ b/last_git_commits.csv
--- a/opencv_details.html
+++ b/opencv_details.html
@@ -0,0 +1,48 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>
        OpenCV Details
    </title>
 </head>
 <body bgcolor="#F0F8FF">
    <details>
        <summary>Menu</summary>
        <ul>
            <li><a href="./index.html">Home</a></li>
            <li><a href="./embeded_details.html"><h4>Embeded Details</h4></a></li>
            <li><a href="./opencv_details.html">OpenCV Details</a></li>
            <li><a href="./photography_details.html">Photography Details</a></li>
            <li><a href="./table.html">Table with filters (not working yet)</a></li>
            <li><a href="./images/institute.png">Institute</a></li>
        </ul>
    </details>
    <h2 align="center">OpenCV Details</h2>
    <hr width="800" align="center">
    <p align="center">
        <img src="./images/opencv.png" alt="OpenCV" height="150" align="top">
        as mentioned before i love when programs are able to <i>see</i> things <br>
        my experience with opencv started with simple hight level functions like detectCircle or findContours and
        etc...<br>
        Right now i'm crawling deeper into the library , and the idea of standartisation of parameters between different
        cameras is appealig to me <br>
        so i'm trying to understand how all that works from the math side<br>
        Additionally, I'm exploring Re-Identification (ReId) techniques,
        they are used for recognizing and tracking objects across different camera views or consecutive frames.
    </p>
    <hr width="500" align="center">
    <p>
        One of many projects I've worked on is <a href="https://github.com/OkunElya/ArucoNGP-MapCreator"
            target="_blank">ArucoNGP-MapCreator</a>.<br>
        The idea was to create a relative map of Aruco markers just from photos of pairs (or more) of them.<br>
        It can also estimate the camera's position in the world relative to a specific marker, using only images
        containing any marker.<br>
        It was also my first deep dive into linear algebra.<br>
    </p>
 </body>
 </html>
--- a/photography_details.html
+++ b/photography_details.html
@@ -0,0 +1,42 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <title>
        Photography Details
    </title>
 </head>
 <body bgcolor="#F0F8FF">
    <details>
        <summary>Menu</summary>
        <ul>
            <li><a href="./index.html">Home</a></li>
            <li><a href="./embeded_details.html">Embeded Details</a></li>
            <li><a href="./opencv_details.html">OpenCV Details</a></li>
            <li><a href="./photography_details.html"><h4>Photography Details</h4></a></li>
            <li><a href="./table.html">Table with filters (not working yet)</a></li>
            <li><a href="./images/institute.png">Institute))</a></li>
        </ul>
    </details>
    <h2 align="center">Photography Details</h2>
    <hr width="800" align="center">
    <p align="center">
        Usually i capture landcape scenes  with SLR camera, the main workhorse is Nikon D3100 with kit and 70-210mm 
    </p>
    <p align="center">
        <img src="images/photos/image0.png" alt="Photo 0" width="200">
        <img src="images/photos/image1.png" alt="Photo 1" width="200">
        <img src="images/photos/image2.png" alt="Photo 2" width="200">
    </p>
    <p  align="center">
        <img src="images/photos/image3.png" alt="Photo 3" width="200">
        <img src="images/photos/image4.png" alt="Photo 4" width="200">
        <img src="images/photos/image5.png" alt="Photo 5" width="200">
    </p>
 </body>
 </html>
--- a/table.html
+++ b/table.html
Author	SHA1	Message	Date
OkunElya	369c5c0428	bruh linux fix	2025-11-13 16:55:05 +10:00
OkunElya	124bc09d44	adding bootstrap	2025-11-01 01:21:25 +10:00
OkunElya	91a952aaf0	adding resources	2025-10-31 12:05:20 +10:00
OkunElya	d691d57037	fixed attributes	2025-10-31 10:27:11 +10:00
OkunElya	0b2a468083	lab3 done all	2025-10-31 00:22:54 +10:00
OkunElya	c0c5d4dbcd	images fixed	2025-10-30 23:45:38 +10:00
OkunElya	36c358e9d9	i'm coocked	2025-10-30 23:04:28 +10:00
OkunElya	c21e4184b4	homework p2 continuing	2025-10-30 22:23:48 +10:00
OkunElya	b3fd772683	lab-3 done lower part	2025-10-20 11:03:14 +10:00
OkunElya	f17d3fada5	fixing menu	2025-10-17 11:04:36 +10:00
OkunElya	7380cd869e	images aligned	2025-10-17 04:45:29 +10:00
OkunElya	bc8100246d	menu done	2025-10-17 04:10:13 +10:00
OkunElya	c8c35a4cf2	added lab 2	2025-10-03 14:43:42 +10:00
OkunElya	cfbf9440d0	fixed forms in tables	2025-10-03 11:09:05 +10:00
OkunElya	382e69d10d	fixed bad attributes in validator	2025-10-03 10:13:43 +10:00
OkunElya	4d9112a099	added small description for data	2025-10-03 04:08:50 +10:00
OkunElya	d7cc0e5332	updated table with converted data + added filters	2025-10-03 04:06:52 +10:00
OkunElya	e4afda0e44	added a script to convert cvs data to temp	2025-10-03 03:48:38 +10:00
OkunElya	2c13f78426	added photograpy page	2025-10-03 03:24:15 +10:00
OkunElya	6ede163c3d	now selected item in menu is bigger	2025-10-03 03:13:16 +10:00
OkunElya	476235a80c	uploaded photos	2025-10-03 03:06:42 +10:00
OkunElya	006051b810	added image gallery	2025-10-03 02:59:33 +10:00
OkunElya	dbf083a945	added opencv details page	2025-10-03 02:54:45 +10:00
OkunElya	4212839f4c	added embeded details	2025-10-03 02:40:11 +10:00
OkunElya	da613d3702	added menu and footer to the index	2025-10-03 02:23:36 +10:00