rik/blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add header image and restyle navigation menu

Browse Source
This commit is contained in:
Rik Veenboer
2016-01-11 20:44:42 +00:00
parent 7495ef03de
commit 3ce8804937
2 changed files with 48 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
_includes/header.html
View File

@@ -35,7 +35,10 @@
</script> </script>
</head> </head>
<body class="layout-{{ page.layout }}{% if page.body_class %} {{ page.body_class }}{% endif %}"> <body class="layout-{{ page.layout }}{% if page.body_class %} {{ page.body_class }}{% endif %}">
<header> <header id="masthead" class="site-header" role="banner">
<a class="home-link" href="/" title="Rik @ St. Andrews" rel="home"></a>
</header>
<header class="navigation">
<ul class="screen-only"> <ul class="screen-only">
{% if 'dev' == site.environment %} {% if 'dev' == site.environment %}
<li><a href="/{{ site.baseurl }}/private/">private</a></li> <li><a href="/{{ site.baseurl }}/private/">private</a></li>

57
static/style/default-common.css
View File

@@ -1,17 +1,52 @@
* {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
body { body {
color: #333333; color: #333333;
font-family: Lato, sans-serif; font-family: Lato, sans-serif;
font-size: 16px; font-size: 16px;
margin: 2px 10px 10px 44px; margin: 0 auto;
padding: 0;
min-width: 640px;
max-width: 1600px;
} }
body > header, article > section { body > header, article > section {
border-bottom: #F0F0F0 solid 1px; border-bottom: #F0F0F0 solid 1px;
padding: 24px 80px;
width: 900px;
}
article > section {
border-left: #E9E9E9 solid 1px; border-left: #E9E9E9 solid 1px;
margin-bottom: 2px;
padding: 24px 34px;
position: relative; position: relative;
width: 640px; left: 80px;
}
header.site-header, header.navigation {
border: 0;
}
header.site-header {
padding: 0;
width: 100%;
background: url(/asset/header/187b6ae.jpg) no-repeat scroll top;
background-size: 1600px auto;
}
header.site-header .home-link {
display: block;
max-width: 1080px;
min-height: 225px;
text-decoration: none;
display: block;
}
header.navigation {
background-color: #f7f5e7;
padding: 10px 50px 10px 50px;
} }
body.layout-gallery-photo > header { body.layout-gallery-photo > header {
@@ -26,9 +61,8 @@ body > footer {
color: #999999; color: #999999;
font-size: 11px; font-size: 11px;
font-weight: 400; font-weight: 400;
padding: 36px 6px 28px 36px; padding: 16px 6px 28px 66px;
position: relative; width: 700px;
width: 668px;
} }
body > footer a { body > footer a {
@@ -40,8 +74,7 @@ body.no-footer > footer {
} }
body > header { body > header {
padding-right: 20px; width: 100%;
width: 654px;
} }
body > header .meta { body > header .meta {
@@ -157,7 +190,7 @@ h2 {
color: #393939; color: #393939;
font-size: 17px; font-size: 17px;
margin: 32px -4px 10px; margin: 32px -4px 10px;
padding: 0 4px 2px; padding: 0 40px 2px;
} }
h3 { h3 {
@@ -171,10 +204,6 @@ hr {
margin: 0 -4px; margin: 0 -4px;
} }
article > section .timeline {
margin-top: 4px;
}
section .timeline > * { section .timeline > * {
display: block; display: block;
opacity: 0.6; opacity: 0.6;