UPDATE - 23-08-2024

CasieBarieDev · Aug 23, 2024 · 68552ff · 68552ff
1 parent c155d3b
commit 68552ff
Show file tree

Hide file tree

Showing 12 changed files with 112 additions and 25 deletions.
diff --git a/404.html b/404.html
@@ -99,6 +99,7 @@
 	</style>
 </head>
 <body>
+<div id="background" style="background-image: url('/images/code.webp');"></div>
 <div id="body" class="visible">
 	<div data-include="/assets/menu" data-js="false"></div>
 	<div id="wrap">

diff --git a/README.md b/README.md
@@ -1 +1,23 @@
-# The source code of [CasieBarie Development](https://www.casiebarie.dev/)!
+# [CasieBarie Development Website](https://www.casiebarie.dev/)
+
+Welcome to the repository for the [CasieBarie Development](https://www.casiebarie.dev/) website, hosted on GitHub Pages.
+This project serves as the official online portfolio and information hub for CasieBarie Development, showcasing my projects, services, and expertise.
+
+## Features
+- **Responsive Design:** Optimized for various devices, including mobile phones, tablets, and desktops.
+- **Project Portfolio:** Showcases my completed projects with detailed descriptions and images.
+- **About Me Page:** Provides insight into the background, skills, and experience of CasieBarie.
+- **Contact Form:** Enables visitors to reach out to us directly from the site.
+- **Automatic Lowercase URL**: If a page is not found, the 404 page will first attempt to lowercase the URL.
+
+## Technologies Used
+- Frontend:
+  - HTML 5
+  - CSS 3
+  - JavaScript
+- Minification
+  - All the files are automatically minified using a GitHub Workflow, optimizing the website’s performance by reducing file size.
+- Hosting:
+  - GitHub Pages
+
+## You can find the website at www.casiebarie.dev.
diff --git a/aboutme.html b/aboutme.html
@@ -58,6 +58,7 @@
 	</style>
 </head>
 <body>
+<div id="background" style="background-image: url('/images/stars.webp');"></div>
 <div id="body" data-currentnav="ABOUT ME">
 	<div data-include="/assets/menu" data-js="false"></div>
 	<div id="wrap">

diff --git a/assets/css/default.css b/assets/css/default.css
@@ -43,7 +43,7 @@ body {
 	width: 100%;
 	height: 100%;
 	text-decoration-skip-ink: none;
-	background: black -webkit-linear-gradient(var(--bg-color-1), var(--bg-color-2)) no-repeat fixed;
+	background: black;
 	text-shadow: var(--font-color-invert) 1px 2px 3px;
 }
 
@@ -84,7 +84,7 @@ body.fixed-position {
 
 #down-button {
 	position: relative;
-	top: -4em;
+	top: -5em;
 	transition: opacity 0.3s linear;
 }
 
@@ -170,7 +170,7 @@ h1 {
 }
 
 .top .center h1 {
-	font-size: clamp(5ex, 10vw, 15ex);
+	font-size: clamp(4ex, 10vw, 10ex);
 }
 
 h2 {
@@ -333,7 +333,7 @@ a.shield img:hover {opacity: 0.7;}
 	height: 20px;
 	background: rgba(255, 255, 255, 0.2);
 	animation: animate 25s linear infinite;
-	bottom: -25vh;
+	bottom: -21vh;
 }
 
 #circles li:nth-child(1) {

diff --git a/assets/css/projects.css b/assets/css/projects.css
@@ -12,6 +12,7 @@
 	overflow: hidden;
 	background: black;
 	transition: opacity .3s ease-in-out;
+	height: fit-content;
 }
 
 .project .image {

diff --git a/assets/footer.html b/assets/footer.html
@@ -93,15 +93,79 @@
 		footer .socials a:nth-child(4) {animation-delay: .4s; -webkit-animation-delay: .4s; -moz-animation-delay: .4s; -o-animation-delay: .4s;}
 		footer .socials a:nth-child(5) {animation-delay: .5s; -webkit-animation-delay: .5s; -moz-animation-delay: .5s; -o-animation-delay: .5s;}
 		footer .socials a:nth-child(6) {animation-delay: .6s; -webkit-animation-delay: .6s; -moz-animation-delay: .6s; -o-animation-delay: .6s;}
-		footer .socials a:nth-child(7) {animation-delay: .7s; -webkit-animation-delay: .7s; -moz-animation-delay: .7s; -o-animation-delay: .7s;}
 
 		/* GITHUB */ footer .socials a:nth-child(1):hover, footer .socials a:nth-child(1):hover .tooltip {color: #e6edf3; text-shadow: 0 0 10px #e6edf3, 0 0 20px #e6edf3, 0 0 30px #e6edf3;}
-		/* PAYPAL */ footer .socials a:nth-child(2):hover, footer .socials a:nth-child(2):hover .tooltip {color: #009cde; text-shadow: 0 0 10px #009cde, 0 0 20px #009cde, 0 0 30px #009cde;}
+		/* SPIGOT */ footer .socials a:nth-child(2):hover, footer .socials a:nth-child(2):hover .tooltip {color: #db8522; text-shadow: 0 0 10px #db8522, 0 0 20px #db8522, 0 0 30px #db8522;}
 		/* YOUTUBE */ footer .socials a:nth-child(3):hover, footer .socials a:nth-child(3):hover .tooltip {color: #cc181e; text-shadow: 0 0 10px #cc181e, 0 0 20px #cc181e, 0 0 30px #cc181e;}
 		/* INSTAGRAM */ footer .socials a:nth-child(4):hover, footer .socials a:nth-child(4):hover .tooltip {color: #ec0075; text-shadow: 0 0 10px #ec0075, 0 0 20px #ec0075, 0 0 30px #ec0075;}
-		/* SPIGOT */ footer .socials a:nth-child(5):hover, footer .socials a:nth-child(5):hover .tooltip {color: #db8522; text-shadow: 0 0 10px #db8522, 0 0 20px #db8522, 0 0 30px #db8522;}
-		/* TRELLO */ footer .socials a:nth-child(6):hover, footer .socials a:nth-child(6):hover .tooltip {color: #51e898; text-shadow: 0 0 10px #51e898, 0 0 20px #51e898, 0 0 30px #51e898;}
-		/* DISCORD */ footer .socials a:nth-child(7):hover, footer .socials a:nth-child(7):hover .tooltip {color: #5865F2; text-shadow: 0 0 10px #5865F2, 0 0 20px #5865F2, 0 0 30px #5865F2;}
+		/* TRELLO */ footer .socials a:nth-child(5):hover, footer .socials a:nth-child(5):hover .tooltip {color: #51e898; text-shadow: 0 0 10px #51e898, 0 0 20px #51e898, 0 0 30px #51e898;}
+		/* DISCORD */ footer .socials a:nth-child(6):hover, footer .socials a:nth-child(6):hover .tooltip {color: #5865F2; text-shadow: 0 0 10px #5865F2, 0 0 20px #5865F2, 0 0 30px #5865F2;}
+
+		footer .donate {
+			margin: 0 auto 20px;
+			width: 140px;
+			height: 40px;
+			border: none;
+			border-radius: 10px;
+			background: linear-gradient(to right,#77530a,#ffd277,#77530a,#77530a,#ffd277,#77530a) left;
+			background-size: 250%;
+			color: #ffd277;
+			position: relative;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			cursor: pointer;
+			transition: background-position 1s;
+			overflow: hidden;
+			text-align: center;
+			animation: shinen 3s infinite linear;
+		}
+
+		footer .donate i {
+			color: #009cde;
+			font-size: large;
+			margin: 10px;
+			transition: text-shadow 1s;
+		}
+
+		footer .donate span {
+			color: #ffd277;
+			font-weight: bold;
+			position: absolute;
+			display: flex;
+			align-items: center;
+			justify-content: center;
+			width: 97%;
+			height: 90%;
+			border-radius: 8px;
+			transition: background-size 1s;
+			background-color: rgba(0, 0, 0, 0.842);
+			background-size: 200%;
+		}
+
+		footer .donate:hover span i {
+			text-shadow: 0 0 10px #009cde, 0 0 20px #009cde, 0 0 30px #009cde;
+		}
+
+		@keyframes shinen {
+			from {background-position: left;}
+			to {background-position: right;}
+		}
+
+		@-webkit-keyframes shinen {
+			from {background-position: left;}
+			to {background-position: right;}
+		}
+
+		@-moz-keyframes shinen {
+			from {background-position: left;}
+			to {background-position: right;}
+		}
+
+		@-o-keyframes shinen {
+			from {background-position: left;}
+			to {background-position: right;}
+		}
 
 		footer .copyright {
 			margin-top: 10px;
@@ -163,9 +227,9 @@
 				<i class="fa-brands fa-github"></i>
 				<div class="tooltip">GitHub</div>
 			</a>
-			<a href="https://www.paypal.com/donate/?hosted_button_id=PGLMKJEJRL6XN" aria-label="PayPal" onclick="window.open('https://www.paypal.com/donate/?hosted_button_id=PGLMKJEJRL6XN','PayPal', 'width=500,height=500,scrollbars=no,toolbar=no,location=no'); return false">
-				<i class="fa-brands fa-paypal"></i>
-				<div class="tooltip">PayPal</div>
+			<a href="https://www.spigotmc.org/members/casiebarie.533954/" aria-label="Spigot" target="_blank">
+				<i class="fa-solid fa-faucet-drip"></i>
+				<div class="tooltip">Spigot</div>
 			</a>
 			<a href="https://www.youtube.com/@casiebariedevelopment" aria-label="YouTube" target="_blank">
 				<i class="fa-brands fa-youtube"></i>
@@ -175,10 +239,7 @@
 				<i class="fa-brands fa-instagram"></i>
 				<div class="tooltip">Instagram</div>
 			</a>
-			<a href="https://www.spigotmc.org/members/casiebarie.533954/" aria-label="Spigot" target="_blank">
-				<i class="fa-solid fa-faucet-drip"></i>
-				<div class="tooltip">Spigot</div>
-			</a>
+
 			<a href="https://trello.com/w/casiebariedevelopment" aria-label="Trello" target="_blank">
 				<i class="fa-brands fa-trello"></i>
 				<div class="tooltip">Trello</div>
@@ -188,6 +249,7 @@
 				<div class="tooltip">Discord</div>
 			</a>
 		</div>
+		<button class="donate" onclick="window.open('https://www.paypal.com/donate/?hosted_button_id=PGLMKJEJRL6XN','PayPal', 'width=500,height=500,scrollbars=no,toolbar=no,location=no'); return false"><span><i class="fa-brands fa-paypal"></i>DONATE<i class="fa-brands fa-paypal"></i></span></button>
 		<div class="copyright">
 			<div class="wrap">
 				<div class="one">© 2021-2024 - CasieBarie</div>

diff --git a/assets/js/default.js b/assets/js/default.js
@@ -22,8 +22,7 @@ function loaded() {
     })
 
     copy();
-
-
+    for(let i = 0; i < 10; i++) {$('#circles').append('<li></li>');}
 }
 
 function copy() {

diff --git a/discord/index.html b/discord/index.html
@@ -19,8 +19,8 @@
 		<div id="page">
 			<div class="row top">
 				<div class="center">
-					<h1>Discord Bots</h1>
 					<div class="text">
+						<h1>Discord Bots</h1>
 						<p>
 							Discover a wide array of Discord bots created with the <a href="https://jda.wiki/" target="_blank" class="white">Java Discord API (JDA) <i class="fa-solid fa-arrow-up-right-from-square"></i></a><br><br>
 						</p>

diff --git a/images/stars.webp b/images/stars.webp
diff --git a/minecraft/casiebounce.html b/minecraft/casiebounce.html
@@ -28,7 +28,8 @@
 		<div id="page">
 			<div class="row top">
 				<div class="center">
-					<h1>CasieBounce</h1>
+					<div class="text">
+						<h1>CasieBounce</h1>
 						<p>
 							<a href="https://www.spigotmc.org/resources/.90967/" class="shield" title="Spigot Download" target="_blank"><img src="https://img.shields.io/spiget/downloads/90967?label=Download&logo=spigotmc&logoColor=FFFFFF" alt="Downloads" height="18px" width="auto"></a>
 							<a href="https://www.spigotmc.org/resources/.90967/updates/" class="shield" title="Spigot Updates" target="_blank"><img src="https://img.shields.io/spiget/version/90967?label=Version&logo=spigotmc&logoColor=FFFFFF" alt="Version" height="18px" width="auto"></a>
@@ -39,7 +40,7 @@ <h1>CasieBounce</h1>
 							<a href="https://bstats.org/plugin/bukkit/CasieBounce/13216" class="shield" title="bStats" target="_blank"><img alt="bStats Players" src="https://img.shields.io/bstats/players/13216?color=hotpink&label=Players&logo=bricks&logoColor=FFFFFF" height="18px" width="auto"></a>
 							<br><br><br>
 						</p>
-					<div class="text">
+
 						<p>The innovative plugin that adds a whole new dimension to movement and exploration!<br><br></p>
 						<p class="gray">
 							Designed for fun and excitement, CasieBounce allows players to experience the thrill of bouncing across terrains, leaping to incredible heights, and exploring the world like never before. Whether you’re building a parkour challenge, creating a fun mini-game, or just want to add some extra flair to your server, CasieBounce is the perfect addition.
@@ -124,7 +125,7 @@ <h2>Config</h2>
 						<ul class="gray">
 							<li><b>BounceForce: </b><code class="lang-java">Double</code> - The amount of force you will bounce with.</li>
 							<li><b>BounceSound: </b><code class="lang-java">String</code> - The sound that will be played when you bounce. Add <code>CUSTOM:</code> at the start for custom sounds. (Set to <code class="copy">NONE</code> to disable)</li>
-							<li><b>BouncePrize: </b><code class="lang-java">String</code> - A prize the player will get each time they bounce. (Format: <code>‹MONEY/ITEM/PERMISSION›@VALUE</code>) (Set to <code class="copy">NONE</code> to disable)</li>
+							<li><b>BouncePrize: </b><code class="lang-java">String</code> - A prize the player will get each time they bounce. With the format: <code>MONEY@{VALUE}</code> or <code>ITEM@{VALUE}</code> or <code>PERMISSION@{VALUE}</code>. (Set to <code class="copy">NONE</code> to disable)</li>
 							<li><b>StopWhenCrouch: </b><code class="lang-java">Boolean</code> - Whether you will stop bouncing when you crouch.</li>
 							<li><b>FallDamage: </b><code class="lang-java">Boolean</code> - Whether you take FallDamage.</li>
 							<li><b>DeathMessage: </b><code class="lang-java">String</code> - The death message when a player dies because of bouncing. (<code>&</code> and <code>#hex</code> codes are supported)</li>

diff --git a/minecraft/index.html b/minecraft/index.html
@@ -19,8 +19,8 @@
 		<div id="page">
 			<div class="row top">
 				<div class="center">
-					<h1>Minecraft Projects</h1>
 					<div class="text">
+						<h1>Minecraft Projects</h1>
 						<p>
 							Explore a collection of Minecraft projects that showcase creativity, technical prowess, and the limitless potential of the Minecraft universe.<br><br>
 						</p>

diff --git a/other/index.html b/other/index.html
@@ -19,8 +19,8 @@
 		<div id="page">
 			<div class="row top">
 				<div class="center">
-					<h1>Other Projects</h1>
 					<div class="text">
+						<h1>Other Projects</h1>
 						<p>
 							This page lists a few projects that are not Minecraft or Discord related.<br><br>
 						</p>
-Original file line number
+Diff line change
@@ Expand Up / @@ -22,8 +22,7 @@ function loaded() { @@
         })
         copy();
+        for(let i = 0; i < 10; i++) {$('#circles').append('<li></li>');}
     }
     function copy() {
@@ Expand Down @@