diff options
Diffstat (limited to 'includes/components/2023ui.inc')
| -rw-r--r-- | includes/components/2023ui.inc | 187 |
1 files changed, 0 insertions, 187 deletions
diff --git a/includes/components/2023ui.inc b/includes/components/2023ui.inc deleted file mode 100644 index 4c1aa5b..0000000 --- a/includes/components/2023ui.inc +++ /dev/null @@ -1,187 +0,0 @@ -<style> - .new-homepage-link { - background-color: rgba(0, 0, 0, .01) !important; - } - - .new-homepage-link:hover { - background-color: rgba(0, 0, 0, .05) !important; - } - - .new-homepage-link:active { - background-color: rgba(0, 0, 0, .1) !important; - } - - .new-homepage-system-list { - background: linear-gradient(180deg, rgba(216,53,124,0.1) 0%, rgba(227,65,55,0.1) 7%, rgba(231,155,96,0.1) 14%, rgba(223,191,78,0.1) 21%, rgba(203,207,117,0.1) 28%, rgba(108,224,154,0.1) 35%, rgba(106,228,205,0.1) 42%, rgba(100,217,234,0.1) 49%, rgba(83,182,238,0.1) 56%, rgba(74,158,234,0.1) 63%, rgba(164,137,238,0.1) 70%, rgba(211,142,240,0.1) 77%, rgba(230,122,238,0.1) 84%, rgba(227,113,196,0.1) 91%); - } - - #banner-lower, #timeline-container { - backdrop-filter: none !important; - background-color: var(--palette-2) !important; - } - - #hpd-legacy { - display: none !important; - } - - #system-page, #member-page { - background-color: var(--palette-2) !important; - backdrop-filter: none !important; - -webkit-backdrop-filter: none !important; - } - - @media (max-width: 926px) { - .mobile-hide { - display: none !important; - } - - .mobile-icon-container-right { - margin-right: 0 !important; - } - - #menu-bar { - grid-template-columns: 1fr max-content 1fr !important; - left: 20px !important; - } - - #side-bar-systems { - display: none !important; - } - - #side-bar-options { - margin: 0 !important; - } - - #side-bar { - bottom: 0 !important; - right: 0 !important; - width: 100% !important; - height: 64px; - top: unset !important; - z-index: 9 !important; - align-items: center; - } - - #app { - left: 0 !important; - right: 0 !important; - bottom: 64px; - } - - .ui2023-side-bar-item:not(.mobile-hide) { - display: inline-block !important; - } - - .mobile-show { - display: inline-block !important; - } - - #app { - z-index: -1; - } - - body:not(.modal-open) #menu-bar { - z-index: 9999; - } - - #app > #member-banner-container, #system-banner-container { - width: 100% !important; - } - - .hpd-item-card div:nth-child(3)::before, .hpd-item-card div:nth-child(3)::after { - color: inherit !important; - } - } -</style> - -<div id="menu-bar" style="position: fixed; top: 0; left: 101px; right: 20px; height: 52px; display: grid; grid-template-columns: 1fr 1fr 1fr;"> - <div style="display: grid; grid-template-columns: max-content 1fr;"> - <div style="height: 52px; display: flex; align-items: center;"> - <a href="/" style="color: inherit; text-decoration: inherit;"> - <img class="antialias" src="/assets/logo/newlogo-ng.png" style="width: 32px;"> - <span style="margin-left: 5px; vertical-align: middle; position: relative; top: -1px; font-weight: bold;">Ponycule</span> - </a> - </div> - </div> - <div style="height: 52px; display: flex; align-items: center;"> - <!--<form action="/-/search" style="width: 100%;"> - <input name="q" class="form-control" type="text" value="" placeholder="Search on Cold Haze..." style="width: 100%; margin-left: auto; margin-right: auto; border-color: var(--palette-4) !important; background-color: var(--palette-4) !important;"> - </form>--> - </div> - <div style="display: grid; grid-template-columns: 1fr max-content;"> - <div style="display: flex; align-items: center;"> - <?php global $isLowerLoggedIn; global $isLoggedIn; global $_PROFILE; if ($isLoggedIn || $isLowerLoggedIn): ?> - <div style="margin-left: auto; margin-right: auto;" class="mobile-icon-container mobile-icon-container-right"> - <a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Jobs" class="ui2023-side-bar-item mobile-hide" href="/-/jobs" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;"> - <img src="<?= icon("jobs") ?>" style="max-width: 28px; max-height: 28px;"> - </a><a data-bs-toggle="tooltip" data-bs-placement="bottom" title="Logout" class="ui2023-side-bar-item mobile-hide" href="/-/logout" style="padding: 10px; height: 48px; width: 48px; display: inline-block; border-radius: 999px;"> - <img src="<?= icon("logout") ?>" style="max-width: 28px; max-height: 28px;"> - </a><div class="ui2023-side-bar-item mobile-show dropdown" style="padding: 10px; height: 48px; width: 48px; display: none; border-radius: 999px;"> - <a data-bs-toggle="dropdown" href="#"> - <img src="<?= icon("menu") ?>" style="max-width: 28px; max-height: 28px;"> - </a> - <ul class="dropdown-menu"> - <li><a class="dropdown-item" href="/-/jobs"> - <img src="<?= icon("jobs") ?>" style="vertical-align: middle; width: 24px; height: 24px;"><span style="vertical-align: middle; margin-left: 5px;">Jobs</span> - </a></li> - <li><a class="dropdown-item" href="/-/logout"> - <img src="<?= icon("logout") ?>" style="vertical-align: middle; width: 24px; height: 24px;"><span style="vertical-align: middle; margin-left: 5px;">Logout</span> - </a></li> - </ul> - </div> - </div> - <?php endif; ?> - </div> - <div style="height: 52px; display: flex; align-items: center;"> - <?php global $isLowerLoggedIn; global $isLoggedIn; global $_PROFILE; if ($isLoggedIn || $isLowerLoggedIn): ?> - <a href="https://account.equestria.dev/hub/users/<?= $_PROFILE["id"] ?>" target="_blank" style="color: inherit; text-decoration: inherit;"> - <?php $fronters = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/data/" . ($_PROFILE["login"] === "raindrops" ? "gdapd" : ($_PROFILE["login"] === "Moonglow" ? "hrbom" : "other")) . "/fronters.json"), true); if (isset($fronters["members"][0])): ?> - <span class="mobile-hide" style="margin-right: 5px; vertical-align: middle; margin-top: -2px;"><?= $fronters["members"][0]["display_name"] ?? $fronters["members"][0]["name"] ?></span> - <img src="<?= getAsset(($_PROFILE["login"] === "raindrops" ? "gdapd" : ($_PROFILE["login"] === "Moonglow" ? "hrbom" : "other")), $fronters["members"][0]["id"]) ?>" style="width: 32px; height: 32px; border-radius: 999px; background-color: var(--palette-2);"> - <?php else: ?> - <span class="mobile-hide" style="margin-right: 5px; vertical-align: middle; margin-top: -2px;"><?= $_PROFILE["name"] ?></span> - <img class="antialias" src="https://account.equestria.dev/hub/api/rest/avatar/<?= $_PROFILE["id"] ?>?dpr=2&size=32" style="width: 32px; height: 32px; border-radius: 999px; background-color: var(--palette-2);"> - <?php endif; ?> - </a> - <?php else: ?> - <a href="/login" style="color: inherit; text-decoration: inherit;"> - <span class="mobile-hide" style="margin-right: 5px; vertical-align: middle; margin-top: -2px;">Log in</span> - <img src="<?= icon("login", false) ?>" class="light-only" style="width: 24px; height: 24px; margin: 4px;"> - <img src="<?= icon("login", true) ?>" class="dark-only" style="width: 24px; height: 24px; margin: 4px;"> - </a> - <?php endif; ?> - </div> - </div> -</div> - -<style> - .ui2023-side-bar-system:hover, .ui2023-side-bar-item:hover { - background-color: var(--palette-2); - } - - .ui2023-side-bar-system:active { - background-color: var(--palette-1); - } - - .ui2023-side-bar-system:active { - background-color: var(--palette-3); - } -</style> - -<div id="side-bar" style="position: fixed; top: 62px; bottom: 20px; left: 0; width: 64px; display: flex; justify-content: center;"> - <div> - <div id="side-bar-systems" style="background-color: var(--palette-4); height: max-content; border-radius: 999px;"> - <a data-bs-toggle="tooltip" data-bs-placement="right" title="Raindrops System" class="ui2023-side-bar-system" href="/raindrops" style="padding: 8px; height: 48px; width: 48px; display: block; border-top-left-radius: 999px; border-top-right-radius: 999px;"> - <img class="antialias" class="antialias" src="<?= getAsset("gdapd") ?>" style="max-width: 32px; max-height: 32px;"> - </a> - <?php global $app; if ($isLoggedIn || $isLowerLoggedIn): ?> - <a data-bs-toggle="tooltip" data-bs-placement="right" title="<?= $app["other"]["name"] ?>" class="ui2023-side-bar-system" href="/<?= $app["other"]["slug"] ?>" style="padding: 8px; height: 48px; width: 48px; display: block;"> - <img class="antialias" class="antialias" src="<?= getAsset("other") ?>" style="max-width: 32px; max-height: 32px;"> - </a> - <?php endif; ?> - <a data-bs-toggle="tooltip" data-bs-placement="right" title="Moonglow" class="ui2023-side-bar-system" href="/moonglow" style="padding: 8px; height: 48px; width: 48px; display: block; border-bottom-left-radius: 999px; border-bottom-right-radius: 999px;"> - <img class="antialias" class="antialias" src="<?= getAsset("hrbom") ?>" style="max-width: 32px; max-height: 32px;"> - </a> - </div> - </div> -</div> |