Skip to content

add cards in exercise #112

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
diegok23 wants to merge 1 commit into
base: master
Choose a base branch
from
Open

add cards in exercise #112

Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
134 changes: 134 additions & 0 deletions diegok23.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
<!DOCTYPE >
<html lang="en_US">
<head>
<title>Groupstrap | A CodeYourFuture Joint</title>
<meta charset="utf-8" />
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
<link rel="dns-prefetch" href="//maxcdn.bootstrapcdn.com" />
<link rel="dns-prefetch" href="//code.jquery.com" />
<link rel="dns-prefetch" href="//cdnjs.cloudflare.com" />
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css"
integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ"
crossorigin="anonymous"
/>
<link
rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"
/>
<link rel="stylesheet" href="styles/style.css" />
</head>
<body>
<header class="site-header container">
<nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse">
<button
class="navbar-toggler navbar-toggler-right"
type="button"
data-toggle="collapse"
data-target="#navbarSupportedContent"
aria-controls="navbarSupportedContent"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<a href="/" class="navbar-brand">
<img
class="img-fluid"
src="https://codeyourfuture.co/img/ico/cyf_brand.png"
alt="Logo for Groupstrap"
/>
<h1 class="sr-only">Groupstrap | A CodeYourFuture Joint</h1>
</a>

<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="/"
>Home <span class="sr-only">(current)</span></a
>
</li>
</ul>
</div>
</nav>
</header>

<div role="main" id="content" class="container site-content">
<div class="row">
<div class="col">
<!-- Add your Bootstrap components here -->
<div class="card" style="width: 18rem">
<img
class="card-img-top"
src="https://www.purina.com/sites/g/files/auxxlc196/files/styles/kraken_generic_max_width_240/public/wet-vs-dry-cat-food_500x300.jpg?itok=WbXyhic0"
alt="Card image cap"
/>
<div class="card-body">
<h5 class="card-title">NUTRITION</h5>
<p class="card-text">
Wet vs. Dry Cat Food: Which is Better? Some cat owners prefer to
feed their cats wet food. Others prefer dry kibble. Trying to
decide between wet vs. dry cat food? Find out what our experts
recommend when it comes to feeding your cat.
</p>
<a href="#" class="btn btn-primary">More Info</a>
</div>
</div>
<div class="card" style="width: 18rem">
<img
class="card-img-top"
src="https://www.purina.com/sites/g/files/auxxlc196/files/styles/kraken_generic_max_width_240/public/2021-01/PMT_How_Much_Feed_Cat_500x300.jpg?itok=g-i4_d4i"
alt="Card image cap"
/>
<div class="card-body">
<h5 class="card-title">FEEDING</h5>
<p class="card-text">
How Much Wet Food Should I Feed My Cat? Knowing how much to feed
your cat can help her maintain a healthy weight, but portion
sizes can vary based on her age, weight, activity levels and
more. Learn how to determine how much food your cat needs at
each meal.
</p>
<a href="#" class="btn btn-primary">More Info</a>
</div>
</div>
<div class="card" style="width: 18rem">
<img
class="card-img-top"
src="https://www.purina.com/sites/g/files/auxxlc196/files/styles/kraken_generic_max_width_240/public/purina_guide%20to%20cat%20hydration_500x300.jpg?itok=qQpFl2GG"
alt="Card image cap"
/>
<div class="card-body">
<h5 class="card-title">HEALTH</h5>
<p class="card-text">
Do Cats Drink Water? Cat Hydration & Dehydration Prevention Do
cats drink water? Yes, like humans and many other animals, cats
need water to survive. Many cats don’t drink as much as they
should, though. Find out why they need water and how to get your
own kitty to drink more.
</p>
<a href="#" class="btn btn-primary">More Info</a>
</div>
</div>
</div>
</div>
</div>

<script
src="https://code.jquery.com/jquery-3.1.1.slim.min.js"
integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n"
crossorigin="anonymous"
></script>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js"
integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb"
crossorigin="anonymous"
></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"
integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn"
crossorigin="anonymous"
></script>
</body>
</html>