Skip to content
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

Jump to bottom

Solve Tugas Pradipta Arya Daniswara #37

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Solve Tugas Pradipta Arya Daniswara #37

Show file tree
Hide file tree
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
210 changes: 210 additions & 0 deletions Pradipta Arya Daniswara/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,210 @@
<!DOCTYPE html>
<html lang="en" class="h-100">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">

<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-GLhlTQ8iRABdZLl6O3oVMWSktQOp6b7In1Zl3/Jr59b6EGGoI1aFkw7cmDA6j6gD" crossorigin="anonymous">

<title> Itadakimasu! </title>

<link rel="icon" href="./resources/images/logo.jpg">

<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="facebook" viewBox="0 0 16 16">
<path d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951z"/>
</symbol>
<symbol id="instagram" viewBox="0 0 16 16">
<path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.917 3.917 0 0 0-1.417.923A3.927 3.927 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.916 3.916 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.926 3.926 0 0 0-.923-1.417A3.911 3.911 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0h.003zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599.28.28.453.546.598.92.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.47 2.47 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.478 2.478 0 0 1-.92-.598 2.48 2.48 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233 0-2.136.008-2.388.046-3.231.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92.28-.28.546-.453.92-.598.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045v.002zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92zm-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217zm0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334z"/>
</symbol>
<symbol id="twitter" viewBox="0 0 16 16">
<path d="M5.026 15c6.038 0 9.341-5.003 9.341-9.334 0-.14 0-.282-.006-.422A6.685 6.685 0 0 0 16 3.542a6.658 6.658 0 0 1-1.889.518 3.301 3.301 0 0 0 1.447-1.817 6.533 6.533 0 0 1-2.087.793A3.286 3.286 0 0 0 7.875 6.03a9.325 9.325 0 0 1-6.767-3.429 3.289 3.289 0 0 0 1.018 4.382A3.323 3.323 0 0 1 .64 6.575v.045a3.288 3.288 0 0 0 2.632 3.218 3.203 3.203 0 0 1-.865.115 3.23 3.23 0 0 1-.614-.057 3.283 3.283 0 0 0 3.067 2.277A6.588 6.588 0 0 1 .78 13.58a6.32 6.32 0 0 1-.78-.045A9.344 9.344 0 0 0 5.026 15z"/>
</symbol>
</svg>
</head>
<body>
<header>
<div class="navbar navbar-dark bg-dark shadow-sm">
<div class="container">
<a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank" class="navbar-brand d-flex align-items-center">
<img src="./resources/images/logo.jpg" style="margin: 5px 10px 5px" width="40" height="40" class="rounded" alt="Logo">
<strong style="margin: 10px">Itadakimasu!</strong>
</a>
</div>
</div>
</header>

<main>
<section class="py-5 text-center container">
<div class="row py-lg-5">
<div class="col-lg-6 col-md-8 mx-auto">
<h1 class="fw-semibold">Bring out the chef in you!</h1>
<p class="lead">Cooking is not just about nourishing your body, it's also about nourishing your soul. Every time you step into the kitchen, you have the opportunity to create something delicious and beautiful, to experiment with different flavors and textures, and to express your creativity. With Itadakimasu! we will bring out the chef in you!</p>
</div>
</div>
</section>

<div class="album py-5 bg-light">
<div class="container">
<div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3">
<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/vvpprx1487325699.jpg" class="card-img-top" alt="Beef Wellington">
<div class="card-body">
<p class="card-text">Beef Wellington is a steak dish of English origin, made out of fillet steak coated with pâté and duxelles, wrapped in puff pastry, then baked. Some recipes include wrapping the coated meat in a crêpe or parma ham to retain the moisture.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Beef</small>
</div>
</div>
</div>
</div>


