Posts

Showing posts from October, 2019

Day 365 + 3

Should be day 4 but I was sick yesterday and missed it... #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********     <section id="experience">       <div class="container">         <div class="large-title">           Experience         </div>         <div class="experience-container">           <div class="large-icons">             <div class="square">               <div class="blue-box">                 Experience               </div>...
Post a Comment
Read more

Day 365 + 2

This day two past the 365 challenge. #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********     <section id="portfolio">       <div class="container">         <div class="title">           <div class="circle"></div>           <h1>Portfolio</h1>         </div>         <div class="portfolio-container">           <a href="portfolio/#" class="box image1"></a>           <a href="portfolio/#" class="box image2"></a>           <a href="portfolio/#" class="box image3"></a>         ...
Post a Comment
Read more

Day 365 + 1

Finished plus one!  Just because... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** .services-container {     display: grid;     grid-template-columns: 1fr 1fr 1fr;     grid-gap: 40px;     .box {       background: rgba(255, 255, 255, 0);       padding: 40px;       margin-bottom: 10px;       transition: all 0.2s ease-in-out;       cursor: pointer;       .icon {       }       .fa {         font-size: 2rem;         margin-bottom: 2rem;       }       h5 {         font-size: 1rem;         font-weight: 700;    ...
Post a Comment
Read more

Day 365

Annnd, DONE! #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********   .services-container {     display: grid;     grid-template-columns: 1fr 1fr 1fr;     grid-gap: 40px;     .box {       background: rgba(255, 255, 255, 0);       padding: 40px;       transition: all 0.2s ease-in-out;       .icon {       }       h5 {         font-size: 1rem;         font-weight: 700;         text-transform: uppercase;         letter-spacing: 2px;         margin-bottom: 2rem;       }       p {         color: #b3b3b3;  ...
Post a Comment
Read more

Day 364

One day left... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #services {   padding-bottom: 80px 15px;   .title {     position: relative;     width: 200px;     height: 200px;     display: flex;     justify-content: center;     align-items: center;     margin: 0 auto;     .circle {       background: #eef9ff;       width: 150px;       height: 150px;       border-radius: 50%;       position: absolute;     }     h1 {       position: relative;       font-size: 2.5rem;       text-transform: uppercase;       font-weight: 700;       color: #16171b;    ...
Post a Comment
Read more

Day 363

Down to the last two days now... #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********     <section id="services">       <div class="container">         <div class="title">           <div class="circle"></div>           <h1>Services</h1>         </div>         <div class="services-container">           <div class="box blue">             <div class="icon"></div>             <H5>Best Ever Quality</H5>             <p>      ...
Post a Comment
Read more

Day 362

Only three days left now! #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #top {   .container {     display: grid;     grid-template-columns: 1fr 1fr;     padding: 80px 0;     align-items: center;   }   .info {     padding: 15px;     position: relative;     .blue-square {       border: #dbf1ff solid 25px;       width: 300px;       height: 300px;       position: absolute;       z-index: 0;       top: -30%;       left: -27%;     }     h1 {       position: relative;       font-size: 2rem;       text-transform: uppercase;       font-weight: 700;  ...
Post a Comment
Read more

Day 361

Just a few days left... #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="css/main.css" />     <title>Document</title>   </head>   <body>     <section id="top">       <div class="container">         <div class="info">           <div class="blue-square"></div>           <h1>Sean Devlin Connelly</h1>           <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</p>     ...
Post a Comment
Read more

Day 360

The first installment of the building a personal portfolio 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" />     <link rel="stylesheet" href="css/main.css" />     <title>Document</title>   </head>   <body>     <section id="home">       <div class="blue-square"></div>       <div class="info">         <h1>Sean Devlin Connelly</h1>         <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit.</p>         <a href="#">Latest Works</a>    ...
Post a Comment
Read more

Day 359

The last of the css for the music site... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #tour {   background: #000;   position: relative;   z-index: 4;   #top-img {     background-image: url("/img/group.png");     background-repeat: no-repeat;     background-size: cover;     background-position: center center;     filter: saturate(10%) contrast(125%);     height: 300px;   }   #tourdates {     background: #000;     display: flex;     flex-direction: column;     align-items: center;     padding: 50px;     .title {       color: #fff;       font-size: 2rem;       text-align: center;       margin: 0 0 50px;     }     .dates {  ...
Post a Comment
Read more

Day 358

The final HTML for the music site. #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********     <section id="tour">       <div id="top-img"></div>       <div class="container">         <div id="tourdates">           <div class="title">             TOUR DATES           </div>           <ul class="dates">             <li>               <span class="city">NYC</span>               <span class="location">Best Buy Center</span>  ...
Post a Comment
Read more

Day 357

And today is my favorite number... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #music {   padding: 80px 0;   position: relative;   #bluredbg {     background-image: linear-gradient(         45deg,         rgba(255, 253, 60, 1) 0%,         rgba(255, 253, 60, 1) 33%,         rgba(255, 253, 60, 0.96) 36%,         rgba(255, 253, 60, 0.86) 43%,         rgba(176, 38, 183, 0.57) 62%,         rgba(125, 185, 232, 0) 100%       ),       url("/img/album69.jpg");     background-size: cover;     height: 100%;     width: 100%;     filter: blur(50px) saturate(150%);     position: absol...
Post a Comment
Read more

Day 356

A quick day of music site building... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #music {   .container {     display: flex;     #info {       width: 50%;       #title {         font-size: 2rem;         font-weight: 700;         text-align: center;       }       #sub-title {         font-size: 0.7rem;         font-weight: 300;         text-align: center;       }       #singles {         display: grid;         grid-template-columns: 50% 50%;       }     }   ...
Post a Comment
Read more

Day 355

Part two of the google.com rebuild. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** @import "reset"; * {   box-sizing: border-box;   font-family: Arial, sans-serif;   font-size: 16px; } #container {   max-width: 100%;   height: 100vh;   background-color: aliceblue;   header {     background: yellow;     display: flex;     height: 40px;     flex-direction: row;     flex-wrap: nowrap;     justify-content: space-between;     align-items: center;     .topmenu-ul {       font-family: Arial, sans-serif;       font-size: 0.8rem;       li {         display: inline-block;         a {           text-decoration: none;    ...
Post a Comment
Read more

Day 354

Beginning my rebuild of google.com #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       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" />     <title>Document</title>   </head>   <body>     <header>       <div class="menutop-left">      ...
Post a Comment
Read more

Day 353

Not much going on today... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** #music {   .container {     display: flex;   }   #info {   }   #album-cover {   } }
Post a Comment
Read more

Day 352

I might finish this one tomorrow... #CodingPhase #TheCodingWay #365CodingPhaseChallenge **********     <section id="music">       <div class="container">         <div id="info">           <div id="title">             DAY 69           </div>           <ul id="singles">             <li>Gummo</li>             <li>Gotti</li>             <li>Kooda</li>             <li>Rondo</li>         ...
Post a Comment
Read more

Day 351

Taking longer than expected... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** .container {   max-width: 1400px;   margin: 0 auto; } #bio {   background: #000;   position: relative;   z-index: 3;   padding: 100px 0;   .container {     display: flex;   }   p {     width: 50%;     color: #fff;     line-height: 1.8;     font-size: 0.9rem;     padding: 50px;   }   #logo-centered {     width: 50%;     display: flex;     justify-content: center;     align-items: center;     padding: 50px;   } } #media {   background-image: url("/img/original.jpeg");   background-size: cover;   padding: 100px 0;   #title {     background: #000;     font-size: 1.1rem;     font-weight: 400;   ...
Post a Comment
Read more

Day 350

Plugin away... #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** <!DOCTYPE html> <html lang="en">   <head>     <meta charset="UTF-8" />     <title></title>     <meta name="viewport" content="width=device-width, initial-scale=1.0" />     <link rel="stylesheet" href="css/main.css" />   </head>   <body>     <header>       <div id="logo">         <a href="">           <img src="img/logo.png" />         </a>       </div>       <nav>         <a href="">BIO</a>         <a href="">MEDIA</a>    ...
Post a Comment
Read more

Day 349

Working through a music site... should finish it up tomorrow. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** @import url("https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700"); @import "reset"; * {   box-sizing: border-box; } body {   font-family: "Roboto", sans-serif;   background: #19202a; } header {   position: absolute;   z-index: 3;   padding: 15px;   display: flex;   width: 100%;   justify-content: space-between;   #logo {     width: 50px;     img {       width: 100%;     }   }   nav {     align-self: center;     a {       color: #fff;       text-decoration: none;       font-size: 1.2rem;       font-weight: 300;       padding: 0 10px;     }   } }...
Post a Comment
Read more

Day 348

Having issues with this class and tools so, going through it manually. #CodingPhase #TheCodingWay #365CodingPhaseChallenge ********** @import url("https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700"); @import "reset"; body {   font-family: "Roboto", sans-serif; } #top-section {   background: url("/img/top.jpg");   background-size: cover;   height: 100vh;   width: 100%; }
Post a Comment
Read more