Add styles
This commit is contained in:
parent
849581b50e
commit
b425212fcf
5 changed files with 251 additions and 214 deletions
52
index.html
52
index.html
|
|
@ -9,31 +9,33 @@
|
||||||
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Odin Recipes</h1>
|
<main>
|
||||||
<ul class="recipe-menu">
|
<h1>Odin Recipes</h1>
|
||||||
<li><a href="index.html">Home</a></li>
|
<ul class="recipe-menu">
|
||||||
<li><a href="./recipes/greenbean-casserole.html"> Green Bean Casserole</a></li>
|
<li><a href="index.html">Home</a></li>
|
||||||
<li><a href="./recipes/avocado-toast.html">Avocado Toast</a></li>
|
<li><a href="./recipes/greenbean-casserole.html"> Green Bean Casserole</a></li>
|
||||||
<li><a href="./recipes/stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
<li><a href="./recipes/avocado-toast.html">Avocado Toast</a></li>
|
||||||
</ul>
|
<li><a href="./recipes/stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
||||||
<div class="content">
|
</ul>
|
||||||
<p>
|
<div class="content">
|
||||||
Welcome to my first Odin project! The purpose of this site is to
|
<p>
|
||||||
simply showcase what I have learned in the course thus far. So far, that includes
|
Welcome to my first Odin project! The purpose of this site is to
|
||||||
HTML and some basic CSS mainly around margins, padding, borders, fonts,
|
simply showcase what I have learned in the course thus far. So far, that includes
|
||||||
two dimensions, display types, and probably some others I'm forgetting at the moment.
|
HTML and some basic CSS mainly around margins, padding, borders, fonts,
|
||||||
</p>
|
two dimensions, display types, and probably some others I'm forgetting at the moment.
|
||||||
<p>
|
</p>
|
||||||
This is currently the second iteration of the site, where we showcase some of the
|
<p>
|
||||||
aforementioned CSS skills we learned. I'm not sure yet if we'll be revisiting this
|
This is currently the second iteration of the site, where we showcase some of the
|
||||||
project or not. If we don't, I may come back to it when I have more interesting
|
aforementioned CSS skills we learned. I'm not sure yet if we'll be revisiting this
|
||||||
ideas for a design for the site.
|
project or not. If we don't, I may come back to it when I have more interesting
|
||||||
</p>
|
ideas for a design for the site.
|
||||||
<p>
|
</p>
|
||||||
In the mean time, make yourself at home and have a look around! And then check black
|
<p>
|
||||||
at a later date to see if anything's changed. See you then!
|
In the mean time, make yourself at home and have a look around! And then check black
|
||||||
</p>
|
at a later date to see if anything's changed. See you then!
|
||||||
</div>
|
</p>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
||||||
|
|
|
||||||
|
|
@ -9,73 +9,75 @@
|
||||||
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Odin Recipes</h1>
|
<main>
|
||||||
|
<h1>Odin Recipes</h1>
|
||||||
|
|
||||||
<ul class="recipe-menu">
|
<ul class="recipe-menu">
|
||||||
<li><a href="../index.html">Home</a></li>
|
<li><a href="../index.html">Home</a></li>
|
||||||
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
||||||
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
||||||
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<h2>Avocado Toast</h2>
|
|
||||||
<img src="../images/avocado-toast.jpg" alt="Avocado Toast">
|
|
||||||
|
|
||||||
<h3>Description</h3>
|
|
||||||
<p>
|
|
||||||
Yes, I'm a millenial and yes I love me some avocado toast.
|
|
||||||
Bite me. :p What I love even more, though, is just how versatile
|
|
||||||
this dish is.
|
|
||||||
</p>
|
|
||||||
<p>
|
|
||||||
Avocado toast can be as simple or as complex as you want it to be.
|
|
||||||
Sometimes, I just want just the bread and avacado. Other times, I'm
|
|
||||||
gormet it up, taking as much as a half hour to get my toast ready!
|
|
||||||
</p>
|
|
||||||
<p>This recipe will focus on the basics, but you can do up your avocado
|
|
||||||
toast however you want to.
|
|
||||||
</p>
|
|
||||||
<p>And with that in mind, let's get to it!</p>
|
|
||||||
|
|
||||||
<h3>Ingredients</h3>
|
|
||||||
<ul>
|
|
||||||
<li>One medium to large avocado</li>
|
|
||||||
<li>A couple slices of nice quality bread</li>
|
|
||||||
<li>Butter or olive oil</li>
|
|
||||||
<li>Optional toppings and condiments of your choosing</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>Steps</h3>
|
<div class="content">
|
||||||
<ol>
|
<h2>Avocado Toast</h2>
|
||||||
<li>Heat up some butter or olive oil in a pan.</li>
|
<img src="../images/avocado-toast.jpg" alt="Avocado Toast">
|
||||||
<li>Soak up that melted butter or oil with the bread.</li>
|
|
||||||
<li>Toast it. Now you have a few options here:
|
<h3>Description</h3>
|
||||||
<ul>
|
<p>
|
||||||
<li>You can leave it in the pan and let it toast that way, or/li>
|
Yes, I'm a millenial and yes I love me some avocado toast.
|
||||||
<li>You can remove the bread and toast in an oven or toaster.</li>
|
Bite me. :p What I love even more, though, is just how versatile
|
||||||
</ul>
|
this dish is.
|
||||||
Personally, I prefer letting my bread toast on the stove on medium heat.
|
</p>
|
||||||
</li>
|
<p>
|
||||||
<li>While your bread toasts, slice up your avocado. I know some
|
Avocado toast can be as simple or as complex as you want it to be.
|
||||||
people like to smush the avocado to hell. If you're one of those
|
Sometimes, I just want just the bread and avacado. Other times, I'm
|
||||||
people, more power to you, but I'm not about that life. If I
|
gormet it up, taking as much as a half hour to get my toast ready!
|
||||||
wanted guacamole, then I'd make that... properly --- but you do you. ;)
|
</p>
|
||||||
Also, <strong>keep an eye your toast!</strong> Toasty bread has a
|
<p>This recipe will focus on the basics, but you can do up your avocado
|
||||||
way of sneaking up on you.
|
toast however you want to.
|
||||||
</li>
|
</p>
|
||||||
<li>Add the avocado to your toasty bread and enjoy! <em>Ooorr...</em></li>
|
<p>And with that in mind, let's get to it!</p>
|
||||||
<li>Gourmet it up and add some of your favorite toppings to it.
|
|
||||||
I personally enjoy fresh greens, roasted tomato, cheese, mustard,
|
|
||||||
and sometimes the occasional fried egg and hot sauce - but that's
|
|
||||||
getting into sandwich territory lol.
|
|
||||||
</li>
|
|
||||||
</ol>
|
|
||||||
|
|
||||||
<p>Anyway, I have blabbed enough. Go off and enjoy your avocado toast my
|
<h3>Ingredients</h3>
|
||||||
fellow "entitled" millenial! I know I'm going to enjoy mine!
|
<ul>
|
||||||
</p>
|
<li>One medium to large avocado</li>
|
||||||
</div>
|
<li>A couple slices of nice quality bread</li>
|
||||||
|
<li>Butter or olive oil</li>
|
||||||
|
<li>Optional toppings and condiments of your choosing</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h3>Steps</h3>
|
||||||
|
<ol>
|
||||||
|
<li>Heat up some butter or olive oil in a pan.</li>
|
||||||
|
<li>Soak up that melted butter or oil with the bread.</li>
|
||||||
|
<li>Toast it. Now you have a few options here:
|
||||||
|
<ul>
|
||||||
|
<li>You can leave it in the pan and let it toast that way, or/li>
|
||||||
|
<li>You can remove the bread and toast in an oven or toaster.</li>
|
||||||
|
</ul>
|
||||||
|
Personally, I prefer letting my bread toast on the stove on medium heat.
|
||||||
|
</li>
|
||||||
|
<li>While your bread toasts, slice up your avocado. I know some
|
||||||
|
people like to smush the avocado to hell. If you're one of those
|
||||||
|
people, more power to you, but I'm not about that life. If I
|
||||||
|
wanted guacamole, then I'd make that... properly --- but you do you. ;)
|
||||||
|
Also, <strong>keep an eye your toast!</strong> Toasty bread has a
|
||||||
|
way of sneaking up on you.
|
||||||
|
</li>
|
||||||
|
<li>Add the avocado to your toasty bread and enjoy! <em>Ooorr...</em></li>
|
||||||
|
<li>Gourmet it up and add some of your favorite toppings to it.
|
||||||
|
I personally enjoy fresh greens, roasted tomato, cheese, mustard,
|
||||||
|
and sometimes the occasional fried egg and hot sauce - but that's
|
||||||
|
getting into sandwich territory lol.
|
||||||
|
</li>
|
||||||
|
</ol>
|
||||||
|
|
||||||
|
<p>Anyway, I have blabbed enough. Go off and enjoy your avocado toast my
|
||||||
|
fellow "entitled" millenial! I know I'm going to enjoy mine!
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
||||||
|
|
|
||||||
|
|
@ -9,65 +9,67 @@
|
||||||
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Odin Recipes</h1>
|
<main>
|
||||||
|
<h1>Odin Recipes</h1>
|
||||||
|
|
||||||
<ul class="recipe-menu">
|
<ul class="recipe-menu">
|
||||||
<li><a href="../index.html">Home</a></li>
|
<li><a href="../index.html">Home</a></li>
|
||||||
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
||||||
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
||||||
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
||||||
</ul>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<h2>Green Bean Casserole</h2>
|
|
||||||
<img src="../images/GreenBeanCasserole.jpg" alt="Green Bean Casserole">
|
|
||||||
|
|
||||||
<h3>Description</h3>
|
|
||||||
<p>
|
|
||||||
Green bean casserole has been a favorite of mine since childhood.
|
|
||||||
It's creamy, cheesy, crunchy, fresh and <em>super</em> easy to make!
|
|
||||||
It only takes a few minutes of prep and about 30 minutes of cook time ---
|
|
||||||
depending on your oven of course.
|
|
||||||
</p>
|
|
||||||
<p>So without further ado, let's dive in to the recipe!</p>
|
|
||||||
|
|
||||||
<h3>Ingredients</h3>
|
|
||||||
<ul>
|
|
||||||
<li>One large can of cream of mushroom soup</li>
|
|
||||||
<li>Four small cans of green beans</li>
|
|
||||||
<li>Two to four packages of crispy french onions</li>
|
|
||||||
<li>Cheddar cheese</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>Steps</h3>
|
<div class="content">
|
||||||
<ol>
|
<h2>Green Bean Casserole</h2>
|
||||||
<li>Preheat your oven to 350 degrees.</li>
|
<img src="../images/GreenBeanCasserole.jpg" alt="Green Bean Casserole">
|
||||||
<li>Carefully open all the cans</li>
|
|
||||||
<li>Drain three all the canned green beans, keeping 1-2 cans of the
|
<h3>Description</h3>
|
||||||
water from the green beans in reserve.
|
<p>
|
||||||
</li>
|
Green bean casserole has been a favorite of mine since childhood.
|
||||||
<li>In a large baking pan or oven safe skillet, add the cream of
|
It's creamy, cheesy, crunchy, fresh and <em>super</em> easy to make!
|
||||||
mushroom soup and green beans. Mix evenly.
|
It only takes a few minutes of prep and about 30 minutes of cook time ---
|
||||||
</li>
|
depending on your oven of course.
|
||||||
<li>Take half of the french onions and mix them in with green beans.</li>
|
</p>
|
||||||
<li>Take the reserved water and <em>gradually</em> mix it in with
|
<p>So without further ado, let's dive in to the recipe!</p>
|
||||||
the ingredients in the pan to your desired thickness. However,
|
|
||||||
be careful not to make it too runny or you run the risk of the
|
|
||||||
casserole not holding together well.
|
|
||||||
</li>
|
|
||||||
<li>Place the dish in the oven for 15-20 minutes.</li>
|
|
||||||
<li>Shred the cheese.</li>
|
|
||||||
<li>After the initial bake time, add the remainder of the french onions
|
|
||||||
to the top of the dish and place it back in the oven for another 5-10
|
|
||||||
minutes. Watch it carefully so as not to burn the top layer of onions.
|
|
||||||
</li>
|
|
||||||
<li>Once the bake time is over, take the casserole out of the oven and let
|
|
||||||
it rest for about 2-5 minutes.
|
|
||||||
</li>
|
|
||||||
<li>Serve it up on a plate add cheese and enjoy!</li>
|
|
||||||
</ol>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
|
<h3>Ingredients</h3>
|
||||||
|
<ul>
|
||||||
|
<li>One large can of cream of mushroom soup</li>
|
||||||
|
<li>Four small cans of green beans</li>
|
||||||
|
<li>Two to four packages of crispy french onions</li>
|
||||||
|
<li>Cheddar cheese</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<h3>Steps</h3>
|
||||||
|
<ol>
|
||||||
|
<li>Preheat your oven to 350 degrees.</li>
|
||||||
|
<li>Carefully open all the cans</li>
|
||||||
|
<li>Drain three all the canned green beans, keeping 1-2 cans of the
|
||||||
|
water from the green beans in reserve.
|
||||||
|
</li>
|
||||||
|
<li>In a large baking pan or oven safe skillet, add the cream of
|
||||||
|
mushroom soup and green beans. Mix evenly.
|
||||||
|
</li>
|
||||||
|
<li>Take half of the french onions and mix them in with green beans.</li>
|
||||||
|
<li>Take the reserved water and <em>gradually</em> mix it in with
|
||||||
|
the ingredients in the pan to your desired thickness. However,
|
||||||
|
be careful not to make it too runny or you run the risk of the
|
||||||
|
casserole not holding together well.
|
||||||
|
</li>
|
||||||
|
<li>Place the dish in the oven for 15-20 minutes.</li>
|
||||||
|
<li>Shred the cheese.</li>
|
||||||
|
<li>After the initial bake time, add the remainder of the french onions
|
||||||
|
to the top of the dish and place it back in the oven for another 5-10
|
||||||
|
minutes. Watch it carefully so as not to burn the top layer of onions.
|
||||||
|
</li>
|
||||||
|
<li>Once the bake time is over, take the casserole out of the oven and let
|
||||||
|
it rest for about 2-5 minutes.
|
||||||
|
</li>
|
||||||
|
<li>Serve it up on a plate add cheese and enjoy!</li>
|
||||||
|
</ol>
|
||||||
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
||||||
for <a href="https://www.theodinproject.com/lessons/foundations-rock-paper-scissors" target="_blank" rel="noreferrer">The Odin Project</a>.
|
for <a href="https://www.theodinproject.com/lessons/foundations-rock-paper-scissors" target="_blank" rel="noreferrer">The Odin Project</a>.
|
||||||
|
|
|
||||||
|
|
@ -9,59 +9,61 @@
|
||||||
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
<link href='https://fonts.googleapis.com/css?family=Assistant' rel='stylesheet'>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<h1>Odin Recipes</h1>
|
<main>
|
||||||
|
<h1>Odin Recipes</h1>
|
||||||
|
|
||||||
<ul class="recipe-menu">
|
<ul class="recipe-menu">
|
||||||
<li><a href="../index.html">Home</a></li>
|
<li><a href="../index.html">Home</a></li>
|
||||||
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
<li><a href="./greenbean-casserole.html"> Green Bean Casserole</a></li>
|
||||||
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
<li><a href="./avocado-toast.html">Avocado Toast</a></li>
|
||||||
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
<li><a href="./stove-popped-popcorn.html">Stove Popped Popcorn</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<div class="content">
|
<div class="content">
|
||||||
<h2>Stove Popped Popcorn</h2>
|
<h2>Stove Popped Popcorn</h2>
|
||||||
<img src="../images/popcorn.jpg" alt="Stove Popped Popcorn">
|
<img src="../images/popcorn.jpg" alt="Stove Popped Popcorn">
|
||||||
|
|
||||||
<h3>Description</h3>
|
<h3>Description</h3>
|
||||||
<p>
|
<p>
|
||||||
This one is <em>extremely</em> easy! All you need is vegetable oil,
|
This one is <em>extremely</em> easy! All you need is vegetable oil,
|
||||||
salt, and popcorn kernals. That's it! Of course if you <i>want</i> to
|
salt, and popcorn kernals. That's it! Of course if you <i>want</i> to
|
||||||
get fancy and add black pepper, replace the salt entirely with
|
get fancy and add black pepper, replace the salt entirely with
|
||||||
your choice of popcorn seasoning, or even get extra fancy and make
|
your choice of popcorn seasoning, or even get extra fancy and make
|
||||||
caramel popcorn, that is entirely up to you. But if you're just looking
|
caramel popcorn, that is entirely up to you. But if you're just looking
|
||||||
for a simple delicious popcorn, three ingredients is all you need
|
for a simple delicious popcorn, three ingredients is all you need
|
||||||
</p>
|
</p>
|
||||||
<p>So let's dive in!</p>
|
<p>So let's dive in!</p>
|
||||||
|
|
||||||
<h3>Ingredients</h3>
|
<h3>Ingredients</h3>
|
||||||
<ul>
|
<ul>
|
||||||
<li>Popcorn kernals</li>
|
<li>Popcorn kernals</li>
|
||||||
<li>Vegetable oil</li>
|
<li>Vegetable oil</li>
|
||||||
<li>Salt and/or other preferred seasonings</li>
|
<li>Salt and/or other preferred seasonings</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<h3>Steps</h3>
|
<h3>Steps</h3>
|
||||||
<ol>
|
<ol>
|
||||||
<li>Cover the bottom of a small pot generously with vegetable oil.</li>
|
<li>Cover the bottom of a small pot generously with vegetable oil.</li>
|
||||||
<li>Put the oil on medium heat and add 3-4 kernals to the pan.</li>
|
<li>Put the oil on medium heat and add 3-4 kernals to the pan.</li>
|
||||||
<li>Puts some kernals in 1/4 to 1/2 measuring cup, depending on the size
|
<li>Puts some kernals in 1/4 to 1/2 measuring cup, depending on the size
|
||||||
of the pot and the amount of oil in the pot for easy acacess.
|
of the pot and the amount of oil in the pot for easy acacess.
|
||||||
</li>
|
</li>
|
||||||
<li>Chill or catch up on some stuff and listen out for the sound of a
|
<li>Chill or catch up on some stuff and listen out for the sound of a
|
||||||
kernal popping.
|
kernal popping.
|
||||||
</li>
|
</li>
|
||||||
<li>Once you hear a kernal pop, return to the stove and pour a
|
<li>Once you hear a kernal pop, return to the stove and pour a
|
||||||
<em>single layer</em> of kernals in the pot. The kernals should be
|
<em>single layer</em> of kernals in the pot. The kernals should be
|
||||||
<em>barely</em> emmersed in the oil.
|
<em>barely</em> emmersed in the oil.
|
||||||
</li>
|
</li>
|
||||||
<li>Let the kernals pop and shake the pan regularly as they do.</li>
|
<li>Let the kernals pop and shake the pan regularly as they do.</li>
|
||||||
<li>Once the popping starts to slow down, immediately turn off the stove,
|
<li>Once the popping starts to slow down, immediately turn off the stove,
|
||||||
remove the popcorn from the heat and carefully pour it into a
|
remove the popcorn from the heat and carefully pour it into a
|
||||||
serving bowl.
|
serving bowl.
|
||||||
</li>
|
</li>
|
||||||
<li>Add your desired amount of salt and/or seasonings and enjoy!</li>
|
<li>Add your desired amount of salt and/or seasonings and enjoy!</li>
|
||||||
</ol>
|
</ol>
|
||||||
</div>
|
</div>
|
||||||
|
</main>
|
||||||
|
|
||||||
<footer>
|
<footer>
|
||||||
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
Created by <a href="https://andrindie.com" target="_blank" rel="noreferrer">Octavia Nichols</a>
|
||||||
|
|
|
||||||
83
style.css
83
style.css
|
|
@ -3,49 +3,31 @@ html {
|
||||||
}
|
}
|
||||||
|
|
||||||
body{
|
body{
|
||||||
|
margin: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
main {
|
||||||
max-width: 66%;
|
max-width: 66%;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 10px 85px;
|
padding: 10px 85px;
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: rgb(220, 248, 220, .85);
|
background-color: rgb(220, 248, 220, .85);
|
||||||
|
flex: 1
|
||||||
}
|
}
|
||||||
|
|
||||||
img{
|
img {
|
||||||
width:100%;
|
width:100%;
|
||||||
height: auto;
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
a{
|
|
||||||
text-decoration: none;
|
|
||||||
color: green;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-menu a {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1, h2, h3, h4, h5, h6, .recipe-menu{
|
|
||||||
font-family: 'Alegreya Sans SC', sans-serif;
|
|
||||||
}
|
|
||||||
/* h3, h4, h5, h6 {
|
|
||||||
color: green;
|
|
||||||
} */
|
|
||||||
h1{
|
|
||||||
font-size: 50px;
|
|
||||||
}
|
|
||||||
h2{
|
|
||||||
font-size: 40px;
|
|
||||||
}
|
|
||||||
h3{
|
|
||||||
font-size: 30px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.recipe-menu{
|
.recipe-menu{
|
||||||
padding: 0;
|
padding: 0;
|
||||||
border: 5px solid green;
|
border: 5px solid green;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
list-style-type: none;
|
list-style-type: none;
|
||||||
margin: auto;
|
margin: auto;
|
||||||
|
background-color: rgba(224, 205, 191, 0.5);
|
||||||
}
|
}
|
||||||
|
|
||||||
.recipe-menu li{
|
.recipe-menu li{
|
||||||
|
|
@ -54,7 +36,54 @@ h3{
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.recipe-menu a {
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
.recipe-menu a:hover, .recipe-menu a:focus {
|
||||||
|
color: #39291c;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6, .recipe-menu {
|
||||||
|
font-family: 'Alegreya Sans SC', sans-serif;
|
||||||
|
color: #39291c;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 50px;
|
||||||
|
}
|
||||||
|
h2 {
|
||||||
|
font-size: 40px;
|
||||||
|
}
|
||||||
|
h3 {
|
||||||
|
font-size: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
.content{
|
.content{
|
||||||
font-family: 'Assistant', sans-serif;
|
font-family: 'Assistant', sans-serif;
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer {
|
||||||
|
color: #eee;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
background-color: rgba(17, 17, 17, 0.85);
|
||||||
|
flex: 0 0 auto;
|
||||||
|
margin: 0;
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a {
|
||||||
|
color: #e0cdbf;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer a:hover, footer a:focus {
|
||||||
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
Loading…
Reference in a new issue