Created
August 25, 2015 07:47
-
-
Save nanonum/58fa97fde4f8df5a5722 to your computer and use it in GitHub Desktop.
akkki tumblr
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<!-- Appearance option --> | |
<meta name="color:text" content="#666"/> | |
<meta name="color:background" content="#fff"/> | |
<meta name="color:Accent" content="#ccc"/> | |
<meta name="text:Disqus Shortname" content=""/> | |
<meta name="font:Logo" content="'lato, sans-serif"/> | |
<meta name="if:Use Lato font" content="1"/> | |
<meta name="if:Show Blog Description" content="0"/> | |
<meta name="if:Show Tags" content="0"/> | |
<meta name="if:Show profile photo" content="0"/> | |
<meta name="if:Show post notes" content="0"/> | |
<meta name="select:Layout" content="regular" title="Regular"/> | |
<meta name="select:Layout" content="narrow" title="Narrow"/> | |
<meta name="select:Layout" content="grid" title="Grid"/> | |
<meta name="select:Large Images" content="0" title="OFF"/> | |
<meta name="select:Large Images" content=".1" title="10%"/> | |
<meta name="select:Large Images" content=".2" title="20%"/> | |
<meta name="select:Large Images" content=".3" title="30%"/> | |
<meta name="select:Large Images" content=".4" title="40%"/> | |
<meta name="select:Large Images" content=".5" title="50%"/> | |
<meta name="select:Large Images" content=".6" title="60%"/> | |
<meta name="select:Large Images" content=".7" title="70%"/> | |
<meta name="select:Large Images" content=".8" title="80%"/> | |
<meta name="select:Large Images" content=".9" title="90%"/> | |
<meta name="select:Large Images" content="1" title="100%"/> | |
<meta name="if:Use endless scrolling" content="1"/> | |
<meta name="text:Google Analytics ID" content=""/> | |
<meta name="image:Header" content="{HeaderImage}"/> | |
<style> | |
@charset 'UTF-8'; | |
html, | |
body, | |
h1, | |
h2, | |
h3, | |
h4, | |
h5, | |
h6, | |
p, | |
ul, | |
ol, | |
li, | |
dl, | |
dt, | |
dd, | |
form, | |
input { | |
margin: 0px; | |
padding: 0px; | |
} | |
ul, | |
ol { | |
list-style: none; | |
} | |
img { | |
border: none; | |
vertical-align: top; | |
} | |
iframe { | |
vertical-align: top; | |
} | |
::selection { | |
background: #111; | |
color: #fff; | |
} | |
html { | |
background: {color:background}; | |
} | |
body { | |
padding-top: 135px; | |
background-attachment: fixed; | |
-webkit-background-size: contain; | |
-moz-background-size: contain; | |
background-size: contain; | |
letter-spacing: 0.05em; | |
line-height: 1.7; | |
color: {color:text}; | |
font-family: "sans-serif"; | |
min-height: 100%; | |
-webkit-text-size-adjust: 100%; | |
letter-spacing: 0.15em; | |
} | |
@media only screen and (max-width: 768px) { | |
body { | |
padding-top: 165px; | |
font-size: 28px; | |
} | |
} | |
@media only screen and (min-width: 768px) { | |
body { | |
font-size: 14px; | |
} | |
} | |
a { | |
color: {color:Accent}; | |
text-decoration: none; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
a:hover, | |
a:active { | |
color: #ccc; | |
} | |
a:after { | |
content: args; | |
} | |
#header { | |
position: absolute; | |
} | |
#header #masthead { | |
width: 100%; | |
top: 0; | |
position: fixed; | |
z-index: 10; | |
height: 135px; | |
border-bottom: none; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
#header #masthead .title { | |
font-weight: 600; | |
letter-spacing: 0.2em; | |
text-transform: uppercase; | |
text-align: center; | |
position: relative; | |
z-index: 15; | |
line-height: 1; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
font-family: {font:Logo}; | |
} | |
#header #masthead .title a { | |
display: block; | |
} | |
#header #masthead .button { | |
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAWCAYAAADXYyzPAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2xpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGNzdGMTE3NDA3MjA2ODExODcxRkYzRjU5MkRERURDOSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpEQjI5NjIwNEE0RDExMUU0QTU0MzlBODNDQTYyMDk4NSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpEQjI5NjIwM0E0RDExMUU0QTU0MzlBODNDQTYyMDk4NSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgMjAxNCAoTWFjaW50b3NoKSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjUzQUVFREYyMUUyMDY4MTE4MjJBQkJCMUI5NUYxOTg5IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkY3N0YxMTc0MDcyMDY4MTE4NzFGRjNGNTkyRERFREM5Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+tJDmQgAAACtJREFUeNrs1EERAAAEAMGjf1kJ6OBhPG5DbADNvUokaSmcS5JzvZ9rBBgA1VEF2pG2OpAAAAAASUVORK5CYII="); | |
background-repeat: no-repeat; | |
background-position: 60px 57px; | |
display: block; | |
width: 150px; | |
height: 136px; | |
top: 0; | |
right: 0; | |
cursor: pointer; | |
z-index: 20; | |
position: absolute; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
#header.scrolled #masthead { | |
height: 90px; | |
} | |
#header.scrolled #masthead .title { | |
height: 90px; | |
padding-top: 35px; | |
} | |
#header.scrolled #masthead .button { | |
background-position: 60px 37px; | |
height: 90px; | |
} | |
#header.scrolled #menu .dropdown { | |
top: 91px; | |
} | |
#header #menu { | |
height: 136px; | |
width: 100%; | |
top: 0; | |
} | |
#header #menu .dropdown { | |
background: rgba(255,255,255,0); | |
position: fixed; | |
display: block; | |
height: 100%; | |
width: 100%; | |
top: 136px; | |
left: 0; | |
z-index: 15; | |
overflow: hidden; | |
visibility: hidden; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
#header #menu .dropdown ul { | |
position: absolute; | |
/*top: 136px;*/ | |
width: 100%; | |
background: rgba(255,255,255,0.9); | |
z-index: 10; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
-webkit-transform-origin: left top; | |
-moz-transform-origin: left top; | |
-o-transform-origin: left top; | |
-ms-transform-origin: left top; | |
transform-origin: left top; | |
-webkit-transform: translateY(-40px); | |
-moz-transform: translateY(-40px); | |
-o-transform: translateY(-40px); | |
-ms-transform: translateY(-40px); | |
transform: translateY(-40px); | |
opacity: 0; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; | |
filter: alpha(opacity=0); | |
visibility: hidden; | |
} | |
#header #menu .dropdown ul li { | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
border-bottom: 1px solid #ccc; | |
text-transform: uppercase; | |
} | |
#header #menu .dropdown ul li:hover { | |
border-color: rgba(102,102,102,0.6); | |
} | |
#header #menu .dropdown ul a { | |
display: block; | |
text-align: center; | |
font-weight: 600; | |
font-size: 24px; | |
letter-spacing: 0.25em; | |
} | |
#header #menu .dropdown ul a:hover { | |
background: rgba(102,102,102,0.6); | |
color: #fff; | |
} | |
#header.active #masthead { | |
border-bottom: 1px solid #ccc; | |
background: rgba(255,255,255,0.9); | |
} | |
#header.active #menu .dropdown { | |
background: rgba(204,204,204,0.5); | |
visibility: visible; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
#header.active #menu .dropdown ul { | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
visibility: visible; | |
-webkit-transform: translateY(0px); | |
-moz-transform: translateY(0px); | |
-o-transform: translateY(0px); | |
-ms-transform: translateY(0px); | |
transform: translateY(0px); | |
} | |
@media only screen and (min-width: 768px) { | |
#header #masthead .title { | |
font-size: 1.7em; | |
padding-top: 57px; | |
} | |
#header #menu ul li a { | |
height: 80px; | |
line-height: 80px; | |
font-size: 20px; | |
} | |
} | |
@media only screen and (max-width: 768px) { | |
#header #masthead { | |
background: #fff; | |
} | |
#header #masthead .title { | |
font-size: 1.2em; | |
padding-top: 55px; | |
} | |
#header #menu ul li a { | |
height: 100px; | |
line-height: 100px; | |
} | |
} | |
#list { | |
margin: 0 30px 0; | |
height: 100%; | |
} | |
#aside { | |
margin: 0 60px 60px; | |
text-align: justify; | |
font-size: 20px; | |
} | |
.item { | |
margin-bottom: 3em; | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
-webkit-transform-origin: left top; | |
-moz-transform-origin: left top; | |
-o-transform-origin: left top; | |
-ms-transform-origin: left top; | |
transform-origin: left top; | |
-webkit-transform: translateY(180px); | |
-moz-transform: translateY(180px); | |
-o-transform: translateY(180px); | |
-ms-transform: translateY(180px); | |
transform: translateY(180px); | |
word-break: break-word; | |
visibility: hidden; | |
} | |
.item blockquote { | |
padding: 2em 0 2em 2em; | |
margin: 0; | |
} | |
.item blockquote:before { | |
content: '"'; | |
display: block; | |
position: absolute; | |
font-size: 60px; | |
line-height: 1; | |
margin-top: -20px; | |
margin-left: -25px; | |
} | |
@media screen and (min-width: 768px) { | |
.item { | |
padding: 0 30px; | |
width: 33.333%; | |
} | |
.item.w2 { | |
width: 66.666%; | |
} | |
.item.grid-sizer { | |
width: 33.333%; | |
} | |
} | |
@media only screen and (max-width: 768px) { | |
.item { | |
width: 100%; | |
} | |
} | |
.item .header { | |
margin-bottom: 2em; | |
} | |
.item .header .title { | |
text-align: center; | |
font-size: 115%; | |
font-weight: bold; | |
word-wrap: break-word; | |
line-height: 1.2; | |
margin-bottom: 0; | |
} | |
.item .header .title a { | |
color: {color:Accent}; | |
} | |
@media only screen and (max-width: 768px) { | |
.item .header .title { | |
line-height: 1.4; | |
margin-bottom: 0.8em; | |
} | |
} | |
.item .header .tags { | |
margin-top: 1em; | |
font-size: 85%; | |
color: #bcbcbc; | |
text-align: center; | |
line-height: 1em; | |
text-transform: uppercase; | |
clear: both; | |
} | |
.item .header .tags a { | |
color: {color:Accent}; | |
opacity: 0.5; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; | |
filter: alpha(opacity=50); | |
} | |
.item .header .tags a:after { | |
content: " /"; | |
} | |
.item .header .tags a:last-child:after { | |
content: none; | |
} | |
.item .block_title { | |
margin-bottom: 10px; | |
font-weight: bold; | |
font-size: 25px; | |
} | |
.item.loaded { | |
visibility: visible; | |
} | |
.item.anim { | |
-webkit-transition-duration: 0.7s; | |
-moz-transition-duration: 0.7s; | |
-o-transition-duration: 0.7s; | |
-ms-transition-duration: 0.7s; | |
transition-duration: 0.7s; | |
} | |
.item.resize { | |
-webkit-transition-duration: 0s; | |
-moz-transition-duration: 0s; | |
-o-transition-duration: 0s; | |
-ms-transition-duration: 0s; | |
transition-duration: 0s; | |
} | |
.item.active { | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
-webkit-transform: translateY(0); | |
-moz-transform: translateY(0); | |
-o-transform: translateY(0); | |
-ms-transform: translateY(0); | |
transform: translateY(0); | |
} | |
.item.active .image img { | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
} | |
.item .image { | |
margin-bottom: 1.5em; | |
-webkit-box-sizing: border-box; | |
-moz-box-sizing: border-box; | |
box-sizing: border-box; | |
background: #f5f5f5; | |
} | |
.item .image a { | |
color: #ccc; | |
} | |
.item .image img { | |
width: 100%; | |
height: auto; | |
position: relative; | |
opacity: 0; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; | |
filter: alpha(opacity=0); | |
-webkit-transition-duration: 0.7s; | |
-moz-transition-duration: 0.7s; | |
-o-transition-duration: 0.7s; | |
-ms-transition-duration: 0.7s; | |
transition-duration: 0.7s; | |
-webkit-transition-delay: 0.4s; | |
-moz-transition-delay: 0.4s; | |
-o-transition-delay: 0.4s; | |
-ms-transition-delay: 0.4s; | |
transition-delay: 0.4s; | |
} | |
.item .photo.image:hover, | |
.item .video:hover { | |
opacity: 0.7; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; | |
filter: alpha(opacity=70); | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
.item img { | |
width: 100%; | |
height: auto; | |
} | |
.item.text { | |
text-align: justify; | |
} | |
.item.text p { | |
margin-bottom: 1.5em; | |
} | |
.item.text blockquote { | |
margin: 0; | |
} | |
.item.text code { | |
word-break: break-word; | |
font-size: 12px; | |
height: 200px; | |
display: block; | |
border: 1px solid #ccc; | |
overflow: scroll; | |
padding: 10px; | |
} | |
.item.link { | |
text-align: justify; | |
} | |
.item.link .description { | |
margin-bottom: 0.5em; | |
} | |
.item.link .host { | |
opacity: 0.1em; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10em)"; | |
filter: alpha(opacity=10em); | |
margin-bottom: 1.5em; | |
} | |
.item.quote .quote { | |
text-align: justify; | |
margin-bottom: 1.5em; | |
} | |
.item.quote.short { | |
font-size: 30px; | |
line-height: 1.4; | |
} | |
.item.quote.medium { | |
font-size: 20px; | |
line-height: 1.4; | |
} | |
.item.quote.long { | |
font-size: 14px; | |
line-height: 1.4; | |
} | |
.item.quote:before { | |
content: '"'; | |
font-size: 50px; | |
font-weight: bold; | |
line-height: 1; | |
position: absolute; | |
left: 0; | |
top: 0; | |
} | |
.item.quote .tags { | |
clear: both; | |
} | |
.item.audio .image { | |
margin-bottom: 0; | |
} | |
.item.audio.has_thumbnail .player iframe { | |
margin-top: -84px; | |
opacity: 0.9; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; | |
filter: alpha(opacity=90); | |
} | |
.item.audio .player { | |
margin-bottom: 2em; | |
background: rgba(0,0,0,0.15); | |
} | |
.item.audio .player iframe { | |
width: 100%; | |
height: 84px; | |
vertical-align: top; | |
} | |
.item.audio .data { | |
margin-bottom: 2em; | |
} | |
.item.audio .data li { | |
display: inline; | |
margin-right: 10px; | |
} | |
.item.audio .download { | |
margin-bottom: 2em; | |
float: right; | |
margin-left: 2em; | |
} | |
.item.audio .download .button { | |
background: #000; | |
padding: 1em 2em; | |
display: inline-block; | |
color: #fff; | |
} | |
.item.audio .caption { | |
text-align: justify; | |
} | |
.item.video .video { | |
text-align: center; | |
width: 100%; | |
position: relative; | |
margin-bottom: 1em; | |
z-index: 5; | |
position: relative; | |
height: auto; | |
} | |
.item.video .video img { | |
max-width: 100%; | |
} | |
.item.video .video .thumbnail { | |
color: #666; | |
text-decoration: none; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
position: relative; | |
z-index: 2; | |
cursor: pointer; | |
} | |
.item.video .video .thumbnail img { | |
width: 100%; | |
} | |
.item.video .video .thumbnail:after { | |
width: 100%; | |
content: "▶"; | |
position: absolute; | |
display: block; | |
color: rgba(255,255,255,0.7); | |
top: 50%; | |
font-size: 80px; | |
line-height: 80px; | |
margin-top: -40px; | |
z-index: 3; | |
cursor: pointer; | |
} | |
.item.video .video iframe { | |
position: absolute; | |
visibility: hidden; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
} | |
.item.video .video:hover:after { | |
color: #fff; | |
} | |
.item.chat .conversation { | |
background-color: #f9f9f9; | |
padding: 0 20px 20px; | |
margin-bottom: 10px; | |
} | |
.item.chat .conversation dt { | |
padding: 0; | |
margin: 0; | |
font-size: 14px; | |
white-space: nowrap; | |
text-align: left; | |
padding-right: 10px; | |
padding-top: 20px; | |
vertical-align: top; | |
float: left; | |
font-weight: bold; | |
} | |
.item.chat .conversation dd { | |
padding: 0; | |
margin: 0; | |
padding-top: 20px; | |
vertical-align: top; | |
} | |
.item.photoset .images:hover { | |
opacity: 0.7; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; | |
filter: alpha(opacity=70); | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
.item.photoset .item.photo .image:hover, | |
.item.photoset .item .video:hover { | |
opacity: 0.7; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; | |
filter: alpha(opacity=70); | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
} | |
.item .social { | |
position: absolute; | |
top: 10px; | |
right: 40px; | |
opacity: 0; | |
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; | |
filter: alpha(opacity=0); | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
background: rgba(255,255,255,0.5); | |
z-index: 10; | |
padding-right: 3px; | |
} | |
.item .social li { | |
float: left; | |
padding: 0 0 0 5px; | |
} | |
.item .social li.permalink { | |
padding: 2px 0 0 4px; | |
} | |
.item .social li.permalink a { | |
content: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFUAAABVCAYAAAA49ahaAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDY3IDc5LjE1Nzc0NywgMjAxNS8wMy8zMC0yMzo0MDo0MiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTUgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MjkwOUMyMDMyNTY4MTFFNUI1MjlERDZDQTdGNTUyOEUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MjkwOUMyMDQyNTY4MTFFNUI1MjlERDZDQTdGNTUyOEUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyOTA5QzIwMTI1NjgxMUU1QjUyOURENkNBN0Y1NTI4RSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyOTA5QzIwMjI1NjgxMUU1QjUyOURENkNBN0Y1NTI4RSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PlhCvMoAAAQISURBVHja7N2BjZ0wDADQ3KkLsAIrZAVW+Cv8G4GOQEegI3Aj0BH+jUBH4EagHymoFHGf2I6Nnd9IUa/Slc9/QLATQ19c+ubvvQx9aR/3/jv0rNo0TWzbvtx7e+/j/DkP+nDvzQbcPOq2U1sVoCZEnw9C8R/1bysCykTsYzgwT486g94SgK779ZlROUBNw1JROUHNwlJQJUBNwmJRJUHNwWJQzwA1BbuH+u0AtA8ZErTNGdR7+LkMyQE0Jm3Dnz9zSRSwZ+hXcee8vS7HMzb28qeA+oizLyvYGFRO0CxhY1AbxJcdEONuNrBHqBXiS94IkyJZwB6h9oKgFNjR4SIScVR/AigFdtAybfgItTkJlALbake9AS49rjMEA1tqRo39EtwTyq21s/UrVA8YxyQaBHbUiPoKuJylVkLfVvMGMem0mkhgaa9Ks783wEGsNKLG7rwXDGM+Lc9OQVAL4WzmI/L31NYQQLIpKux8cOpVGHcLfy92fi9mfzqtIVUtlH8/mgXbJhWXyH2ptaKWQhMbR1fEOq/vraNiMxoIbGw8PAL3pdKMWrrjAjMKbO3SLw6qDf7Xwf13ZAZ01hznuzPSuCaPPcOZ6jWeqdKwfULQTsMZCC2m4IDFjtt7Y2lpEZUL1ieAvWgZK7G1VFjYlgkWG5cWHOEXpeqPAruXflKqsGOXc5bnEIYH22moNztqfSoFog//vk80pj6CrRGfMWDDwhSV1Cnq/FP1Lax3+Ic61ge/lEbVCntNnKV5aVRtsIPjSX+9NKo22OksWI6H054elgOVA7ZNlCCIwHKhunCjGBPs/DVx5sUOy4m65PUpk4TUsLcQMg0pYblR17i1O67PWhb8juJCKmy38xneJaoYl0LdtmqnQ1tNOLuKxPeDf2DPQqU27/hSWjKsRdQiUXDPBmsRtXHp7uANQ2i4C6u5lS59aFRKwOa4AEldMcDCFhZQx5NQsbC9dlTIM12QFVrPfKVUmlFrAKiLnE/tBYagXjNqg7icqwdDBuWBNiis+XrZvUSh25lXoH5RCGydGypnEhI7V9BpfZDiExDLSu3PD2X7xHajkr7UJmVXEHjSW2PRr2lUSIoq9ah6YR3VOdgksgTsFbAvLochgBsWUgLaO+VtUAALfVlPrR0V816XlLCYtx95Z6A1J8FiQHsra1SUOU4sLHYF92IJVRIWC9pbWk2VhMWCmpn5l4algHpr6/4pYStuUMuoWNhlfvUSgC+E7Zhd9z9q2HeyJqsCzBH1jNc7Z1FLpQlWTdVfLrCn1qfmCHtaJXWusKfV/OcSboFfDf1MqC7EoJTa1sZFPFj8bKjLcHAF4C5vGopeZt5DfXHP03zIorZvslz+78H5NXi/oBvdOzP/CDAABNhtV8n9odwAAAAASUVORK5CYII="); | |
height: 18px; | |
vertical-align: top; | |
} | |
.item:hover .social { | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
} | |
.item .photo .social li, | |
.item .photoset .social li, | |
.item .chat .social li { | |
float: left; | |
padding: 5px 5px 0; | |
} | |
.page #content { | |
padding-top: 100px; | |
} | |
@media screen and (min-width: 768px) { | |
#content { | |
margin: 0 20% 0; | |
} | |
} | |
@media only screen and (max-width: 768px) { | |
#content { | |
margin: 0 30px 0; | |
} | |
} | |
#content .header { | |
margin-bottom: 55px; | |
} | |
#content .header .title { | |
font-size: 1.8em; | |
} | |
#content .body { | |
text-align: left; | |
} | |
#content .item { | |
width: 100%; | |
visibility: visible; | |
position: relative; | |
-webkit-transform: none; | |
-moz-transform: none; | |
-o-transform: none; | |
-ms-transform: none; | |
transform: none; | |
padding: 0; | |
} | |
#content .item .image { | |
background: none; | |
text-align: center; | |
} | |
#content .item .image img { | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
width: auto; | |
max-height: 800px; | |
} | |
#content .item.w2 { | |
width: 100%; | |
} | |
#content .item.grid-sizer { | |
width: 100%; | |
} | |
#content .social { | |
position: relative; | |
top: auto; | |
right: auto; | |
opacity: 1; | |
-ms-filter: none; | |
filter: none; | |
-webkit-transition-duration: 0.4s; | |
-moz-transition-duration: 0.4s; | |
-o-transition-duration: 0.4s; | |
-ms-transition-duration: 0.4s; | |
transition-duration: 0.4s; | |
background: rgba(255,255,255,0.5); | |
z-index: 10; | |
} | |
#content .social li { | |
float: left; | |
padding: 0 0 0 5px; | |
} | |
#content .video { | |
position: relative; | |
padding-bottom: 56.25%; | |
padding-top: 30px; | |
height: 0; | |
overflow: hidden; | |
margin-bottom: 2em; | |
} | |
#content .video iframe { | |
position: absolute; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
} | |
#content .single_title { | |
text-align: center; | |
font-size: 2.14em; | |
margin-bottom: 0.8em; | |
letter-spacing: 0.3em; | |
font-weight: 600; | |
line-height: 1.4em; | |
word-wrap: break-word; | |
} | |
@media only screen and (max-width: 768px) { | |
#content .single_title { | |
font-size: 1.4em; | |
margin-bottom: 0px; | |
letter-spacing: 0.1em; | |
line-height: 1.4; | |
margin-bottom: 2px; | |
} | |
} | |
#content .name { | |
text-align: center; | |
font-size: 1.28em; | |
letter-spacing: 0.7em; | |
font-weight: 100; | |
margin-bottom: 2.4em; | |
} | |
#content .tags { | |
text-align: center; | |
font-size: 1.14em; | |
color: #999; | |
letter-spacing: 0.2em; | |
line-height: 1.4; | |
text-transform: uppercase; | |
} | |
@media only screen and (max-width: 768px) { | |
#content .tags { | |
font-size: 1em; | |
letter-spacing: 0.15em; | |
} | |
} | |
#content .tags a { | |
color: #999; | |
} | |
#content address, | |
#content .permalink { | |
text-align: center; | |
font-size: 1.28em; | |
font-style: normal; | |
font-weight: 100; | |
margin-bottom: 2.4em; | |
line-height: 1; | |
} | |
#content .body { | |
line-height: 2.57em; | |
margin-bottom: 5em; | |
letter-spacing: 0.1em; | |
} | |
@media only screen and (max-width: 768px) { | |
#content .body { | |
text-align: left; | |
} | |
} | |
#content .body p { | |
margin-bottom: 1em; | |
} | |
#content .body img { | |
max-width: 100%; | |
height: auto; | |
} | |
#content .body h1 { | |
font-size: 20px; | |
margin-bottom: 20px; | |
} | |
#content .body h2 { | |
font-size: 18px; | |
margin-bottom: 20px; | |
} | |
#content .body h3 { | |
font-size: 16px; | |
margin-bottom: 20px; | |
} | |
#content .body h4 { | |
font-size: 14px; | |
margin-bottom: 20px; | |
} | |
#content .body h5 { | |
font-size: 12px; | |
margin-bottom: 20px; | |
} | |
#content .body h6 { | |
font-size: 10px; | |
margin-bottom: 20px; | |
} | |
#content .body p { | |
margin-bottom: 40px; | |
} | |
#content .body ul { | |
text-align: left; | |
list-style: disc; | |
margin-left: 2em; | |
margin-bottom: 40px; | |
} | |
#content .body ul { | |
text-align: left; | |
list-style: decimal; | |
margin-left: 2em; | |
margin-bottom: 40px; | |
} | |
#content .video { | |
padding-top: 0; | |
} | |
#content .video iframe { | |
position: absolute; | |
visibility: visible; | |
top: 0; | |
left: 0; | |
width: 100%; | |
height: 100%; | |
} | |
#content #post_data { | |
margin-top: 6em; | |
} | |
#content #post_data .caption, | |
#content #post_data .post_info { | |
margin-bottom: 2em; | |
} | |
#content #post_data .caption li, | |
#content #post_data .post_info li { | |
float: left; | |
margin-right: 1px; | |
} | |
#content #post_data .caption li a, | |
#content #post_data .post_info li a, | |
#content #post_data .caption li time, | |
#content #post_data .post_info li time { | |
color: {color:text}; | |
background: rgba(0,0,0,0.05); | |
padding: 8px; | |
display: block; | |
} | |
#content #post_data .caption li a:hover, | |
#content #post_data .post_info li a:hover { | |
background: rgba(0,0,0,0.1); | |
} | |
#content #post_data .caption:after, | |
#content #post_data .post_info:after { | |
content: ''; | |
clear: both; | |
display: block; | |
} | |
#content #post_data .post_notes li { | |
margin-bottom: 10px; | |
} | |
#content #post_data .post_notes li img { | |
width: 20px; | |
height: 20px; | |
margin-right: 10px; | |
} | |
.page #content .header { | |
margin-bottom: 80px; | |
} | |
.page #content .tags { | |
margin-bottom: 50px; | |
} | |
#related { | |
background: #f8f8f8; | |
padding-top: 90px; | |
} | |
@media only screen and (max-width: 768px) { | |
#related { | |
padding-top: 3em; | |
} | |
} | |
#related .related_title { | |
margin: 0 60px 60px; | |
font-size: 1.14em; | |
letter-spacing: 0.2em; | |
line-height: 1; | |
} | |
@media only screen and (max-width: 768px) { | |
#related .related_title { | |
margin-left: 30px; | |
font-size: 0.8em; | |
padding: 0; | |
padding-bottom: 30px; | |
margin-bottom: 3em; | |
line-height: 1; | |
} | |
} | |
.pagination { | |
clear: both; | |
display: table; | |
text-align: center; | |
width: 20%; | |
margin: 0 auto 40px; | |
} | |
.pagination li { | |
display: table-cell; | |
} | |
.pagination li a { | |
color: {color:text}; | |
font-size: 30px; | |
line-height: 1; | |
} | |
#footer { | |
padding: 100px 60px; | |
text-align: center; | |
font-size: 1.14em; | |
letter-spacing: 0.15em; | |
} | |
@media only screen and (max-width: 768px) { | |
#footer { | |
font-size: 1em; | |
} | |
} | |
#infscr-loading { | |
position: fixed; | |
left: 50%; | |
top: 50%; | |
width: 64px; | |
height: 64px; | |
margin-left: -32px; | |
margin-top: -32px; | |
z-index: 30; | |
-webkit-transition-duration: 0s; | |
-moz-transition-duration: 0s; | |
-o-transition-duration: 0s; | |
-ms-transition-duration: 0s; | |
transition-duration: 0s; | |
} | |
#infscr-loading img { | |
-webkit-transition-duration: 0s; | |
-moz-transition-duration: 0s; | |
-o-transition-duration: 0s; | |
-ms-transition-duration: 0s; | |
transition-duration: 0s; | |
} | |
</style> | |
{block:IfUseLatofont} | |
<style>#header #masthead .title, body{font-family: 'lato', sans-serif;}</style> | |
{/block:IfUseLatofont} | |
<script>var large_image_prob = {select:Large Images};</script> | |
<script src="//code.jquery.com/jquery-2.1.4.min.js"></script> | |
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js"></script> | |
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.imagesloaded/3.1.8/imagesloaded.pkgd.js"></script> | |
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery-mousewheel/3.1.12/jquery.mousewheel.min.js"></script> | |
<script src="//cdnjs.cloudflare.com/ajax/libs/masonry/3.3.1/masonry.pkgd.min.js"></script> | |
<script> | |
/* | |
* onScreen.js | |
* Checks if matched elements are inside the viewport. | |
* | |
* Copyright onScreen Contributors, 2013 Licensed under the MIT license: | |
* http://www.opensource.org/licenses/mit-license.php | |
* | |
* You can find a list of contributors at: | |
* https://github.com/silvestreh/onScreen/graphs/contributors | |
*/ | |
(function($) { | |
$.fn.onScreen = function(options) { | |
var params = $.extend({ | |
container: window, | |
direction: 'vertical', | |
toggleClass: null, | |
doIn: null, | |
doOut: null, | |
tolerance: 0, | |
throttle: null, | |
lazyAttr: null, | |
lazyPlaceholder: 'data:image/gif;base64,R0lGODlhEAAFAIAAAP///////yH/C05FVFNDQVBFMi4wAwEAAAAh+QQJCQAAACwAAAAAEAAFAAACCIyPqcvtD00BACH5BAkJAAIALAAAAAAQAAUAgfT29Pz6/P///wAAAAIQTGCiywKPmjxUNhjtMlWrAgAh+QQJCQAFACwAAAAAEAAFAIK8urzc2tzEwsS8vrzc3tz///8AAAAAAAADFEiyUf6wCEBHvLPemIHdTzCMDegkACH5BAkJAAYALAAAAAAQAAUAgoSChLS2tIyKjLy+vIyOjMTCxP///wAAAAMUWCQ09jAaAiqQmFosdeXRUAkBCCUAIfkECQkACAAsAAAAABAABQCDvLq83N7c3Nrc9Pb0xMLE/P78vL68/Pr8////AAAAAAAAAAAAAAAAAAAAAAAAAAAABCEwkCnKGbegvQn4RjGMx8F1HxBi5Il4oEiap2DcVYlpZwQAIfkECQkACAAsAAAAABAABQCDvLq85OLkxMLE9Pb0vL685ObkxMbE/Pr8////AAAAAAAAAAAAAAAAAAAAAAAAAAAABCDwnCGHEcIMxPn4VAGMQNBx0zQEZHkiYNiap5RaBKG9EQAh+QQJCQAJACwAAAAAEAAFAIOEgoTMysyMjozs6uyUlpSMiozMzsyUkpTs7uz///8AAAAAAAAAAAAAAAAAAAAAAAAEGTBJiYgoBM09DfhAwHEeKI4dGKLTIHzCwEUAIfkECQkACAAsAAAAABAABQCDvLq85OLkxMLE9Pb0vL685ObkxMbE/Pr8////AAAAAAAAAAAAAAAAAAAAAAAAAAAABCAQSTmMEGaco8+UBSACwWBqHxKOJYd+q1iaXFoRRMbtEQAh+QQJCQAIACwAAAAAEAAFAIO8urzc3tzc2tz09vTEwsT8/vy8vrz8+vz///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAEIhBJWc6wJZAtJh3gcRBAaXiIZV2kiRbgNZbA6VXiUAhGL0QAIfkECQkABgAsAAAAABAABQCChIKEtLa0jIqMvL68jI6MxMLE////AAAAAxRoumxFgoxGCbiANos145e3DJcQJAAh+QQJCQAFACwAAAAAEAAFAIK8urzc2tzEwsS8vrzc3tz///8AAAAAAAADFFi6XCQwtCmAHbPVm9kGWKcEQxkkACH5BAkJAAIALAAAAAAQAAUAgfT29Pz6/P///wAAAAIRlI8SAZsPYnuJMUCRnNksWwAAOw==', | |
debug: false | |
}, options); | |
return this.each(function() { | |
var isOnScreen = false; // Initialize boolean | |
var scrollTop; // Initialize Vertical Scroll Position | |
var scrollLeft; // Initialize Horizontal Scroll Position | |
var $el = $(this); // Matched element | |
// Initialize Viewport dimensions | |
var $container; | |
var containerHeight; | |
var containerWidth; | |
var containerBottom; | |
var containerRight; | |
// Initialize element dimensions & position | |
var elHeight; | |
var elWidth; | |
var elTop; | |
var elLeft; | |
// Checks if params.container is the Window Object | |
var containerIsWindow = $.isWindow(params.container); | |
function verticalIn() { | |
if (containerIsWindow) { | |
return elTop < containerBottom - params.tolerance && | |
scrollTop < (elTop + elHeight) - params.tolerance; | |
} else { | |
return elTop < containerHeight - params.tolerance && | |
elTop > (-elHeight) + params.tolerance; | |
} | |
} | |
function verticalOut() { | |
if (containerIsWindow) { | |
return elTop + (elHeight - params.tolerance) < scrollTop || | |
elTop > containerBottom - params.tolerance; | |
} else { | |
return elTop > containerHeight - params.tolerance || | |
-elHeight + params.tolerance > elTop; | |
} | |
} | |
function horizontalIn() { | |
if (containerIsWindow) { | |
return elLeft < containerRight - params.tolerance && | |
scrollLeft < (elLeft + elWidth) - params.tolerance; | |
} else { | |
return elLeft < containerWidth - params.tolerance && | |
elLeft > (-elWidth) + params.tolerance; | |
} | |
} | |
function horizontalOut() { | |
if (containerIsWindow) { | |
return elLeft + (elWidth - params.tolerance) < scrollLeft || | |
elLeft > containerRight - params.tolerance; | |
} else { | |
return elLeft > containerWidth - params.tolerance || | |
-elWidth + params.tolerance > elLeft; | |
} | |
} | |
function directionIn() { | |
if (isOnScreen) { | |
return false; | |
} | |
if (params.direction === 'horizontal') { | |
return horizontalIn(); | |
} else { | |
return verticalIn(); | |
} | |
} | |
function directionOut() { | |
if (!isOnScreen) { | |
return false; | |
} | |
if (params.direction === 'horizontal') { | |
return horizontalOut(); | |
} else { | |
return verticalOut(); | |
} | |
} | |
function throttle(fn, timeout, ctx) { | |
var timer, args, needInvoke; | |
return function() { | |
args = arguments; | |
needInvoke = true; | |
ctx = ctx || this; | |
if(!timer) { | |
(function() { | |
if(needInvoke) { | |
fn.apply(ctx, args); | |
needInvoke = false; | |
timer = setTimeout(arguments.callee, timeout); | |
} | |
else { | |
timer = null; | |
} | |
})(); | |
} | |
}; | |
} | |
var checkPos = function(){ | |
// Make container relative | |
if (!containerIsWindow && $(params.container).css('position') === 'static') { | |
$(params.container).css('position', 'relative'); | |
} | |
// Update Viewport dimensions | |
$container = $(params.container); | |
containerHeight = $container.height(); | |
containerWidth = $container.width(); | |
containerBottom = $container.scrollTop() + containerHeight; | |
containerRight = $container.scrollLeft() + containerWidth; | |
// Update element dimensions & position | |
elHeight = $el.outerHeight(true); | |
elWidth = $el.outerWidth(true); | |
if (containerIsWindow) { | |
var offset = $el.offset(); | |
elTop = offset.top; | |
elLeft = offset.left; | |
} else { | |
var position = $el.position(); | |
elTop = position.top; | |
elLeft = position.left; | |
} | |
// Update scroll position | |
scrollTop = $container.scrollTop(); | |
scrollLeft = $container.scrollLeft(); | |
// This will spam A LOT of messages in your console | |
if (params.debug) { | |
console.log( | |
'Container: ' + params.container + ' | |
' + | |
'Width: ' + containerHeight + ' | |
' + | |
'Height: ' + containerWidth + ' | |
' + | |
'Bottom: ' + containerBottom + ' | |
' + | |
'Right: ' + containerRight | |
); | |
console.log( | |
'Matched element: ' + ($el.attr('class') !== undefined ? $el.prop('tagName').toLowerCase() + '.' + $el.attr('class') : $el.prop('tagName').toLowerCase()) + ' | |
' + | |
'Left: ' + elLeft + ' | |
' + | |
'Top: ' + elTop + ' | |
' + | |
'Width: ' + elWidth + ' | |
' + | |
'Height: ' + elHeight | |
); | |
} | |
if (directionIn()) { | |
if (params.toggleClass) { | |
$el.addClass(params.toggleClass); | |
} | |
if ($.isFunction(params.doIn)) { | |
params.doIn.call($el[0]); | |
} | |
if (params.lazyAttr && $el.prop('tagName') === 'IMG') { | |
var lazyImg = $el.attr(params.lazyAttr); | |
if (lazyImg !== $el.prop('src')) { | |
$el.css({ | |
background: 'url(' + params.lazyPlaceholder + ') 50% 50% no-repeat', | |
minHeight: '5px', | |
minWidth: '16px' | |
}); | |
$el.prop('src',lazyImg).load(function() { | |
$(this).css({ | |
background: 'none' | |
}); | |
}); | |
} | |
} | |
isOnScreen = true; | |
} | |
else if (directionOut()) { | |
if (params.toggleClass) { | |
$el.removeClass(params.toggleClass); | |
} | |
if ($.isFunction(params.doOut)) { | |
params.doOut.call($el[0]); | |
} | |
isOnScreen = false; | |
} | |
}; | |
if (window.location.hash) { | |
throttle(checkPos, 50); | |
} else { | |
checkPos(); | |
} | |
if (params.throttle) { | |
checkPos = throttle(checkPos, params.throttle); | |
} | |
// Attach checkPos | |
$(params.container).on('scroll resize', checkPos); | |
// Since <div>s don't have a resize event, we have | |
// to attach checkPos to the window object as well | |
if (!containerIsWindow) { | |
$(window).on('resize', checkPos); | |
} | |
// Module support | |
if (typeof module === 'object' && module && typeof module.exports === 'object') { | |
// Node.js module pattern | |
module.exports = jQuery; | |
} else { | |
// AMD | |
if (typeof define === 'function' && define.amd) { | |
define('jquery-onscreen', [], function() { return jQuery; }); | |
} | |
} | |
}); | |
}; | |
})(jQuery); | |
</script> | |
<script> | |
var AKKKI = function(){}; | |
$(function(){ | |
// TRUE = SP | |
// FALSE = PC | |
// WINDOW OBSERVER CLASS | |
function Obsrv(){ | |
console.log('AKKKI Obsrv') | |
this.breakpoint = 768; | |
this.status = $(window).width() > this.breakpoint; | |
} | |
// CONSTRUCTOR | |
Obsrv.prototype.set = function(v){ | |
console.log('AKKKI set') | |
var st = v > this.breakpoint; | |
if(st !== this.status){ | |
if(this.status){ | |
$('#list article').addClass('resize'); | |
msnry.destroy(); | |
}else{ | |
$('#list article').addClass('resize'); | |
activateMasonry(); | |
} | |
} | |
this.status = st; | |
} | |
var obsv = new Obsrv(); | |
$(window).resize(function(){ | |
obsv.set( $(this).width() ) | |
}) | |
$(window).mousewheel(function(){ | |
if($(window).scrollTop() > 1){ | |
$('#header').addClass('scrolled'); | |
}else{ | |
$('#header').removeClass('scrolled'); | |
} | |
}) | |
var msnry; | |
function activateMasonry(){ | |
console.log('AKKKI activateMasonry') | |
msnry = new Masonry(document.querySelector('#list'), { | |
"columnWidth": ".grid-sizer", | |
"itemSelector": ".item", | |
"transitionDuration": 0 | |
}); | |
msnry.on( 'layoutComplete', function( msnryInstance, laidOutItems ){ | |
$('#list article').removeClass('resize'); | |
}); | |
bindOnscreen(); | |
} | |
function bindOnscreen(){ | |
console.log('AKKKI bindOnscreen') | |
// onscreen | |
$('#list article').onScreen({ | |
direction: 'vertical', | |
doIn: function() { | |
$('.image img', this).css('visibility', 'visible'); | |
}, | |
doOut: function() { | |
$('.image img', this).css('visibility', 'hidden'); | |
}, | |
tolerance: -10, | |
throttle: 10, | |
toggleClass: 'active', | |
lazyAttr: null, | |
lazyPlaceholder: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6REIyOTYyMDdBNEQxMTFFNEE1NDM5QTgzQ0E2MjA5ODUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6REIyOTYyMDhBNEQxMTFFNEE1NDM5QTgzQ0E2MjA5ODUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEQjI5NjIwNUE0RDExMUU0QTU0MzlBODNDQTYyMDk4NSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEQjI5NjIwNkE0RDExMUU0QTU0MzlBODNDQTYyMDk4NSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv/aBbYAAAAPSURBVHjaYvj69StAgAEABcIC4G3ph48AAAAASUVORK5CYII=', | |
debug: false | |
}); | |
} | |
AKKKI.classify = function(){ | |
console.log('AKKKI classify') | |
$('#list .item').not('.pos_fix').each(function(i){ | |
if(Math.random() < large_image_prob && $(this).hasClass('photo')){ | |
$(this).removeClass('grid-sizer'); | |
$(this).addClass('w2') | |
$(this).addClass('pos_fix') | |
}else{ | |
$(this).addClass('pos_fix') | |
} | |
}) | |
} | |
AKKKI.append = function(first){ | |
console.log('AKKKI append') | |
// if($('#list').length === 0) return false; | |
function promise(){ | |
var dfd = $.Deferred(); | |
dfd.then(function(){ | |
AKKKI.classify(); | |
}).then(function(){ | |
activateMasonry(); | |
}).then(function(){ | |
$('#list .item').each(function(){ | |
$(this).addClass('anim').addClass('loaded') | |
}) | |
}); | |
dfd.resolve(); | |
} | |
if(first) promise(); | |
imagesLoaded( | |
document.querySelector('#list'), function () { | |
promise(); | |
} | |
); | |
} | |
if($('#list').length !== 0){ | |
AKKKI.append(); | |
} | |
// MENU | |
$('#bind_header_button').click(function(){ | |
$('#header').toggleClass('active') | |
}); | |
$('#header').mouseleave(function(e){ | |
e.preventDefault(); | |
$('#header').removeClass('active') | |
}); | |
$('#bind_header_menuarea').click(function(e){ | |
// e.preventDefault(); | |
$('#header').removeClass('active') | |
}); | |
$('.thumbnail').click(function(){ | |
$(this).parent().find('iframe').css({ | |
"visibility": "visible" | |
}) | |
$(this).css({ | |
"z-index": 0, | |
"visibility": "hidden" | |
}) | |
}) | |
}) | |
// callback function | |
jQuery.fn.extend({ | |
infinite_append: function() { | |
console.log('AKKKI infinite_append') | |
AKKKI.append(); | |
} | |
}); | |
</script> | |
<title> | |
{Title} | |
{block:SearchPage} | |
({lang:Search results for SearchQuery}) | |
{/block:SearchPage} | |
{block:PermalinkPage} | |
{block:PostSummary} | |
— | |
{PostSummary} | |
{/block:PostSummary} | |
{/block:PermalinkPage} | |
</title> | |
<meta charset="utf-8"> | |
<meta name="description" content="{block:IndexPage}{block:Description}{MetaDescription}{/block:Description}{/block:IndexPage}{block:PermalinkPage}{block:PostSummary}{PostSummary}{/block:PostSummary}{/block:PermalinkPage}" /> | |
<link rel="shortcut icon" href="{Favicon}" /> | |
<link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/> | |
<!-- HTML5 Shiv --> | |
<!--[if lt IE 9]> | |
<script src="http://static.tumblr.com/hriofhd/Qj0m8pn7q/html5shiv.js"></script> | |
<![endif]--> | |
<!-- Custom CSS --> | |
<style type="text/css" media="screen"> | |
{CustomCSS} | |
</style> | |
{block:IndexPage} | |
<meta property="og:url" content="{BlogURL}" /> | |
{/block:IndexPage} | |
{block:PermalinkPage} | |
<meta property="og:url" content="{Permalink}" /> | |
{/block:PermalinkPage} | |
{block:IndexPage} | |
<meta property="og:url" content="{BlogURL}" /> | |
{/block:IndexPage} | |
</head> | |
<body class=" | |
{block:IndexPage} home{/block:IndexPage} | |
{block:PermalinkPage} single{/block:PermalinkPage} | |
"> | |
<header id="header"> | |
<section id="masthead"> | |
<h1 class="title"><a href="/">{Title}</a></h1> | |
<div class="button" id="bind_header_button"></div> | |
</section> | |
<nav id="menu"> | |
<div class="dropdown" id="bind_header_menuarea"> | |
<div class="menu-header-container"> | |
<ul id="menu-header" class="menu"> | |
{block:HasPages} | |
{block:Pages} | |
<li><a href="{URL}">{Label}</a></li> | |
{/block:Pages} | |
{/block:HasPages} | |
<li><a href="{RSS}" class="rss">RSS</a></li> | |
<li><a href="/archive">ARCHIVE</a></li> | |
{block:AskEnabled} | |
<li><a href="/ask" class="ask">ASK ME ANYTHING</a></li> | |
{/block:AskEnabled} | |
{block:SubmissionsEnabled} | |
<li><a href="/submit" class="submit">SUBMIT A POST</a></li> | |
{/block:SubmissionsEnabled} | |
</ul> | |
</div> | |
</div> | |
</nav> | |
</header> | |
<section id="container"> | |
{block:IndexPage} | |
{block:IfShowBlogDescription} | |
<aside id="aside"> | |
{block:Description} | |
<div class="description">{Description}</div> | |
{/block:Description} | |
</aside> | |
{/block:IfShowBlogDescription} | |
{/block:IndexPage} | |
{block:PermalinkPage} | |
<main id="content"> | |
{/block:PermalinkPage} | |
{block:IndexPage} | |
<section id="list" class="autoload"> | |
{/block:IndexPage} | |
<!-- _/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/_/ --> | |
<!-- START POSTS --> | |
{block:Posts} | |
<article class="item post group | |
{block:Photo} photo{/block:Photo} | |
{block:Photoset} photoset{/block:Photoset} | |
{block:Link} link{/block:Link} | |
{block:Audio} audio{block:AlbumArt} has_thumbnail{/block:AlbumArt}{/block:Audio} | |
{block:Video} video{/block:Video} | |
{block:Text} text{/block:Text} | |
{block:Answer} answer{/block:Answer} | |
{block:Quote} quote{/block:Quote} | |
{block:Chat} chat{/block:Chat} | |
grid-sizer"> | |
{block:Text} | |
<header class="header"> | |
{block:Title} | |
<h2 class="title"><a href="{Permalink}">{Title}</a></h2> | |
{/block:Title} | |
{block:IfShowTags} | |
{block:HasTags} | |
<p class="tags"> | |
{block:Tags} | |
<a href="{TagURL}">{Tag}</a> | |
{/block:Tags} | |
</p> | |
{/block:HasTags} | |
{/block:IfShowTags} | |
</header> | |
<div class="body">{Body}</div> | |
{/block:Text} | |
{block:Photo} | |
<div class="image"> | |
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}">{LinkCloseTag} | |
</div> | |
<header class="header"> | |
{block:IfShowTags} | |
{block:HasTags} | |
<p class="tags"> | |
{block:Tags} | |
<a href="{TagURL}">{Tag}</a> | |
{/block:Tags} | |
</p> | |
{/block:HasTags} | |
{/block:IfShowTags} | |
</header> | |
{block:Caption} | |
<div class="caption">{Caption}</div> | |
{/block:Caption} | |
{/block:Photo} | |
{block:Photoset} | |
<div class="images"> | |
{block:Photos} | |
<div class="image"> | |
{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}">{LinkCloseTag} | |
</div> | |
{/block:Photos} | |
{block:Caption} | |
<div class="caption">{Caption}</div> | |
{/block:Caption} | |
</div> | |
{/block:Photoset} | |
{block:Answer} | |
{Question} | |
<img src="{AskerPortraitURL-24}" width="24" height="24" /> {Asker} | |
{Answer} | |
{/block:Answer} | |
{block:Quote} | |
<section class="quote {Length}">{Quote}</section> | |
{/block:Quote} | |
{block:Link} | |
{block:Thumbnail} | |
<div class="image"><a href="{URL}" class="link"><img src="{Thumbnail}"></a></div> | |
{/block:Thumbnail} | |
<header class="header"> | |
<h2 class="title"><a href="{URL}" class="link">{Name}</a></h2> | |
{block:IfShowTags} | |
{block:HasTags} | |
<p class="tags"> | |
{block:Tags} | |
<a href="{TagURL}">{Tag}</a> | |
{/block:Tags} | |
</p> | |
{/block:HasTags} | |
{/block:IfShowTags} | |
</header> | |
{block:Description} | |
<div class="description">{Description}</div> | |
{/block:Description} | |
{block:Host} | |
<p class="host">{Host}</p> | |
{/block:Host} | |
{/block:Link} | |
{block:Chat} | |
{block:Title} | |
<h2 class="block_title"><a href="{Permalink}">{Title}</a></h2> | |
{/block:Title} | |
<dl class="conversation"> | |
{block:Lines} | |
{block:Label} | |
<dt>{Label}</dt> | |
{/block:Label} | |
<dd>{Line}</dd> | |
{/block:Lines} | |
</dl> | |
{/block:Chat} | |
{block:Audio} | |
{block:AlbumArt} | |
<div class="image"><img src="{AlbumArtURL}"></div> | |
{/block:AlbumArt} | |
<div class="player"> | |
{block:AudioPlayer} | |
{AudioPlayerGrey} | |
{/block:AudioPlayer} | |
</div> | |
<header class="header"> | |
{block:TrackName} | |
<h2 class="title"><a href="{Permalink}">{TrackName}</a></h2> | |
{/block:TrackName} | |
{block:IfShowTags} | |
{block:HasTags} | |
<p class="tags"> | |
{block:Tags} | |
<a href="{TagURL}">{Tag}</a> | |
{/block:Tags} | |
</p> | |
{/block:HasTags} | |
{/block:IfShowTags} | |
</header> | |
{block:PlayCount} | |
<div class="count">{PlayCountWithLabel}</div> | |
{/block:PlayCount} | |
<ul class="data"> | |
{block:Artist} | |
<li class="artist"> | |
ARTIST/ {Artist} | |
</li> | |
{/block:Artist} | |
{block:Album} | |
<li class="album_title"> | |
FROM/ {Album} | |
</li> | |
{/block:Album} | |
</ul> | |
{block:ExternalAudio} | |
<div class="download"><a href="{ExternalAudioURL}" class="button">DOWNLOAD</a></div> | |
{/block:ExternalAudio} | |
{block:Caption} | |
<div class="caption">{Caption}</div> | |
{/block:Caption} | |
{/block:Audio} | |
{block:Video} | |
<div class="video"> | |
{block:PermalinkPage} | |
{Video-400} | |
{/block:PermalinkPage} | |
{block:IndexPage} | |
{block:VideoThumbnail} | |
<div class="thumbnail"><img src="{VideoThumbnailURL}"></div> | |
{VideoEmbed-400} | |
{/block:VideoThumbnail} | |
{/block:IndexPage} | |
</div> | |
{block:Caption} | |
<div class="caption">{Caption}</div> | |
{/block:Caption} | |
{/block:Video} | |
{block:IndexPage} | |
<ul class="social group"> | |
<li class="permalink"><a href="{Permalink}">»</a></li> | |
<li>{ReblogButton size="21" color="black"}</li> | |
<li>{LikeButton size="21" color="black"}</li> | |
</ul> | |
{/block:IndexPage} | |
<div id="post_data"> | |
{block:PermalinkPage} | |
<ul class="post_info"> | |
{block:Date} | |
<li> | |
<time> | |
{DayOfMonth}, | |
{Year} | |
{12Hour}:{Minutes} | |
{AmPm} | |
</time> | |
</li> | |
{/block:Date} | |
{block:NoteCount} | |
<li><a class="notecount" href="{Permalink}#notes">{NoteCount} notes</a></li> | |
{/block:NoteCount} | |
{block:ContentSource} | |
<li> | |
<a href="{SourceURL}"> | |
via. {lang:Source}: | |
{SourceTitle} | |
</a> | |
</li> | |
{/block:ContentSource} | |
</ul> | |
{/block:PermalinkPage} | |
{block:IfShowpostnotes} | |
{block:PostNotes} | |
<section class="post_notes"> | |
{PostNotes} | |
</section> | |
{/block:PostNotes} | |
{/block:IfShowpostnotes} | |
</div> | |
</article> | |
{/block:Posts} | |
<!-- END POSTS --> | |
{block:PermalinkPage} | |
<div id="disqus_thread"></div> | |
<script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script> | |
<noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">View the discussion thread.</a></noscript> | |
{/block:PermalinkPage} | |
{block:PermalinkPage} | |
</main> | |
{/block:PermalinkPage} | |
{block:IndexPage} | |
</section> | |
{/block:IndexPage} | |
{block:IfDisqusShortname} | |
<script type="text/javascript"> | |
//<![CDATA[ | |
(function() { | |
var links = document.getElementsByTagName('a'); | |
var query = '?'; | |
for(var i = 0; i < links.length; i++) { | |
if(links[i].href.indexOf('#disqus_thread') >= 0) { | |
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&'; | |
} | |
} | |
document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>'); | |
})(); | |
//]]> | |
</script> | |
{/block:IfDisqusShortname} | |
<footer id="footer"> | |
{block:Pagination} | |
<ul class="pagination"> | |
<li>{block:PreviousPage}<a href="{PreviousPage}" class="left">«</a>{/block:PreviousPage}</li> | |
<li>{CurrentPage}/{TotalPages}</li> | |
<li>{block:NextPage}<a href="{NextPage}" class="right">»</a>{/block:NextPage}</li> | |
</ul> | |
{/block:Pagination} | |
<section class="copyright"> | |
© {CopyrightYears} {Title} | |
<a href="http://akitayoshiko.com/">AKKKI Theme</a> by <a href="http://akitayoshiko.com/">AKITA YOSHIKO</a> | |
</section> | |
</footer> | |
</section> | |
{block:IfUseEndlessScrolling} | |
<script type="text/javascript"> | |
var Tumblelog = {}; | |
// AJAX | |
Tumblelog.Ajax = (function(url, callbackFunction) { | |
this.bindFunction = function (caller, object) { | |
console.log('bindFunction') | |
return function() { | |
return caller.apply(object, [object]); | |
}; | |
}; | |
this.stateChange = function (object) { | |
console.log('stateChange') | |
if (this.request.readyState==4) this.callbackFunction(this.request.responseText); | |
}; | |
this.getRequest = function() { | |
console.log('getRequest') | |
if (window.ActiveXObject) | |
return new ActiveXObject('Microsoft.XMLHTTP'); | |
else if (window.XMLHttpRequest) | |
return new XMLHttpRequest(); | |
return false; | |
}; | |
this.postBody = (arguments[2] || ""); | |
this.callbackFunction=callbackFunction; | |
this.url=url; | |
this.request = this.getRequest(); | |
if(this.request) { | |
var req = this.request; | |
req.onreadystatechange = this.bindFunction(this.stateChange, this); | |
if (this.postBody!=="") { | |
req.open("POST", url, true); | |
req.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); | |
req.setRequestHeader('Content-type', 'application/x-www-form-urlencoded'); | |
req.setRequestHeader('Connection', 'close'); | |
} else { | |
req.open("GET", url, true); | |
} | |
req.send(this.postBody); | |
} | |
}); | |
// Infinite Scroll | |
Tumblelog.Infinite = (function() { | |
var _$window = $(window); | |
var _$posts = $('#list'); | |
var _trigger_post = null; | |
var _current_page = {CurrentPage}; | |
var _total_pages = {TotalPages}; | |
var _url = document.location.href.split("#")[0]; | |
var _infinite_timeout = null; | |
var _is_loading = false; | |
var _posts_loaded = false; | |
var _Ajax = Tumblelog.Ajax; | |
function init() { | |
console.log('init') | |
set_trigger(); | |
enable_scroll(); | |
} | |
function set_trigger () { | |
console.log('set_trigger') | |
var $all_posts = _$posts.find('article.item'); | |
if (!_posts_loaded) { | |
_posts_loaded = $all_posts.length; | |
} | |
if (_posts_loaded >= 4) { | |
_trigger_post = _$posts.find('article.item:eq(' + ($all_posts.length - 4) + ')').get(0); | |
} else if (_posts_loaded >= 3) { | |
_trigger_post = _$posts.find('article.item:eq(' + ($all_posts.length - 3) + ')').get(0); | |
} else { | |
_trigger_post = _$posts.find('article.item:last').get(0); | |
} | |
}; | |
function in_viewport (el) { | |
if (el == null) return; | |
var top = el.offsetTop; | |
var height = el.offsetHeight; | |
while (el.offsetParent) { | |
el = el.offsetParent; | |
top += el.offsetTop; | |
} | |
return (top < (window.pageYOffset + window.innerHeight)); | |
}; | |
function enable_scroll() { | |
console.log('enable_scroll'); | |
$('#footer .pagination').hide(); | |
_$window.scroll(function(){ | |
clearTimeout(_infinite_timeout); | |
infinite_timeout = setTimeout(infinite_scroll, 100); | |
}); | |
} | |
function disable_scroll() { | |
console.log('disable_scroll'); | |
clearTimeout(_infinite_timeout); | |
$(window).unbind('scroll'); | |
} | |
function infinite_scroll() { | |
console.log('infinite_scroll'); | |
if (_is_loading) return; | |
if (in_viewport(_trigger_post)) { | |
load_more_posts(); // w00t | |
} | |
}; | |
function load_more_posts() { | |
console.log('load_more_posts'); | |
if (_is_loading) return; | |
_is_loading = true; | |
// Build URL | |
if (_url.charAt(_url.length - 1) != '/') _url += '/'; | |
if (_current_page === 1) _url += 'page/1'; | |
_current_page++; | |
_url = _url.replace('page/' + (_current_page - 1), 'page/' + _current_page); | |
// Fetch | |
_Ajax(_url, function(data) { | |
var new_posts_html = data.split('<!-- START' + ' POSTS -->')[1].split('<!-- END' + ' POSTS -->')[0]; | |
var $new_posts = $('#list', data); | |
// Insert posts and update counters | |
$('#list').append(new_posts_html); | |
console.log('append new posts'); | |
// console.log(new_posts_html) | |
_posts_loaded = $new_posts.find('article.item').length; | |
console.log('_posts_loaded = ' + _posts_loaded) | |
if (_posts_loaded) { | |
AKKKI.append(); | |
var post_ids = []; | |
var like_buttons = $('#list', data).find('.like_button'); | |
for (var i = 0; i < like_buttons.length; i++) { | |
var button = like_buttons[i]; | |
if ($(button).attr('data-post-id')) { | |
post_ids.push($(button).attr('data-post-id')); | |
} | |
} | |
if (post_ids.length > 0) Tumblr.LikeButton.get_status_by_post_ids(post_ids); | |
} | |
if ((_posts_loaded > 0) && (_current_page < _total_pages)) { | |
set_trigger(); | |
_is_loading = false; | |
} else { | |
disable_scroll(); | |
} | |
}); | |
// Stats | |
{block:IfGoogleAnalyticsID} | |
if (typeof window._gaq != 'undefined') { | |
_gaq.push(['_trackPageview', _url]); | |
} | |
{/block:IfGoogleAnalyticsID} | |
} | |
return { | |
init: init | |
}; | |
}); | |
$(function() { | |
{block:IndexPage} | |
var InfiniteScroll = new Tumblelog.Infinite; | |
InfiniteScroll.init(); | |
{/block:IndexPage} | |
}); | |
</script> | |
{/block:IfUseEndlessScrolling} | |
{block:Twitter} | |
<script type="text/javascript" src="/tweets.js"></script> | |
{/block:Twitter} | |
{block:IfGoogleAnalyticsID} | |
<script type="text/javascript"> | |
var _gaq=[['_setAccount','{text:Google Analytics ID}'],['_trackPageview']]; | |
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; | |
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; | |
s.parentNode.insertBefore(g,s)}(document,'script')); | |
</script> | |
{/block:IfGoogleAnalyticsID} | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment