PluralSight Login Page Clone

A simple, responsive clone of the PluralSight Login Page - View

Here's links to both the original and this clone for quick comparison View Original || View This clone

"Good artists copy. Great artists create from nothing using only innate talent and/or God-given magic steal" - Picaso

What it is

A simple, learning Project to practice HTML and CSS Fundamentals. Built with:

• HTML
• CSS - FlexBox & Media Queries
• Google Fonts - Custom Google Fonts
• LOVE - Strictly for the love of coding Mehn!

What it does

• Doesn't Do anything Yo! Just a cloning exercise. Looks pretty cool though.

Learning Points

• FlexBox
• CSS Media Queries
• That Horizontal Line OR thing (you know the one)

Some notes

This is just one of many cloning projects I will be doing to build a collection of clones for referencing purposes. Login Pages are a staple of just about every website. And being able to make a cool one is pretty important.

Here's the OR thing

HTML =>

<div class="or">
  <hr class="bar">
  <span>OR</span>
  <hr class="bar">
</div>

CSS =>

.or{
  display:flex;
  flex-direction: row;
  margin-bottom: 1.2rem;
  align-items: center;
}
.or .bar{
  flex: auto;
  border:none;
  height: 1px;
  background: #aaa;
}
.or span {
  color: #ccc;
  padding: 0 0.8rem;
}

Here's the gist of media queries =>

@media(min-width: 1200px;){
  //Larger Screens
}
@media(max-width: 768px;){
  //Tablets and Down
}

Future Development

Just some ideas in my head for improvements I might come back to this to implement.

• Adding Social Login buttons (because wth not?)
• Using SASS
• A little JS for Event handling

Contribution

Contributions are highly welcome. Feel free to fork, clone, make pull requests, make comments/observations etc.

Acknowledgments

• Many thanks to @bradtraversy for his awesome courses - i will not fail you sensei
• Thanks to @torvalds For Making the world a better place
• And To anyone reading this... You're awesome!

"The Master has failed more times than the beginner has even tried" - Bruce Lee