Commit 5d073738 authored by betz's avatar betz

image gallery

parent 801b820f
Pipeline #36079584 failed with stage
in 18 seconds
......@@ -2,4 +2,5 @@
.idea
# Public / dist
public
\ No newline at end of file
public
resources
\ No newline at end of file
......@@ -58,3 +58,18 @@ sectionPagesMenu = "main"
[[params.offcanvas.socialnetworks]]
name = "Facebook"
url = "https://www.facebook.com/groups/hsbxl"
[imaging]
# Default resample filter used for resizing. Default is Box,
# a simple and fast averaging filter appropriate for downscaling.
# See https://github.com/disintegration/imaging
resampleFilter = "box"
# Default JPEG quality setting. Default is 75.
quality = 75
# Anchor used when cropping pictures.
# Default is "smart" which does Smart Cropping, using https://github.com/muesli/smartcrop
# Smart Cropping is content aware and tries to find the best crop for each image.
# Valid values are Smart, Center, TopLeft, Top, TopRight, Left, Right, BottomLeft, Bottom, BottomRight
anchor = "smart"
\ No newline at end of file
......@@ -10,5 +10,7 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse tempus null
Vivamus vitae pellentesque justo, in placerat quam. Maecenas risus lorem, laoreet at enim a, ultrices fermentum turpis. Fusce dictum tincidunt fermentum. Proin fermentum convallis ipsum in molestie. Pellentesque non arcu nulla. Donec tempus libero at est ullamcorper, quis blandit diam lobortis. Nam diam neque, hendrerit et tellus non, venenatis commodo tortor. Proin nulla magna, mollis nec tortor ac, euismod scelerisque mi.
## images frm index.md
{{< gallery "" >}}
{{< gallery "images" >}}
{{< twitter "gfdfdhgfhjg" >}}
......@@ -18,10 +18,6 @@
{{ .Content }}
</article>
{{ if .IsPage }}
[<a href="{{ .Site.Params.giteditpath }}/{{ .File.Path }}">Edit this page</a>]
{{ end }}
<h2>Resources</h2>
{{ range .Resources }}
......@@ -29,5 +25,10 @@
{{ end }}
{{ partial "bottom.html" . }}
{{ if .IsPage }}
<h2>Edit</h2>
[<a href="{{ .Site.Params.giteditpath }}/{{ .File.Path }}">Edit this page</a>]
{{ end }}
{{ partial "bottom.html" . }}
{{ range .Page.Resources.ByType "image" }}
<img src="{{ .Permalink }}">
{{ end }}
\ No newline at end of file
<div class="gallery">
{{ $directory := .Get 0}}
{{ $resources := .Page.Resources.Match ( print $directory "/*") }}
{{ range $resources }}
{{ with . }}
{{ $image200x := (.Resize "100x") }}
<a href="{{ .RelPermalink }}">
<img src="{{ $image200x.RelPermalink }}">
</a>
{{ end }}
{{ end }}
</div>
\ No newline at end of file
<!--
#####################
# Responsive Images #
#####################
## README:
Allows browser to load a different image based on screen width and device pixel density. This allows for a smaller file size and better load performance when users are on a lower capacity device. Uses images generated in the gulp build script. Some browsers don't support <picture> and will load the fallback <img>; see browser support: http://caniuse.com/#feat=picture
### Usage
Leave off file extention in the src then pass it to a type parameter and wrap everything in double curly braces:
< img src="/img/example" type="jpg" alt="Example" >
Optional: Use the 'caption' parameter to add an image caption:
< img src="/img/example" type="jpg" alt="Example" caption="This is a nice." >
-->
<div class="picture">
{{ if .Get "caption"}}
<figure>
{{ end }}
<picture>
<!-- Large screens -->
<source
media="(min-width: 535px)"
data-original-set="{{ .Get "src" }}.{{ .Get "type" }} 1x,
{{ .Get "src" }}@2x.{{ .Get "type" }} 2x">
<!-- Small screens -->
<source
media="(max-width: 534px)"
data-original-set="{{ .Get "src" }}-sm.{{ .Get "type" }} 1x,
{{ .Get "src" }}-sm@2x.{{ .Get "type" }} 2x">
<!-- Fallback -->
<img
data-original="{{ .Get "src" }}.{{ .Get "type" }}"
data-original-set="{{ .Get "src" }}@2x.{{ .Get "type" }} 2x"
alt="{{ .Get "alt" }}"{{ if .Get "caption"}} class="img-fluid figure-img"{{ end }}>
</picture>
{{ if .Get "caption"}}
<figcaption>{{ .Get "caption" }}</figcaption>
</figure>
{{ end }}
</div>
\ No newline at end of file
{{ with .Params.image }}
{{ $imageResource := ($.Site.GetPage "section" "uploads").Resources.GetMatch (strings.TrimPrefix "/uploads/" . ) }}
{{ $resized := $imageResource.Fill "200x200" }}
<img src="{{ $resized.RelPermalink }}" />
{{ end }}
\ No newline at end of file
......@@ -76,4 +76,8 @@ pre {
display: block;
padding: 15px;
max-height: 250px;
}
.gallery a {
text-decoration: none;
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment