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.

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

Updates to HW1 #4

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
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
10 changes: 3 additions & 7 deletions hw1/01-card.css
Original file line number Diff line number Diff line change
@@ -1,9 +1,5 @@
body {
font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
font-size: 20px;
color: #555;
}

a {
color: rgb(0, 96, 96);
color: var(--teal);
}

/* Add your code here */
9 changes: 6 additions & 3 deletions hw1/01-card.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,11 +5,14 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Cards</title>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="01-card.css" />
</head>
<body>
<!-- add your code below -->
<p>exercise #1 - organizing information into cards</p>
<!-- you can use http://placekitten.com/300/200 for the placeholder images -->
<main>
<h1>Card Exercise</h1>
<!-- Add your code below -->
<!-- Use http://placekitten.com/300/200 for the placeholder images -->
</main>
</body>
</html>
8 changes: 1 addition & 7 deletions hw1/02-navbar.css
Original file line number Diff line number Diff line change
@@ -1,7 +1 @@
* {
font-family: sans-serif;
font-size: 1.1em;
color: #333;
}

/* The accent color used is #008080 */
/* Add you code here */
19 changes: 9 additions & 10 deletions hw1/02-navbar.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,18 +5,17 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Navigation</title>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="02-navbar.css" />
</head>
<body>
<section>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</section>
<nav>
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Projects</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</body>
</html>
12 changes: 1 addition & 11 deletions hw1/03-form.css
Original file line number Diff line number Diff line change
@@ -1,11 +1 @@
body {
background-color: rgb(0, 78, 78);
font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
color: #ccc;
}

/* Colors used include:
- #aaa;
- #006060;
- #008080;
*/
/* Add you code here */
7 changes: 5 additions & 2 deletions hw1/03-form.html
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,13 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Form</title>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="03-form.css" />
</head>
<body>
<!-- add your code below -->
<p>exercise #3 - creating a form</p>
<main>
<h1>Form</h1>
<!-- Add your code here -->
</main>
</body>
</html>
16 changes: 0 additions & 16 deletions hw1/04-flex.css
Original file line number Diff line number Diff line change
@@ -1,17 +1 @@
* {
box-sizing: border-box;
font-family: sans-serif;
font-size: 1.3em;
}

.flex-item {
width: 160px;
height: 80px;
margin: 1px;
padding: 10px;
background-color: purple;
color: white;
text-align: center;
}

/* Add your code here */
27 changes: 15 additions & 12 deletions hw1/04-flex.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,24 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="04-flex.css" />
<title>CSS Layouts</title>
</head>
<body>
<section class="flex-container">
<div class="flex-item item1">One</div>
<div class="flex-item item2">Two</div>
<div class="flex-item item3">Three</div>
<div class="flex-item item4">Four</div>
<div class="flex-item item5">Five</div>
<div class="flex-item item6">Six</div>
<div class="flex-item item7">Seven</div>
<div class="flex-item item8">Eight</div>
<div class="flex-item item9">Nine</div>
<div class="flex-item item10">Ten</div>
</section>
<main>
<section class="flex-container">
<div class="flex-item item1">One</div>
<div class="flex-item item2">Two</div>
<div class="flex-item item3">Three</div>
<div class="flex-item item4">Four</div>
<div class="flex-item item5">Five</div>
<div class="flex-item item6">Six</div>
<div class="flex-item item7">Seven</div>
<div class="flex-item item8">Eight</div>
<div class="flex-item item9">Nine</div>
<div class="flex-item item10">Ten</div>
</section>
</main>
</body>
</html>
16 changes: 0 additions & 16 deletions hw1/05-flex.css
Original file line number Diff line number Diff line change
@@ -1,17 +1 @@
* {
box-sizing: border-box;
font-family: sans-serif;
font-size: 1.3em;
}

.flex-item {
width: 160px;
height: 80px;
margin: 1px;
padding: 10px;
background-color: purple;
color: white;
text-align: center;
}

/* Add your code here */
27 changes: 15 additions & 12 deletions hw1/05-flex.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,21 +4,24 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="05-flex.css" />
<title>Flexbox Layout</title>
</head>
<body>
<section class="flex-container">
<div class="flex-item item1">One</div>
<div class="flex-item item2">Two</div>
<div class="flex-item item3">Three</div>
<div class="flex-item item4">Four</div>
<div class="flex-item item5">Five</div>
<div class="flex-item item6">Six</div>
<div class="flex-item item7">Seven</div>
<div class="flex-item item8">Eight</div>
<div class="flex-item item9">Nine</div>
<div class="flex-item item10">Ten</div>
</section>
<main>
<section class="flex-container">
<div class="flex-item item1">One</div>
<div class="flex-item item2">Two</div>
<div class="flex-item item3">Three</div>
<div class="flex-item item4">Four</div>
<div class="flex-item item5">Five</div>
<div class="flex-item item6">Six</div>
<div class="flex-item item7">Seven</div>
<div class="flex-item item8">Eight</div>
<div class="flex-item item9">Nine</div>
<div class="flex-item item10">Ten</div>
</section>
</main>
</body>
</html>
14 changes: 0 additions & 14 deletions hw1/06-grid.css
Original file line number Diff line number Diff line change
@@ -1,15 +1 @@
* {
box-sizing: border-box;
font-family: sans-serif;
font-size: 1.3em;
}

