Untitled

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>MJK</title>
    <link href="https://fonts.googleapis.com/css?family=Bungee" rel="stylesheet">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <link rel="icon" href="misc/ico/kek.ico">
    <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet">
    <script type="text/javascript" src="js/main.js"></script>
</head>

<body>
<header class="hdr">
    <div class="hdrf">
        <div class="burger">
            <i class="material-icons im">menu</i>
        </div>
    </div>
</header>
<div class="top">
    <div class="center">
        <h1>MJK</h1>
    </div>
</div>
<div class="sortBy">
    <span>SORT BY: </span>
    <form method="get">
        <label>
            <input type="hidden" name="color" value="<?php echo $_GET['color'] ?>" />
            <select name="sortBy" onchange='this.form.submit()'>
                <option disabled selected value><?php echo $_GET['sortBy'] ?></option>
                <option value="N DESC">New</option>
                <option value="N ASC">Old</option>
                <option value="pPrice ASC">Price ASC</option>
                <option value="pPrice DESC">Price DESC</option>
                <option value="Size ASC">Size ASC</option>
                <option value="Size DESC">Size DESC</option>
            </select>
        </label>
    </form>

    <span>COLOR: </span>
    <form method="get">
        <label>
            <input type="hidden" name="sortBy" value="<?php echo $_GET['sortBy'] ?>" />
            <select name="color" onchange='this.form.submit()'>
                <option disabled selected value><?php echo $_GET['color'] ?></option>
                <option value>All</option>
                <option value="Black">Black</option>
                <option value="Brown">Brown</option>
                <option value="Gray">Gray</option>
                <option value="White">White</option>
            </select>
        </label>
    </form>

    <!-- ADD 3RD FILTER HERE -->

</div>
<div class="items">
<?php
$serverName = "server61.web-hosting.com";
$username = "quadcrer_all";
$password = "********";
$DB = "quadcrer_main";
$sortBy = $_GET['sortBy'];
// Internal color? idk how to name vars. kms
$iColor = $_GET['color'];

$conn = mysqli_connect($serverName, $username, $password, $DB);

// SQL
$sql = 'SELECT * FROM Merch ORDER';

if($sortBy !== null){
    $sql .= 'ORDER BY ' . $sortBy;
}

$result = $conn->query($sql);

while ($row = mysqli_fetch_assoc($result)) {
    $ID2 = $row['ID'];
    $url = $row['pIMG'];
    $size = $row['Size'];
    $price = $row['pPrice'];
    $color = $row['color'];
    $furType = $row['furType'];
    $productType = $row['productType'];
    $classBy = $row['classBy'];
    ?>

    <div class="merch" onclick="addToFav(this)" id="<?php echo $ID2 ?>" data-size="<?php echo $size ?>"
         data-furType="<?php echo $furType ?>" data-price="<?php echo $price ?>"
         data-color="<?php echo $color ?>"
         data-id="<?php echo $ID2 ?>">
        <div class="pic">
            <script>
                if (getCookie('<?php echo $ID2 ?>') !== null) {
                    document.write('<i class="material-icons m-fav" id="<?php echo "js" . $ID2 ?>">favorite</i>');
                } else {
                    document.write('<i class="material-icons m-fav" id="<?php echo "js" . $ID2 ?>">favorite_border</i>')
                }
            </script>
            <div class="img" style="background-image: url('<?php echo $url ?>')">

            </div>
            <div class="desc">
                <p><?php echo $color ?>, <?php echo $furType ?> </p>
                <h3 style="font-size: 2vh">Size: <?php echo $size ?></h3>
            </div>
            <div class="price">
                <h2><?php echo $price ?> &euro;</h2>
            </div>
        </div>
    </div>

    <?php

}

?>
    <script type="text/javascript">
        window.__lc = window.__lc || {};
        window.__lc.license = 8573721;
        (function () {
            var lc = document.createElement('script');
            lc.type = 'text/javascript';
            lc.async = true;
            lc.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'cdn.livechatinc.com/tracking.js';
            var s = document.getElementsByTagName('script')[0];
            s.parentNode.insertBefore(lc, s);
        })();
    </script>
</div>
</body>
</html>

<?php


?>