From 9f55046fd65db3effa230eaa2647467e42a0132a Mon Sep 17 00:00:00 2001 From: ​ Date: Thu, 1 Jan 1970 00:00:00 +0000 Subject: rescue 10 --- 10/about.html | 107 ++++++++++++++ 10/contact.html | 115 +++++++++++++++ 10/css/styles.css | 365 ++++++++++++++++++++++++++++++++++++++++++++++ 10/faqs.html | 80 ++++++++++ 10/gallery.html | 138 ++++++++++++++++++ 10/index.html | 88 +++++++++++ 10/media/captions.vtt | 31 ++++ 10/media/descriptions.vtt | 31 ++++ 10/partnership.html | 150 +++++++++++++++++++ 10/question.txt | 38 +++++ 10/scripts/script.js | 46 ++++++ 10/template.html | 69 +++++++++ 12 files changed, 1258 insertions(+) create mode 100644 10/about.html create mode 100644 10/contact.html create mode 100644 10/css/styles.css create mode 100644 10/faqs.html create mode 100644 10/gallery.html create mode 100644 10/index.html create mode 100644 10/media/captions.vtt create mode 100644 10/media/descriptions.vtt create mode 100644 10/partnership.html create mode 100644 10/question.txt create mode 100644 10/scripts/script.js create mode 100644 10/template.html diff --git a/10/about.html b/10/about.html new file mode 100644 index 0000000..f4cce2d --- /dev/null +++ b/10/about.html @@ -0,0 +1,107 @@ + + + + + + + + + + + + +Wild Rescues: About +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+
+

About Us

+

Wild Rescues is a registered nonprofit wildlife + rescue and rehabilitation facility, located in Ocala, + Florida. We help injured, sick, neglected, and orphaned + wildlife. We help rehabilitate these animals and then + release them back into the wild, if possible.

+

Wild Rescues is a member of the + + National Wildlife Rehabilitators Association. +

+ +

Watch the video below to meet our new, rescued friends.

+ + + +

We help many animals, such as:

+
    +
  • Raccoons
    • +
  • Squirrels
    • +
  • Fox
    • +
  • Birds
    • +
  • Horses
    • +
  • Deer
    • +
  • Pigs
    • +
  • Reptiles
    • +
+ +

Did you find an injured or orphaned animal? + Contact us to see if we can help.

+
+
+ + +
+ + diff --git a/10/contact.html b/10/contact.html new file mode 100644 index 0000000..4f88f01 --- /dev/null +++ b/10/contact.html @@ -0,0 +1,115 @@ + + + + + + + + + + + + +Wild Rescues: Contact +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+
+

You can reach us at:

+

(814) 555-8989

+

(814) 555-8989

+

Email: + contact@wildrescues.net

+

Address: Rescue Drive, Ocala, FL 34471

+
+
+

Complete the form below and we will contact you soon.

+
+
+ Contact Information + + + + + + + + + + +
+
+ Additional Information +

would like more information about:

