mirror of
https://github.com/Fluffy-Bean/image-gallery.git
synced 2025-01-30 01:38:28 +00:00
Cleaning up CSS
This commit is contained in:
parent
eac7f15292
commit
58b07d30d4
|
|
@ -12,7 +12,7 @@
|
|||
<body>
|
||||
<?php include("../ui/header.php"); ?>
|
||||
|
||||
<div class="account-root">
|
||||
<div class="account-root default-window">
|
||||
<h2>Account settings</h2>
|
||||
<?php
|
||||
if (isset($_SESSION["loggedin"]) && $_SESSION["loggedin"] === true) {
|
||||
|
|
|
|||
|
|
@ -92,7 +92,7 @@
|
|||
}
|
||||
?>
|
||||
|
||||
<div class="login-root">
|
||||
<div class="login-root default-window">
|
||||
<h2 class="space-bottom">Login</h2>
|
||||
<p class="space-bottom">Passwords are important to keep safe. Don't tell anyone your password, not even Fluffy!</p>
|
||||
<form class="flex-down between" method="POST" action="login.php" enctype="multipart/form-data">
|
||||
|
|
|
|||
|
|
@ -75,7 +75,7 @@
|
|||
}
|
||||
?>
|
||||
|
||||
<div class="password-reset-root">
|
||||
<div class="password-reset-root default-window">
|
||||
<h2 class="space-bottom">Reset Password</h2>
|
||||
<p class="space-bottom">After reset, you will be kicked out to login again</p>
|
||||
<form class="flex-down between" method="POST" action="password-reset.php" enctype="multipart/form-data">
|
||||
|
|
|
|||
|
|
@ -104,7 +104,7 @@
|
|||
}
|
||||
?>
|
||||
|
||||
<div class="signup-root">
|
||||
<div class="signup-root default-window">
|
||||
<h2 class="space-bottom">Make account</h2>
|
||||
<p class="space-bottom">And amazing things happened here...</p>
|
||||
<form class="flex-down between" method="POST" action="signup.php" enctype="multipart/form-data">
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= ABOUT =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.about-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= Account =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.account-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
16
css/edit.css
16
css/edit.css
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= EDIT =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.edit-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--red);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
@ -36,39 +36,13 @@
|
|||
}
|
||||
|
||||
.image-description {
|
||||
margin: 0 0 2rem; padding: 0.5rem;
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.image-detail {
|
||||
margin: 0 0 2rem; padding: 0.5rem;
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
word-wrap: break-word;
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.danger-zone {
|
||||
margin: 0 0 2rem; padding: 0.5rem;
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--red);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= LONGIN =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.login-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
@ -3,15 +3,6 @@
|
|||
|
||||
@import "gallery.css";
|
||||
@import "image.css";
|
||||
@import "edit.css";
|
||||
@import "upload.css";
|
||||
|
||||
@import "about.css";
|
||||
|
||||
@import "signup.css";
|
||||
@import "login.css";
|
||||
@import "account.css";
|
||||
@import "password-reset.css";
|
||||
|
||||
:root {
|
||||
--bg: #151515df;
|
||||
|
|
@ -135,13 +126,11 @@ form * {
|
|||
}
|
||||
.btn:hover {
|
||||
outline: var(--white) 3px solid;
|
||||
color: var(--fg);
|
||||
}
|
||||
a.btn {
|
||||
text-align: center;
|
||||
}
|
||||
.link:hover {
|
||||
color: var(--orange);
|
||||
}
|
||||
|
||||
.space-bottom {
|
||||
margin-bottom: 1rem;
|
||||
|
|
@ -164,17 +153,6 @@ a.btn {
|
|||
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.default-window {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
/*
|
||||
-=-=-= TEXT SIZES =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
|
|
@ -206,6 +184,9 @@ p, a {
|
|||
margin: 0 0 0.5rem 0;
|
||||
font-family: "Fira Code", monospace;
|
||||
}
|
||||
a:hover {
|
||||
color: var(--orange);
|
||||
}
|
||||
|
||||
/*
|
||||
-=-=-= Back to top button =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
|
|
@ -237,3 +218,47 @@ p, a {
|
|||
|
||||
object-position: center;
|
||||
}
|
||||
|
||||
/*
|
||||
-=-=-= DIV DECORATIONS =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.default-window {
|
||||
margin: 0 0 2rem; padding: 0.5rem;
|
||||
|
||||
/*max-width: 621px;*/ width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg);
|
||||
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.upload-root {
|
||||
border: 0.2rem solid var(--green);
|
||||
}
|
||||
|
||||
.edit-root {
|
||||
border: 0.2rem solid var(--red);
|
||||
}
|
||||
|
||||
.signup-root {
|
||||
border: 0.2rem solid var(--green);
|
||||
}
|
||||
|
||||
.password-reset-root {
|
||||
border: 0.2rem solid var(--red);
|
||||
}
|
||||
|
||||
.account-root {
|
||||
border: 0.2rem solid var(--green);
|
||||
}
|
||||
|
||||
.login-root {
|
||||
border: 0.2rem solid var(--green);
|
||||
}
|
||||
|
||||
.about-root {
|
||||
border: 0.2rem solid var(--green);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= LONGIN =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.password-reset-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= SIGN UP =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.signup-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
/*
|
||||
-=-=-= UPLOAD =-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
|
||||
*/
|
||||
.upload-root {
|
||||
margin: 0 auto 2rem; padding: 0.5rem;
|
||||
|
||||
max-width: 621px; width: calc(100% - 2rem);
|
||||
|
||||
background-color: var(--bg); color: var(--fg);
|
||||
|
||||
border: 0.2rem solid var(--green);
|
||||
outline: 0.5rem solid var(--bg);
|
||||
|
||||
border-radius: var(--rad);
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
12
edit.php
12
edit.php
|
|
@ -23,10 +23,10 @@
|
|||
$image_results = mysqli_query($conn, $get_image);
|
||||
$image = mysqli_fetch_assoc($image_results);
|
||||
|
||||
// Check if user owns image
|
||||
// Updating alt
|
||||
if (isset($_SESSION['id']) && $image['author'] == $_SESSION['id'] || $_SESSION['id'] == 1) {
|
||||
// If no errors
|
||||
if (empty($error)) {
|
||||
if (isset($_POST['alt']) || $_POST['alt'] != "") {
|
||||
// getting ready forSQL asky asky
|
||||
$sql = "UPDATE swag_table SET alt=? WHERE id=?";
|
||||
|
||||
|
|
@ -45,6 +45,8 @@
|
|||
$error = "Something went fuckywucky, please try later";
|
||||
}
|
||||
}
|
||||
} else {
|
||||
header("Location:https://superdupersecteteuploadtest.fluffybean.gay/image.php?id=".$_POST['id']."&update=skip");
|
||||
}
|
||||
} else {
|
||||
$error = "You do not have edit rights";
|
||||
|
|
@ -56,12 +58,12 @@
|
|||
}
|
||||
?>
|
||||
|
||||
<div class="edit-root">
|
||||
<div class="edit-root default-window">
|
||||
<h2>Modify Information</h2>
|
||||
<p class="space-below">This is a dangerous place to step foot into... tread carefully.</p>
|
||||
<form class="flex-down between" method="POST" action="edit.php" enctype="multipart/form-data">
|
||||
<input class="btn alert-default space-bottom-large" type="text" name="alt" placeholder="Description/Alt for image">
|
||||
<?php echo "<button class='btn alert-default' type='submit' name='id' value=".$_GET["id"]."><img class='svg' src='assets/icons/edit.svg'>Update information</button>"; ?>
|
||||
<input class="btn alert-default space-bottom-large" type="text" name="alt" placeholder="Description/Alt for image">
|
||||
<?php echo "<button class='btn alert-default' type='submit' name='id' value=".$_GET["id"]."><img class='svg' src='assets/icons/edit.svg'>Update information</button>"; ?>
|
||||
</form>
|
||||
<?php
|
||||
if (isset($error)) {
|
||||
|
|
|
|||
54
image.php
54
image.php
|
|
@ -18,6 +18,8 @@
|
|||
// Update toast
|
||||
if ($_GET["update"] == "success") {
|
||||
echo "<p class='alert alert-high space-bottom-large'>Information updated</p>";
|
||||
} elseif ($_GET["update"] == "skip") {
|
||||
echo "<p class='alert alert-default space-bottom-large'>No alt, skip</p>";
|
||||
}
|
||||
|
||||
// Getting all image info from table
|
||||
|
|
@ -67,7 +69,7 @@
|
|||
<?php echo "<img class='image' id='".$image['id']."' src='".$image_path."' alt='".$image_alt."'>"; ?>
|
||||
</div>
|
||||
|
||||
<div class="image-description">
|
||||
<div class="image-description default-window">
|
||||
<h2>Description</h2>
|
||||
<?php
|
||||
// Image Description/Alt
|
||||
|
|
@ -76,11 +78,10 @@
|
|||
}else{
|
||||
echo "<p>".$image_alt."</p>";
|
||||
}
|
||||
|
||||
?>
|
||||
</div>
|
||||
|
||||
<div class="image-detail flex-down">
|
||||
<div class="image-detail flex-down default-window">
|
||||
<h2>Details</h2>
|
||||
<?php
|
||||
// Image ID
|
||||
|
|
@ -113,35 +114,40 @@
|
|||
|
||||
<?php
|
||||
if (isset($_SESSION['id']) && $image['author'] == $_SESSION['id'] || $_SESSION['id'] == 1) {
|
||||
echo "<div class='danger-zone flex-down'>";
|
||||
// Deleting image
|
||||
if (isset($_POST['delete'])) {
|
||||
// Delete from table
|
||||
$image_delete_request = "DELETE FROM swag_table WHERE id =".$image['id'];
|
||||
$image_delete = mysqli_query($conn,$image_delete_request);
|
||||
|
||||
if ($image_delete) {
|
||||
// See if image is in the directory
|
||||
if (is_file("images/".$image['imagename'])) {
|
||||
unlink("images/".$image['imagename']);
|
||||
}
|
||||
// Delete thumbnail if exitsts
|
||||
if (is_file("images/thumbnails/".$image['imagename'])) {
|
||||
unlink("images/thumbnails/".$image['imagename']);
|
||||
}
|
||||
header("Location:index.php?del=true&id=".$image['id']);
|
||||
} else {
|
||||
$error = "Could not delete image";
|
||||
}
|
||||
}
|
||||
// Delete form
|
||||
echo "<div class='danger-zone flex-down default-window'>";
|
||||
echo "<h2>Danger zone</h2>";
|
||||
// Image hover details
|
||||
echo "<form class='detail' method='POST' enctype='multipart/form-data'>";
|
||||
echo "<button class='btn alert-low' type='submit' name='delete' value='".$image['id']."'><img class='svg' src='assets/icons/trash.svg'>Delete image</button>";
|
||||
if (isset($error)) {
|
||||
echo "<p class='alert alert-fail' id='deleted'>".$error."</p>";
|
||||
}
|
||||
echo "</form>";
|
||||
|
||||
// Check if query is set
|
||||
if (isset($_POST['delete'])) {
|
||||
// Try deleting image
|
||||
if(unlink("images/".$image['imagename']) && unlink("images/thumbnails/".$image['imagename'])) {
|
||||
// If deleted, delete from Table
|
||||
$image_delete_request = "DELETE FROM swag_table WHERE id =".$image['id'];
|
||||
$image_delete = mysqli_query($conn,$image_delete_request);
|
||||
|
||||
if ($image_delete) {
|
||||
// Deleted image
|
||||
header("Location:index.php?del=true&id=".$image['id']);
|
||||
}
|
||||
} else {
|
||||
// Could not delete from file
|
||||
echo "<p class='alert alert-fail' id='deleted'>Error: Coult not delete image</p>";
|
||||
}
|
||||
}
|
||||
|
||||
// Edit image button
|
||||
echo "<a class='btn alert-low space-top' href='https://superdupersecteteuploadtest.fluffybean.gay/edit.php?id=".$image['id']."'><img class='svg' src='assets/icons/edit.svg'>Modify image content</a>";
|
||||
echo "</div>";
|
||||
} else {
|
||||
|
||||
}
|
||||
?>
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
<body>
|
||||
<?php include("../ui/header.php"); ?>
|
||||
|
||||
<div class="about-root">
|
||||
<div class="about-root default-window">
|
||||
<h2 id="about">What is Fluffys Amazing Gallery?</h2>
|
||||
<p>Fluffys Amazing Gallery, or F.A.G for short, is a project by Fluffy Bean. It started as a project to manage the gallery on my main page, but quickly turned into its own thing.</p>
|
||||
<p>What do I want this to become? Good question! I have no clue. All I know is that I want to make this open-source and free to host on your own server once I'm finished with this.</p>
|
||||
|
|
|
|||
Loading…
Reference in a new issue