<!DOCTYPE html>
<html>
<head>
<!--Resposive meta tag to make this webpage page looking good on mobile browser-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--Add a favicon-->
<link rel="shortcut icon" type="image/png" href="images/icon.png" />
<!--Add a page title-->
<title>Home</title>
<!--Include styles.css file to this webpage-->
<link rel="stylesheet" href="homestyles.css">
<!--Include script.js file to this webpage-->
<script src="homescript.js"></script>
<!--Use custom font from Google font https://fonts.google.com/ -->
<link href="https://fonts.googleapis.com/css2?family=Abel&family=Amatic+SC:wght@700&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Loved+by+the+King&family=Merienda:wght@700&family=Yesteryear&display=swap" rel="stylesheet">
</head>
<body>
<nav>
<img id="nav-img" src="images/image.png">
<a href='homeindex.html'>Home</a>
<a href='dailyindex.html'>Daily Check-in</a>
<a href='profileindex.html'>My Profile</a>
</nav>
<!--<div class = head>-->
<h4 id = "title">Starling</h4>
<p></p>
<h6 id = "intro"> A place where you can be your true self. </h6>
<!--</div>-->
<!--user types in goal-->
<header id='goal'>
<div style="text-align:center;">
<h1>Goal Setting</h1>
<p> </p>
<h3>What is your goal of the day?</h3>
<form id = form5>
<input type="text" id = form6>
</form>
<p> </p>
<p> </p>
<h3 id = goal-description>Hint: Make sure that your goal is specific and is something that you feel slightly uncomfortable doing.</h3>
<p></p>
<p></p>
</div>
</header>
<!--goal generator-->
<h3>Feeling stuck? Generate example goals by clicking "Get Goal" below!</h3>
<div style="text-align:center;" id='msg1'>
<p id="messagegoal"></p>
</div>
<div id='button1'>
<input type="button" id="btnSearch1" value="Get Goal" onclick="GetGoal();" />
</div>
<p></p>
<header id='quote'>
<div style="text-align:center;">
<h1>Inspirational Quotes</h1>
<p> </p>
<h3>Generate your own customized quote by pressing "Get Quote" below.</h3>
</div>
</header>
<!--motivation quote generator-->
<div style="text-align:center;" id='msg'>
<p id="message"></p>
</div>
<div id='button'>
<input type="button" id="btnSearch2" value="Get Quote" onclick="GetValue();" />
</div>
<p></p>
</body>
</html>