Skip to content

Instantly share code, notes, and snippets.

@RSchneider94

RSchneider94/index.html

Last active July 10, 2018 15:03
Show Gist options
  • Save RSchneider94/6eeecba6edc2341c1df6b2ad7bad8fd4 to your computer and use it in GitHub Desktop.
Save RSchneider94/6eeecba6edc2341c1df6b2ad7bad8fd4 to your computer and use it in GitHub Desktop.
Download ZIP
Index Page - CareerFoundry Web Development Course
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Rodrigo Schneider | Web Developer</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css">
<!-- FontAwesome Icons -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.1.0/css/all.css" integrity="sha384-lKuwvrZot6UHsBSfcMvOkWwlCMgc0TaWr+30HWe3a4ltaBwTZhyTEggF5tJv8tbt"
crossorigin="anonymous">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css?family=Quattrocento|Ubuntu+Condensed" rel="stylesheet">
<!-- My Page CSS -->
<link rel="stylesheet" href="css/styles.css">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body data-spy="scroll" data-target=".navbar">
<!-- Navbar -->
<nav class="navbar fixed-top navbar-expand-lg navbar-dark bg-dark" role="navigation">
<a class="navbar-brand" href="#home">Rodrigo Schneider</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item">
<a class="nav-link" href="#work">Portfolio</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</nav>
<!-- End Navbar -->
<!-- Home Section -->
<section id="home">
<div class="container">
<div class="row">
<div class="col-12">
<h1 class="text-sm-center text-lg-left text-uppercase">Hello!</h1>
<p class="text-sm-center text-lg-left">
I'm currently looking for an entry-level position as Web Developer.
<br>Wanna know more about me?
</p>
</div>
</div>
</div>
</section>
<!-- End Home Section -->
<!-- Work Section -->
<section id="work">
<div class="container content">
<div class="row">
<div class="col-12 header">
<h1>My Portfolio</h1>
<hr>
</div>
<!-- end header -->
</div>
<!-- end row -->
<div class="row" id="portfolio-thumbs"></div>
</div>
</section>
<!-- End Work Section-->
<!-- About Section -->
<section id="about">
<div class="container content">
<div class="row">
<div class="col-12 header">
<h1>About Me</h1>
<hr>
</div>
<!-- end header -->
</div>
<!-- end row -->
<div class="row">
<div class="col-12 col-md-3 image">
<img class="img-fluid rounded-circle" src="img/profile-photo.jpeg" alt="A person working at an iMac with lines of code on its screen.
Photo by Lee Campbell on Unsplash">
</div>
<!-- end image -->
<div class="col-7 col-md-5 intro">
<h2>Introduction</h2>
<p>
Worked as IT Support Technician for about 4 years...
<br>
<br>Then I falled in love with Development and of course, a bit with Design. At this moment, I'm looking forward
to work as
<br>
<span class="featured-text">Web Developer</span>.
</p>
</div>
<!-- end intro -->
<div class="col-5 col-md-3 skill">
<h2>My Skills</h2>
<ul id="skill-list">
<li>
<i class="fas fa-check"></i> HTML5</li>
<li>
<i class="fas fa-check"></i> CSS</li>
<li>
<i class="fas fa-check"></i> JavaScript</li>
<li>
<i class="fas fa-check"></i> Ruby On Rails</li>
</ul>
</div>
<!-- end skills -->
</div>
<!-- end row -->
<div class="row">
<div class="col-12 main-text">
<h2>My Story</h2>
<p>
I have worked as IT Support Technician for about 4 years. I have met Web Programming during a challenging task in my last
job role as IT Support Technician. I have developed a Web Dashboard to monitor the incomming tickets of our team
(Help Desk) and a Stock Management System for another team in the company. At this moment, I‘m willing to work
as Web Developer.
You could check my detailed CV <a href="#" id="item1" title="More information" data-toggle="modal" data-target="#modal-cv">here</a>.
</p>
</div>
<!-- end main-text -->
<!-- Call Modal CV -->
<div class="modal fade" id="modal-cv" tabindex="-1" role="dialog" aria-labelledby="modal-cv" aria-hidden="true">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title text-uppercase">My CV</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div> <!-- end modal header-->
<div class="modal-body">
<embed id="modal-embed" src="docs/my-cv.pdf">
</div> <!-- end modal body -->
</div>
</div>
</div>
</div>
<!-- end row -->
</div>
<!-- end container -->
</section>
<!-- End About Section -->
<!-- Contact Section -->
<section id="contact">
<div class="container content">
<div class="row">
<div class="col-12 header">
<h1>Contact Me</h1>
<hr>
</div>
<!-- end header -->
</div>
<!-- end row -->
<div class="row">
<div class="col-12 col-md-6 contact-information">
<h2>Say hello!</h2>
<ul id="contact-details">
<li>
<i class="fas fa-location-arrow"></i> Berlin, Germany
</li>
<li>
<i class="fas fa-envelope"></i>
<a href="mailto:rodrigoschneider94@gmail.com">rodrigoschneider94@gmail.com</a>
</li>
</ul>
<form action="" method="post">
<div class="form-group">
<label class="sr-only" for="name">Your Name*</label>
<input class="form-control" type="text" name="name" id="name" placeholder="But first, what is your name?" required>
</div>
<div class="form-group">
<label class="sr-only" for="name">Your E-Mail*</label>
<input class="form-control" type="email" name="email" id="email" placeholder="And your e-mail too!" required>
</div>
<div class="form-group">
<label class="sr-only" for="name">Your Message*</label>
<textarea class="form-control" style="resize: none" name="message" id="message" placeholder="And finally, your message to me!" cols="30" rows="5" required></textarea>
</div>
<p id="visible-comment"></p>
<p id="char-count"></p>
<input class="form-control btn btn-dark form-submit" type="submit" value="Send your message">
</form>
</div>
<!-- end information column -->
<div class="col-12 col-md-6 social-network">
<h2>You can also follow me here:</h2>
<div class="col-xs-12 col-md-12 text-center">
<ul id="social-network-links">
<li>
<a href="https://www.linkedin.com/in/rschneider94/" target="_blank">
<i class="fab fa-linkedin fa-3x"></i>
</a>
</li>
<li>
<a href="https://www.xing.com/profile/RodrigoSchneider_Wernke/" target="_blank">
<i class="fab fa-xing-square fa-3x"></i>
</a>
</li>
<li>
<a href="https://twitter.com/schneiderods" target="_blank">
<i class="fab fa-twitter-square fa-3x"></i>
</a>
</li>
<li>
<a href="https://github.com/RSchneider94" target="_blank">
<i class="fab fa-github-square fa-3x"></i>
</a>
</li>
</ul>
<div id="google-maps"></div>
</div>
<!-- end social-network-links -->
</div>
<!-- end social-network column -->
</div>
<!-- end row -->
</div>
<!-- end container -->
</section>
<!-- End Contact Section -->
<!-- Footer -->
<footer class="text-center">
&copy; Rodrigo Schneider 2018
</footer>
<!-- End Footer -->
<!-- JQuery -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js" integrity="sha384-cs/chFZiN24E4KMATLdqdvsezGxaGsi4hLGOzlXwp5UZB1LY//20VyM2taTB4QvJ" crossorigin="anonymous"></script>
<!-- Bootstrap core JS -->
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js" charset="utf-8"></script>
<!-- Scripts JS (Own JS) -->
<script src="js/work.js"></script>
<script src="js/scripts.js"></script>
<!-- Google Maps JS API -->
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDOe-CUwHEIG2uuBVnm5HPACiS-Ojb85K0&callback=initMap"
async defer></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment