Added hw1 for 140991.

parent b81447a8
No preview for this file type
This diff is collapsed.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A Commotion</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="commotion.png" alt="">
<h1 class="heading">A Commotion</h1>
<p class="narration">The farmers create a commotion outside your house. They refuse to give up their livelihood. Their leader shouts, "no money can replace our land." The ball is in your hand. What do you do?</p>
<div><a href="goons.html" class="choice">Hire goons to scare the farmers away.</a></div>
<div><a href="george.html" class="choice">Come out and negotiate with the farmers.</a></div>
<div><a href="index.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>The Conglomerate</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="conglomerate.png" alt="">
<h1 class="heading">The Conglomerate</h1>
<p class="narration">The conglomerate pressures you to accept the decision. They offer you even more money, benefits, and access to political power. What do you do?</p>
<div><a href="reputation.html" class="choice"> Protect the farmers at all costs.</a></div>
<div><a href="refused.html" class="choice"> Toast to the additional offers.</a></div>
<div><a href="index.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>A Haunting</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="death.png" alt="">
<h1 class="heading">A Haunting</h1>
<p class="narration">The bullet landed on one of the farmers' heads and a stampede occurred. The goons fought back, so your goons opened fire on them. It was a bloodbath. You found a way to hide the crime, but the memory and guilt of it will continue to haunt you for years until you die.</p>
<div><a href="goons.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Haunted</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="haunted.png" alt="">
<h1 class="heading">Haunted</h1>
<p class="narration">Thousands of farmers are displaced and do not know where to go. But your bank account is overflowing with money and you join the three comma club. Your actions haunt you every day for the rest of your life.</p>
<div><a href="refused.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Prosperity and Eggplants</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="eggplant.png" alt="">
<h1 class="heading">Prosperity and Eggplants</h1>
<p class="narration">You have never gotten any more offers from giant corporations for your land. However, the land prospered and your constituents never went hungry again. You even earned titles such as "#1 Exporter of Eggplant," "Talong Boy," and "Talong Ranger."</p>
<div><a href="goons.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Torture and Death</title>
<link rel="stylesheet" href="main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="torture.png" alt="">
<h1 class="heading">Torture and Death</h1>
<p class="narration">You've been kidnapped. You are all over the news and your family doesn't know where you are. You've been tortured for months and eventually suffer death. The farmers continue your fight.</p>
<div><a href="reputation.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A Negotiation</title>
<link rel="stylesheet" href="main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="george.png" alt="">
<h1 class="heading">A Negotiation</h1>
<p class="narration">You come out of your house and meet with one of their leaders, George Nicolas. You offer him two options.</p>
<div><a href="relocation.html" class="choice">Offer them relocation in the city.</a></div>
<div><a href="mall.html" class="choice">Provide jobs in the mall.</a></div>
<div><a href="commotion.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Guns, Goons and Gold</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="goons.png" alt="">
<h1 class="heading">Guns, Goons and Gold</h1>
<p class="narration">For several days, the farmers refuse to break their picket. One of your goons suggested to fire a test shot. What is your decision?</p>
<div><a href="eggplant.html" class="choice">Yield your decision.</a></div>
<div><a href="death.html" class="choice">Fire the test shot.</a></div>
<div><a href="commotion.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Farmer Life</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="title.png" alt="">
<h1 class="heading">Farmer Life</h1>
<p class="narration">You're a mayor. A mall conglomerate offered to buy your land for a ton of money. There are farmers who work on your land and if you accept the offer, they will be landless, unemployed and displaced. If you take farmers away from your land, it's like taking away fish from the water. What will you do?</p>
<div><a href="conglomerate.html" class="choice">Do not accept the offer but continue to be a haciendero.</a></div>
<div><a href="commotion.html" class="choice">Accept the offer. It's a lot of money.</a></div>
</div>
</body>
</html>
\ No newline at end of file
body {
margin: 0;
padding: 0;
font-family: 'Libre Baskerville';
font-size: 16px;
line-height: 1rem;
animation-duration: 2s;
}
header {
padding: 0px;
margin: 0px;
box-sizing: border-box;
padding: 0.2em;
font-size: 0.8rem;
color: #a2a2a2;
margin-bottom: 5em;
text-align: center;
background: #fbfbfb;
}
h1 {
line-height: 2rem;
}
p {
line-height: 2rem;
}
img {
width: 100%;
}
.choice {
text-decoration: none;
line-height: 4rem;
border: 1px solid #e7e7e7;
padding: 1em;
font-size: 0.8rem;
color: #6f0000;
transition: 0.4s;
}
.choice:hover {
border: 1px solid #6f0000;
}
.story {
max-width: 500px;
margin: 0 auto;
display: block;
}
.heading {
text-align: center;
}
@media (max-width: 768px) {
.story {
max-width: 90%;
}
.heading {
font-size: 2rem;
}
p{
line-height: 2rem;
}
header {
padding:1em;
font-size: 0.6rem;
margin-bottom: 1.5em !important;
}
.choice {
font-size: 0.6rem;
padding: 2em;
}
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Contractualization</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="mall.png" alt="">
<h1 class="heading">Contractualization</h1>
<p class="narration">The farmers accepted the decision but were subjected to contractualization laws. They resorted to migrating to other parts of the country. Many of them became informal settlers and a life of extreme poverty.</p>
<div><a href="george.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Enraged</title>
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="enraged.png" alt="">
<h1 class="heading">Enraged</h1>
<p class="narration">The farmers are enraged by your decisions but they cannot do anything about it. They refuse to leave their land.</p>
<div><a href="demolish.html" class="choice">Demolish their houses.</a></div>
<div><a href="repeal.html" class="choice">Repeal your decision.</a></div>
<div><a href="conglomerate.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Are You Happy Now?</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="main.css">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="relocation.png" alt="">
<h1 class="heading">Are You Happy Now?</h1>
<p class="narration">The farmers decline your offer of relocation. You stood by your decision to sell the land. One night, you wake up in your bed with a dagger pointed at your neck. George Nicolas says, "Are you happy now?" You say your last prayer.</p>
<div><a href="george.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Imprisoned</title>
<link rel="stylesheet" href="main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="collegian.png" alt="">
<h1 class="heading">Imprisoned</h1>
<p class="narration"> The conglomerate sues you but you don't have the power and money to fight back. You are sentenced to life but the farmers live on to fight for genuine agrarian reform.</p>
<div><a href="refused.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Power Play</title>
<link rel="stylesheet" href="main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="reputation.png" alt="">
<h1 class="heading">Power Play</h1>
<p class="narration">The conglomerate threatens to destroy your reputation. Your family's life is already involved. What is your next course of action?</p>
<div><a href="resign.html" class="choice">Resign from office.</a></div>
<div><a href="fight.html" class="choice">Fight the difficult fight.</a></div>
<div><a href="conglomerate.html" class="choice">Go back.</a></div>
</div>
</body>
</html>
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>A Peaceful End</title>
<link rel="stylesheet" href="main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="animate.css">
<link href='https://fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700|Raleway:400,300,700' rel='stylesheet' type='text/css'>
</head>
<body class="animated fadeIn">
<header><p>Development by Alexis Collado & Story by Trysh Olives <br> Paintings and Photos from Google Images, The Phillipine Collegian</p></header>
<div class="story">
<img src="reform.png" alt="">
<h1 class="heading">A Peaceful End</h1>
<p class="narration">It may not be the best choice for many, but you lived a peaceful life. You contemplate whatever happened to the farmers. You eventually receive news that they were able to receive genuine agrarian reform.</p>
<div><a href="reputation.html" class="choice">Try a different fate.</a></div>
<div><a href="index.html" class="choice">Start again.</a></div>
</div>
</body>
</html>
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment