Browse Source

Moved social links to top and made them disappear when cursor is outside

header
master
Jakub Filo 6 years ago
parent
commit
c42cd201cb
  1. 11
      layouts/partials/header.html
  2. 11
      layouts/partials/social.html
  3. 115
      static/css/github.css
  4. 1
      static/css/highlight.pack.js
  5. 20
      static/css/main.css
  6. BIN
      static/images/apple-touch-icon.png
  7. BIN
      static/images/bg.jpg
  8. BIN
      static/images/favicon.ico

11
layouts/partials/header.html

@ -17,9 +17,6 @@
{{ end }}{{ end }}
{{ if .IsPage }}
<meta property="og:type" content="article" />
{{ with .Site.Params.facebook }}
<meta property="og:article:author" content="https://facebook.com/{{ . }}" />
{{ end }}
<meta property="og:article:published_time" content="{{ .Date.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}" />
{{ range .Params.tags }}
<meta property="og:article:tag" content="{{ . }}" />
@ -31,11 +28,10 @@
<title>
{{ if ne .URL "/" }} {{ .Title }} &middot; {{ end }} {{ .Site.Title }}
</title>
<link rel="canonical" href=" {{ .Permalink }}" />
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/bootstrap.min.css" />
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/main.css" />
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/font-awesome.min.css" />
<link rel="stylesheet" href="{{ .Site.BaseURL }}css/github.css" />
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:200,300,400" type="text/css">
<link rel="shortcut icon" href="{{ .Site.BaseURL }}images/favicon.png" />
{{ if eq .URL "/" }}
@ -52,8 +48,9 @@
{{ end }}
</head>
<body>
<header class="global-header" style="background-image:url({{ if isset .Params "image" }}{{ .Params.image }} {{ else }} /images/bg.jpg {{ end }})">
<header class="global-header" style="background-image:url({{ if isset .Params "image" }}{{ .Params.image }} {{ else }} /images/bg.svg {{ end }})">
<section class="header-text">
{{ partial "social.html" . }}
<h1>
<a href="{{ .Site.BaseURL }}">
{{ with .Site.Params.avatar }}
@ -69,7 +66,7 @@
{{ . }}
</div>
{{ end }}
{{ partial "social.html" . }}
</section>
</header>
<main class="container">

11
layouts/partials/social.html

@ -1,7 +1,4 @@
<div class="sns-social hidden-print">
<a href="/index.xml" title="Subscribe">
<i class="fa fa-rss"></i>
</a>
{{ with .Site.Params.about }}
<a href="{{ . }}" target="_self" title="About me">
<i class="fa fa-user"></i>
@ -62,4 +59,12 @@
<i class="fa fa-key"></i>
</a>
{{ end }}
{{ with .Site.Params.trakt }}
<a href="https://trakt.tv/users/{{ . }}" target="_blank">
<i class="fa fa-film"></i>
</a>
{{ end }}
<a href="/index.xml" title="Subscribe">
<i class="fa fa-rss"></i>
</a>
</div>

115
static/css/github.css

@ -1,115 +0,0 @@
/*
github.com style (c) Vasily Polovnyov <vast@whiteants.net>
*/
.hljs-comment,
.diff .hljs-header,
.hljs-javadoc {
color: #998;
font-style: italic;
}
.hljs-keyword,
.css .rule .hljs-keyword,
.hljs-winutils,
.nginx .hljs-title,
.hljs-subst,
.hljs-request,
.hljs-status {
color: #333;
font-weight: bold;
}
.hljs-number,
.hljs-hexcolor,
.ruby .hljs-constant {
color: #008080;
}
.hljs-string,
.hljs-tag .hljs-value,
.hljs-phpdoc,
.hljs-dartdoc,
.tex .hljs-formula {
color: #d14;
}
.hljs-title,
.hljs-id,
.scss .hljs-preprocessor {
color: #900;
font-weight: bold;
}
.hljs-list .hljs-keyword,
.hljs-subst {
font-weight: normal;
}
.hljs-class .hljs-title,
.hljs-type,
.vhdl .hljs-literal,
.tex .hljs-command {
color: #458;
font-weight: bold;
}
.hljs-tag,
.hljs-tag .hljs-title,
.hljs-rules .hljs-property,
.django .hljs-tag .hljs-keyword {
color: #000080;
font-weight: normal;
}
.hljs-attribute,
.hljs-variable,
.lisp .hljs-body {
color: #008080;
}
.hljs-regexp {
color: #009926;
}
.hljs-symbol,
.ruby .hljs-symbol .hljs-string,
.lisp .hljs-keyword,
.clojure .hljs-keyword,
.scheme .hljs-keyword,
.tex .hljs-special,
.hljs-prompt {
color: #990073;
}
.hljs-built_in {
color: #0086b3;
}
.hljs-preprocessor,
.hljs-pragma,
.hljs-pi,
.hljs-doctype,
.hljs-shebang,
.hljs-cdata {
color: #999;
font-weight: bold;
}
.hljs-deletion {
background: #fdd;
}
.hljs-addition {
background: #dfd;
}
.diff .hljs-change {
background: #0086b3;
}
.hljs-chunk {
color: #aaa;
}

1
static/css/highlight.pack.js

File diff suppressed because one or more lines are too long

20
static/css/main.css

@ -3,21 +3,26 @@ html {
}
main {
max-width: 750px;
max-width: 640px;
word-wrap: break-word;
}
/* Header */
.global-header {
background: #222 no-repeat center center;
background-size: cover;
}
.global-header:hover .sns-social {
display: block;
position: relative;
top: 10px;
}
.header-text {
position: relative;
padding-bottom: 1px;
height: 100%;
vertical-align: middle;
background-color: rgba(0, 0, 0, 0.4);
color: rgba(255, 255, 255, 0.9);
}
@ -25,19 +30,22 @@ main {
.header-text .tag-line {
margin: 10px auto;
padding: 0 10px;
max-width: 430px;
color: rgba(255, 255, 255, 0.7);
text-align: center;
font-weight: 300;
}
.header-text .sns-social {
top: -500px;
position: relative;
text-align: center;
display: block;
transition-duration: 1s;
}
.header-text .sns-social a {
display: inline-block;
width: 32px;
width: 42px;
height: 32px;
color: rgba(255, 255, 255, 0.6);
text-decoration: none;
@ -62,13 +70,13 @@ main {
text-decoration: none;
}
/* Footer */
.global-footer {
margin-top: 10px;
padding-top: 10px;
width: 100%;
max-width: 640px;
height: 100px;
border-top: 1px solid rgba(0, 0, 0, 0.2);
color: rgba(0, 0, 0, 0.4);

BIN
static/images/apple-touch-icon.png

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.4 KiB

BIN
static/images/bg.jpg

Binary file not shown.

Before

Width:  |  Height:  |  Size: 343 KiB

BIN
static/images/favicon.ico

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

Loading…
Cancel
Save