image gallery

.gitignore

@@ -2,4 +2,5 @@
 .idea
 
 # Public / dist
-public
\ No newline at end of file
+public
+resources
\ No newline at end of file

config.toml

@@ -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

content/projects/aquaponics/index.md

@@ -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" >}}

themes/code-editor/layouts/projects/single.html

@@ -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" . }}

themes/code-editor/layouts/shortcodes/gallery.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

themes/code-editor/layouts/shortcodes/img.html

-<!--
-#####################
-# 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

themes/code-editor/static/css/theme.min.css

@@ -76,4 +76,8 @@ pre {
     display: block;
     padding: 15px;
     max-height: 250px;
+}
+
+.gallery a {
+    text-decoration: none;
 }
\ No newline at end of file