Control zing!!!!

This commit is contained in:
Arjun Patel
2017-09-16 00:06:41 -07:00
parent 34c339acde
commit e2a908d5cc
4 changed files with 140 additions and 20 deletions
+33 -14
View File
@@ -6,33 +6,52 @@
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="main.css"> <link rel="stylesheet" type="text/css" href="main.css">
<link href="https://fonts.googleapis.com/css?family=Dosis" rel="stylesheet">
</head> </head>
<body> <body>
<div class="container logIn"> <div class="container logIn">
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-xs-12 signin">
Email:<input class="input"></input> Sign In
</div>
</div>
<div class="row">
<div class="col-xs-4 eachintxt">
email
</div>
<div class="col-xs-8">
<input class="input"></input>
</div>
</div>
<hr>
<div class="row">
<div class="col-xs-4 eachintxt">
password
</div>
<div class="col-xs-8">
<input class="input"></input>
</div>
</div>
<hr>
<div class="row">
<div class="col-xs-12 signup">
<a class="signup">sign up</a>
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="col-xs-12"> <div class="col-xs-12">
Password:<input class="input"></input> <button class="retrieve btn">View Profile</button>
</div> </div>
</div> </div>
<div class="row">
<div class="col-xs-12">
Age:<input class="input"></input>
</div>
</div>
<div class="row">
<div class="col-xs-12">
City:<input class="input"></input>
</div>
</div>
</div> </div>
</body> </body>
</html </html
+40 -4
View File
@@ -11,20 +11,56 @@ body {
background-size: cover; background-size: cover;
background-position: right; background-position: right;
background-repeat: no-repeat; background-repeat: no-repeat;
font-family: 'Dosis', sans-serif;
} }
div.logIn { div.logIn {
height: 500px; height: 375px;
width: 500px; width: 500px;
background-color: white; background-color: #7f8184;
position: absolute; position: absolute;
top: 50%; top: 50%;
left: 25%; left: 25%;
margin-right: -50%; margin-right: -50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
border-radius: 5px; border-radius: 20px;
box-shadow: 0;
transform: translate();
} }
input.input { input.input {
background-color: grey; background-color: #d1d3d6;
border-radius: 5px; border-radius: 5px;
width: 250px;
font-size: 20px;
}
.row {
margin: 22px 0 22px 0;
}
.signin {
font-size: 30px;
color: white;
text-align: center;
}
.eachintxt {
text-align: right;
color: white;
font-size: 20px;
}
.signup {
color: white;
font-size: 15px;
text-align: center;
}
.btn {
border-radius: 10px;
font-size: 20px;
margin-top: 20px;
height: 40px;
width: 200px;
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
} }
+67 -1
View File
@@ -1,10 +1,17 @@
google.charts.load('current', {'packages':['corechart']}); google.charts.load('current', {'packages':['corechart']});
<<<<<<< HEAD
google.charts.setOnLoadCallback(drawChart); google.charts.setOnLoadCallback(drawChart);
google.charts.load('current', {'packages':['bar']}); google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawBarChart); google.charts.setOnLoadCallback(drawBarChart);
=======
google.charts.setOnLoadCallback(drawChart);
google.charts.load('current', {'packages':['bar']});
google.charts.setOnLoadCallback(drawChart);
>>>>>>> parent of 3e059c2... d
function drawChart() { function drawChart() {
<<<<<<< HEAD
var data = google.visualization.arrayToDataTable([ var data = google.visualization.arrayToDataTable([
['Task', 'Amount'], ['Task', 'Amount'],
['Food and Dining', 11], ['Food and Dining', 11],
@@ -20,8 +27,24 @@ google.charts.load('current', {'packages':['corechart']});
}; };
var chart = new google.visualization.PieChart(document.getElementById('piechart')); var chart = new google.visualization.PieChart(document.getElementById('piechart'));
=======
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Food and Dining', 11],
['Clothing', 2],
['Entertainment', 2],
['Transportation', 7],
['Other', 1]
]);
var options = {
title: 'My Daily Activities'
};
>>>>>>> parent of 3e059c2... d
var chart = new google.visualization.PieChart(document.getElementById('piechart'));
chart.draw(data, options); chart.draw(data, options);
<<<<<<< HEAD
} }
function drawBarChart() { function drawBarChart() {
@@ -47,3 +70,46 @@ google.charts.load('current', {'packages':['corechart']});
chart.draw(data, google.charts.Bar.convertOptions(options)); chart.draw(data, google.charts.Bar.convertOptions(options));
} }
=======
}
};
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Category', 'You', 'Average 18 Year Old'],
['Food and Dining', 1000, 400],
['Utilities', 1170, 460],
['Clothing', 660, 120],
['Entertainment', 1030, 540],
['Transportation', 1030, 540],
['Other', 1030, 540]
]);
var options = {
chart: {
title: 'Comparing Spending Habits',
subtitle: 'Based on other 18 year olds',
},
bars: 'horizontal', // Required for Material Bar Charts.
hAxis: {
format: 'decimal'
},
height: 400,
colors: ['#1b9e77', '#d95f02', '#7570b3']
};
var chart = new google.charts.Bar(document.getElementById('chart_div'));
chart.draw(data, google.charts.Bar.convertOptions(options));
var btns = document.getElementById('btn-group');
btns.onclick = function(e) {
if (e.target.tagName === 'BUTTON') {
options.hAxis.format = e.target.id === 'none' ? '' : e.target.id;
chart.draw(data, google.charts.Bar.convertOptions(options));
}
}
}
>>>>>>> parent of 3e059c2... d
-1
View File
@@ -1,4 +1,3 @@
<!DOCTYPE html>
<html> <html>
<head> <head>