<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/llcbn01574260722.jpg" class="card-img-top" alt="Carbonara">
<div class="card-body">
<p class="card-text">Carbonara is an Italian pasta dish from Rome made with eggs, hard cheese, cured pork and black pepper. The cheese is usually Pecorino Romano, Parmigiano-Reggiano, or a combination of the two. Normally smoked bacon are used for the meat component.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Pasta</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/tyywsw1505930373.jpg" class="card-img-top" alt="Chicken Karaage">
<div class="card-body">
<p class="card-text">Karaage (唐揚げ) is a Japanese cooking technique in which various foods are deep fried in oil. The process involves lightly coating small pieces of the meat or fish with a combination of flour and potato starch or corn starch, and frying in a light oil.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Chicken</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/utxryw1511721587.jpg" class="card-img-top" alt="English Breakfast">
<div class="card-body">
<p class="card-text">A full breakfast is a substantial cooked breakfast meal, often served in the United Kingdom and Ireland, that typically includes bacon, sausages, eggs, black pudding, baked beans, potato, tomatoes, mushrooms, toast, and a beverage such as coffee or tea.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Breakfast</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/0jv5gx1661040802.jpg" class="card-img-top" alt="Fettuccine Alfredo">
<div class="card-body">
<p class="card-text">Fettuccine Alfredo or fettuccine al burro ("fettuccine with butter") is an Italian pasta dish of fresh fettuccine tossed with butter and Parmesan cheese. As the cheese melts, it emulsifies the liquids to form a smooth and rich cheese sauce coating the pasta.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Pasta</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/rvxxuy1468312893.jpg" class="card-img-top" alt="Lasagna">
<div class="card-body">
<p class="card-text">Lasagna, is an Italian dish made of stacked layers of lasagna alternating with fillings such as ragù (ground meats and tomato sauce), vegetables, cheeses (which may include ricotta, mozzarella, and parmesan), and seasonings and spices.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Vegan</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/x0lk931587671540.jpg" class="card-img-top" alt="Pizza">
<div class="card-body">
<p class="card-text">Pizza is a dish of Italian origin consisting of a usually round, flat base of leavened wheat-based dough topped with tomatoes, cheese, and often various other ingredients, which is then baked at a high temperature, traditionally in a wood-fired oven.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Miscellaneous</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/xxrxux1503070723.jpg" class="card-img-top" alt="Risotto">
<div class="card-body">
<p class="card-text">Risotto is a northern Italian rice dish cooked with broth until it reaches a creamy consistency. The broth can be derived from meat, fish, or vegetables. Many types of risotto contain butter, onion, white wine, and Parmigiano-Reggiano.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Seafood</small>
</div>
</div>
</div>
</div>

<div class="col">
<div class="card shadow-sm">
<img src="https://www.themealdb.com/images/media/meals/g046bb1663960946.jpg" class="card-img-top" alt="Sushi">
<div class="card-body">
<p class="card-text">Sushi (すし, 寿司, 鮨, 鮓) is a Japanese dish of prepared vinegared rice (鮨飯, sushi-meshi), usually with some sugar and salt, accompanied by a variety of ingredients (ねた, neta), such as seafood, often raw, and vegetables.</p>
<div class="d-flex justify-content-between align-items-center">
<div class="btn-group">
<a type="button" class="btn btn-sm btn-outline-secondary" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ">View</a>
</div>
<small class="text-muted">Seafood</small>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>

<div class="container">
<footer class="d-flex flex-wrap justify-content-between align-items-center py-3 my-4 border-top">
<div class="col-md-4 d-flex align-items-center">
<img src="./resources/images/logo.jpg" style="margin: 5px 10px 5px" width="50" height="50" class="rounded" alt="Logo">
<span class="mb-md-0 text-muted">&copy; 2023 Itadakimasu!</span>
</div>

<ul class="nav my-2 me-3 col-md-4 justify-content-end list-unstyled d-flex">
<li class="ms-3"><a class="text-muted" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank"><svg class="bi" width="24" height="24"><use xlink:href="#twitter"/></svg></a></li>
<li class="ms-3"><a class="text-muted" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank"><svg class="bi" width="24" height="24"><use xlink:href="#instagram"/></svg></a></li>
<li class="ms-3"><a class="text-muted" href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" target="_blank"><svg class="bi" width="24" height="24"><use xlink:href="#facebook"/></svg></a></li>
</ul>
</footer>
</div>

<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js" integrity="sha384-w76AqPfDkMBDXo30jS1Sgez6pr3x5MlQ1ZAGC+nuZB+EYdgRZgiwxhTBTkF7CXvN" crossorigin="anonymous"></script>
</body>
</html>
11 changes: 11 additions & 0 deletions Pradipta Arya Daniswara/resources/css/views.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,11 @@
@media only screen and (max-width: 768px) {
.col-image {
width: 100%;
}
}

@media only screen and (min-width: 768px) {
.col-image {
width: 50%;
}
}
Binary file added Pradipta Arya Daniswara/resources/images/logo.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.