Merge branch 'galleria-fullscreen-icon'
This commit is contained in:
Simon Conseil
5
sigal/themes/galleria/README
Normal file
5
sigal/themes/galleria/README
Normal file
@@ -0,0 +1,5 @@
|
||||
Theme based on Galleria (http://galleria.io/), which is distributed under the
|
||||
MIT License.
|
||||
|
||||
Additional icons (map, fullscreen) come from the Font Awesome project
|
||||
(http://fortawesome.github.io/Font-Awesome/ License: SIL OFL 1.1).
|
||||
@@ -102,6 +102,7 @@ header h1 a:hover, header h2 a:hover {
|
||||
line-height: 0;
|
||||
width: 100%;
|
||||
height: 600px;
|
||||
clear: both;
|
||||
}
|
||||
#gallery video {
|
||||
position: absolute;
|
||||
@@ -110,10 +111,32 @@ header h1 a:hover, header h2 a:hover {
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
/* fullscreen display link */
|
||||
#fullscreen {
|
||||
.icons {
|
||||
top: 10px;
|
||||
right: 20px;
|
||||
padding: 5px;
|
||||
z-index: 2;
|
||||
position: absolute;
|
||||
text-align: right;
|
||||
}
|
||||
.icons a {
|
||||
cursor: pointer;
|
||||
}
|
||||
.icons img {
|
||||
opacity: .7;
|
||||
}
|
||||
.icons img:hover {
|
||||
opacity: .9;
|
||||
}
|
||||
|
||||
/* Mimic .galleria-stage to use the same area for the map */
|
||||
#galleria-map {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
left: 10px;
|
||||
top: 0;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
/* footer */
|
||||
footer {
|
||||
|
||||
@@ -1 +1 @@
|
||||
/*!normalize.css v3.0.1 | MIT License | git.io/normalize */ html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}body{background-color:#242424;color:#aaa;text-shadow:0 1px 3px rgba(0,0,0,0.7)}.container{margin:0 auto;text-align:left;width:96%}a,a:link,a:visited{color:#999;text-decoration:underline}a:hover{color:#dadada}header{padding:1em 0;color:#eee}header h1,header h2{color:#eee;margin:10px 0}header h1 a,header h1 a:link,header h1 a:visited,header h2 a,header h2 a:link,header h2 a:visited{color:#eee;text-shadow:0 2px 0 #000;text-decoration:none}header h1 a:hover,header h2 a:hover{color:#fff;text-decoration:none}#menu ul{list-style-type:none;margin:0 0 10px;padding:0}#menu ul li{display:inline-block}#menu ul li a,#menu ul li a:link,#menu ul li a:visited{color:#aaa;border-bottom:1px solid #aaa;padding-bottom:2px;margin-left:5px;text-decoration:none}#menu ul li a:hover{color:#eee;border-color:#eee;text-decoration:none}#albums ul{list-style-type:none;padding-left:0}#albums ul li{display:inline-block;margin:0 55px 30px 0;text-align:center;vertical-align:top;width:280px}#albums ul li:nth-child(3n+3){margin-right:0}#albums ul li a img{opacity:1;-webkit-transition:opacity .2s ease-in;-moz-transition-property:opacity;-moz-transition-duration:.2s;-moz-box-shadow:0 1px 6px rgba(0,0,0,0.6);-webkit-box-shadow:0 1px 6px rgba(0,0,0,0.6);-o-box-shadow:0 1px 6px rgba(0,0,0,0.6);box-shadow:0 1px 6px rgba(0,0,0,0.6)}#albums ul li a:hover img{opacity:.5}.album_title{display:block;color:#eee;font-size:1.3em;font-variant:small-caps;font-weight:bold}#gallery{line-height:0;width:100%;height:600px}#gallery video{position:absolute;top:10%;width:100%;margin:0 auto}#fullscreen{cursor:pointer}footer{clear:both;display:block;margin:1em 0;text-align:center}footer a:link,footer a:visited{font-weight:bold;text-decoration:none}footer a:hover{border-bottom:1px solid;text-decoration:none}@media only screen and (min-width:980px){.container{width:960px}#gallery{width:980px;margin:0 0 40px -10px}header h1,#menu{display:inline-block;width:49.5%}#menu{text-align:right}}
|
||||
/*!normalize.css v3.0.1 | MIT License | git.io/normalize */ html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block;vertical-align:baseline}audio:not([controls]){display:none;height:0}[hidden],template{display:none}a{background:transparent}a:active,a:hover{outline:0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:bold}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0}mark{background:#ff0;color:#000}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-0.5em}sub{bottom:-0.25em}img{border:0}svg:not(:root){overflow:hidden}figure{margin:1em 40px}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}pre{overflow:auto}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}button,input,optgroup,select,textarea{color:inherit;font:inherit;margin:0}button{overflow:visible}button,select{text-transform:none}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}input{line-height:normal}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0}input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button{height:auto}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0}textarea{overflow:auto}optgroup{font-weight:bold}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}body{background-color:#242424;color:#aaa;text-shadow:0 1px 3px rgba(0,0,0,0.7)}.container{margin:0 auto;text-align:left;width:96%}a,a:link,a:visited{color:#999;text-decoration:underline}a:hover{color:#dadada}header{padding:1em 0;color:#eee}header h1,header h2{color:#eee;margin:10px 0}header h1 a,header h1 a:link,header h1 a:visited,header h2 a,header h2 a:link,header h2 a:visited{color:#eee;text-shadow:0 2px 0 #000;text-decoration:none}header h1 a:hover,header h2 a:hover{color:#fff;text-decoration:none}#menu ul{list-style-type:none;margin:0 0 10px;padding:0}#menu ul li{display:inline-block}#menu ul li a,#menu ul li a:link,#menu ul li a:visited{color:#aaa;border-bottom:1px solid #aaa;padding-bottom:2px;margin-left:5px;text-decoration:none}#menu ul li a:hover{color:#eee;border-color:#eee;text-decoration:none}#albums ul{list-style-type:none;padding-left:0}#albums ul li{display:inline-block;margin:0 55px 30px 0;text-align:center;vertical-align:top;width:280px}#albums ul li:nth-child(3n+3){margin-right:0}#albums ul li a img{opacity:1;-webkit-transition:opacity .2s ease-in;-moz-transition-property:opacity;-moz-transition-duration:.2s;-moz-box-shadow:0 1px 6px rgba(0,0,0,0.6);-webkit-box-shadow:0 1px 6px rgba(0,0,0,0.6);-o-box-shadow:0 1px 6px rgba(0,0,0,0.6);box-shadow:0 1px 6px rgba(0,0,0,0.6)}#albums ul li a:hover img{opacity:.5}.album_title{display:block;color:#eee;font-size:1.3em;font-variant:small-caps;font-weight:bold}#gallery{line-height:0;width:100%;height:600px;clear:both}#gallery video{position:absolute;top:10%;width:100%;margin:0 auto}.icons{top:10px;right:20px;padding:5px;z-index:2;position:absolute;text-align:right}.icons a{cursor:pointer}.icons img{opacity:.7}.icons img:hover{opacity:.9}#galleria-map{position:absolute;bottom:80px;left:10px;top:0;right:10px}footer{clear:both;display:block;margin:1em 0;text-align:center}footer a:link,footer a:visited{font-weight:bold;text-decoration:none}footer a:hover{border-bottom:1px solid;text-decoration:none}@media only screen and (min-width:980px){.container{width:960px}#gallery{width:980px;margin:0 0 40px -10px}header h1,#menu{display:inline-block;width:49.5%}#menu{text-align:right}}
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 204 B After Width: | Height: | Size: 444 B |
Binary file not shown.
|
Before Width: | Height: | Size: 911 B After Width: | Height: | Size: 512 B |
Binary file not shown.
|
Before Width: | Height: | Size: 473 B After Width: | Height: | Size: 474 B |
@@ -25,33 +25,6 @@
|
||||
<link rel="stylesheet" href="{{ theme.url }}/leaflet/leaflet.css" />
|
||||
<script src="{{ theme.url }}/leaflet/leaflet.js"></script>
|
||||
<style type="text/css">
|
||||
.gallery-map-toggle {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Mimic .galleria-stage to use the same area for the map */
|
||||
#galleria-map {
|
||||
position: absolute;
|
||||
bottom: 80px;
|
||||
left: 10px;
|
||||
top: 0;
|
||||
right: 10px;
|
||||
}
|
||||
|
||||
/* We need to have more contract between active and inactive images
|
||||
for maps, or we may not know which is the selected. */
|
||||
.galleria-thumbnails .galleria-image.active {
|
||||
opacity: 1;
|
||||
}
|
||||
.galleria-thumbnails .galleria-image {
|
||||
opacity: 0.6;
|
||||
}
|
||||
.icons {
|
||||
float: right;
|
||||
}
|
||||
#gallery {
|
||||
clear: both;
|
||||
}
|
||||
</style>
|
||||
{% endif %}
|
||||
</head>
|
||||
@@ -118,14 +91,14 @@
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{%- endmacro %}
|
||||
{% if settings.show_map and album.show_map %}
|
||||
<div class="icons">
|
||||
{% if settings.show_map and album.show_map %}
|
||||
<a class="gallery-map-toggle"><img src="{{ theme.url }}/img/map.png"
|
||||
title="Show/Hide map" alt="Show/Hide Map" /></a>
|
||||
{% endif %}
|
||||
<a id="fullscreen"><img src="{{ theme.url }}/img/fullscreen.png"
|
||||
title="Fullscreen" alt="Fullscreen" /></a>
|
||||
</div>
|
||||
{% endif %}
|
||||
<div id="gallery">
|
||||
{% for media in album.medias %}
|
||||
{% if media.type == "image" %}
|
||||
@@ -274,12 +247,14 @@
|
||||
|
||||
var stage = $(".galleria-stage");
|
||||
var mapdiv = $("#galleria-map");
|
||||
var icons = $(".icons");
|
||||
|
||||
if (stage.attr.hidden == true) {
|
||||
stage.attr.hidden = false;
|
||||
$(".galleria-info-link").show();
|
||||
mapdiv.hide();
|
||||
stage.css("opacity", "1");
|
||||
icons.css("background-color", "inherit");
|
||||
/* Change display of the Map link */
|
||||
$(".gallery-map-toggle img")[0].src = "{{ theme.url }}/img/map.png";
|
||||
} else {
|
||||
@@ -288,6 +263,7 @@
|
||||
mapdiv.show();
|
||||
/* Play with the stage opacity otherwise galleria will go mad */
|
||||
stage.css("opacity", "0");
|
||||
icons.css("background-color", "#333");
|
||||
/* Change display of the Map link */
|
||||
$(".gallery-map-toggle img")[0].src = "{{ theme.url }}/img/photo.png";
|
||||
}
|
||||
@@ -311,6 +287,9 @@
|
||||
$('#fullscreen').click(function() {
|
||||
gallery.toggleFullscreen();
|
||||
});
|
||||
|
||||
$('.icons').appendTo(this.$('container'));
|
||||
|
||||
{% if settings.show_map and album.show_map %}
|
||||
this.bind('loadfinish', function(e) {
|
||||
init_map();
|
||||
|
||||
Reference in New Issue
Block a user