gergely/cypher-player-assistant
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Create the initial welcome screen

Browse Source
This commit is contained in:
Gergely Polonkai 2025-06-05 21:09:54 +02:00
parent b938272cb2
commit 5e0bddf0d3
No known key found for this signature in database
GPG Key ID: 38F402C8471DDE93
1 changed files with 23 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
index.html
View File

@ -9,14 +9,17 @@
/* Dark Color Scheme */ /* Dark Color Scheme */
--dark-bg: black; --dark-bg: black;
--dark-text: white; --dark-text: white;
--dark-box-border: #333333;
/* Light Color Scheme */ /* Light Color Scheme */
--light-bg: white; --light-bg: white;
--light-text: black; --light-text: black;
--light-box-border: #cccccc;
/* Defaults */ /* Defaults */
--bg: var(--light-bg); --bg: var(--light-bg);
--text: var(--light-text); --text: var(--light-text);
--box-border: var(--light-box-border);
} }
#color-scheme { #color-scheme {
@ -26,6 +29,7 @@
#color-scheme:checked ~ .color-scheme-wrapper { #color-scheme:checked ~ .color-scheme-wrapper {
--bg: var(--dark-bg); --bg: var(--dark-bg);
--text: var(--dark-text); --text: var(--dark-text);
--box-border: var(--dark-box-border);
} }
#color-scheme:checked ~ .color-scheme-wrapper .dark-mode-hide { #color-scheme:checked ~ .color-scheme-wrapper .dark-mode-hide {
@ -48,11 +52,13 @@
:root { :root {
--bg: var(--dark-bg); --bg: var(--dark-bg);
--text: var(--dark-text); --text: var(--dark-text);
--box-border: var(--dark-box-border);
} }
#color-scheme:checked ~ .color-scheme-wrapper { #color-scheme:checked ~ .color-scheme-wrapper {
--bg: var(--light-bg); --bg: var(--light-bg);
--text: var(--light-text); --text: var(--light-text);
--box-border: var(--light-box-border);
} }
#color-scheme:checked ~ .color-scheme-wrapper .dark-mode-hide { #color-scheme:checked ~ .color-scheme-wrapper .dark-mode-hide {
@ -174,6 +180,20 @@
font-family: serif; font-family: serif;
text-align: center; text-align: center;
} }
.box {
width: 80%;
border-width: 2px;
border-style: solid;
border-color: var(--box-border);
border-radius: 10px;
margin: 0 auto 1em auto;
padding: 1em;
}
#no-loaded-container {
text-align: center;
}
</style> </style>
</head> </head>
<body> <body>
@ -186,6 +206,9 @@
</label> </label>
</div> </div>
<h1>Cypher Player Assistant</h1> <h1>Cypher Player Assistant</h1>
<div id="no-loaded-container" class="box">
No character is loaded.
</div>
</div> </div>
</body> </body>
</html> </html>