generated from nhcarrigan/template
feat: add game title and copyright to UI
Adds the Elysium title above the guild hall button and an NHCarrigan copyright notice at the bottom of the sidebar, with matching styles.
This commit is contained in:
@@ -39,6 +39,7 @@ export const ClickArea = (): React.JSX.Element => {
|
||||
|
||||
return (
|
||||
<section className="click-area">
|
||||
<h1 className="game-title">Elysium</h1>
|
||||
<h2>Guild Hall</h2>
|
||||
<div className="click-button-wrapper">
|
||||
<button
|
||||
|
||||
@@ -95,6 +95,7 @@ export const GameLayout = (): React.JSX.Element => {
|
||||
<div className="game-main">
|
||||
<aside className="game-sidebar">
|
||||
<ClickArea />
|
||||
<p className="game-copyright">© NHCarrigan</p>
|
||||
</aside>
|
||||
|
||||
<main className="game-content">
|
||||
|
||||
@@ -165,6 +165,24 @@ body {
|
||||
}
|
||||
|
||||
/* ===================== CLICK AREA ===================== */
|
||||
.game-title {
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
background: linear-gradient(135deg, var(--colour-accent), var(--colour-accent-light));
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: transparent;
|
||||
background-clip: text;
|
||||
letter-spacing: 0.05em;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.game-copyright {
|
||||
margin-top: auto;
|
||||
font-size: 0.7rem;
|
||||
color: var(--colour-text-muted);
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.click-area {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user