nishiki/hugo-theme-relearn
1
0
Fork 0
mirror of https://github.com/McShelby/hugo-theme-relearn.git synced 2024-11-22 23:37:53 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

feat: implemented functionnalities on Markdown images: 1. featherlight for full size view in popup 2. Height/Width customizables 3. Possibility to add css classes

Browse source
This commit is contained in:
Mathieu Cornic 2016-03-17 17:48:18 +01:00
parent 0495785eda
commit 2b88eae74b
8 changed files with 76 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
layouts/partials/footer.html
View file

@ -6,7 +6,7 @@
</div>
<div id="navigation">
{{ with .Params.prev }}<a class="nav nav-prev" href="{{ . }}"> <i class="fa fa-chevron-left"></i></a>{{ end }}
{{ with .Params.prev }}<a class="nav nav-prev" href="{{ . }}"> <i class="fa fa-chevron-left"></i></a>{{ end }}
{{ with .Params.next }}<a class="nav nav-next" href="{{ . }}" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>{{ end }}
</div>
@ -24,5 +24,6 @@
<script>hljs.initHighlightingOnLoad();</script>
<script src="/js/modernizr.custom.71422.js"></script>
<script src="/js/learn.js"></script>
<script src="/js/hugo-learn.js"></script>
</body>
</html>

11
layouts/partials/header.html
View file

@ -10,19 +10,14 @@
{{ .Scratch.Add "title" "" }}{{ if isset .Site.Data.titles .Title }}{{ .Scratch.Set "title" (index .Site.Data.titles .Title).title }}{{ else }}{{ .Scratch.Set "title" .Title}}{{end}}
<title>Hugo - {{ .Scratch.Get "title" }}</title>
<link href="/css/nucleus.css" rel="stylesheet">
<link href="/css/theme.css" rel="stylesheet">
<link href="/css/font-awesome.min.css" rel="stylesheet">
<link href="/css/hybrid.css" rel="stylesheet">
<link href="/css/featherlight.min.css" rel="stylesheet">
<link href="/css/theme.css" rel="stylesheet">
<style type="text/css">:root #header + #content > #left > #rlblock_left
{display:none !important;}</style>
</head>
<body>
<!------->
<body class="searchbox-hidden " data-url="/">
<body class="" data-url="/">
{{ partial "menu.html" . }}

4
layouts/partials/menu.html
View file

@ -2,11 +2,13 @@
<div id="header-wrapper">
<div id="header">
{{ partial "logo.html" . }}
{{ if .Site.Params.search }}
<div class="searchbox">
<label for="search-by"><i class="fa fa-search"></i></label>
<input id="search-by" type="text" placeholder="Search Documentation" data-search-input="/search.json/query">
<input id="search-by" type="text" placeholder="Search Documentation" data-search-input="/lunr.json/query">
<span data-search-clear=""><i class="fa fa-close"></i></span>
</div>
{{ end }}
</div>
</div>

1
layouts/shortcodes/warn.html Normal file
View file

@ -0,0 +1 @@
<div class="notices warning">{{ .Inner }}</div>

8
static/css/featherlight.min.css vendored Normal file
View file

@ -0,0 +1,8 @@
/**
* Featherlight - ultra slim jQuery lightbox
* Version 1.2.3 - http://noelboss.github.io/featherlight/
*
* Copyright 2015, Noël Raoul Bossart (http://www.noelboss.com)
* MIT Licensed.
**/
@media all{.featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:2147483647;text-align:center;white-space:nowrap;cursor:pointer;background:#333;background:rgba(0,0,0,0)}.featherlight:last-of-type{background:rgba(0,0,0,.8)}.featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle;margin-right:-.25em}.featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:25px 25px 0;border-bottom:25px solid transparent;min-width:30%;margin-left:5%;margin-right:5%;max-height:95%;background:#fff;cursor:auto;white-space:normal}.featherlight .featherlight-inner{display:block}.featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:0;right:0;line-height:25px;width:25px;cursor:pointer;text-align:center;font:Arial,sans-serif;background:#fff;background:rgba(255,255,255,.3);color:#000}.featherlight .featherlight-image{width:100%}.featherlight-iframe .featherlight-content{border-bottom:0;padding:0}.featherlight iframe{border:0}}@media only screen and (max-width:1024px){.featherlight .featherlight-content{margin-left:10px;margin-right:10px;max-height:98%;padding:10px 10px 0;border-bottom:10px solid transparent}}

3
static/js/clippy.svg
View file

@ -1,3 +0,0 @@
<svg height="1024" width="896" xmlns="http://www.w3.org/2000/svg">
<path d="M128 768h256v64H128v-64z m320-384H128v64h320v-64z m128 192V448L384 640l192 192V704h320V576H576z m-288-64H128v64h160v-64zM128 704h160v-64H128v64z m576 64h64v128c-1 18-7 33-19 45s-27 18-45 19H64c-35 0-64-29-64-64V192c0-35 29-64 64-64h192C256 57 313 0 384 0s128 57 128 128h192c35 0 64 29 64 64v320h-64V320H64v576h640V768zM128 256h512c0-35-29-64-64-64h-64c-35 0-64-29-64-64s-29-64-64-64-64 29-64 64-29 64-64 64h-64c-35 0-64 29-64 64z" />
</svg>
Side by side

Before

Width:  |  Height:  |  Size: 519 B

56
static/js/hugo-learn.js Normal file
View file

@ -0,0 +1,56 @@
// Get Parameters from some url
var getUrlParameter = function getUrlParameter(sPageURL) {
var url = sPageURL.split('?');
var obj = {};
if (url.length == 2) {
var sURLVariables = url[1].split('&'),
sParameterName,
i;
for (i = 0; i < sURLVariables.length; i++) {
sParameterName = sURLVariables[i].split('=');
obj[sParameterName[0]] = sParameterName[1];
}
return obj;
} else {
return undefined;
}
};
// Execute actions on images generated from Markdown pages
var images = $("div#body-inner img");
// Wrap image inside a featherlight (to get a full size view in a popup)
images.wrap(function(){
var image =$(this);
return "<a href='" + image[0].src + "' data-featherlight='image'></a>";
});
// Change styles, depending on parameters set to the image
images.each(function(index){
var image = $(this)
var o = getUrlParameter(image[0].src);
if (typeof o !== "undefined") {
var h = o["height"];
var w = o["width"];
var c = o["classes"];
image.css("width", function() {
if (typeof w !== "undefined") {
return w;
} else {
return "auto";
}
});
image.css("height", function() {
if (typeof h !== "undefined") {
return h;
} else {
return "auto";
}
});
if (typeof c !== "undefined") {
var classes = c.split(',');
for (i = 0; i < classes.length; i++) {
image.addClass(classes[i]);
}
}
}
});

6
static/js/learn.js
View file

@ -127,7 +127,7 @@ jQuery(document).ready(function() {
var input = jQuery(this),
value = input.val(),
items = jQuery('[data-nav-id]');
console.log(input, value, items);
items.removeClass('search-match');
if (!value.length) {
$('ul.topics').removeClass('searched');
@ -207,7 +207,7 @@ jQuery(document).ready(function() {
});
}
});
// allow keyboard control for prev/next links
jQuery(function() {
jQuery('.nav-prev').click(function(){
@ -228,7 +228,7 @@ jQuery(document).ready(function() {
if(e.which == '39') {
jQuery('.nav.nav-next').click();
}
});
});
});