summaryrefslogtreecommitdiff
path: root/includes/components
diff options
context:
space:
mode:
Diffstat (limited to 'includes/components')
-rw-r--r--includes/components/header.inc2
-rw-r--r--includes/components/sysbanner.inc2
-rw-r--r--includes/components/timeline.inc56
3 files changed, 31 insertions, 29 deletions
diff --git a/includes/components/header.inc b/includes/components/header.inc
index 234b518..5179d54 100644
--- a/includes/components/header.inc
+++ b/includes/components/header.inc
@@ -54,6 +54,7 @@ require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/util/functions.inc";
<html lang="en">
<head>
<link href="/assets/logo/custom.css" rel="preload" as="style">
+ <link href="/assets/logo/light.css" rel="preload" as="style">
<link href="/assets/logo/custom.css" rel="stylesheet">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
@@ -61,6 +62,7 @@ require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/util/functions.inc";
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
<title><?= $title && $title !== "-" ? $title . " ยท " : "" ?>Cold Haze</title>
<link rel="shortcut icon" href="/assets/logo/newlogo<?= $isLoggedIn || $isLowerLoggedIn ? "3" : "" ?>.png" type="image/png">
+ <link href="/assets/logo/light.css" rel="stylesheet">
</head>
<body style="background-color: #000;">
<?php require_once $_SERVER['DOCUMENT_ROOT'] . "/includes/components/navigation.inc"; global $navigation; ?>
diff --git a/includes/components/sysbanner.inc b/includes/components/sysbanner.inc
index 26a049e..30babf0 100644
--- a/includes/components/sysbanner.inc
+++ b/includes/components/sysbanner.inc
@@ -13,7 +13,7 @@ $pages = json_decode(file_get_contents($_SERVER['DOCUMENT_ROOT'] . "/includes/pa
?>
-<div id="system-info" style="background-color:rgba(255, 255, 255, .05);margin-left: -20px; margin-right: -20px;margin-top:-20px;padding: 0 20px 10px; <?php if ($systemID === $app["other"]["id"]): ?>padding-top: 15px;<?php endif; ?>">
+<div id="system-info" class="system-info-system" style="background-color:rgba(255, 255, 255, .05);margin-left: -20px; margin-right: -20px;margin-top:-20px;padding: 0 20px 10px; <?php if ($systemID === $app["other"]["id"]): ?>padding-top: 15px;<?php endif; ?>">
<div style="padding:10px 10px 10px 20px;text-align:center;">
<div>
<img src="<?= getAsset($systemID) ?>" alt="" style="margin-right: auto; margin-left: auto; display: block; width:128px;max-height:128px;border-radius:10px;">
diff --git a/includes/components/timeline.inc b/includes/components/timeline.inc
index 1a34550..3766073 100644
--- a/includes/components/timeline.inc
+++ b/includes/components/timeline.inc
@@ -6,23 +6,23 @@ function displayTimeline($systems) { global $app; $showIcons = count($systems) >
<thead>
<tr class="row-desktop">
<?php if ($showIcons): ?><th colspan="20"></th><?php endif; ?>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 6 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 6) ?></th>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 5 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 5) ?></th>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 4 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 4) ?></th>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 3 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 3) ?></th>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 2 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 2) ?></th>
- <th class="dynamic-time" data-time="<?= time() - 3600 * 1 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 1) ?></th>
- <th class="dynamic-time" data-time="<?= time() ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time()) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 6 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 6) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 5 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 5) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 4 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 4) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 3 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 3) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 2 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 2) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() - 3600 * 1 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time() - 3600 * 1) ?></th>
+ <th class="dynamic-time timeline-indicator" data-time="<?= time() ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:i', time()) ?></th>
</tr>
<tr class="row-mobile">
<?php if ($showIcons): ?><th colspan="20"></th><?php endif; ?>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 6 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 6) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 5 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 5) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 4 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 4) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 3 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 3) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 2 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 2) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() - 3600 * 1 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 1) ?></th>
- <th class="dynamic-time-mobile" data-time="<?= time() ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time()) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 6 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 6) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 5 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 5) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 4 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 4) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 3 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 3) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 2 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 2) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() - 3600 * 1 ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time() - 3600 * 1) ?></th>
+ <th class="dynamic-time-mobile timeline-indicator" data-time="<?= time() ?>" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);"><?= date('H:', time()) ?></th>
</tr>
</thead>
<tbody>
@@ -70,23 +70,23 @@ function displayTimeline($systems) { global $app; $showIcons = count($systems) >
<?php endforeach; ?>
<tr class="row-desktop">
<?php if ($showIcons): ?><td colspan="20"></td><?php endif; ?>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">6 hours ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">5 hours ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">4 hours ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">3 hours ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">2 hours ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">1 hour ago</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">Now</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">6 hours ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">5 hours ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">4 hours ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">3 hours ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">2 hours ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">1 hour ago</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">Now</td>
</tr>
<tr class="row-mobile">
<?php if ($showIcons): ?><td colspan="20"></td><?php endif; ?>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-6h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-5h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-4h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-3h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-2h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-1h</td>
- <td colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">Now</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-6h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-5h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-4h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-3h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-2h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">-1h</td>
+ <td class="timeline-indicator" colspan="60" style="text-align: right; padding-right: 10px; border-right: 1px solid rgba(255, 255, 255, 0.5);">Now</td>
</tr>
<tr>
<?php for ($i = 0; $i < 420; $i++): ?><td></td><?php endfor; ?>