<?php
include "classes/html.class.php";
$html = new html("receive MANUAL");
$db = new db();
?>

<div>
    <br>
    <h1 style="font-size: 2vw;text-align: center;">Step 1:Click RECEIVE on the Homepage</h1>

    <div id="list1" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">HOMEPAGE</h2>
            <hr><br>
            <img src="images/home.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">The Home Page is the central navigation hub of the LOWVELD NUTS application.<br>
                From here, users can access all core functions involved in nut processing and operations management.
            </p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>*RECEIVE</b> - Recording all the batch data received into the system</li>
                <li><b>DEHUSK</b> - Opens the dehusking section to track which batches have to dehusked</li>
                <li><b>BINS</b> - Manage and monitor the drying bins and store nuts into the silos</li>
                <li><b>SILO</b> - Opens the silo management section with the current data in all silos</li>
                <li><b>MANUAL</b> - Opens documentation, system instructions and guide for the system</li>
                <li><b>ADD</b> - Opens a submenu where users can add new silos, varieties, clients, etc.</li>
                <li><b>REPORTS</b> - Access system generated reports and analytics on clients, nuts received etc. </li>
                <li><b>DASHBOARDS</b> - Dashboard overview of current system data</li>
            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 2:Click Pre-check </h1>

    <div id="list2" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">PRE-CHECK</h2>
            <hr><br>
            <img src="images/receive.png" alt=" add home"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">To record a new batch in pre-check and to confirm the data based on the data in check</p>
            <hr>
            <h3 style="font-size: 1.5vw;">Button Description</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>PRE-CHECK</b> - Record a new batch </li>
                <li><b>CHECK</b> - Update the data based on the pre-check data and lab report.
                </li>
            </ul>
            </p>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 3:Example of pre-check</h1>
    <div id="list3" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">EXAMPLE</h2>
            <hr><br>
            <img src="images/pre_check.png" alt="pre check"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;"> <br>The Pre-Check section is designed to verify and validate incoming nut batches before they are fully received into the system</p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Tips & Considerations</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>Sound not sound</b> - if not sound then the batch is rejected but the data is recorded to the system</li>
                <li><b>All required fields are filled</b> - Ensure all values are correctly filled before submitting.
                </li>
                <li><b>Special Characters</b> - Avoid using special characters in the inputs field unless supported.</li>
                <li><b>Confirmation</b> - A confirmation or success message should appear on submitting </li>
            </ul>
            <img src="images/confirm.png" alt="add silo" style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            </p>
            <br>
            <br>
        </div>
    </div>

    <h1 style="font-size: 2vw;text-align: center;">Step 4:Example of checking a batch</h1>
    <div id="list3" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">EXAMPLE</h2>
            <hr><br>
            <img src="images/check.png" alt="add silo"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;">The Check page is used to perform a detailed verification of nut batches after they have passed the Pre-Check stage</p>
            <br>
            </p>
        </div>


    <h1 style="font-size: 2vw;text-align: center;">Step 5:Example of check</h1>
    <div id="list3" style="align-items: center;">
        <div class='form' style="padding-bottom: 0%;">
            <h2 style="font-size: 2vw;">EXAMPLE</h2>
            <hr><br>
            <img src="images/pre_check.png" alt="pre check"
                style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            <p style="font-size: 1vw;">
                <br>
                <hr>
            <h3 style="font-size: 1.5vw;">Overview</h3>
            <p style="font-size: 1vw;"> <br>The Check page is used to Review and confirm key information such as weight, sound not sound, and moisture.</p>
            <br><br>
            <hr>
            <h3 style="font-size: 1.5vw;">Tips & Considerations</h3>
            <ul style="list-style-type:none;line-height: 1.5vw;font-size: 1vw;">
                <li><b>Sound not sound</b> - if not sound then the batch is rejected but the data is recorded to the system</li>
                <li><b>All required fields are filled</b> - Ensure all values are correctly filled before submitting.
                </li>
                <li><b>Shell</b> - Bin put added is there is no shell present </li>
                <li><b>Special Characters</b> - Avoid using special characters in the inputs field unless supported.</li>
                <li><b>Confirmation</b> - A confirmation or success message should appear on submitting </li>
            </ul>
            <img src="images/noti.png" alt="add silo" style="width: 80%; padding: 1vw; border: #099200 5px solid;border-radius: 2vw;">

            </p>
            <br>
            <br>
        </div>
    </div>
    <br>
    <br>

</div>