.grid-item {
margin: 1px;
padding: 10px;
background-color: purple;
color: white;
text-align: center;
}

/* Add your code here */
5 changes: 3 additions & 2 deletions hw1/06-grid.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,11 +4,12 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="06-grid.css" />
<title>CSS Grid Layout</title>
</head>
<body>
<section class="grid-container">
<main class="grid-container">
<div class="grid-item item1">1</div>
<div class="grid-item item2">2</div>
<div class="grid-item item3">3</div>
Expand All @@ -19,6 +20,6 @@
<div class="grid-item item8">8</div>
<div class="grid-item item9">9</div>
<div class="grid-item item10">10</div>
</section>
</main>
</body>
</html>
14 changes: 0 additions & 14 deletions hw1/07-grid.css
Original file line number Diff line number Diff line change
@@ -1,15 +1 @@
* {
box-sizing: border-box;
font-family: sans-serif;
font-size: 1.3em;
}

.grid-item {
margin: 1px;
padding: 10px;
background-color: purple;
color: white;
text-align: center;
}

/* Add your code here */
1 change: 1 addition & 0 deletions hw1/07-grid.html
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="07-grid.css" />
<title>CSS Grid Layout</title>
</head>
Expand Down
15 changes: 1 addition & 14 deletions hw1/08-bootstrap-grid.css
Original file line number Diff line number Diff line change
@@ -1,14 +1 @@
* {
box-sizing: border-box;
font-size: 1.1em;
color: white;
}
/*
Colors used in this exercise:
background-color: navy;
background-color: purple;
background-color: teal;
background-color: mediumvioletred;
background-color: var(--red);
background-color: darkgreen;
*/
/* Add your code here */
5 changes: 4 additions & 1 deletion hw1/08-bootstrap-grid.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,13 @@
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css"
/>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="08-grid.css" />
<title>Bootstrap Grid Exercise</title>
</head>
<body>
<!-- Add your code here -->
<main>
<!-- Add your code here -->
</main>
</body>
</html>
1 change: 1 addition & 0 deletions hw1/09-bootstrap-form.css
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
/* Add your code here */
5 changes: 4 additions & 1 deletion hw1/09-bootstrap-form.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,13 @@
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css"
/>
<link rel="stylesheet" href="styles.css" />
<link rel="stylesheet" href="09-bootstrap-form.css" />
<title>Bootstrap Form Exercise</title>
</head>
<body>
/* Add your code here */
<main>
<!-- Add your code here -->
</main>
</body>
</html>
40 changes: 40 additions & 0 deletions hw1/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
* {
box-sizing: border-box;
}

:root {
--white: #ffffff;
--gray1: #333333;
--gray2: #666666;
--gray3: #cccccc;
--gray4: #aaaaaa;

--teal: #006060;
--lightteal: #008080;
--purple: #800080;
--navy: #000080;
--violetred: #c71585;
--red: #ff0000;
--green: #006400;
}

body {
font-family: 'Open Sans', 'Helvetica Neue', sans-serif;
font-size: 1.2em;
color: var(--gray1);
}

.flex-item,
.grid-item {
padding: 10px;
background-color: var(--purple);
color: var(--white);
font-size: 2.4em;
text-align: center;
}

.flex-item {
width: 160px;
height: 80px;
margin: 1px;
}
2 changes: 1 addition & 1 deletion hw2/01-fizzbuzz.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,12 @@
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css"
/>
<script defer src="01-fizzbuzz.js"></script>
</head>
<body class="bg-dark">
<section class="container border rounded bg-light w-50 mx-auto mt-5 p-3">
<h2 class="mt-2 mb-4">Fizzbuzz</h2>
<div id="results"></div>
</section>
<script src="01-fizzbuzz.js"></script>
</body>
</html>
2 changes: 1 addition & 1 deletion hw2/02-reverse.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
type="text/css"
href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.4.1/css/bootstrap.min.css"
/>
<script defer src="02-reverse.js"></script>
</head>
<body class="bg-dark">
<form class="bg-light border rounded w-50 mx-auto mt-5 p-3">
Expand All @@ -21,6 +22,5 @@ <h2 class="mt-2 mb-4">Reverse</h2>
<input type="submit" class="btn btn-info" value="Reverse" />
</div>
</form>
<script src="02-reverse.js"></script>
</body>
</html>
Loading