jake/dbpc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

updated font css, hover css

Browse Source
This commit is contained in:
Jacob Haddon 2024-03-12 20:19:49 -04:00
parent 83c918809b
commit e52846a08f
2 changed files with 26 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
index.html
View File

@ -100,6 +100,10 @@ $(document).ready(function(){
todayFormatted = today.toString();
$("#byline").html("<p>blackout poem inspired by " + book.title + " by " + book.author + "</p><p>composed on: " + todayFormatted) + "</p>";
$(this).text(function(i, text){
return text === "Blackout!" ? "Un-Blackout!" : "Blackout!";
})
}); // compose
// reset everything back
@ -157,15 +161,17 @@ $(document).ready(function(){
<p>Click on a word to select it, click on it again to unselect. When you’ve found your poem hit Blackout! Get a screen shot and copy the words below!</p>
</header>
<nav>
<button class="helpbtn btn btn-mn">Help</button> - <button id="lock" class="btn btn-mn">Lock</button> - <button id="compose" class="btn btn-mn">Blackout!</button> - <button id="clear" class="btn btn-mn">Start Over</button> - <button id="screen" class="btn btn-mn">Save as image</button>
</nav>
<div id="poem_header">
<h2>Invaders from the Dark</h2>
<h3>Greye La Spina</h3>
</div>
<nav>
<button class="helpbtn btn btn-mn">Help</button> - <button id="clear" class="btn btn-mn">Start Over</button> - <button id="compose" class="btn btn-mn">Blackout!</button> - <button id="screen" class="btn btn-mn">Save as image</button>
</nav>
<main id="poem">
<div id="spina" class="unlock">

21
style.css
View File

@ -13,20 +13,25 @@ Written by Jacob Haddon https://jacobhaddon.com
@font-face {
font-family: "lora";
src: local("Lora"),
url("fonts/Lora/Lora-VariableFont_wght.ttf");
url("fonts/Lora/webfonts/Lora-Regular.woff2") format('woff2'),
url("fonts/Lora/variable/Lora-VariableFont_wght.ttf") format('truetype');
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: "brygada";
src: local("Brygada1918"),
url("fonts/Brygada_1918/Brygada1918-VariableFont_wght.ttf");
url("fonts/Brygada_1918/Brygada1918-VariableFont_wght.ttf") format('truetype');
}
@font-face {
font-family: "lora";
src: local("Lora"),
url("fonts/Lora/Lora-VariableFont_wght.ttf");
url("fonts/Lora/webfonts/Lora-Italic.woff2") format('woff2'),
url("fonts/Lora/variable/Lora-Italic-VariableFont_wght.ttf");
font-weight: normal;
font-style: italic;
}
body {
@ -96,6 +101,8 @@ a:hover {
.click {
background-color: Plum;
/*background-color: RebeccaPurple;*/
/*color: #ffffff;*/
}
/* Styles for the buttons */
@ -113,8 +120,10 @@ a:hover {
color: #ffffff;
}
.btn-mn:hover {
background-color: Plum;
color: #000000;
/* background-color: Plum;
color: #000000;*/
background-color: black;
color: white;
}
.btn-hlp-bx {
@ -137,7 +146,9 @@ a:hover {
.clickDone {
background-color: white;
padding: 2px;
color: black;
}
.done {