diff --git a/assignment/.vscode/launch.json b/assignment/.vscode/launch.json
new file mode 100644
index 00000000..8fd599e2
--- /dev/null
+++ b/assignment/.vscode/launch.json
@@ -0,0 +1,14 @@
+{
+ // Use IntelliSense to learn about possible attributes.
+ // Hover to view descriptions of existing attributes.
+ // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+ "version": "0.2.0",
+ "configurations": [
+ {
+ "type": "chrome",
+ "request": "launch",
+ "name": "Open index.html",
+ "file": "/Users/alvinb.cotton/assignment 1/assignment-unit-1/assignment/index.html"
+ }
+ ]
+}
\ No newline at end of file
diff --git a/assignment/index.html b/assignment/assignment/style.css/hello world.html
similarity index 73%
rename from assignment/index.html
rename to assignment/assignment/style.css/hello world.html
index 04abb302..25b6a40d 100644
--- a/assignment/index.html
+++ b/assignment/assignment/style.css/hello world.html
@@ -4,7 +4,7 @@
Unit 1 Assignment
+ Hello World
-
-
-
+ Three fun facts about me!
+ I love to Roller Skate!
+I enjoy comedy and have participated in open mics around the Twin Cities!
+I am a Minnesota Vikings fan!! SkOL!!
+
-
+
diff --git a/assignment/assignment/style.css/style.css b/assignment/assignment/style.css/style.css
new file mode 100644
index 00000000..7eb87f9a
--- /dev/null
+++ b/assignment/assignment/style.css/style.css
@@ -0,0 +1,28 @@
+/* Add a background color to the header element */
+header {
+ background-color: rgb(60, 0, 255);
+}
+/* Add a fun background color to the main element */
+main {
+ background-color: rgb(47, 75, 255);
+}
+/* Align the h1 containing your name in the center of the header*/
+h1 {
+ text-align: center;
+}
+/* Make your p tag a different color and italic */
+p {
+ text-emphasis-color: blue;
+}
+/* Put a border around your image */
+img {
+ border: 5px solid goldenrod;
+}
+/* Change the font-family of your list */
+ul {
+ font-family: Arial, Helvetica, sans-serif;
+}
+/* Add a background color to the footer element */
+footer{
+ background-color:rgb(230, 16, 16);
+}
\ No newline at end of file
diff --git a/assignment/assignment/style.css/work.jpg b/assignment/assignment/style.css/work.jpg
new file mode 100644
index 00000000..228dfac0
Binary files /dev/null and b/assignment/assignment/style.css/work.jpg differ
diff --git a/assignment/helloWorld.js b/assignment/helloWorld.js
deleted file mode 100644
index e69de29b..00000000
diff --git a/assignment/style.css b/assignment/style.css
deleted file mode 100644
index 9d9fc549..00000000
--- a/assignment/style.css
+++ /dev/null
@@ -1,13 +0,0 @@
-/* Add a background color to the header element */
-
-/* Add a fun background color to the main element */
-
-/* Align the h1 containing your name in the center of the header*/
-
-/* Make your p tag a different color and italic */
-
-/* Put a border around your image */
-
-/* Change the font-family of your list */
-
-/* Add a background color to the footer element */
\ No newline at end of file
diff --git a/prime assignment/README.md b/prime assignment/README.md
new file mode 100644
index 00000000..5d58e802
--- /dev/null
+++ b/prime assignment/README.md
@@ -0,0 +1,143 @@
+# Unit 1: Git, HTML/CSS, Hello World
+
+**Please watch all the videos for Week 1 on [the Tier 1 site](http://fullstack.primeacademy.io) before starting the assignment.**
+
+These videos contain important information that will help you complete the assignment. Feel free to refer back to the videos whenever you need them!
+
+## Onward!
+
+For the assignment this week, you will practice using the tools you saw in the videos. You should have worked along with them as you watched. If you did, the following should be somewhat familiar.
+
+You're going to:
+
+* use git to fork/clone a repository (aka repo) from GitHub and get your work published back to your GitHub account
+* set up files and connect them
+* edit the HTML and CSS
+* test your work in the browser
+* use git to "save" your work
+* use the command line and your Mac's built-in Terminal
+* turn your assignment in through Prime's Assignment Portal
+
+---
+
+## Set-up: Fork and Clone This Repo
+
+Using your new git and GitHub skills, Fork this repo to your own GitHub account. Then Clone it to your own computer. You are going to end up cloning 80+ repos at Prime so try to stay organized!
+
+We recommend making a "prime" folder inside your "home" directory, which will be named your username. Inside of this, perhaps a "tier1" folder in which you can keep all of your Tier 1 work.
+
+Wherever you put it, use your Terminal to `cd` into your new cloned folder of this assignment.
+
+## Set-up: Opening your assignment in VSCode
+
+You are going to be writing some code in VSCode, so open this entire folder in VSCode.
+
+Do one of the following:
+
+- Using the Terminal command of `code .` OR
+- Using Finder/folder to drag the assignment folder to VSCode in your Dock OR
+- Open VSCode first, then use the File > Open command to choose your assignment folder
+
+---
+
+## Your Actual Assignment
+
+Inside of project you just opened in VSCode, is an *assignment* folder.
+
+Inside of this folder, we've provided you with a few files, some of those files are inside of other folders.
+
+**IMPORTANT:** Don't edit any files other than those inside of the *assignment* folder, and you should not need to move files around inside the folder.
+
+### Files Provided
+
+- *assignment/index.html* (base functionality - required)
+- *assignment/helloWorld.js* (base functionality - required)
+- *assignment/style.css* (base functionality - required)
+
+## 1) Edit the HTML
+
+Inside of the `index.html` file are comments with tasks for you to complete. Write the code below the comment (no need to delete the comment), like this:
+
+```HTML
+
+
+
+```
+
+Feel free to add more content than just what is in the comments (but the content laid out in the comments is required)!
+
+## Test Your Work
+
+As you make changes, it's important to check your work often. Our mantra is going to be "code a little then test!" Over and over again.
+
+To test your work, open your `index.html` file in Chrome. You should see all of the content you created in your HTML file.
+
+If you make more changes in VSCode, save your work, then Refresh the browser to see them.
+
+## 1.1) Make a Commit
+
+*When you're done with your HTML, make a "`commit`" with `git`.*
+
+> Definitly refer to the Git Practical video on this! You'll be making commits *all the time* so eventually you'll get this memorized. For now, take it one step at a time!
+
+Here is the pattern. Be sure you are in the project folder!
+
+1. write some code
+2. test your code
+3. in Terminal: `git add .`
+4. in Terminal: `git commit -m "what you changed"`
+5. back to step 1!
+
+
+## 2) Edit the CSS
+
+Now that we have content in our HTML file, let's make it look nice with some styling!
+
+- The CSS file is already linked to the HTML file using a `link` tag.
+- There are comments in the `style.css` file. You can write your styles below the comments.
+- You can also add more styles if you want, but make sure you include the styles in the directions, those are required!
+
+*When you're done, make another "`commit`" with `git`.*
+
+Here is an example of what your assignment could look like:
+
+
+
+---
+
+## 3) Complete JavaScript "Hello World!"
+
+Our assignment also contains a `helloWorld.js` file. A "hello world" is a common first step in learning to code, and the first program many programmers write.
+
+In the video for this week, we used a `console.log()` to get messages from our JavaScript file to display in the browser's console interface.
+
+1. You will need to source in the `helloWorld.js` file into your `index.html` file.
+2. Refer back to the video to cover how to source in and get "hello world" to log in the browser console for your assignment! More information on `console.log` can be found [here](https://www.w3schools.com/jsref/met_console_log.asp).
+3. Be sure to test your work by opening your browser console for this assignment. You should be able to see the text "hello world" or whatever you logged!
+
+*When you're done, make another "`commit`" with `git`.*
+
+---
+
+## 4) "Upload" Your Completed Work to GitHub
+
+Now that your assignment is done, we'll use `git` to `push` your work to GitHub.
+
+You can find detailed instructions on how to do this in this week's video content.
+
+## 5) Submit Your Assignment in the Prime Portal
+
+You will need to "submit" a link to your GitHub repo containing your work for this assignment. Prime will then use this link to find and check out your assignment!
+
+We won't know you're done until you [Submit it in the Portal](https://portal.primeacademy.io/).
+
+You can find detailed instructions on how to do this in this week's video content.
+
+---
+
+## 6) Answer the Slack Discussion Question
+
+Make sure that you answer this week's Slack discussion question (found each week in the left sidebar of the Tier 1 site) in your cohort's Slack channel!
+
diff --git a/prime assignment/assignment/hello world.html b/prime assignment/assignment/hello world.html
new file mode 100644
index 00000000..25b6a40d
--- /dev/null
+++ b/prime assignment/assignment/hello world.html
@@ -0,0 +1,47 @@
+
+
+
+ Hello World
+
+
+
+ Three fun facts about me!
+
+ I love to Roller Skate!
+I enjoy comedy and have participated in open mics around the Twin Cities!
+I am a Minnesota Vikings fan!! SkOL!!
+
+
+
+
+
+
+
+
+ not changed to `Hello World`').to.equal('Hello World');
+ });
+ });
+
+ describe('Create a header element `<header>` element', function () {
+ it('Create a header element `<header>` element', function () {
+ let header = root.querySelector('header');
+ expect(header, '<header> element not found.').to.exist;
+ });
+ });
+ describe('Inside the `<header>`, add an `<h1>` element containing your name', function () {
+ it('Inside the `<header>`, add an `<h1>` element containing your name', function () {
+ let header = root.querySelector('header');
+ expect(header, '<header> element not found.').to.exist;
+ let h1 = header.querySelector('h1');
+ expect(h1, '<h1> not in header.').to.exist;
+ expect(h1.innerHTML, '<h3> was empty.').not.to.be.empty;
+ });
+ });
+ describe('Background color added to the `<header>``', function () {
+ it('Background color added to the `<header>`', function () {
+ if (typeof window === 'object') {
+ let header = root.querySelector('header');
+ expect(header, '<header> element was not found in div.').to.exist;
+ let style = window.getComputedStyle(header);
+ let backgroundColor = style.getPropertyValue('background-color');
+ expect(backgroundColor, '<header> element does not have background color.').not.to.be.empty;
+ expect(backgroundColor, '<header> element does not have background color.').to.not.equal('rgba(0, 0, 0, 0)');
+ } else {
+ // Unable to test background color with node
+ this.skip();
+ }
+ });
+ });
+ describe('Background color added to the `<main>``', function () {
+ it('Background color added to the `<main>`', function () {
+ if (typeof window === 'object') {
+ let main = root.querySelector('main');
+ expect(main, '<main> element was not found in div.').to.exist;
+ let style = window.getComputedStyle(main);
+ let backgroundColor = style.getPropertyValue('background-color');
+ expect(backgroundColor, '<main> element does not have background color.').not.to.be.empty;
+ expect(backgroundColor, '<main> element does not have background color.').to.not.equal('rgba(0, 0, 0, 0)');
+ } else {
+ // Unable to test background color with node
+ this.skip();
+ }
+ });
+ });
+ describe('Include an image', function () {
+ it('Include an image', function () {
+ let div = root.querySelector('img');
+ expect(div, '<img> not found').to.exist;
+ });
+ });
+ describe('Image URL is a Relative URL, not Absolute', function () {
+ const absolutePathError = `
+ The URL you're using for your image looks like an Absolute URL, which wont work on anyone else's machine.
+ Try a relative url, which will be shorter and look something like './image.png'
+ `;
+
+ it('Image URL is a Relative URL, not Absolute', function () {
+ let src = root.querySelector('img').getAttribute("src");
+ let absolutePath = src.match(/^\/(Users)/)
+ expect(absolutePath, absolutePathError).to.not.exist;
+ });
+ });
+ describe('Create an unordered list with 3 list items of fun facts about you', function () {
+ it('Create an unordered list with 3 list items of fun facts about you', function () {
+ let ul = root.querySelector('main ul');
+ expect(ul, '<ul> element was not found.').to.exist;
+ let liCount = ul.querySelectorAll('li').length
+ expect(liCount, `${liCount} of 3 list items found`).to.be.greaterThan(2);
+ });
+ });
+ describe('Create a `<footer>` element', function () {
+ it('Create a `<footer>` element', function () {
+ let footer = root.querySelector('footer');
+ expect(footer, '<footer> element was not found.').to.exist;
+ });
+ });
+ describe('Inside your `<footer>`, put a `<p>` element with your favorite quote', function () {
+ it('Inside your `<footer>`, put a `<p>` element with your favorite quote', function () {
+ let footer = root.querySelector('footer');
+ expect(footer, '<footer> element was not found.').to.exist;
+ let p = footer.querySelector('p');
+ expect(p.innerHTML, '<h3> was empty.').not.to.be.empty;
+ });
+ });
+ describe('Background color added to the `<footer>``', function () {
+ it('Background color added to the `<footer>`', function () {
+ if (typeof window === 'object') {
+ let footer = root.querySelector('footer');
+ expect(footer, '<footer> element was not found in div.').to.exist;
+ let style = window.getComputedStyle(footer);
+ let backgroundColor = style.getPropertyValue('background-color');
+ expect(backgroundColor, '<footer> element does not have background color.').not.to.be.empty;
+ expect(backgroundColor, '<footer> element does not have background color.').to.not.equal('rgba(0, 0, 0, 0)');
+ } else {
+ // Unable to test background color with node
+ this.skip();
+ }
+ });
+ });
+});
+
+/**
+ * If running the tests in the browser, call mocha.run()
+ */
+if (typeof window === 'object') {
+ mocha.run();
+}
diff --git a/prime assignment/work mode.jpg b/prime assignment/work mode.jpg
new file mode 100644
index 00000000..228dfac0
Binary files /dev/null and b/prime assignment/work mode.jpg differ
diff --git a/style.css b/style.css
new file mode 100644
index 00000000..377de1dc
--- /dev/null
+++ b/style.css
@@ -0,0 +1,23 @@
+header { color:crimson
+}
+/* Add a fun background color to the main element */
+main {
+ background-color:azure
+}
+/* Align the h1 containing your name in the center of the header*/
+h1 {
+ text-align: center;
+}
+/* Make your p tag a different color and italic */
+p {
+ color:darkgoldenrod}
+/* Put a border around your image */
+img{
+ border:5px solid #555
+ }
+
+/* Change the font-family of your list */
+ul{
+ font-family:"Times New Roman", Times, serif;
+}
+/* Add a backgr ound color to the footer element */
\ No newline at end of file
diff --git a/test.styles.css b/test.styles.css
new file mode 100644
index 00000000..a89cab69
--- /dev/null
+++ b/test.styles.css
@@ -0,0 +1,35 @@
+#container {
+ max-width: 1000px;
+ margin: 0 auto;
+ padding: 50px 10px;
+}
+
+#mocha-stats {
+ background-color: #ffffffee;
+ padding-top: 4px !important;
+ border: 1px solid darkgray;
+}
+
+#mocha .test a.replay {
+ display: none;
+}
+
+#mocha h1 a {
+ pointer-events: none;
+}
+
+pre {
+ display: inline;
+ margin: 0;
+ font-size: 1.2em;
+}
+
+.note {
+ color: black;
+ max-width: 900px;
+ margin: 10px auto;
+ padding: 20px;
+ background-color: #FFFFCC;
+ border: 2px solid teal;
+ font-size: 1.2em;
+}
\ No newline at end of file
diff --git a/work mode.jpg b/work mode.jpg
new file mode 100644
index 00000000..228dfac0
Binary files /dev/null and b/work mode.jpg differ
+