main page has been done

This commit is contained in:
Sameer Rahmani 2019-03-28 21:20:47 +00:00
parent 43edc57c1b
commit 0b311f874c
8 changed files with 213 additions and 99 deletions

80
_layouts/_nav.html Normal file
View File

@ -0,0 +1,80 @@
<section class="section">
<div class="container">
<div class="level">
<a class="navlink" href="https://gitlab.com/lxsameer">
<div class="level-item">
</div>
</a>
<a class="navlink" href="/feed.xml">
<div class="level-item">
<span class="icon is-large">
<i class="fas fa-rss fa-lg"></i>
</span>
</div>
</a>
{% if page.url != "/" %}
<a class="level-item" href="/">
<div class="column">
<span class="icon is-large">
<i class="fas fa-home fa-lg"></i>
</span>
</div>
</a>
{% endif %}
<!-- {% if page.url != "/gpg.html" %}
<div class="column navlink">
<a class="" href="/gpg.html">
<span class="icon is-large">
<i class="fas fa-key fa-lg"></i>
</span>
</a>
</div>
{% endif %} -->
{% if page.url != "/blog/" %}
<a class="navlink" href="/blog/">
<div class="level-item">
<span class="icon is-large">
<i class="fas fa-blog fa-lg"></i>
</span>
</div>
</a>
{% endif %}
<a class="navlink" href="https://www.linkedin.com/in/lxsameer/">
<div class="level-item">
<span class="icon is-large">
<i class="fab fa-linkedin fa-lg"></i>
</span>
</div>
</a>
<a class="navlink" href="https://twitter.com/lxsameer">
<div class="level-item">
<span class="icon is-large">
<i class="fab fa-twitter fa-lg"></i>
</span>
</div>
</a>
</div>
</div>
</section>

View File

@ -7,91 +7,79 @@
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous"> <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css" integrity="sha384-fnmOCqbTlWIlj8LyTjo7mOUStjsKC4pOpQbqyi7RrhN7udi9RwhKkMHpvLbHG9Sr" crossorigin="anonymous">
</head> </head>
<body class="{% if page.theme %}{{page.theme }}{% else %}light{% endif %}"> <body class="{% if page.theme %}{{page.theme }}{% else %}light{% endif %}">
<section class="section">
<nav class="navbar is-primary" role="navigation" aria-label="main navigation">
<div class="container"> <div class="container">
<div class="columns is-centered centered is-flex"> <div class="navbar-brand">
<div class="column is-half centered is-flex"> <a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false" data-target="navcontainer">
<div class="columns"> <span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<a class="navlink" href="https://gitlab.com/lxsameer"> <div id="navcontainer" class="navbar-menu">
<div class="column"> <div class="navbar-start">
<span class="icon is-large"> <a href="/" class="navbar-item">
<i class="fab fa-gitlab fa-lg"></i> Blog
</span>
</div>
</a> </a>
<a class="navlink" href="/feed.xml"> <a href="/code-of-honor/" class="navbar-item">
<div class="column"> Code of Honor
<span class="icon is-large">
<i class="fas fa-rss fa-lg"></i>
</span>
</div>
</a> </a>
{% if page.url != "/" %} <a href="/about-me/" class="navbar-item">
<a class="navlink" href="/"> About Me
<div class="column">
<span class="icon is-large">
<i class="fas fa-home fa-lg"></i>
</span>
</div>
</a> </a>
{% endif %} </div>
<!-- {% if page.url != "/gpg.html" %} <div class="navbar-end">
<div class="column navlink"> <a class="navbar-item" href="https://gitlab.com/lxsameer">
<a class="" href="/gpg.html"> <span class="icon is-large is-hidden-mobile">
<span class="icon is-large"> <i class="fab fa-gitlab fa-lg"></i>
<i class="fas fa-key fa-lg"></i> </span>
</span> <span class="is-large is-hidden-desktop">
</a> <i class="pad fab fa-gitlab fa-lg"></i>
</div> Gitlab
{% endif %} --> </span>
{% if page.url != "/blog/" %}
<a class="navlink" href="/blog/">
<div class="column">
<span class="icon is-large">
<i class="fas fa-blog fa-lg"></i>
</span>
</div>
</a>
{% endif %}
<a class="navlink" href="https://www.linkedin.com/in/lxsameer/">
<div class="column">
<span class="icon is-large">
<i class="fab fa-linkedin fa-lg"></i>
</span>
</div>
</a> </a>
<a class="navlink" href="https://twitter.com/lxsameer"> <a class="navbar-item" href="https://www.linkedin.com/in/lxsameer/">
<div class="column"> <span class="icon is-large is-hidden-mobile">
<span class="icon is-large"> <i class="fab fa-linkedin fa-lg"></i>
<i class="fab fa-twitter fa-lg"></i> </span>
</span> <span class="is-large is-hidden-desktop">
</div> <i class="pad fab fa-linkedin fa-lg"></i>
Linkedin
</span>
</a>
<a class="navbar-item" href="https://twitter.com/lxsameer">
<span class="icon is-large is-hidden-mobile">
<i class="fab fa-twitter fa-lg"></i>
</span>
<span class="is-large is-hidden-desktop">
<i class="pad fab fa-twitter fa-lg"></i>
Twitter
</span>
</a> </a>
</div> </div>
</div> </div>
</div>
</nav>
<div class="container">
{{ content }}
</div> </div>
</div>
</section>
<section class="section is-flex">
<div class="container">
{{ content }}
</div>
</section>
<footer class="footer"> <footer class="footer">
<div class="content has-text-centered"> <div class="content has-text-centered">
<p>© 2010-2019 Sameer Rahmani</p> <p>© 2010-2019 Sameer Rahmani</p>
</div> </div>
</footer> </footer>
<script src="/assets/js/main.js?1"></script>
</body> </body>
</html> </html>

