AustinCodingAcademy · juan-rod · Mar 3, 2018 · Nov 13, 2018 · Nov 13, 2018 · Nov 14, 2018
diff --git a/01week/helloworld/index.html b/01week/helloworld/index.html
@@ -0,0 +1,11 @@
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>First Site</title>
+</head>
+<body>
+  <h1>Hello, World!</h1>
+</body>
+</html>
diff --git a/01week/resume/css/style.css b/01week/resume/css/style.css
@@ -0,0 +1,95 @@
+@import url('https://fonts.googleapis.com/css?family=Roboto:300,500,900');
+* {
+  font-family: 'Roboto', sans-serif;
+}
+body {
+  font-family: 'Roboto', sans-serif;
+}
+
+header {
+  border: 1px solid red;
+  border: 1px solid red;
+  border: 1px solid red;
+  border: 1px solid red;
+  border: 1px solid red;
+  border: 1px solid red;
+  height: 100px;
+  width: 100%;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+  color: aquamarine;
+}
+footer {
+  color: red;
+  font-family: 'Roboto', sans-serif;
+  font-weight: 300;
+}
+h1 {
+  font-weight: 900;
+
+}
+div {
+  height:100%;
+}
+.access {
+  height: 100%;
+  width: 50%;
+  border: 1px solid pink;
+}
+.red {
+  background:red;
+}
+input {
+  border: blue;
+}
+a:visit{
+  content: '',
+
+
+}
+nav li {
+  color: white
+}
+li {
+  color:red;
+}
+input:hover {
+
+}
+input:disabled {
+  border: grey;
+}
+#div-access {
+  height: 50%;
+  background:blue;
+}
+
+nav {
+  border: 1px solid blue;
+  height: 100px;
+  width: 100%;
+  display: inline-block;
+}
+nav {
+  border: 1px solid red;
+}
+section {
+  border: 1px solid yellow;
+  height: 100px;
+  width: 100%;
+}
+article {
+  border: 1px solid purple;
+  height: 100px;
+  width: 100%;
+}
+footer {
+  border: 1px solid pink;
+  height: 100px;
+  width: 100%;
+}
diff --git a/01week/resume/index.html b/01week/resume/index.html
@@ -0,0 +1,71 @@
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>Juan's Resume</title>
+  <link rel="stylesheet" href="./css/style.css">
+  <style>
+    h1 {
+      color: red;
+    }
+  </style>
+</head>
+<body>
+  <p class="container blue">
+    <nav>
+      <p>
+        <img src="logo" alt="">
+      </p>
+      <p>
+        <ul>
+          <li class="blue">Home</li>
+          <li>about</li>
+          <li>contact</li>
+        </ul>
+      </p>
+    </nav>
+    <section>
+      <p>
+        <img src="" alt="">
+      </p>
+      <div>
+        <h1 class="blue">Juan Rod</h1>
+        <h3>Front End Developer</h3>
+        <div class="social">
+          <ul>
+            <li> 
+              <img src="twitter" alt="">
+            </li>
+            <li> 
+                <img src="twitter" alt="">
+              </li>
+              <li> 
+                  <img src="twitter" alt="">
+                </li>
+          </ul>
+        </div>
+      </div>
+    </section>
+    <section>
+      <div>
+        <div>
+          <div></div>
+          <div></div>
+          <div></div>
+          <div></div>
+        </div>
+      </div>
+      <div>
+          <div>
+            <div></div>
+            <div></div>
+            <div></div>
+            <div></div>
+          </div>
+        </div>
+    </section>
+    <footer></footer>
+  </div>
+</body>
+</html>
diff --git a/02week/site/css/style.css b/02week/site/css/style.css
@@ -0,0 +1,60 @@
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+.border-red {
+  border: 1px solid red;
+}
+.border-blue {
+  border: 1px solid blue;
+}
+.border-green {
+  border: 1px solid green;
+}
+body{
+  height: 100vh;
+  background-color: #ff7700;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900'%3E%3Cpolygon fill='%23cc0000' points='957 450 539 900 1396 900'/%3E%3Cpolygon fill='%23aa0000' points='957 450 872.9 900 1396 900'/%3E%3Cpolygon fill='%23d6002b' points='-60 900 398 662 816 900'/%3E%3Cpolygon fill='%23b10022' points='337 900 398 662 816 900'/%3E%3Cpolygon fill='%23d9004b' points='1203 546 1552 900 876 900'/%3E%3Cpolygon fill='%23b2003d' points='1203 546 1552 900 1162 900'/%3E%3Cpolygon fill='%23d3006c' points='641 695 886 900 367 900'/%3E%3Cpolygon fill='%23ac0057' points='587 900 641 695 886 900'/%3E%3Cpolygon fill='%23c4008c' points='1710 900 1401 632 1096 900'/%3E%3Cpolygon fill='%239e0071' points='1710 900 1401 632 1365 900'/%3E%3Cpolygon fill='%23aa00aa' points='1210 900 971 687 725 900'/%3E%3Cpolygon fill='%23880088' points='943 900 1210 900 971 687'/%3E%3C/svg%3E");
+  background-attachment: fixed;
+  background-size: cover;
+}
+nav {
+  height: 90px;
+  width: 100%;
+  display: block;
+  position: fixed;
+  padding: 10px 15px 10px 15px;
+  background-color: rgba(128, 128, 128, 0.5);
+  transition: background-color 0.3s ease;
+}
+nav:hover {
+  background-color: rgba(128, 128, 128, 0.8);
+}
+nav .logo {
+  display: inline-block;
+  height: 70px;
+  width: 70px;
+  text-align: center;
+}
+nav .logo i {
+  font-size: 65px;
+  margin: 15% 0;
+}
+nav ul {
+  height: 100%;
+  padding: 12px 0 0;
+  float: right;
+}
+/* ul li:nth-child(2) {
+  width:300px;
+} */
+ul li {
+  display: inline-block;
+  padding: 10px;
+  margin: 0 auto;
+}
+header {
+  height: 100vh;
+  padding-top: 90px;
+}
diff --git a/02week/site/index.html b/02week/site/index.html
@@ -0,0 +1,26 @@
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>Wireframe Site</title>
+  <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
+  <link rel="stylesheet" href="./css/style.css">
+</head>
+<body>
+  <nav class="border-red">
+    <div class="logo border-blue">
+      <i class="fa fa-lg fa-grav"></i>
+    </div>
+    <ul class="border-blue">
+      <li class="border-green">Link 1</li>
+      <li class="border-green">Link 2</li>
+      <li class="border-green">Link 3</li>
+    </ul>
+  </nav>
+  <header class="border-red">I'm a header</header>
+  <section class="border-red">Section 1</section>
+  <section class="border-red">Section 2</section>
+  <footer class="border-red">I'm a footer</footer>
+</body>
+</html>
diff --git a/04week/flexbox-exercises/css/home.css b/04week/flexbox-exercises/css/home.css
@@ -0,0 +1,38 @@
+@import url('https://fonts.googleapis.com/css?family=Ubuntu');
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+.container {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  font-family: 'Ubuntu', sans-serif;
+  background: url('https://images.unsplash.com/photo-1543896792-da955826e5eb?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1268&q=80');
+  background-size: cover;
+}
+.container--inner {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  /* background-color: rgba(0, 0, 0, 0.196); */
+}
+.button__wrapper {
+  /* border: 1px solid red; */
+  padding: 50px 125px;
+  border-radius: 4px;
+  background-color: rgba(238, 238, 238, 0.829);
+  transform: scale(1);
+  transition: transform 300ms ease;
+}
+.button__wrapper:hover {
+  transform: scale(1.1);
+}
+a {
+  text-decoration: none;
+  color: #4d4e4f;
+  font-size: 40px;
+}
diff --git a/04week/flexbox-exercises/css/styles.css b/04week/flexbox-exercises/css/styles.css
@@ -0,0 +1,66 @@
+@import url('https://fonts.googleapis.com/css?family=Ubuntu');
+* {
+  margin: 0;
+  padding: 0;
+  box-sizing: border-box;
+}
+.container {
+  height: 100%;
+  width: 100%;
+  position: relative;
+  font-family: 'Ubuntu', sans-serif;
+}
+.list__wrapper {
+  border: 1px solid red;
+  display: flex;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+}
+.list {
+  border: 1px solid blue;
+  height: 550px;
+  width: 1000px;
+  display: flex;
+  justify-content: center;
+}
+ul {
+  display: flex;
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  list-style: none;
+  width: 100%;
+}
+@media(min-width: 480px) {
+  ul {
+    flex-direction: column;
+  }
+}
+.list__item {
+  border: 1px solid #eee;
+  width: 100%;
+  display: flex;
+  flex-direction: row;
+  margin-bottom: 10px;
+  border-radius: 6px;
+  padding: 15px;
+  box-shadow: 5px 5px 13px 0px rgba(0,0,0,.15);
+}
+.list__image {
+  flex-shrink: 0;
+}
+.list__content {
+  flex-grow: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  padding: 0 0 0 20px;
+  line-height: 1.4;
+  /* border: 5px solid pink; */
+}
+img {
+  height: 100px;
+  width: 100px;
+  border-radius: 50%;
+}
diff --git a/04week/flexbox-exercises/home.html b/04week/flexbox-exercises/home.html
@@ -0,0 +1,18 @@
+<html lang="en">
+<head>
+  <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="./css/home.css">
+  <title>HOME</title>
+</head>
+<body>
+  <div class="container">
+    <div class="container--inner">
+      <div class="button__wrapper">
+        <a href="#">ENTER SITE</a>
+      </div>
+    </div>
+  </div>
+</body>
+</html>