Merge pull request #37 from PseudoDopamine/Release-3.4.1

Release v3.4.1
PseudoDopamine · Apr 26, 2024 · c303593 · c303593
2 parents 3127fc9 + 6cf9482
commit c303593
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 42 deletions.
diff --git a/index.html b/index.html
@@ -61,6 +61,24 @@ <h1>TPDC</h1>
 		<!-- Header -->
 		<header class="flex">
 			<h1>Where Dopamine fails, friends will thrive.</h1>
+			<hr />
+			<div class="call-to-action">
+				<p>
+					<strong>The Final Three Productions - The Rogue Summit 5</strong>
+					<br />
+					A 2-day charity event raising money for <a href="https://www.PCRF.net" target="_blank" rel="noopener noreferrer">Palestine Children's Relief Fund</a>.
+				</p>
+				<nav aria-label="Call-to-action menu">
+					<ul>
+						<li>
+							<a href="https://Tiltify.com/@ayaan-ahmed/the-rogue-summit-5" target="_blank" rel="noopener noreferrer" class="button">Donate!</a>
+						</li>
+						<li>
+							<a href="https://www.Twitch.tv/AsuraFGC" target="_blank" rel="noopener noreferrer" class="button">Watch now!</a>
+						</li>
+					</ul>
+				</nav>
+			</div>
 		</header>
 
 		<!-- Main content -->

diff --git a/res/css/style.css b/res/css/style.css
@@ -27,10 +27,10 @@ html {
 
 /* A better looking default horizontal rule */
 hr {
-	display: block;
-	height: 1px;
 	border: 0;
 	border-top: 1px solid currentColor;
+	display: block;
+	height: 1px;
 	margin: 1em 0;
 	padding: 0;
 }
@@ -106,13 +106,10 @@ p {
 	margin: .5em 0;
 }
 
-a, button {
-	transition-property: all;
-}
-
 a {
 	color: var(--french-blue);
 	font-weight: normal;
+	transition-property: all;
 }
 
 a[href*="Discord"] {
@@ -135,49 +132,29 @@ a[href*="YouTube"] {
 	color: #FF0000;
 }
 
-button, a.button {
+a.button {
 	background-color: var(--french-blue);
 	border-radius: .5rem;
-	color: var(--seasalt-white);
-}
-
-button {
-	border: none;
-	font: inherit;
-	font-weight: normal;
-	height: 2.5rem;
-	width: 2.5rem;
-}
-
-a.button {
-	padding: .5rem .75rem;
+	display: inline-block;
+	color: currentColor !important;
 	text-decoration: none;
+	padding: .5rem .75rem;
 }
 
 a:hover {
 	text-decoration: none;
 }
 
-button:hover {
-	border: 2.5px solid currentColor;
-	cursor: pointer;
-}
-
 a.button:hover {
-	border: 2.5px solid var(--seasalt-white);
+	border-radius: .75rem;
 }
 
 a:active {
 	color: var(--celestial-blue);
 }
 
 a.button:active {
-	color: var(--seasalt-white);
-}
-
-button:active, a.button:active {
 	background-color: var(--celestial-blue);
-	border-radius: .75rem;
 }
 
 /* Layouts */
@@ -275,28 +252,22 @@ nav.bar li:not(.logo)>a:hover {
 	text-decoration: underline;
 }
 
-nav.bar>button {
-	display: none;
-}
-
-nav.bar.scrolled>button:hover {
-	border-color: var(--eerie-black);
-}
-
 /* Header */
 header {
-	background: center / cover no-repeat url("../assets/img/Banner\ \(RS5).gif");
+	background: center / cover no-repeat url("../assets/img/Banner\ \(RS5\).gif");
+	flex-direction: column;
 	height: 100vh;
 	justify-content: center !important;
+	position: relative;
 	text-align: center;
 	width: 100%;
 }
 
 header::before {
-	background-color: var(--eerie-black);
+	background-color: var(--night-black);
 	content: "";
 	height: 100%;
-	opacity: .5;
+	opacity: .9;
 	position: absolute;
 	width: 100%;
 }
@@ -305,6 +276,14 @@ header>* {
 	z-index: 1;
 }
 
+header>.call-to-action{
+	font-size: 1.15rem;
+}
+
+header hr {
+	width: 85%;
+}
+
 /* Main content */
 section {
 	padding: 75px 0 2.5rem;