View File

@ -1,32 +1,37 @@
--- ---
layout: default layout: default
--- ---
<div class="columns is-centered">
<div class="column is-half has-text-centered is-flex centered"> <div class="column is-half-desktop is-offset-one-quarter-desktop">
<figure class="image is-128x128 is-centered"> <section class="section">
<img class="is-rounded" src="https://lxsameer.com/images/me-1.jpg" alt="Sameer Rahmani" /> <p class="text-centered">
</figure> <img class="is-rounded" alt="lxsameer" src="https://lxsameer.com/images/me-1.jpg"/>
</p>
<p class="info text-justified">
Hi! I'm <b>Sameer</b> and I usally write about
technology and software development (hmmm more like nagging instead of writing).
</p>
</section>
</div>
<div class="column is-half-desktop is-offset-one-quarter-desktop">
<section class="section">
<h3 class="is-size-5">
Blog Posts:
</h3>
{% for post in site.posts %}
<div class="columns">
<div class="column">
<h2 class="is-size-3-desktop is-size-4-mobile">
<a class="post-title-link" href="{{ post.url }}">
<i class="fas fa-link"></i> {{ post.title }}
</a>
</h2>
</div>
</div> </div>
</div> {% endfor %}
</section>
<div class="columns is-centered has-text-centered">
<div class="column is-half">
<h1 class="is-size-1">Sameer Rahmani</h1>
<h2 class="is-size-2">Senior Software Engineer</h2>
</div>
</div>
<div class="columns is-centered is-flex">
<div class="column is-one-quarter centered">
<a class="button is-primary is-block cv-button" href="https://dl.lxsameer.com/CV/SameerRahmani.pdf">
<b>
Download My CV
</b>
</a>
</div>
</div>
{{ content }}
</div> </div>

View File

@ -4,7 +4,7 @@ theme: dark
--- ---
<div class="columns is-flex centered"> <div class="columns is-flex centered">
<div class="column is-half"> <div class="column is-half-desktop">
<h1 class="is-size-1"> <h1 class="is-size-1">
{{page.title}} {{page.title}}
</h1> </h1>
@ -70,8 +70,8 @@ theme: dark
</div> </div>
</div> </div>
[]
<div class="columns is-flex centered"> <div class="columns is-flex centered">
<div class="column is-half has-text-centered"> <div class="column is-half-desktop has-text-centered">
</div> </div>
</div> </div>

View File

@ -3,7 +3,7 @@ layout: default
--- ---
<div class="columns is-flex centered"> <div class="columns is-flex centered">
<div class="column is-half"> <div class="column is-half-desktop">
{{ content }} {{ content }}
</div> </div>
</div> </div>

25
assets/js/main.js Normal file
View File

@ -0,0 +1,25 @@
document.addEventListener('DOMContentLoaded', () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Check if there are any navbar burgers
if ($navbarBurgers.length > 0) {
// Add a click event on each of them
$navbarBurgers.forEach( el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
});
});
}
});

View File

@ -109,6 +109,11 @@ body.dark
.columns.is-flex.centered .columns.is-flex.centered
justify-content: center justify-content: center
.text-centered
text-align: center
.text-justified
text-align: justify
.cv-button .cv-button
margin-top: 3rem margin-top: 3rem
@ -134,3 +139,14 @@ ul.details
display: inline display: inline
li.category li.category
padding: 0.5em padding: 0.5em
.pad
padding-right: 5px
.navbar-menu
a.navbar-item
color: $purple
.is-rounded
border-radius: 50%
border: 3px solid darken($purple, 10%)

View File

@ -1,5 +1,5 @@
--- ---
layout: home layout: home
theme: light theme: dark
home: true home: true
--- ---