Skip to content

web_agency_hero #11

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 3 commits into
base: web_agency_hero
Choose a base branch
from
Open

web_agency_hero #11

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
5fdade3
Solved Web-agency-hero Issue
Mar 16, 2024
102a6fe
Changes made
Mar 22, 2024
83f985d
Changes made
Mar 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
55 changes: 55 additions & 0 deletions projects/amazon_product_page/index.html
View file
Open in desktop
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This should not be part of the web_agency_hero branch as it is for the Amazon product page challenge

Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
<!DOCTYPE html>
<html>
<head>
<title></title>
<link rel="stylesheet" href="styles.css" />
<style>


</style>
</head>
<body>
<div class="container">
<div class="left-side">
<p>Books > Humor & Entertainment > Humor</p>
<img class="main-img" src="images/book-cover.jpg" />
</div>
<div class="right-side">
<h1 class="title">
How to Talk to Your Cat About Gun Safety: And Abstinence, Drugs,
Satanism, and Other Dangers That Threaten Their Nine Lives
</h1>

<strong
>by
<a href="https://scrimba.com" target="_blank">Zachary Auburn </a
>(Author)</strong
><br /><br />
<img class="main-img" src="images/ratings.png" /> <br /><br />
<strong>The cats of America are under siege!</strong><br /><br />

<p>
Long gone are the good old days when a cat’s biggest worries were mean
dogs or a bath. Modern cats must confront satanists, online predators,
the possibility of needing to survive in a post-apocalyptic wasteland,
and countless other threats to their nine lives.
</p>
<p>
For over four decades, the American Association of Patriots have stood
at the vanguard of our country's defense by helping to prepare our
nation's cat owners for the difficult conversations they dread having
with their pets.
</p>

<p>
Written in a simple Q&A format, How to Talk to Your Cat About Gun
Safety answers crucial questions such as, “What is the right age to
talk to my cat about the proper use of firearms?” and “What are the
benefits of my cat living a lifestyle of abstinence?” and especially
“Why does my cat need to use the internet? Can’t he just play with
yarn like cats used to do?”
</p>
</div>
</div>
</body>
</html>
25 changes: 17 additions & 8 deletions projects/web_agency_hero/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,14 +1,23 @@
<!DOCTYPE html>

<html>
<head>
<link rel="stylesheet" href="styles.css" />
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;700&display=swap"
rel="stylesheet"
/>
</head>
<body></body>
<body>
<div class="container">
<div class="text-overlay">
<h1 class="title">Dave's Devs <br />& Designers</h1>
<!-- Split the title into two lines -->
<p>We're a group of devs &</p>
<p>designers who will help your</p>
<p>dream <span class="highlight">come true.</span></p>
<br /><br />
<button>Let's chat</button>
</div>
</div>
</body>
</html>

<!--
Dave's Devs & Designers
We're a group devs & designers who will help your dream come true.
Let's chat
-->
47 changes: 47 additions & 0 deletions projects/web_agency_hero/styles.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
body,
html {
margin: 0;
padding: 0;
height: 100%;
font-family: "Open Sans", sans-serif; /* Use Open Sans font */
}

.container {
position: relative;
width: 100%;
height: 100vh; /* Use the full viewport height */
background: url("images/faded-office.png") center center/cover;
}

.title {
color: #020202; /* Change h1 color to #020202 */
font-weight: 700; /* Bold font weight */
}

.text-overlay {
position: absolute;
top: 50%;
left: 10%;
transform: translateY(-50%);
text-align: left;
color: black;
}

.text-overlay p {
margin: 0; /* Remove default margins */
}

.text-overlay button {
padding: 10px 20px;
background-color: #0ea5e9;
color: white;
border: none;
cursor: pointer;
font-size: 1em;
border-radius: 5px;
font-weight: bold; /* Make button text bolder */
}

.highlight {
border-bottom: 2px solid #0ea5e9; /* Thick underline */
}