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(); todayFormatted = today.toString();
$("#byline").html("<p>blackout poem inspired by " + book.title + " by " + book.author + "</p><p>composed on: " + todayFormatted) + "</p>"; $("#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 }); // compose
// reset everything back // 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> <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> </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"> <div id="poem_header">
<h2>Invaders from the Dark</h2> <h2>Invaders from the Dark</h2>
<h3>Greye La Spina</h3> <h3>Greye La Spina</h3>
</div> </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"> <main id="poem">
<div id="spina" class="unlock"> <div id="spina" class="unlock">

21
style.css
View File

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