a lot of changes
This commit is contained in:
parent
fdc0b7c5bc
commit
0a9983f56c
@ -1,4 +1,12 @@
|
|||||||
<!--PAGENAME=You have rights-->
|
<!--PAGENAME=Hello, <template name="username">-->
|
||||||
<h2>Welcome</h2>
|
<!--PAGESTYLE=/styles/pages/admin/style.css-->
|
||||||
<p>Logged in as an admin: <template name="username"></p>
|
|
||||||
<template name="gravatar_image">
|
<header class="admin-index-header">
|
||||||
|
<div class="admin-index-header-text" id="headerText">
|
||||||
|
<h1 class="admin fade-in">Hello,</h1>
|
||||||
|
<h2 class="admin-index-h2 fade-in">Welcome back, Admin <span class="outlined-text"><template name="username"></template></span></h2>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="/scripts/pages/admin/main.js" defer></script>
|
@ -31,6 +31,8 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
|
|||||||
}
|
}
|
||||||
?>
|
?>
|
||||||
|
|
||||||
|
<!--PAGENAME=Login-->
|
||||||
|
|
||||||
<h2>Login</h2>
|
<h2>Login</h2>
|
||||||
<form action="" method="post">
|
<form action="" method="post">
|
||||||
<input type="email" name="email" id="email-field" placeholder="E-Mail" required>
|
<input type="email" name="email" id="email-field" placeholder="E-Mail" required>
|
||||||
|
@ -1,3 +1,6 @@
|
|||||||
|
|
||||||
|
<!--PAGENAME=Register-->
|
||||||
|
|
||||||
<h2>Register</h2>
|
<h2>Register</h2>
|
||||||
<form action="register.php" method="post">
|
<form action="register.php" method="post">
|
||||||
<input type="text" name="username" id="username-field" pattern=".{3,32}" placeholder="Username" required>
|
<input type="text" name="username" id="username-field" pattern=".{3,32}" placeholder="Username" required>
|
||||||
|
@ -1,5 +1,6 @@
|
|||||||
<!--PAGENAME=Hello, <template name="username">-->
|
<!--PAGENAME=Hello, <template name="username">-->
|
||||||
<!--PAGESTYLE=/styles/pages/user/style.css-->
|
<!--PAGESTYLE=/styles/pages/user/style.css-->
|
||||||
|
|
||||||
<header class="user-index-header">
|
<header class="user-index-header">
|
||||||
<div class="user-index-header-text" id="headerText">
|
<div class="user-index-header-text" id="headerText">
|
||||||
<h1 class="user-index-h1 fade-in">Hello, <span class="outlined-text"><template name="username"></template></span>.</h1>
|
<h1 class="user-index-h1 fade-in">Hello, <span class="outlined-text"><template name="username"></template></span>.</h1>
|
||||||
@ -8,4 +9,4 @@
|
|||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
|
||||||
<script src="/scripts/pages/user/main.js" defer></script>
|
<script src="/scripts/pages/admin/main.js" defer></script>
|
24
scripts/pages/admin/main.js
Normal file
24
scripts/pages/admin/main.js
Normal file
@ -0,0 +1,24 @@
|
|||||||
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
|
var h1 = document.querySelector('.admin-index-h1');
|
||||||
|
var h2 = document.querySelector('.admin-index-h2');
|
||||||
|
|
||||||
|
// Initial styles for fade-in effect
|
||||||
|
h1.style.opacity = '0';
|
||||||
|
h1.style.transform = 'translateX(-35px)';
|
||||||
|
|
||||||
|
h2.style.opacity = '0';
|
||||||
|
h2.style.transform = 'translateX(-35px)';
|
||||||
|
|
||||||
|
// Trigger the reflow to restart the CSS animation
|
||||||
|
void h1.offsetWidth;
|
||||||
|
void h2.offsetWidth;
|
||||||
|
|
||||||
|
// Apply the fade-in effect
|
||||||
|
h1.style.transition = 'opacity 0.8s ease, transform 0.6s ease';
|
||||||
|
h1.style.opacity = '1';
|
||||||
|
h1.style.transform = 'translateX(0)';
|
||||||
|
|
||||||
|
h2.style.transition = 'opacity 0.8s ease, transform 0.6s ease';
|
||||||
|
h2.style.opacity = '1';
|
||||||
|
h2.style.transform = 'translateX(0)';
|
||||||
|
});
|
@ -68,6 +68,7 @@ nav ul .links {
|
|||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
gap: 2.5rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
nav ul li {
|
nav ul li {
|
||||||
|
38
styles/pages/admin/style.css
Normal file
38
styles/pages/admin/style.css
Normal file
@ -0,0 +1,38 @@
|
|||||||
|
body {
|
||||||
|
height: 200vh !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-index-header-text {
|
||||||
|
width: 80%;
|
||||||
|
margin: auto;
|
||||||
|
text-align: left;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-index-h1 {
|
||||||
|
font-size: 4rem;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-index-h2 {
|
||||||
|
font-size: 3.3rem;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.outlined-text {
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
-webkit-text-stroke: 2.2px #8c00ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.admin-index-h1,
|
||||||
|
.admin-index-h2 {
|
||||||
|
opacity: 0;
|
||||||
|
transform: translateX(-35px);
|
||||||
|
transition: opacity 0.8s ease, transform 0.6s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fade-in {
|
||||||
|
opacity: 1;
|
||||||
|
transform: translateX(0);
|
||||||
|
}
|
@ -3,7 +3,7 @@
|
|||||||
<li><a href="/settings"><i class="ri-settings-4-fill"></i></a></li>
|
<li><a href="/settings"><i class="ri-settings-4-fill"></i></a></li>
|
||||||
<div class="links">
|
<div class="links">
|
||||||
<li><a href="/about">About</a></li>
|
<li><a href="/about">About</a></li>
|
||||||
<li><span class="pfp"><i class="ri-question-fill"></i></span></li>
|
<li><a href="/" class="pfp"><i class="ri-question-fill"></i></a></li>
|
||||||
</div>
|
</div>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
Loading…
Reference in New Issue
Block a user