mirror of
https://github.com/Fluffy-Bean/image-gallery.git
synced 2025-05-28 14:23:11 +00:00
Moving nav bar to bottom when smol screen and fixing broken code on seperate pages
This commit is contained in:
parent
bf449271e6
commit
2cffd0debd
11 changed files with 130 additions and 81 deletions
|
@ -31,7 +31,7 @@
|
|||
and a text div .sniffle-content
|
||||
*/
|
||||
.sniffle-notification {
|
||||
margin-bottom: 1rem; padding: 0.5rem;
|
||||
margin-bottom: 0.5rem; padding: 0.5rem;
|
||||
|
||||
max-width: calc(100% - 1rem); min-height: 2.5rem;
|
||||
|
||||
|
@ -53,7 +53,6 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
/*
|
||||
Notification content Root
|
||||
|
||||
|
@ -86,8 +85,8 @@
|
|||
.sniffle-header {
|
||||
margin: 0 0 0.25rem 0; padding: 0;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
font-weight: 621;
|
||||
|
||||
color: var(--fg);
|
||||
}
|
||||
|
@ -96,10 +95,10 @@
|
|||
*/
|
||||
.sniffle-description {
|
||||
margin: 0; padding: 0;
|
||||
font-size: 14px;
|
||||
font-size: 15px;
|
||||
|
||||
word-wrap: break-word;
|
||||
font-weight: bold;
|
||||
font-weight: 300;
|
||||
|
||||
color: var(--fg);
|
||||
}
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
<?php include "../ui/required.php"; ?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
@ -13,14 +11,19 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
|
||||
crossorigin="anonymous">
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="../Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='../Sniffle/sniffle.css'>
|
||||
|
||||
<!-- Flyout script! -->
|
||||
<script src="../Flyout/flyout.js"></script>
|
||||
<link rel='stylesheet' href='../Flyout/flyout.css'>
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
include "../ui/required.php";
|
||||
include "../ui/nav.php";
|
||||
?>
|
||||
|
||||
|
@ -54,9 +57,6 @@
|
|||
?>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
include "../ui/top.html";
|
||||
include "../ui/footer.php";
|
||||
?>
|
||||
<?php include "../ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
<?php include "../ui/required.php"; ?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
@ -13,14 +11,19 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
|
||||
crossorigin="anonymous">
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="../Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='../Sniffle/sniffle.css'>
|
||||
|
||||
<!-- Flyout script! -->
|
||||
<script src="../Flyout/flyout.js"></script>
|
||||
<link rel='stylesheet' href='../Flyout/flyout.css'>
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
include "../ui/required.php";
|
||||
include "../ui/nav.php";
|
||||
|
||||
// Initialize the session
|
||||
|
@ -124,9 +127,6 @@
|
|||
<a class='btn alert-default space-top-large' href='https://superdupersecteteuploadtest.fluffybean.gay/account/signup.php'><img class="svg" src="../assets/icons/sign-in.svg">Need an account? Sign up!</a>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
include "../ui/top.html";
|
||||
include "../ui/footer.php";
|
||||
?>
|
||||
<?php include "../ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
<?php include "../ui/required.php"; ?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
@ -13,14 +11,19 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
|
||||
crossorigin="anonymous">
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="../Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='../Sniffle/sniffle.css'>
|
||||
|
||||
<!-- Flyout script! -->
|
||||
<script src="../Flyout/flyout.js"></script>
|
||||
<link rel='stylesheet' href='../Flyout/flyout.css'>
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
include "../ui/required.php";
|
||||
include "../ui/nav.php";
|
||||
|
||||
// Initialize the session
|
||||
|
@ -103,9 +106,6 @@
|
|||
</form>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
include "../ui/top.html";
|
||||
include "../ui/footer.php";
|
||||
?>
|
||||
<?php include "../ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,5 +1,3 @@
|
|||
<?php include "../ui/required.php"; ?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
@ -13,14 +11,19 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
|
||||
crossorigin="anonymous">
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="../Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='../Sniffle/sniffle.css'>
|
||||
|
||||
<!-- Flyout script! -->
|
||||
<script src="../Flyout/flyout.js"></script>
|
||||
<link rel='stylesheet' href='../Flyout/flyout.css'>
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
include "../ui/required.php";
|
||||
include "../ui/nav.php";
|
||||
|
||||
// Validate susness of Username
|
||||
|
@ -189,9 +192,6 @@
|
|||
</form>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
include "../ui/top.html";
|
||||
include "../ui/footer.php";
|
||||
?>
|
||||
<?php include "../ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
20
css/nav.css
20
css/nav.css
|
@ -54,10 +54,30 @@ nav hr {
|
|||
}
|
||||
|
||||
@media (max-width: 550px) {
|
||||
nav {
|
||||
margin: 0;
|
||||
|
||||
width: calc(100vw - 2rem));
|
||||
|
||||
position: fixed;
|
||||
top: auto; bottom: 0; left: 0; right: 0;
|
||||
|
||||
border: none;
|
||||
border-top: 3px solid var(--green);
|
||||
|
||||
backdrop-filter: blur(16px);
|
||||
}
|
||||
.nav-hide {
|
||||
display: none;
|
||||
}
|
||||
.nav-links a .svg {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-bottom: 3.5rem !important;
|
||||
}
|
||||
#back-to-top {
|
||||
bottom: 4.5rem !important;
|
||||
}
|
||||
}
|
||||
|
|
16
image.php
16
image.php
|
@ -13,10 +13,6 @@
|
|||
<!-- JQuery -->
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
|
||||
</script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='Sniffle/sniffle.css'>
|
||||
|
@ -155,6 +151,18 @@
|
|||
|
||||
// Image download
|
||||
echo "<a class='btn alert-high space-top' href='images/".$image['imagename']."' download='".$image['imagename']."'><img class='svg' src='assets/icons/download.svg'>Download image</a>";
|
||||
|
||||
// Copy image
|
||||
?>
|
||||
<script>
|
||||
function copyLink() {
|
||||
navigator.clipboard.writeText(window.location.href);
|
||||
|
||||
sniffleAdd("Info", "Link has been copied!", "var(--green)", "assets/icons/clipboard-text.svg");
|
||||
}
|
||||
</script>
|
||||
<?php
|
||||
echo "<button class='btn alert-high space-top-small' onclick='copyLink()'><img class='svg' src='assets/icons/clipboard-text.svg'>Copy image link</button>";
|
||||
?>
|
||||
</div>
|
||||
|
||||
|
|
33
index.php
33
index.php
|
@ -9,8 +9,8 @@
|
|||
|
||||
<!-- Google Fonts -->
|
||||
<link rel="stylesheet" href="css/master.css">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600&display=swap">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@600">
|
||||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
|
@ -45,15 +45,40 @@
|
|||
|
||||
<div class="info-text center">
|
||||
<?php
|
||||
// Set time for message
|
||||
$time = date("H");
|
||||
$timezone = date("e");
|
||||
if ($time < "12") {
|
||||
$time_welc = "Good morning";
|
||||
} else if ($time >= "12" && $time < "17") {
|
||||
$time_welc = "Good afternoon";
|
||||
} else if ($time >= "17" && $time < "19") {
|
||||
$time_welc = "Good evening";
|
||||
} else if ($time >= "19") {
|
||||
$time_welc = "Good night";
|
||||
}
|
||||
|
||||
// Welcome depending on if user is logged in or not
|
||||
if (isset($_SESSION["username"])) {
|
||||
echo "<h1>Welcome ".$_SESSION['username']."!</h1>";
|
||||
echo "<h1>".$time_welc." ".$_SESSION['username']."!</h1>";
|
||||
} else {
|
||||
echo "<h1>Welcome!</h1>";
|
||||
}
|
||||
|
||||
// Random welcome message
|
||||
$welcome_message = array("*internal screaming*", "Sussy Wussy", "What is this world?", "Don't forget to drink water!", "Bruh", "This is so poorly programmed", "Sorry", "Fluffy made this!", "maybe", "I'm gay", "I wish we were better strangers.");
|
||||
$welcome_message = array("*internal screaming*",
|
||||
"Sussy Wussy",
|
||||
"What is this world?",
|
||||
"Don't forget to drink water!",
|
||||
"Bruh",
|
||||
"This is so poorly programmed",
|
||||
"Sorry",
|
||||
"Fluffy made this!",
|
||||
"maybe",
|
||||
"I'm gay",
|
||||
"I wish we were better strangers.",
|
||||
"<span style='color:#ffff00;'>Just like Minecraft!</span>",
|
||||
"If I were you, I'd run now");
|
||||
echo "<p>".$welcome_message[array_rand($welcome_message, 1)]."</p>";
|
||||
?>
|
||||
</div>
|
||||
|
|
10
ui/nav.php
10
ui/nav.php
|
@ -3,17 +3,17 @@
|
|||
<p>Lynx Gallery</p>
|
||||
</div>
|
||||
<div class="nav-links flex-left">
|
||||
<a class='btn alert-default' href='index.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/house.svg'><span class='nav-hide'>Home</span></a>
|
||||
<a class='btn alert-default' href='<?php echo $root_dir; ?>index.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/house.svg'><span class='nav-hide'>Home</span></a>
|
||||
<hr>
|
||||
<a class='btn alert-default' href='search.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/binoculars.svg'><span class='nav-hide'>Search</span></a>
|
||||
<a class='btn alert-default' href='<?php echo $root_dir; ?>search.php'><img class='svg' src='<?php echo $root_dir; ?>assets/icons/binoculars.svg'><span class='nav-hide'>Search</span></a>
|
||||
<hr>
|
||||
<?php
|
||||
if (loggedin()) {
|
||||
echo "<a class='btn alert-default' href='upload.php'><img class='svg' src='".$root_dir."assets/icons/upload.svg'><span class='nav-hide'>Upload</span></a>";
|
||||
echo "<a class='btn alert-default' href='".$root_dir."upload.php'><img class='svg' src='".$root_dir."assets/icons/upload.svg'><span class='nav-hide'>Upload</span></a>";
|
||||
echo "<hr>";
|
||||
echo "<a class='btn alert-default' href='/account/account.php'><img class='svg' src='".$root_dir."assets/icons/user-circle.svg'><span class='nav-hide'>".substr($_SESSION["username"], 0, 15)."</span></a>";
|
||||
echo "<a class='btn alert-default' href='".$root_dir."/account/account.php'><img class='svg' src='".$root_dir."assets/icons/user-circle.svg'><span class='nav-hide'>".substr($_SESSION["username"], 0, 15)."</span></a>";
|
||||
} else {
|
||||
echo "<a class='btn alert-default' href='/account/login.php'><img class='svg' src='".$root_dir."assets/icons/sign-in.svg'><span class='nav-hide'>Login</span></a>";
|
||||
echo "<a class='btn alert-default' href='".$root_dir."/account/login.php'><img class='svg' src='".$root_dir."assets/icons/sign-in.svg'><span class='nav-hide'>Login</span></a>";
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
|
|
@ -78,7 +78,7 @@ include $root_dir."app/server/secrete.php";
|
|||
everything can always be accessed
|
||||
-->
|
||||
<a id="back-to-top" href="#">
|
||||
<img src="assets/icons/caret-up.svg">
|
||||
<img src="<?php echo $root_dir; ?>assets/icons/caret-up.svg">
|
||||
</a>
|
||||
<script>
|
||||
button = document.getElementById("back-to-top");
|
||||
|
|
31
upload.php
31
upload.php
|
@ -1,5 +1,3 @@
|
|||
<?php include "ui/required.php"; ?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
@ -13,21 +11,23 @@
|
|||
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Fira+Code:wght@500&display=swap">
|
||||
|
||||
<!-- JQuery -->
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-3.6.0.min.js"
|
||||
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
|
||||
crossorigin="anonymous">
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
|
||||
|
||||
<!-- Sniffle script! -->
|
||||
<script src="Sniffle/sniffle.js"></script>
|
||||
<link rel='stylesheet' href='Sniffle/sniffle.css'>
|
||||
|
||||
<!-- Flyout script! -->
|
||||
<script src="Flyout/flyout.js"></script>
|
||||
<link rel='stylesheet' href='Flyout/flyout.css'>
|
||||
</head>
|
||||
<body>
|
||||
<?php
|
||||
include "ui/required.php";
|
||||
include "ui/nav.php";
|
||||
|
||||
// Check if user is logged in
|
||||
if (loggedin()) {
|
||||
// User is logged in
|
||||
} else {
|
||||
$error = "You must be logged in to upload images";
|
||||
if (!loggedin()) {
|
||||
header("Location: index.php");
|
||||
}
|
||||
|
||||
|
@ -82,10 +82,10 @@
|
|||
<div class="alert-banner">
|
||||
<?php
|
||||
if (isset($error)) {
|
||||
echo notify($error, "low");
|
||||
echo "<script>sniffleAdd('Error', '".$error."', 'var(--red)', '".$root_dir."assets/icons/cross.svg');</script>";
|
||||
}
|
||||
if (isset($success)) {
|
||||
echo notify($success, "high");
|
||||
echo "<script>sniffleAdd('Success!', '".$success."', 'var(--green)', '".$root_dir."assets/icons/check.svg');</script>";
|
||||
}
|
||||
?>
|
||||
<script src='scripts/alert.js'></script>
|
||||
|
@ -101,9 +101,6 @@
|
|||
</form>
|
||||
</div>
|
||||
|
||||
<?php
|
||||
include "ui/top.html";
|
||||
include "ui/footer.php";
|
||||
?>
|
||||
<?php include "ui/footer.php"; ?>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue