<?php include "../../root.class.php";
$html = new html();
$html->add_styles_page();
// $html->check_user_type("ADMIN");


$add_label = new label();
$add_label->for("add_label");
$add_label->value("ADD PAGE EXAMPLE");
$add_label->addAttribute("style", "font-size: 3vw;");

$home_label = new label();
$home_label->for("home_label");
$home_label->value("ADD HOME");
$home_label->addAttribute("style", "font-size: 3vw;");

$overview_label = new label();
$overview_label->for("overview");
$overview_label->value("OVERVIEW");
$overview_label->addAttribute("style", "font-size: 3vw;");

$page_des_label = new label();
$page_des_label->for("page_description");
$page_des_label->value("PAGE DESCRIPTION");
$page_des_label->addAttribute("style", "font-size: 3vw;");

$button_des_label = new label();
$button_des_label->for("button_description");
$button_des_label->value("BUTTON DESCRIPTION");
$button_des_label->addAttribute("style", "font-size: 3vw;");

$example_label = new label();
$example_label->for("example");
$example_label->value("EXAMPLE");
$example_label->addAttribute("style", "font-size: 3vw;");

$tips_label = new label();
$tips_label->for("tips");
$tips_label->value("TIPS & CONSIDERATIONS");
$tips_label->addAttribute("style", "font-size: 3vw;");

$side_label = new label();
$side_label->for("side");
$side_label->value("TIPS, CONSIDERATIONS & SIDE NOTES");
$side_label->addAttribute("style", "font-size: 3vw;");

?>

<div class="form_down">
    <div>
        <?php $home_label->add(); ?>
        <br><br>
        <div>
            <img src="../images/add_home.png" alt="Default Navbar"
                style="width: 80%; margin: 1vw;border: 3px solid navy;border-radius: 2vw; padding: 1vw;">
        </div>

        <br>
        <hr style="border: 2px solid black;">
        <br>

        <?php $overview_label->add(); ?>

        <div>
            <p style="font-size: 1.5vw;line-height: 2vw;">From here, you can add to essential sections like Variety,
                Clients, Bins, Silo and Users.<br> All the add pages have home pages with a list of all the available
                options for different sections. </p>
        </div>

        <br>
        <hr style="border: 2px solid black;">
        <br>

        <?php $button_des_label->add(); ?>
        <div style="display: flex;align-items: center;text-align: left;padding: 1vw;justify-content: center;">
            <ul style="list-style-type:none;line-height: 3vw;font-size: 1.5vw;">
                <li><b>VARIETY</b> - Add a different type of nut variety</li>
                <li><b>CLIENTS -</b> Add client related data, such as company name, phone number, and business details.
                </li>
                <li><b>BINS</b> - Add the new drying bin information</li>
                <li><b>SILO</b> - Add a new store silo</li>
                <li><b>USER</b> - Add a new user to the system</li>
            </ul>
        </div>
    </div>
</div>

<br>

<div class="form_down">
    <div>
        <?php $add_label->add(); ?>
        <br><br>
        <div>
            <img src="../images/add_page.png" alt="Default Navbar"
                style="width: 80%; margin: 1vw;border: 3px solid navy;border-radius: 2vw; padding: 1vw;">
        </div>

        <br>
        <hr style="border: 2px solid black;">
        <br>

        <?php $page_des_label->add(); ?>

        <div style="display: flex;align-items: center;text-align: left;padding: 1vw; justify-content: center;">
            <ul style="list-style-type:none;line-height: 3vw;font-size: 1.5vw;">
                <li><b>HEADING/LABELS</b> - description of the current page</li>
                <li><b>INPUTS/SELECTS</b> - enter or select data based on labels or placeholders</li>
                <li><b>BUTTON</b> - submit the data in the form</li>
            </ul>
        </div>

        <br>
        <hr style="border: 2px solid black;">
        <br>

        <?php $tips_label->add(); ?>
        <div style="display: flex;align-items: center;text-align: left;padding: 1vw;justify-content: center;">
            <ul style="list-style-type:none;line-height: 3vw;font-size: 1.5vw;">
                <li><b>Use consistent & unique naming</b> - this is to ensure that all data added is unique and easy to
                    identify</li>
                <li><b>All required fields are filled -</b> Ensure all values are correctly filled before tapping ADD.
                </li>
                <li><b>Special Characters</b> - Avoid using special characters in the Name field unless supported.</li>
            </ul>
        </div>
    </div>
</div>

<br>

<div class="form_down">
    <div>
        <?php $side_label->add(); ?>

        <br>
        <hr style="border: 2px solid black;">

        <div style="display: flex;align-items: center;text-align: left;padding: 1vw;justify-content: center;">
            <ul style="list-style-type:none;line-height: 3vw;font-size: 1.5vw; text-align: center;">
                <li><b>Use consistent & unique naming</b> - this is to ensure that all data added is unique, easy to
                    identify and avoid errors.</li>
                <li><b>Special Characters</b> - Avoid using special characters in the Name field unless supported.</li>
                <li><b>All required fields are filled -</b> Ensure all values are correctly filled before tapping ADD.
                </li>
                <li><b>Confirmation</b> - A confirmation or success message should appear on submitting</li>
            </ul>
        </div>

        <div>
            <img src="../images/add_pop.png" alt="Default Navbar"
                style="width: 20%; margin: 1vw;border: 3px solid navy;border-radius: 2vw;padding: 1vw;">
        </div>
    </div>
</div>