1 files changed, 38 insertions, 0 deletions
diff --git a/includes/components/details.inc b/includes/components/details.inc
index 6b8ea64..288f540 100644
--- a/includes/components/details.inc
+++ b/includes/components/details.inc
@@ -1,4 +1,42 @@
 <?php global $isLoggedIn; global $metadata; global $memberData; global $isLowerLoggedIn; global $systemID; global $app; global $lang; global $pages; $pronouns = getMemberPronouns($memberData['pronouns']); ?>
+<?php if ($isLoggedIn && $memberData['id'] === "alily"): ?>
+<div id="member-details-hazy" class="<?= (($isLoggedIn || $isLowerLoggedIn) && $systemID !== $app["other"]["id"]) ? 'member-details-loggedIn' : 'member-details-loggedIn2' ?>" style="<?php if (!$isLoggedIn && !$isLowerLoggedIn): ?>grid-template-columns: repeat(3, 1fr);<?php endif; ?> background-color: <?= isset($memberData["color"]) ? '#' . $memberData["color"] . "44" : "transparent" ?>; margin-left: -20px; margin-right: -20px; padding: 10px 20px;">
+    <div style="display: grid; grid-template-columns: 128px 1fr;">
+        <img id="member-icon2" src="data:image/png;base64,<?= base64_encode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/assets/uploads/hazy.png")) ?>" alt="" style="background-color:rgba(255, 255, 255, .125);width:128px;height:128px;border-radius:5px;">
+        <div id="member-details-hazy2" style="display: flex; align-items: center; justify-content: center; text-align: center;">
+            <div>
+                <h3 style="margin: 0;">Hazel Stardawn</h3>
+                <div style="margin-bottom:0.5rem;"></div>
+                <p style="margin: 0 10px;">This pony takes a human appearance when she is around <u><a href="/leah" class="member-link">Leah</a></u> or other humans in Cloudburst System. However, her pony appearance remains her preferred one and she will use it with other creatures and pony members of Cloudburst System.</p>
+            </div>
+        </div>
+    </div>
+</div>
+
+<style>
+    @media (max-width: 700px) {
+        #member-details-hazy > div {
+            grid-template-columns: 46px 1fr !important;
+        }
+
+        #member-details-hazy2 {
+            text-align: left !important;
+            justify-content: left !important;
+        }
+
+        #member-icon2 {
+            width: 36px !important;
+            height: 36px !important;
+            border-radius: 999px !important;
+        }
+
+        #member-details-hazy2 > div > p {
+            margin: 0 !important;
+        }
+    }
+</style>
+
+<?php endif; ?>
 <div id="member-details" class="<?= (($isLoggedIn || $isLowerLoggedIn) && $systemID !== $app["other"]["id"]) ? 'member-details-loggedIn' : 'member-details-loggedIn2' ?>" style="<?php if (!$isLoggedIn && !$isLowerLoggedIn): ?>grid-template-columns: repeat(3, 1fr);<?php endif; ?> background-color: <?= isset($memberData["color"]) ? '#' . $memberData["color"] . "33" : "transparent" ?>; margin-left: -20px; margin-right: -20px;">
     <div>
         <b><?= $lang["details"]["food"] ?></b><span class="member-small-separator"><br></span>