Buttons page
This commit is contained in:
Dan
parent
13d8d21071
commit
d8cbd092b2
18 changed files with 337 additions and 73 deletions
|
Before Width: | Height: | Size: 880 KiB After Width: | Height: | Size: 880 KiB |
67
assets/sass/_handwritten.scss
Normal file
67
assets/sass/_handwritten.scss
Normal file
|
|
@ -0,0 +1,67 @@
|
|||
/**
|
||||
|
||||
Styles to apply the handwritten effect to a thinger
|
||||
|
||||
**/
|
||||
|
||||
.handwritten-wrap {
|
||||
font-family: "Caveat", cursive;
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: -2px;
|
||||
right: -2px;
|
||||
bottom: -0.15em;
|
||||
height: 0.3em;
|
||||
pointer-events: none;
|
||||
|
||||
background: repeating-linear-gradient(
|
||||
-3deg,
|
||||
currentColor 0 1.5px,
|
||||
transparent 1.5px 4px
|
||||
);
|
||||
opacity: 0.9;
|
||||
}
|
||||
|
||||
del {
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
del::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: -4px;
|
||||
top: 50%;
|
||||
width: calc(100% + 8px);
|
||||
height: 1.4em;
|
||||
transform: translateY(-50%);
|
||||
pointer-events: none;
|
||||
|
||||
background-color: currentColor;
|
||||
|
||||
-webkit-mask-image: url("data:image/svg+xml;utf8,\
|
||||
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20'>\
|
||||
<path d='M2 8 Q20 2 40 10 T80 8 T98 10' stroke='white' stroke-width='3' fill='none'/>\
|
||||
<path d='M2 14 Q30 6 60 14 T98 12' stroke='white' stroke-width='2' fill='none'/>\
|
||||
</svg>");
|
||||
-webkit-mask-repeat: repeat-x;
|
||||
-webkit-mask-size: auto 100%;
|
||||
|
||||
mask-image: url("data:image/svg+xml;utf8,\
|
||||
<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 20'>\
|
||||
<path d='M2 8 Q20 2 40 10 T80 8 T98 10' stroke='white' stroke-width='3' fill='none'/>\
|
||||
<path d='M2 14 Q30 6 60 14 T98 12' stroke='white' stroke-width='2' fill='none'/>\
|
||||
</svg>");
|
||||
mask-repeat: repeat-x;
|
||||
mask-size: auto 100%;
|
||||
}
|
||||
}
|
||||
|
|
@ -88,7 +88,13 @@ $breakpoints: (
|
|||
}
|
||||
}
|
||||
|
||||
// Usage
|
||||
.scrollable-child {
|
||||
@include scrollbar-custom(greenyellow, 10px);
|
||||
@mixin enhance-3d-transform {
|
||||
backface-visibility: hidden;
|
||||
-webkit-backface-visibility: hidden;
|
||||
transform-style: preserve-3d;
|
||||
-webkit-transform-style: preserve-3d;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Optional: Force GPU acceleration */
|
||||
will-change: transform;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,14 +21,32 @@
|
|||
}
|
||||
}
|
||||
|
||||
.buttons-window {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
aspect-ratio: 16/9;
|
||||
width: 50%;
|
||||
left: 70%;
|
||||
transform: translate(-50%, -20%);
|
||||
border: 5px solid #c4b89a;
|
||||
border-top-width: 5px;
|
||||
border-top-style: solid;
|
||||
border-top-color: rgb(196, 184, 154);
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.buttons-container {
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
|
||||
> .wall {
|
||||
position: fixed !important;
|
||||
width: 100vw !important;
|
||||
height: 100vh !important;
|
||||
top: 0 !important;
|
||||
left: 0 !important;
|
||||
background: repeating-linear-gradient(
|
||||
background:
|
||||
repeating-linear-gradient(
|
||||
90deg,
|
||||
#2a2a2a 0px,
|
||||
#2a2a2a 100px,
|
||||
|
|
@ -44,7 +62,12 @@
|
|||
}
|
||||
|
||||
> .desk {
|
||||
height: 37%;
|
||||
position: absolute;
|
||||
top: 50vh;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 100%;
|
||||
min-height: calc(100% - 50vh);
|
||||
}
|
||||
|
||||
.button-lavalamp {
|
||||
|
|
@ -69,6 +92,10 @@
|
|||
filter: blur(8px);
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
@include media-down(lg) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.buttons-header {
|
||||
|
|
@ -109,6 +136,8 @@
|
|||
align-items: center;
|
||||
perspective: 2000px;
|
||||
margin: 4rem 0;
|
||||
margin-top: 10%;
|
||||
margin-bottom: 0;
|
||||
min-height: 570px;
|
||||
padding: 2rem;
|
||||
position: relative;
|
||||
|
|
@ -121,7 +150,8 @@
|
|||
height: 50px;
|
||||
background: linear-gradient(180deg, #1a1a1a 0%, #0d0d0d 100%);
|
||||
border-radius: 0 0 15px 15px;
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5),
|
||||
box-shadow:
|
||||
0 10px 30px rgba(0, 0, 0, 0.5),
|
||||
inset 0 1px 2px rgba(255, 255, 255, 0.05);
|
||||
z-index: 1;
|
||||
bottom: 0;
|
||||
|
|
@ -137,7 +167,8 @@
|
|||
bottom: 10px;
|
||||
left: 50%;
|
||||
transform: translateX(-50%) translateZ(0px);
|
||||
background: repeating-linear-gradient(
|
||||
background:
|
||||
repeating-linear-gradient(
|
||||
90deg,
|
||||
#2a2a2a 0,
|
||||
#2a2a2a 12px,
|
||||
|
|
@ -163,7 +194,8 @@
|
|||
height: 480px;
|
||||
background: linear-gradient(135deg, #d4d4d4 0%, #c0c0c0 40%, #b0b0b0 100%);
|
||||
border-radius: 20px 20px 0 0;
|
||||
box-shadow: 0 40px 100px rgba(0, 0, 0, 0.4),
|
||||
box-shadow:
|
||||
0 40px 100px rgba(0, 0, 0, 0.4),
|
||||
inset 0 1px 2px rgba(255, 255, 255, 0.5),
|
||||
inset 0 -3px 8px rgba(0, 0, 0, 0.08);
|
||||
transform: rotateX(25deg) translateZ(20px);
|
||||
|
|
@ -273,48 +305,122 @@
|
|||
.buttons-content {
|
||||
max-width: 800px;
|
||||
margin: 4rem auto 0;
|
||||
margin-top: 0;
|
||||
padding: 2rem;
|
||||
perspective: 400px;
|
||||
perspective: 1000px;
|
||||
|
||||
// Show as a grid with 2 colums
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 2rem;
|
||||
|
||||
font-weight: bold;
|
||||
font-size: 1.5em;
|
||||
|
||||
.link-me-buttons {
|
||||
margin: auto;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, 1fr);
|
||||
gap: 0.5em;
|
||||
|
||||
> img {
|
||||
// Apply a random rotation
|
||||
transform: rotate(var(--rotation, 0deg));
|
||||
filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.5));
|
||||
border: 4px solid white;
|
||||
border-radius: 2px;
|
||||
|
||||
&:hover {
|
||||
transform: rotateY(-10deg) scale(1.2);
|
||||
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.6));
|
||||
border: 4px solid transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.buttons-paper {
|
||||
position: relative;
|
||||
// Paper-like background
|
||||
background: #f9f9f9;
|
||||
padding: 1.5rem;
|
||||
background: #d7d9cf;
|
||||
padding: 0.5em;
|
||||
padding-top: 1.6em;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.08);
|
||||
box-shadow:
|
||||
0 4px 12px rgba(0, 0, 0, 0.1),
|
||||
0 1px 3px rgba(0, 0, 0, 0.08),
|
||||
0 10px 30px rgba(0, 0, 0, 0.5);
|
||||
border: 1px solid #e0e0e0;
|
||||
// Lined background
|
||||
// Lined background - matches the 1.6 line-height of paragraphs with 1.5em font-size = 2.4em
|
||||
background-image: linear-gradient(
|
||||
to bottom,
|
||||
#f9f9f9 0%,
|
||||
#f9f9f9 95%,
|
||||
#e0e0e0 95%,
|
||||
#e0e0e0 100%
|
||||
#d1d4cc 0%,
|
||||
#d1d4cc 97%,
|
||||
#5c6f90 97%,
|
||||
#5c6f90 100%
|
||||
);
|
||||
background-size: 100% 24px;
|
||||
// Add a slight perspective so it looks like its on the table
|
||||
background-size: 100% 1.6em;
|
||||
}
|
||||
|
||||
// Target the parent div that contains the image
|
||||
> div {
|
||||
transform: rotateX(25deg) translateZ(20px);
|
||||
transform-style: preserve-3d;
|
||||
transform-origin: bottom center;
|
||||
@include enhance-3d-transform;
|
||||
}
|
||||
|
||||
.blog-img-container {
|
||||
width: 80%;
|
||||
margin: auto;
|
||||
background-color: #fdfaf5;
|
||||
padding: 0.5em;
|
||||
padding-bottom: 1em;
|
||||
transform: rotate(-2deg);
|
||||
box-shadow:
|
||||
0 0 1px rgba(255, 255, 255, 0.5),
|
||||
inset 0 0 0 1px rgba(255, 255, 255, 0.8),
|
||||
0 10px 30px rgba(0, 0, 0, 0.2),
|
||||
0 10px 30px rgba(0, 0, 0, 0.7);
|
||||
@include enhance-3d-transform;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
aspect-ratio: 1;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
|
||||
// Vintage Polaroid filter effects
|
||||
filter: contrast(1.3) saturate(0.65) brightness(1.05) sepia(0.3);
|
||||
|
||||
border: 1px solid rgba(0, 0, 0, 0.7);
|
||||
}
|
||||
|
||||
figcaption {
|
||||
text-align: center;
|
||||
transform: rotate(-3deg);
|
||||
padding-top: 1em;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
margin-bottom: 1.5rem;
|
||||
line-height: 1.6;
|
||||
color: #828282;
|
||||
margin-bottom: 1.6em;
|
||||
line-height: 1.6em;
|
||||
color: #2f2f2f;
|
||||
}
|
||||
}
|
||||
|
||||
// Responsive adjustments
|
||||
@media (max-width: 900px) {
|
||||
.buttons-container {
|
||||
> .desk {
|
||||
top: 20vh;
|
||||
height: 120vh;
|
||||
}
|
||||
}
|
||||
|
||||
.laptop-container {
|
||||
min-height: 500px;
|
||||
min-height: 100px;
|
||||
}
|
||||
|
||||
.laptop-container::before {
|
||||
|
|
@ -331,6 +437,17 @@
|
|||
.laptop-lid {
|
||||
width: 600px;
|
||||
height: 375px;
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:before {
|
||||
left: 35px;
|
||||
top: 30px;
|
||||
transform: none;
|
||||
font-size: 2em;
|
||||
}
|
||||
}
|
||||
|
||||
.button-sticker {
|
||||
|
|
@ -341,6 +458,18 @@
|
|||
transform: rotateX(-25deg) rotate(0deg) scale(1.3) translateZ(30px);
|
||||
}
|
||||
}
|
||||
|
||||
.buttons-content {
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
img {
|
||||
margin: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.blog-img-container {
|
||||
max-width: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 600px) {
|
||||
|
|
@ -355,29 +484,49 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
.buttons-content {
|
||||
perspective: none;
|
||||
.link-me-buttons {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.laptop-container {
|
||||
perspective: 800px;
|
||||
min-height: 400px;
|
||||
min-height: 50px;
|
||||
}
|
||||
|
||||
.laptop-container::before {
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
height: 30px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.laptop-container::after {
|
||||
width: 370px;
|
||||
height: 18px;
|
||||
bottom: 6px;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.laptop-lid {
|
||||
width: 100%;
|
||||
max-width: 400px;
|
||||
height: 250px;
|
||||
transform: rotateX(25deg) translateZ(20px);
|
||||
transform: rotateX(0) translateZ(0);
|
||||
border-width: 1px;
|
||||
padding: 2px;
|
||||
border-radius: 10px;
|
||||
|
||||
&:after {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&:before {
|
||||
left: 25px;
|
||||
top: 20px;
|
||||
transform: none;
|
||||
font-size: 1em;
|
||||
}
|
||||
|
||||
.laptop-lid-bezel {
|
||||
inset: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.button-sticker {
|
||||
|
|
|
|||
|
|
@ -188,9 +188,27 @@
|
|||
|
||||
.nav-floppy {
|
||||
width: 44%;
|
||||
max-width: 100px;
|
||||
transform: rotate(5deg);
|
||||
position: relative;
|
||||
|
||||
&.top {
|
||||
transform: rotate(-5deg);
|
||||
left: -20px;
|
||||
|
||||
.nav-floppy-text {
|
||||
transform: rotate(7deg);
|
||||
}
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
left: 20px;
|
||||
|
||||
.nav-floppy-text {
|
||||
transform: rotate(-7deg);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
.nav-floppy-text {
|
||||
opacity: 1;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
@import "normalize";
|
||||
@import "mixins";
|
||||
@import "animations";
|
||||
@import "handwritten";
|
||||
|
||||
@import "partials/global-styles";
|
||||
@import "partials/form-controls";
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@ draft: false
|
|||
- 🌐 I setup a dedicated server for this site and migrated off neocities, I am coming up with a plan on how to make sure updates keep getting posted there but redirect here.
|
||||
- 📺 There's been a bunch of Taskmaster recently, including Champion of Champions which was good. Traitors is back on so we're up to date on that so far.
|
||||
|
||||
{{< img src="thinkpad_t480s.jpg" alt="Thinkpad T480s complete with stickerbomb" width="900x" >}}
|
||||
{{< img src="images/misc/thinkpad_t480s.jpg" alt="Thinkpad T480s complete with stickerbomb" width="900x" >}}
|
||||
|
||||
## Links I Found Interesting
|
||||
|
||||
|
|
|
|||
|
|
@ -43,6 +43,16 @@ buttons:
|
|||
image: "jigglypuff.gif"
|
||||
- name: "Fuck Google"
|
||||
image: "fckgoogle.gif"
|
||||
- name: "Ritual.sh"
|
||||
image: "ritual_1.gif"
|
||||
- name: "Ritual.sh"
|
||||
image: "ritual_2.gif"
|
||||
- name: "Ritual.sh"
|
||||
image: "ritual_4.gif"
|
||||
---
|
||||
|
||||
People and things I like, stuck on my laptop - just like in real life!
|
||||
Here are a bunch of ~stickers~ buttons that I've collected on my travels around the IndieWeb.
|
||||
|
||||
If you want to appear on my laptop, leave me a message on my [guestbook](/guestbook) and I will add you!
|
||||
|
||||
Here are some ~stickers~ buttons... feel free to take one!
|
||||
|
|
|
|||
BIN
content/buttons/ritual_1.gif
Normal file
BIN
content/buttons/ritual_1.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 64 KiB |
BIN
content/buttons/ritual_2.gif
Normal file
BIN
content/buttons/ritual_2.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
content/buttons/ritual_3.gif
Normal file
BIN
content/buttons/ritual_3.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
content/buttons/ritual_4.gif
Normal file
BIN
content/buttons/ritual_4.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 63 KiB |
|
|
@ -1,8 +1,6 @@
|
|||
{{ define "header" }}{{ partial "page-header.html" . }}{{ end }}
|
||||
{{ define "main" }}
|
||||
{{ define "header" }}{{ partial "page-header.html" . }}{{ end }} {{ define
|
||||
"main" }}
|
||||
<article>
|
||||
<h1>
|
||||
This is not the page you were looking for
|
||||
</h1>
|
||||
<h1>This is not the page you were looking for</h1>
|
||||
</article>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
|
|
|||
|
|
@ -3,18 +3,8 @@
|
|||
<div class="wall"></div>
|
||||
<div class="desk"></div>
|
||||
|
||||
<div class="button-lavalamp">
|
||||
<script
|
||||
src="https://ritual.sh/js/adoptables/lavalamp.js"
|
||||
data-bg-color-1="#62a0ea"
|
||||
data-bg-color-2="#1c71d8"
|
||||
data-blob-color-1="#f8e45c"
|
||||
data-blob-color-2="#f6d32d"
|
||||
data-case-color="#c0bfbc"
|
||||
data-blob-count="6"
|
||||
data-speed="1.0"
|
||||
data-blob-size="1.4"
|
||||
></script>
|
||||
<div class="buttons-window hidden-lg-down">
|
||||
{{ partial "elements/window.html" . }}
|
||||
</div>
|
||||
|
||||
<article class="buttons-page">
|
||||
|
|
@ -41,8 +31,21 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<section class="buttons-content">
|
||||
<div class="buttons-paper">{{ .Content }}</div>
|
||||
<section class="buttons-content handwritten-wrap">
|
||||
<div class="buttons-paper">
|
||||
{{ .Content }}
|
||||
<div class="link-me-buttons">
|
||||
<img src="ritual_1.gif" style="--rotation: 3deg" />
|
||||
<img src="ritual_2.gif" style="--rotation: -2deg" />
|
||||
<img src="ritual_3.gif" style="--rotation: 1deg" />
|
||||
<img src="ritual_4.gif" style="--rotation: 2deg" />
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<!-- prettier-ignore -->
|
||||
{{ partial "responsive-image.html" (dict "src"
|
||||
"images/misc/thinkpad_t480s.jpg" "alt" "My Thinkpad T480s with stickerbomb" "width" "900x" "page" .) }}
|
||||
</div>
|
||||
</section>
|
||||
</article>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -265,7 +265,7 @@
|
|||
</div>
|
||||
|
||||
<div>
|
||||
<div class="nav-floppy">
|
||||
<div class="nav-floppy top">
|
||||
<a href="/guestbook/">
|
||||
{{ partial "elements/floppy.html" (dict "title" "Guestbook" "lines"
|
||||
(slice "" "" "DO NOT DELETE" "" "") "bgColor" "#1a4d8f" "bgColorDark"
|
||||
|
|
@ -273,6 +273,14 @@
|
|||
<div class="nav-floppy-text">Guestbook</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="nav-floppy bottom">
|
||||
<a href="/buttons/">
|
||||
{{ partial "elements/floppy.html" (dict "title" "Buttons" "lines" (slice
|
||||
"" "" "NOT STICKERS" "" "") "bgColor" "#85112e" "bgColorDark" "#660a21")
|
||||
}}
|
||||
<div class="nav-floppy-text">Buttons & Links</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>{{ partial "elements/crt-tv.html" . }}</div>
|
||||
|
|
|
|||
21
layouts/partials/responsive-image.html
Normal file
21
layouts/partials/responsive-image.html
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<!-- prettier-ignore -->
|
||||
{{ $src := .src }}
|
||||
{{ $alt := .alt | default "" }}
|
||||
{{ $width := .width | default "800x" }}
|
||||
|
||||
<figure class="blog-img-container">
|
||||
{{ with .page.Resources.GetMatch $src }}
|
||||
{{ $resized := .Resize $width }}
|
||||
<img src="{{ $resized.RelPermalink }}" alt="{{ $alt }}" loading="lazy" class="blog-img" />
|
||||
{{ else }}
|
||||
{{ with resources.Get $src }}
|
||||
{{ $resized := .Resize $width }}
|
||||
<img src="{{ $resized.RelPermalink }}" alt="{{ $alt }}" loading="lazy" class="blog-img" />
|
||||
{{ else }}
|
||||
<img src="{{ $src }}" alt="{{ $alt }}" loading="lazy" class="blog-img" />
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
{{ if $alt }}
|
||||
<figcaption class="blog-img-caption">{{ $alt }}</figcaption>
|
||||
{{ end }}
|
||||
</figure>
|
||||
|
|
@ -4,9 +4,7 @@
|
|||
|
||||
•
|
||||
|
||||
<a href="https://neocities.org/site/ritualsh" target="_blank"
|
||||
>Follow on Neocities</a
|
||||
>
|
||||
<a href="/guestbook">Sign My Guestbook</a>
|
||||
|
||||
•
|
||||
|
||||
|
|
|
|||
|
|
@ -1,16 +1 @@
|
|||
<!-- prettier-ignore -->
|
||||
{{ $src := .Get "src" }}
|
||||
{{ $alt := .Get "alt" | default "" }}
|
||||
{{ $width := .Get "width" | default "800x" }}
|
||||
|
||||
<figure class="blog-img-container">
|
||||
{{ with .Page.Resources.GetMatch $src }}
|
||||
{{ $resized := .Resize $width }}
|
||||
<img src="{{ $resized.RelPermalink }}" alt="{{ $alt }}" loading="lazy" class="blog-img" />
|
||||
{{ else }}
|
||||
<img src="{{ $src }}" alt="{{ $alt }}" loading="lazy" class="blog-img" />
|
||||
{{ end }}
|
||||
{{ if $alt }}
|
||||
<figcaption class="blog-img-caption">{{ $alt }}</figcaption>
|
||||
{{ end }}
|
||||
</figure>
|
||||
{{ partial "responsive-image.html" (dict "src" (.Get "src") "alt" (.Get "alt") "width" (.Get "width") "page" .Page) }}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue