Merge pull request #58 from NullHypothesis/improve-icons

Improve the way icons are displayed.
This commit is contained in:
Philipp Winter 2025-02-01 14:00:36 -06:00 committed by GitHub
commit 0800b05a99
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -20,7 +20,7 @@ const headerTemplate = `
<link rel="icon" href="assets/favicon-192.png" sizes="192x192"> <link rel="icon" href="assets/favicon-192.png" sizes="192x192">
<style> <style>
body { body {
font-family: Roboto,Helvetica,sans-serif; font-family: Roboto, Helvetica, sans-serif;
background: #ddd; background: #ddd;
margin: 1em auto; margin: 1em auto;
max-width: 1000px; max-width: 1000px;
@ -40,20 +40,20 @@ const headerTemplate = `
padding: 0.5em; padding: 0.5em;
list-style-type: none; /* Disable bullet points */ list-style-type: none; /* Disable bullet points */
border-radius: 10px; border-radius: 10px;
border:1px solid #c0c0c0; border: 1px solid #c0c0c0;
background: #f5f5f5; background: #f5f5f5;
box-shadow: 2px 2px 5px #bbb; box-shadow: 2px 2px 5px #bbb;
} }
a:link { a:link {
color:#0b61a4; color: #0b61a4;
text-decoration:none; text-decoration: none;
} }
a:visited { a:visited {
color:#033e6b; color: #033e6b;
text-decoration:none; text-decoration: none;
} }
a:hover { a:hover {
text-decoration:underline; text-decoration: underline;
} }
.icons a:hover { .icons a:hover {
text-decoration: none; text-decoration: none;
@ -82,7 +82,16 @@ const headerTemplate = `
} }
.icon { .icon {
height: 1em; height: 1em;
margin-right: 0.5em; width: 1em;
display: inline-block;
border-radius: 50%;
transition: background-color 0.3s ease;
padding: 0.5em;
overflow: visible;
}
.icon:hover {
background-color: #ffb772;
cursor: pointer;
} }
.icons { .icons {
float: right; float: right;
@ -158,10 +167,10 @@ const headerTemplate = `
color: #efefef; color: #efefef;
} }
#book-info > a:link { #book-info > a:link {
color: #d94b7b color: #d94b7b;
} }
#book-info > a:visited { #book-info > a:visited {
color: #d94b7b color: #d94b7b;
} }
</style> </style>
</head> </head>