Skip to content

About Page added #1

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
Bigminer106 wants to merge 2 commits into
base: master
Choose a base branch
from
Open

About Page added #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
e7f893f
About Page added
Bigminer106 Jun 24, 2017
0e428ae
About Page tweaks
Bigminer106 Jun 24, 2017
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
65 changes: 65 additions & 0 deletions about.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,65 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<title>About Parent Pals</title>
</head>
<body>
<nav class="navbar navbar-default white shadow">
<div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="./index.html"><img src="media/logo1.png" alt="Little Helpers Logo"></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a class="active" href="./about.html">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Login</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<!-- About Page Content Added Here -->
<main>
<div class="row">
<div class="text-center tall-div blue">
<div class="container text-box">
<h3 class="white-text">About Parent Pals</h3>
<p class="white-text">Little Helpers is the brainchild of a like-minded group of individuals, including one father who wanted a way to keep track of the chores his young child completed. Little Helpers is intended to be that chore tracker, geared towards children ages 5-13 as well as their parents.</p><br>
</div>
</div>
<div class="text-center tall-div shadow">
<div class="container text-box">
<h3 class="blue-text">Little Helpers Info</h3>
<p>Little Helpers is a task-reward tracker set up for both parents and kids. The parents can set chores and rewards for their children, as well as set point values for them. Children can make requests for particular rewards, such as a new toy or a trip to the zoo or aquarium. Parents, in turn, can accept or turn down reward requests that their child sends in, and redeem their child's points for the set rewards.</p><br>
</div>
</div>
<div class="text-center tall-div green">
<div class="container text-box">
<h3 class="white-text">Goals</h3>
<p class="white-text">It is our goal that the parents will have more peace of mind and say in what their child can do to help around the house and the rewards for such help, and the children are learning how to manage their point "bank," which translates into learning financial management and task responsibility for later in life.</p>
</div>
</div>
</div>
</main>
<div class="text-center tall-div pink" id="footer">
<div class="container">
<h3 class="white-text">FOOTER</h3>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js" charset="utf-8"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="script.js" charset="utf-8"></script>
</body>
</html>
90 changes: 45 additions & 45 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,56 +20,56 @@
<a class="navbar-brand" href="#"><img src="media/logo1.png" alt="Little Helpers Logo"></a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
<li><a href="#">Registration</a></li>
<li><a href="#">Login</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="jumbotron">
<div class="container">
</div>
</div>
<main>
<div class="row">
<div class="text-center tall-div blue" id="chores">
<div class="container text-box">
<img src="media/fbroom.png">
<h3 class="white-text">CHORES</h3>
<p class="white-text">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav navbar-right">
<li><a href="./about.html">About</a></li>
<li><a href="./contact.html">Contact</a></li>
<li><a href="./register.html">Registration</a></li>
<li><a href="./child-list.html">Login</a></li>
</ul>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->
</nav>
<div class="jumbotron">
<div class="container">
</div>
</div>
<div class="text-center tall-div shadow" id="points">
<div class="container text-box">
<img src="media/fpoints.png">
<h3 class="blue-text">POINTS</h3>
<p>
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
<main>
<div class="row">
<div class="text-center tall-div blue" id="chores">
<div class="container text-box">
<img src="media/fbroom.png">
<h3 class="white-text">CHORES</h3>
<p class="white-text">
On this page, a parent can set the chores for their children, as well as the point value for those chores, as well as marking whether or not the chores were completed, which will bank those points for the individual child. A child, in similar fashion, can see what chores need to be completed and their point values, but cannot set chores for themselves.
</p>
</div>
</div>
</div>
<div class="text-center tall-div green" id="rewards">
<div class="container text-box">
<img src="media/ftrophy.png">
<h3 class="white-text">REWARDS</h3>
<p class="white-text">
"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
</p>
<div class="text-center tall-div shadow" id="points">
<div class="container text-box">
<img src="media/fpoints.png">
<h3 class="blue-text">POINTS</h3>
<p>
Here, a parent can see how many points their children have accrued, as well as see a brief history of each child's completed tasks. Children, meanwhile, will see their own personal point "bank", as well as their own chore history.
</p>
</div>
</div>
<div class="text-center tall-div green" id="rewards">
<div class="container text-box">
<img src="media/ftrophy.png">
<h3 class="white-text">REWARDS</h3>
<p class="white-text">
A parent can set rewards and their point values for each child on this page. Similarly, a child can make a request for a particular reward (pending parental approval), as well as the remaining points towards each reward. Also, a parent will be able to redeem points for their child if they meet the needed points for a particular reward.
</p>
</div>
</div>
</div>
<div class="text-center tall-div pink" id="footer">
<div class="container">
<h3 class="white-text">FOOTER</h3>
<div class="text-center tall-div pink" id="footer">
<div class="container">
<h3 class="white-text">FOOTER</h3>
</div>
</div>
</div>
</div>
</main>
</div>
</main>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js" charset="utf-8"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="script.js" charset="utf-8"></script>
Expand Down
7 changes: 7 additions & 0 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,3 +75,10 @@ h3 {
.text-box {
width: 600px;
}

.active {
background-color: #D3D7D7;
}
.text-box h3 {
letter-spacing: 0.3em;
}