+ + + + + + +
+ +
+
+
+ + +
+ + diff --git a/10/css/styles.css b/10/css/styles.css new file mode 100644 index 0000000..6f0592a --- /dev/null +++ b/10/css/styles.css @@ -0,0 +1,365 @@ +/* + Author: Name Surname + File Name: styles.css + Date: 2024/10/21 +*/ + +/* CSS Reset */ +body,header,nav,main,footer,img,h1,h3,ul,aside,figure, +figcaption,video{ + margin: 0px; + padding: 0px; + border: 0px; +} + +/* Style rules for body and images */ +body{ + background-color: #F6EEE4; +} + +img,video{ + max-width: 100%; + display: block; +} + +/* Style rules for mobile viewport */ + +/* Style rules to show show mobiile class and hide tab-desk class */ +.mobile,.mobile-tablet{ + display: block; +} + +.tab-desk,.desktop,#nav-links{ + display: none; +} + +/* Style rules for header area */ +.mobile h1,.mobile h3{ + padding: 2%; + text-align: center; +} + +.mobile h1{ + font-family: "Emblema One",system-ui; + font-weight: 400; + font-style: normal; + margin: 2% 0 0 3%; +} + +.mobile h3{ + font-family: "Lora",serif; + font-weight: 400; + font-style: normal; +} + +/* Style rules for navigation area */ +nav{ + background-color: #2A1F14; +} + +.mobile-nav a{ + color: #FFFFFF; + text-align: center; + font-size: 2em; + text-decoration: none; + padding: 3%; + display: block; +} +.mobile-nav a.nav-icon{ + display: block; + position: absolute; + left: 0; + top: 0; + color: #F6EEE4; + padding: 2%; +} +.nav-icon div{ + height: 40px; + width: 40px; + color: #2A1F14; +} + +/* Style rules for main content */ +main{ + padding: 2%; + font-family: "Lora",serif; + font-weight: 400; + font-style: normal; +} + +main p{ + font-size: 1.25em; +} + +main h3{ + padding-top: 2%; +} + +main ul{ + list-style: square; +} + +/* Style rules for class and id selectors */ +.link{ + color: #4D3319; + text-decoration: none; + font-weight: bold; + font-style: italic; +} + +.action{ + font-size: 1.75em; + font-weight: bold; + text-align: center; +} + +.round{ + border-radius: 6px; +} + +aside{ + text-align: center; + font-size: 1.5em; + font-weight: bold; + text-shadow: 4px 4px 10px #C5A687; +} + +figure{ + border: 4px solid #2A1F14; + box-shadow: 6px 6px 10px #C5A687; + max-width: 400px; + margin: 2% auto; +} + +figcaption{ + padding: 2%; + border-top: 4px solid #2A1F14; +} + +#info ul{ + margin-left: 10%; +} + +#contact,#form h2{ + text-align: center; +} + +.tel-link{ + background-color: #2A1F14; + padding: 2%; + width: 80%; + margin: 0px auto 0px auto; +} +.tel-link a{ + color: #F6EEE4; + text-decoration: none; + font-weight: bold; +} + +#questions p{ + cursor: pointer; +} +#answer{ + text-align: center; + font-weight: bold; + width: 80%; + margin: 0 auto; +} +#answer h2{ + display: none; +} + +/* Style rules for form elements */ +fieldset,input,textarea{ + margin-bottom: 2%; +} + +fieldset legend{ + font-weight: bold; + font-size: 1.25em; +} + +label{ + display: block; + padding-top: 2%; +} + +form #submit{ + margin: 0px auto 0px auto; + display: block; + padding: 2%; + background-color: #78593A; + color: #F6EEE4; + font-size: 1.25em; + border-radius: 10px; +} + +/* Style rules for footer content */ +footer{ + text-align: center; + font-size: 0.85em; + background-color: #2A1F14; + color: #F6EEE4; + padding-top: 1%; + padding-bottom: 1%; + padding-left: 0%; + padding-right: 0%; +} + +footer a{ + color: #F3E6D8; + text-decoration: none; +} + +/* Media Query for Tablet Viewport */ +@media screen and (min-width:620px),print{ + /* Tablet Viewport: Show tab-desk class, hide mobile class */ + .tab-desk{ + display: block; + } + .mobile,.mobile-nav{ + display: none; + } + + /* Tablet Viewport: Style rules for nav area */ + nav ul{ + list-style: none; + text-align: center; + } + nav li{ + border-top: 0px; + display: inline-block; + font-size: 1.25em; + font-family: Geneva,Arial,sans-serif; + font-weight: bold; + } + nav li a{ + padding: 0.5em; + display: block; + color: #F6EEE4; + text-decoration: none; + } + + .grid{ + display: grid; + grid-template-columns: auto auto; + grid-gap: 10px; + } + aside{ + grid-column: 1 / span 2; + } + + /* Tablet Viewport: Style rule for form element */ + form{ + width: 70%; + margin: 0px auto 0px auto; + } +} + +/* Media Query for Desktop Viewport */ +@media screen and (min-width:1000px),print{ + /* Desktop Viewport: Show desktop class, hide mobile-tablet class. */ + .desktop{ + display: inline; + } + .mobile-tablet{ + display: none; + } + + /* Desktop Viewport: Style rules for nav area */ + nav li{ + font-size: 1.5em; + } + nav li a{ + border-bottom: 0.5em; + border-left: 1.5em; + border-right: 1.5em; + } + nav li a:hover{ + color: #2A1F14; + background-color: #F6EEE4; + opacity: 0.5; + } + + /* Desktop Viewport: Style rules for main content */ + info ul{ + margin-left: 5%; + } + + .grid{ + grid-template-columns: auto auto auto; + grid-gap: 30px; + } + aside{ + grid-column: 1 / span 3; + font-size: 2em; + } + + /* Style rules for table */ + table{ + border: 1px solid #2A1F14; + border-collapse: collapse; + margin: 0px auto 0px auto; + } + caption{ + font-size: 1.5em; + font-weight: bold; + padding: 1%; + } + th,td{ + border: 1px solid #2A1F14; + padding: 1%; + } + th{ + background-color: #2A1F14; + color: #FFFFFF; + font-size: 1.15em; + } + tr:nth-child(odd){ + background-color: #DECCBA; + } + /* Desktop Viewport: Style rules for form elements */ + form{ + width: auto; + } + .form-grid{ + display: grid; + grid-template-columns: auto auto; + grid-gap: 20px; + } + .btn{ + grid-column: 1 / span 2; + } +} + +/* Media Query for Large Desktop Viewports */ +@media screen and (min-width:1921px){ + body{ + background: linear-gradient(#F6EEE4,#78593A); + } + + #wrapper{ + width: 1920px; + margin: 0px auto 0px auto; + } + + main{ + background-color: #F6EEE4; + } + + .grid{ + grid-template-columns: auto auto auto auto; + } + aside{ + grid-column: 1 / span 4; + font-size: 3em; + } +} + +/* Media Query for Print */ +@media print{ + body{ + background-color: #FFFFFF; + color: #000000; + } +} diff --git a/10/faqs.html b/10/faqs.html new file mode 100644 index 0000000..dd9b452 --- /dev/null +++ b/10/faqs.html @@ -0,0 +1,80 @@ + + + + + + + + + + + + +Wild Rescues: FAQs +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+
+

How can I determine if a baby animal + is an orphan?

+

How can I tell if an animal has + rabies?

+

I found a baby bird that fell from + its nest. Will the parents orphan it if I touch it?

+

How can I volunteer?

+
+
+

Answer:

+

+
+
+ + +
+ + diff --git a/10/gallery.html b/10/gallery.html new file mode 100644 index 0000000..a5d4c8d --- /dev/null +++ b/10/gallery.html @@ -0,0 +1,138 @@ + + + + + + + + + + + + +Wild Rescues: Gallery +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+ +
+ blind deer +
Russ is a blind deer. He was brought + to us by a hunter who found him wandering in + circles.
+
+
+ baby squirrel on a tree house +
Meet Nugget. He is learning how to + climb trees and will be released in a few more + weeks.
+
+
+ face of a cow +
This is Ellie. She was neglected by + her owner and malnourished when she was rescued. +
+
+
+ goat laying in the grass +
Say hi to Vinny. His back legs were + injured, making it difficult for him to get + around.
+
+
+ pig standing +
Rosie was just a baby when she + arrived. Now she has babies.
+
+
+ pig standing +
Squirt is one of Rosie’s babies. +
+
+
+ face of a horse +
Muffin has come a long way. She was + very thin when she was rescued.
+
+
+ baby hawk +
Poor Harley was rescued when he was + just three weeks old. He is getting big and will + be released in about a month.
+
+
+ bearded dragon +
Gizmo was abandoned by his owner and + is available for adoption.
+
+
+ cockatoo +
Peaches was also abandoned by his + owner. He loves to talk.
+
+
+ hedgehog +
Sonny was just a baby when he was + brought to us for rehabilitation.
+
+
+ tortoise with shell pyramiding +
Poor Victor has "shell pyramiding," + a form of bone disease.
+
+
+ + +
+ + diff --git a/10/index.html b/10/index.html new file mode 100644 index 0000000..c8914c8 --- /dev/null +++ b/10/index.html @@ -0,0 +1,88 @@ + + + + + + + + + + + + +Wild Rescues: Home +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+
+

Welcome to Wild Rescues. Our mission is to rescue, + rehabilitate, and release wildlife back into their natural + environment. We are a nonprofit organization dedicated to + helping injured wildlife.

+ +

Our staff provides around-the-clock care for wildlife + in need. We also provide long-term care for wildlife that + cannot be released back into their natural environment.

+ +

Will you partner with us question mark We need caring + volunteers to help care for our animals. You can also donate, + become a member, or become a sponsor. Contact us today.

+
+
+

Our Latest Rescue: Baby Raccoons

+ hands holding three baby raccoons +

Our latest rescues, Fizz, Bandit, and Mohawk. These + three little guys were found abandoned near a home.

+
+
+ + +
+ + diff --git a/10/media/captions.vtt b/10/media/captions.vtt new file mode 100644 index 0000000..6e49237 --- /dev/null +++ b/10/media/captions.vtt @@ -0,0 +1,31 @@ +WEBVTT + +NOTE +Captions for Wild Rescues +Student Name: Name Surname +File Name: captions.vtt +Date: 2024/10/28 + +1 +00:03.200 --> 00:07.200 +These baby raccoons were found abandoned near a home. + +2 +00:08.900 --> 00:11.700 +Nugget is learning how to climb trees. + +3 +00:13.800 --> 00:16.500 +Princess was neglected by her owner. + +4 +00:18.900 --> 00:20.500 +Sox is an orphan. + +5 +00:24.000 --> 00:26.000 +Frank was found abandoned. + +6 +00:29.000 --> 00:31.500 +Prince’s hooves are in bad shape. diff --git a/10/media/descriptions.vtt b/10/media/descriptions.vtt new file mode 100644 index 0000000..3cb416c --- /dev/null +++ b/10/media/descriptions.vtt @@ -0,0 +1,31 @@ +WEBVTT + +NOTE +Descriptions for Wild Rescues +Student Name: Name Surname +File Name: descriptions.vtt +Date: 2024/10/28 + +1 +00:03.200 --> 00:07.200 +Three baby racoons held by human hands. + +2 +00:08.900 --> 00:11.700 +Baby squirrel on a wooden home on a tree. + +3 +00:13.800 --> 00:16.500 +Face of a minature horse. + +4 +00:18.900 --> 00:20.500 +Small goat. + +5 +00:24.000 --> 00:26.000 +Pigeon standing on a hand. + +6 +00:29.000 --> 00:31.500 +Minature horse standing in its pen. diff --git a/10/partnership.html b/10/partnership.html new file mode 100644 index 0000000..455b0f5 --- /dev/null +++ b/10/partnership.html @@ -0,0 +1,150 @@ + + + + + + + + + + + + +Wild Rescues: Partnership +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+

We are grateful for the support from our community partners. + We have many sponsorship opportunities.

+
+

Sponsorship Levels.

+

Green: $200.

+

Blue: $400.

+

Red: $600.

+

Purple: $800.

+

Silver: $1,000.

+

Gold: $1,500.

+

Each sponsorship supports our animals and operations. + Business recognition is given at every sponsorship level. + Contact us today to become a sponsor.

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Sponsorship Opportunities.
Sponsorship LevelDollar AmountDetailsSponsorship Benefits
Green$200The green sponsorship helps us maintain + green pastures for our grazing friends.Recognition on our website.
Blue$400The blue sponsorship helps us provide food + for the animals.Recognition on our website and our brochure. +
Red$600The red sponsorship helps us provide medical + care for the animals.Recognition on our website and our brochure. + Business logo displayed on a banner at our + facility.
Purple$800The purple sponsorship helps us maintain homes + for the animals.Recognition on our website and our brochure. + Business logo displayed on a banner at our facility. + Business name and logo displayed at the annual + community event.
Silver$1,000The silver sponsorship supports our monthly + expenses.Recognition on our website and our brochure. + Business logo displayed on a banner at our facility. + Business name and logo displayed at the annual community + event. Recognition plaque with business name prominently + displayed within the facility.
Gold$1,500The gold sponsorship supports our operation costs.Recognition on our website and our brochure. + Business logo displayed on a banner at our facility. + Business name and logo displayed at the annual community + event. Recognition plaque with business name prominently + displayed within the facility. Display table at the + annual community event. Recognition in all media + releases.
+ +
+
+ + +
+ + diff --git a/10/question.txt b/10/question.txt new file mode 100644 index 0000000..922968d --- /dev/null +++ b/10/question.txt @@ -0,0 +1,38 @@ +Question: +In this exercise, you used an onclick event handler to call +each function. Research the addEventListener() method, and +explain how you would use it instead of an onclick event +handler to call the functions. + +Answer: +To use addEventListener(), I would replace the HTML onclick +attributes with ID attributes. I could then use addEventListener() +in combination with document.getElementById() to run a specific +function depending on which HTML paragraph is clicked. + +HTML: +
+
+

How can I determine if a baby animal + is an orphan?

+

How can I tell if an animal has + rabies?

+

I found a baby bird that fell from + its nest. Will the parents orphan it if I touch it?

+

How can I volunteer?

+
+
+

Answer:

+

+
+
+ +JS: +var q1 = document.getElementById("q1"); +q1.addEventListener("click",ans1); +var q2 = document.getElementById("q2"); +q2.addEventListener("click",ans2); +var q3 = document.getElementById("q3"); +q3.addEventListener("click",ans3); +var q4 = document.getElementById("q4"); +q4.addEventListener("click",ans4); diff --git a/10/scripts/script.js b/10/scripts/script.js new file mode 100644 index 0000000..c0c2dea --- /dev/null +++ b/10/scripts/script.js @@ -0,0 +1,46 @@ +/* + Student: Name Surname + File Name: script.js + Date: 2024/11/18 +*/ + +// Global variables +var answer = document.querySelector("#answer p"); +var heading = document.querySelector("#answer h2"); + +// Hamburger menu function +function hamburger() { + var navlinks = document.getElementById("nav-links"); + var menuicon = document.getElementById("icon"); + if (navlinks.style.display === "block") { + navlinks.style.display = "none"; + menuicon.style.color = "#2a1f14"; + }else { + navlinks.style.display = "block"; + menuicon.style.color = "#f6eee4"; + } +} + +// Function to display the first answer +function ans1() { + heading.style.display = "block"; + answer.textContent = "Step back and observe the situation for a a few minutes. Wait to see if a parent arrives. If the animal is in immediate danger from a predator or is in the road, remove the baby and bring to a rescue center."; +} + +// Function to display the second answer +function ans2() { + heading.style.display = "block"; + answer.textContent = "You cannot tell if an animal has rabies a simply by seeing it. A test must be performed to determine if an animal has rabies. Do not approach wildlife that you suspect might be rabid. Contact us to have the animal removed."; +} + +// Function to display the third answer +function ans3() { + heading.style.display = "block"; + answer.textContent = "No. This is a myth. The parents will retrieve the baby bird and place it back in its nest. If the parents do not return, contact us."; +} + +// Function to display the fourth answer +function ans4() { + heading.style.display = "block"; + answer.textContent = "We need volunteers to help feed animals, care a for animals, and clean animal pens. We also accept donations."; +} diff --git a/10/template.html b/10/template.html new file mode 100644 index 0000000..9c9a0b8 --- /dev/null +++ b/10/template.html @@ -0,0 +1,69 @@ + + + + + + + + + + + + +Wild Rescues: Template +
+ + + +
+
+ + rescued baby hawk + +
+
+

🐾 Wild Rescues

+

Rescue. Rehabilitate. Release.

+
+
+ + + + +
+
+
+
+ + +
+ + -- cgit 1.4.1