restyle header
This commit is contained in:
parent
fd8e512fd5
commit
0bf9bbfcfb
5 changed files with 20 additions and 31 deletions
|
@ -4,16 +4,6 @@
|
||||||
<meta name="no_container" content="true" />
|
<meta name="no_container" content="true" />
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<section class="bg-primary">
|
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-8 col-lg-offset-2 text-center">
|
|
||||||
<h1 class="section-heading">About Me</h1>
|
|
||||||
<hr class="light">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
<section id="me">
|
<section id="me">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="row">
|
<div class="row">
|
||||||
|
@ -23,7 +13,7 @@
|
||||||
I work as a full stack developer, but I prefer working on servers and mobile apps.
|
I work as a full stack developer, but I prefer working on servers and mobile apps.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-sm-4 text-center">
|
<div class="col-sm-4 text-center github-card-container">
|
||||||
<div data-theme="medium" data-github="RealOrangeOne" class="github-card"></div>
|
<div data-theme="medium" data-github="RealOrangeOne" class="github-card"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -71,16 +71,18 @@ p a {
|
||||||
padding: 1px 0;
|
padding: 1px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
#header {
|
header#header {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
min-height: 50vh;
|
||||||
|
|
||||||
|
|
||||||
&.image .section-heading {
|
&.image .section-heading {
|
||||||
@extend .text-shadow;
|
@extend .text-shadow;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-height: $screen-xs-max) {
|
@media screen and (max-height: $screen-xs-max) {
|
||||||
height: 40vh;
|
height: 100vh;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -99,3 +101,7 @@ p a {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.github-card-container > iframe {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
{% extends "base.html" %}
|
{% extends "base.html" %}
|
||||||
|
|
||||||
{% block htmltitle %}
|
{% block htmltitle %}
|
||||||
{{ category|title }}
|
{{ category.name|title }}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block metadata %}
|
{% block metadata %}
|
||||||
|
@ -9,16 +9,7 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<section class="bg-primary">
|
{% include 'extras/header.html' with instance=category %}
|
||||||
<div class="container">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-lg-8 col-lg-offset-2 text-center">
|
|
||||||
<h1 class="section-heading">{{ category.name|title }}</h1>
|
|
||||||
<hr class="light">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</section>
|
|
||||||
{% if category.page.content %}
|
{% if category.page.content %}
|
||||||
<section>
|
<section>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
|
|
|
@ -1,6 +1,8 @@
|
||||||
<section id="header" class="bg-primary image" data-image="{{ instance.image }}">
|
<header id="header" class="bg-primary image" data-image="{{ instance.image or (instance.page and instance.page.image) }}">
|
||||||
<div class="container text-center text-uppercase">
|
<div class="header-content">
|
||||||
<h1 class="section-heading">{{ instance.title }}</h1>
|
<div class="header-content-inner">
|
||||||
<hr class="light">
|
<h1>{{ instance.title or instance.name or (instance.page and instance.page.name) }}</h1>
|
||||||
|
<hr>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</header>
|
||||||
|
|
|
@ -9,8 +9,8 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block content %}
|
{% block content %}
|
||||||
|
{% include 'extras/header.html' with instance=page %}
|
||||||
{% if not page.no_container %}
|
{% if not page.no_container %}
|
||||||
{% include 'extras/header.html' with instance=page %}
|
|
||||||
<section>
|
<section>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
{{ page.content }}
|
{{ page.content }}
|
||||||
|
|
Reference in a new issue