Sean D Connelly - CP365 LOG

Posts

Showing posts from April, 2019

Day 193

April 30, 2019

Closing on the end of this course! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** * { box-sizing: border-box; font-family: sans-serif; } html, body { background: #eff2f9; } #home { min-height: 100vh; display: flex; justify-content: center; align-items: center; } .box { background: white; width: 100%; max-width: 400px; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 41px -17px rgba(84, 88, 247, 1); } .box .background-image { background: url('https://vacationrentalssmithmountainlake.com/wp-content/uploads/2018/01/mountain-lake-1.jpeg'); background-position: center bottom; background-size: cover; background-repeat: none; height: 100px; } .box .content-area { padding: 20px; } .box .content-area .user-image { height: 40px; position: relative; display: flex; justify-content: center; align-items: center; } .box .content-area .user-image .circle { background: u

Day 192

April 29, 2019

Again, thank you Joe for the "First website' course. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <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/reset.css" /> <link rel="stylesheet" href="css/main.css" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"> <title>Static Template</title> </head> <body> <div id="home"> <div class="box"> <div class="

Day 191

April 28, 2019

I still want to do more with Grid and Flexbox... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <head> <title>CSS Grids</title> <style> .wrapper{ display:grid; grid-template-columns: 70% 30%; /* grid-column-gap:1em; grid-row-gap:1em; */ grid-gap:1em; } .wrapper > div{ background:#eee; padding:1em; } .wrapper > div:nth-child(odd){ background:#ddd; } </style> </head>

Day 190

April 27, 2019

More "First website" class... Going much more slowly than it should. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** * { box-sizing: border-box; font-family: sans-serif; } html, body { background: #eff2f9; } #home { min-height: 100vh; display: flex; justify-content: center; align-items: center; } .box { background: white; width: 100%; max-width: 400px; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 41px -17px rgba(84, 88, 247, 1); } .box .background-image { background: url('https://vacationrentalssmithmountainlake.com/wp-content/uploads/2018/01/mountain-lake-1.jpeg'); background-position: center bottom; background-size: cover; background-repeat: none; height: 100px; } .box .content-area { padding: 20px; } .box .content-area .user-image { height: 40px; position: relative; display: flex; justify-content: center; align-items: center; } .box .conten

Day 189

April 26, 2019

The slow steady march of the "First website" course. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <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/reset.css" /> <link rel="stylesheet" href="css/main.css" /> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/all.css" integrity="sha384-50oBUHEmvpQ+1lW4y57PTFmhCaXp0ML5d60M1M7uH2+nqUivzIebhndOJK28anvf" crossorigin="anonymous"> <title>Static Template</title> </head> <body> <div id="home"> <div class="box"> <div class="

Day 188

April 25, 2019

This is me working on building a dev environment on a linux box... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** smc@smc-ToshLap:~$ sudo npm install gulp-cli -g /usr/bin/gulp -> /usr/lib/node_modules/gulp-cli/bin/gulp.js + gulp-cli@2.2.0 added 236 packages from 157 contributors in 7.232s smc@smc-ToshLap:~$ sudo npm install gulp@3.9.1 -g npm WARN deprecated gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5 npm WARN deprecated graceful-fs@3.0.11: please upgrade to graceful-fs 4 for compatibility with current and future versions of Node.js npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated minimatch@0.2.14: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated graceful-fs@1.2.3: please upgrade to graceful-fs 4 for compatibility with current and future versions o

Day 187

April 24, 2019

Blah coding Blah Blah Blah coding... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ************************** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>New Computer Day</title> <style> body { background: black; } h1, p { color: red; } </style> </head> <body> <h1>I AM FUCKING SICK OF THIS SHIT!</h1> <p>BlahBlah coding Blah</p> </body> </html>

Day 186

April 23, 2019

Another day going through Joe's "First page" tutorial/class... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** * { box-sizing: border-box; font-family: sans-serif; } html, body { background: #eff2f9; } #home { min-height: 100vh; display: flex; justify-content: center; align-items: center; } .box { background: white; width: 100%; max-width: 400px; border-radius: 10px; overflow: hidden; box-shadow: 0 10px 41px -17px rgba(84, 88, 247, 1); } .box .background-image { background: url('https://vacationrentalssmithmountainlake.com/wp-content/uploads/2018/01/mountain-lake-1.jpeg'); background-position: center bottom; background-size: cover; background-repeat: none; height: 150px; } .box .content-area { padding: 20px; } .box .content-area .user-image { height: 40px; position: relative; display: flex; justify-content: center; align-items: center; } .box .content-a

Day 185

April 22, 2019

Going through the Traversy HTML crash course again... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <table> <thead> <tr> <th>Name</th> <th>Email</th> <th>Age</th> </tr> </thead> <tbody> <tr> <td>Sean Connelly</td> <td>miniwarlord@gmail.com</td> <td>50</td> </tr> <tr> <td>Mary Connelly</td> <td>mkconnelly55@gmail.com</td> <td>29</td> </tr> <tr> <td>Kieran Ethington</td> <td>killerk2000@gmail.com</td> <td>18</td> </tr> </tbody> </table>

Day 184

April 21, 2019

I started looking at a new tutorial I found on lerning HTML and found myself lacking. I am starting to re-focus my studies and work on building a straight path to employment. This is part of the code that I did in the new tutorial. I am now focusing on Joe's content. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <main> <section> <h2>Local News</h2> <article> <header> <h3>Fire fighters rescue man from building</h3> <p>(author, date)</p> </header> <p>This is the story text. This is the story text.</p> <p>This is the story text. This is the story text.</p> </article> <article> <header> <h3>New Library to be built</h3> <p>(author, date)</p> </header> <p

Day 183

April 20, 2019

I was looking around and found a tutorial on building a CSS "reset" file for building HTML emails. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** /* Body */ body { /* Reset margin/padding */ margin: 0; padding: 0; } /* Image */ img { /* Remove border */ border: 0 none; /* Auto height */ height: auto; /* Set line-height so inline works */ line-height: 100%; /* No outline */ outline: none; /* No text decoration */ text-decoration: none; } a img { /* Remove border */ border: 0 none; } /* Table and column */ table, td { /* Remove extra spacing */ border-collapse: collapse; /* No padding */ padding: 0; } /* Header */ h1,h2,h3,h4,h5,h6 { /* Margin */ margin: 0; }

Day 182

April 19, 2019

Again the code says it all... Damnit! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>New Computer Day</title> </head> <body> <h1>I spent today tearing down my new computer!</h1> <p>I got a cheep PC to use for development.</p> <p>The key word is CHEAP! CHEAP! CHEAP!</p> <p>So, I returned the computer to BestBuy...</p> </body> </html>

Day 181

April 18, 2019

The page says it all #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>New Computer Day</title> </head> <body> <h1>I spent today building my new computer!</h1> <p>I got a cheep PC to use for development.</p> <p>It is a slow AMD PC but I think it will work untill I win the MACBOOK!</p> </body> </html>

Day 180

April 17, 2019

The beginnings of the "Build your first website" course by Joe! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <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>Static Template</title> </head> <body> <div id="home"> <div class="box"> <div class="background-image"></div> <div class="content-area"> <div class="user-image"> <div class="circle"></div> </div> </div> </div> </div> </body> </html>

Day 179

April 16, 2019

Bulma, Bulma, Bulma... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> <link rel="stylesheet" href="style/bulma_V0.7.4.css"> <link rel="stylesheet" href="style/main.css"> <title>Codingphase ARMY</title> </head> <body class="container is-fluid"> <header> <div class="block"> <div class="columns is-vcentered has-background-black is-gapless is-mobile"> <div class="column is-2"><img id="cpa-logo-small" src="images/

Day 178

April 15, 2019

Another day of modifying Bulma.io... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** .tabs a { align-items: center; border-bottom-color: #dbdbdb; border-bottom-style: solid; border-bottom-width: 1px; /* color: #4a4a4a; */ color: greenyellow; display: flex; justify-content: center; margin-bottom: -1px; padding: 0.5em 1em; vertical-align: top; } .tabs a:hover { border-bottom-color: #363636; /* color: #363636; */ color: green; } .tabs li { display: block; } .tabs li.is-active a { border-bottom-color: #3273dc; color: #3273dc; } .tabs ul { align-items: center; /* border-bottom-color: #dbdbdb; */ /* border-bottom-style: solid; */ /* border-bottom-width: 1px; */ display: flex; flex-grow: 1; flex-shrink: 0; justify-content: flex-start; }

Day 177

April 14, 2019

My header bar for the Codingphase ARMY website... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> <link rel="stylesheet" href="style/bulma_V0.7.4.css"> <link rel="stylesheet" href="style/main.css"> <title>Codingphase ARMY</title> </head> <body class="container is-fluid"> <header> <div class="block"> <div class="columns is-vcentered has-background-black is-gapless is-mobile"> <div class="column is-2"><img id="cpa-logo-sm

Day 176

April 13, 2019

Learning how to modify the Bulma.io CSS framework... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** * { margin: 0; padding: 0; } #cpa-logo-small { width: 7rem; height: auto; margin: .9rem 0 0 0; } .button.is-black-sdc { color: hsl(141, 71%, 48%); } .button.is-black-sdc:hover, .button.is-black-sdc.is-hovered { color: hsl(141, 71%, 40%); }

Day 175

April 12, 2019

Feeling pretty ill today. Sorry folks. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Oh! I did it again!</title> </head> <body> <H1>Sorry folks...</H1> <p>Down with a cold today.</p> <p>Going back to bed now.</p> </body> </html>

Day 174

April 11, 2019

Slow day today. I mostly worked on content. I am not posting the content portions. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.css"> <link rel="stylesheet" href="style/main.css"> <title>Codingphase ARMY</title> </head> <body class="container"> <header>  <

Day 173

April 10, 2019

My first day of working on the actual codingphase army website... and learning Bulma.io CSS framework. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css"> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.css"> <link rel="stylesheet" href="style/main.css"> <title>Codingphase ARMY</title> </head> <body> <header> <img id="cpa-logo-small" src="images/codingphasearmy-logo_white-on-black_small.jpg" alt="Codingphase ARMY logo"> </header> </body>

Day 172

April 09, 2019

A snippet from a tutorial I am doing from Adam Bray. Thank you sir for assisting me in learning Bulma. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <div id="navMenu" class="navbar-menu"> <div class="navbar-end"> <a href="#" class="navbar-item is-active">Home</a> <a href="#" class="navbar-item">Blog</a> <a href="#" class="navbar-item">Forum</a> <a href="#" class="navbar-item">Shop</a> <a href="#" class="navbar-item">Examples</a> </div> </div>

Day 171

April 08, 2019

My proposal HTML... without the proposal. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel="stylesheet" href="style/main.css"> <title>CodingPhase Army</title> </head> <body> <header> <div id="logo-image"> <a href="#"><img src="/images/codingphase-logo_white-on-black.jpg" alt=""></a> </div> <div> <p id="line1-logo">CODING</p> <p id="line2-logo">PHASE</p> <p id="line3-logo">ARMY</p> </div> <div class="menu"> <a class="menu-a" href="#">

Day 170

April 07, 2019

Joe gave me permission to persue my idea for a codingphase army! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** * { margin: 0; padding: 0; font-family: Arial, Helvetica, sans-serif; font-size: 16px; text-decoration: none; } body { box-sizing: border-box; width: 60em; margin: 0 auto; } body > main { width: 100%; } main > img { width: 960px; } body > header { position: relative; display: block; background: #000; color: #fff; top: 0; left: 0; width: 100%; height: 153px; } .menu { position: absolute; right: 75px; top: 75px; } .menu-a, .menu-p, p { color: #fff; } .menu-p { display: inline; font-weight: bold; } #line1-logo { font-size: 3.3rem; font-weight: 900; position: absolute; left: 100px; top: 0px; } #line2-logo { font-size: 2.1rem; font-weight: 100; position: absolute; left: 150px; top: 50px; } #line3-logo { font-size: 3.7re

Day 169

April 06, 2019

Working on building a new version of the codingphase logo with CSS. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** /* header { background: #000; display: flex; padding: 20px; justify-content: space-between; color: #fff; position: fixed; top: 0; left: 0; z-index: 10; width: 100%; } */ .logo { display: block; position: fixed; height: 200px; background: #fff; } #logo-image { height: 95%; } .menu-toggle { padding: 1em; position: absolute; top: 14em; left: 1em; cursor: pointer; } .hamburger, .hamburger::before/* , .hamburger::after */ { content: ''; display: block; background: #EBEBD3; height: 20px; width: 5em; border-radius: 10px; transform: rotate(45deg); /* transition: all ease-in-out 500ms; */ } .hamburger::before { transform: translate(30px,-25px); } .hamburger::after { transform: translateY(3px); } .open .hamburger { transform: rotate(45deg);

Day 168

April 05, 2019

Started a new project for codingphase today... NO. Joe not know about it yet. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <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="style/main.css"> <title>CodingPhase Army</title> </head> <body> <header> <div class="logo"> <a aria-current="page" class="" href="index.html"> <img id="logo-image" src="images/codingphaseLogo.png" alt=""> CodingPhaseArmy.com</a> </div> <div class="menu"> <a href="/courses">All Courses</a&g

Day 167

April 04, 2019

My first snippet from a SASS tutorial I started today. This looks like it could be fun! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** /* Containers */ $x-small: 600px; $small: 800px; $medium: 1000px; $large: 1200px; /* Breakpoints */ $mobile: $x-small; $desktop: $medium; /* Colors */ $background: white; $primary-color: #0366EE; $secondary-color: #FCB42A; $accent-color: #cdcdcd; $alternate-background: #fafafa; $alternate-color: #404040; $link-color: $primary-color; $link-hover-color: darken($link-color, 15%); $highlight: #ffeea8; $error: #D33C40; $bq-border: 16px solid #f0f0f0; /* Typography */ // Body font $font-size: 1rem; $body-font-size: 1rem; $font-style: normal; $font-variant: normal; $font-weight: normal; $font-color: #404040; $font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, Helvetica, Arial, sans-serif; $line-height: 1.6;

Day 166

April 03, 2019

Back to an old project today... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** section p { margin: 10px auto; padding-left: 4px; width: 80%; text-align: justify; } /* section p span { font-size: 1.25rem; font-weight: 400; } */ section div #familypic { margin: 15px 10% 0px 1%; /* margin-right: 10%; */ /* margin-left: 1%; */ /* padding-left: 1%; */ width: 20vw; float: right; padding:1px; /* border:1px solid #021a40; */ border-radius: 10px; /* background-color:#ff0; */ } section #daughter-left { margin-right: 1%; margin-left: 1%; width: 10vw; float: left; padding:1px; /* border:1px solid #021a40; */ border-radius: 10px; /* background-color:#ff0; */ } section #daughter-right { margin-right: 1%; margin-left: 1%; width: 10vw; float: right; padding:1px; /* border:1px solid #021a40; */ border-radius: 10px; /* background-color:#ff0; */ } section div #walking{ /*

Day 165

April 02, 2019

I finally got the calendar working for the booking section! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** October 18-21 <br><br> <a href="https://freshfeaturephoto.com/info-fall/">MORE INFORMATION</a> <br> <a href="https://freshfeaturephoto.com/fall-family/">BOOK YOUR SESSION</a>

Day 164

April 01, 2019

A tutorial in Javascript... Here we go. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <script language="javascript" type="text/javascript"> <!-- Hide JavaScript Code // JavaScript is case sensitive - Variables & Functions must use the same capitalization // Variables must start with a Letter, _, or $ then numbers // 4 Datatypes- Numbers, Strings, Booleans, Objects // Maximum and Minimum Numbers (Precision is not guaranteed past 16 digits) document.write(Number.MAX_VALUE+"<br />"); document.write(Number.MIN_VALUE+"<br />"); // Strings - Series of characters surrounded by quotes var samp_str = "Here are escaped characters \' \" \\ \t \n"; document.write(samp_str+"<br />"); // Newlines have no control in html // String Functions var first_str = "First S