DavidJentes
/
websitedesign2023
mirror of https://github.com/DavidJentes/websitedesign2023
1
0
Fork 0
Code

Add logo to pages

main
dugo3number2 2023-04-18 12:44:33 -05:00
parent d65df1a9dc
commit f715b34e33
12 changed files with 22 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
docs/about/index.html
View File

@ -11,6 +11,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

7
docs/assets/css/main.css
View File

@ -35,6 +35,13 @@ header h1 {
transition: font-size 200ms; transition: font-size 200ms;
} }
.logo {
display: inline-block;
width: 75px;
height: 75px;
transition: width 300ms, height 300ms;
}
nav { nav {
text-align: right; text-align: right;
display: inline-block; display: inline-block;

5
docs/assets/js/scroll.js
View File

@ -3,12 +3,15 @@ window.onscroll = () => {
} }
const header = document.getElementsByTagName("header")[0] const header = document.getElementsByTagName("header")[0]
const logo = document.getElementsByClassName("logo")[0]
const headerText = document.getElementsByTagName("h1")[0] const headerText = document.getElementsByTagName("h1")[0]
const headerButtons = document.getElementsByTagName("ul")[0].children const headerButtons = document.getElementsByTagName("ul")[0].children
function headerScroll() { function headerScroll() {
if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) { if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
header.style.padding = "5px" header.style.padding = "5px"
logo.style.width = "50px"
logo.style.height = "50px"
headerText.style.fontSize = "16px" headerText.style.fontSize = "16px"
headerText.style.padding = "5px" headerText.style.padding = "5px"
for (const button of headerButtons) { for (const button of headerButtons) {
@ -17,6 +20,8 @@ function headerScroll() {
menuButton.style.width = "20px" menuButton.style.width = "20px"
} else { } else {
header.style.padding = "10px" header.style.padding = "10px"
logo.style.width = "75px"
logo.style.height = "75px"
headerText.style.fontSize = "32px" headerText.style.fontSize = "32px"
headerText.style.padding = "10px" headerText.style.padding = "10px"
for (const button of headerButtons) { for (const button of headerButtons) {

1
docs/calendar/index.html
View File

@ -12,6 +12,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/contact/general/index.html
View File

@ -12,6 +12,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/contact/help/index.html
View File

@ -12,6 +12,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/contact/index.html
View File

@ -12,6 +12,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/contact/volunteer/index.html
View File

@ -12,6 +12,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/index.html
View File

@ -11,6 +11,7 @@
<body data-m="drop" data-m-duration="1.5"> <body data-m="drop" data-m-duration="1.5">
<header data-m="reveal-right" data-m-delay="1" data-m-duration="1"> <header data-m="reveal-right" data-m-delay="1" data-m-duration="1">
<img class="logo" width="25" height="25" src="assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/projects/index.html
View File

@ -13,6 +13,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>
<ul> <ul>

1
docs/shop/index.html
View File

@ -11,6 +11,7 @@
<body> <body>
<header data-m="reveal-right" data-m-duration="0.5"> <header data-m="reveal-right" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<h1>The Cherub Foundation</h1> <h1>The Cherub Foundation</h1>
<a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a> <a href="javascript:void(0)" id="menu"><img src="../assets/img/hamburger.svg" width="25"></a>
<nav> <nav>

1
docs/thankyou/index.html
View File

@ -26,6 +26,7 @@
</nav> </nav>
</header> </header>
<main data-m="drop" data-m-duration="0.5"> <main data-m="drop" data-m-duration="0.5">
<img class="logo" width="25" height="25" src="../assets/img/logo.png">
<h1>Thanks for your purchase!</h1> <h1>Thanks for your purchase!</h1>
<p>Donations and profits from products are used in the ministry you chose at checkout.</p> <p>Donations and profits from products are used in the ministry you chose at checkout.</p>
<a href="../projects">Do you want to read about the ministry you donated for?</a><br /> <a href="../projects">Do you want to read about the ministry you donated for?</a><br />