1414codeforge
/
www.doublefourteen.io
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

[themes/doublefourteen] Add contact buttons to page footer.

This commit is contained in:
Lorenzo Cogotti 2022-03-23 18:02:03 +01:00
parent 762db1ed3b
commit 298b6dc204
3 changed files with 119 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
themes/doublefourteen/assets/sass/style.sass
View File

@ -29,6 +29,13 @@
.up-to-small-screen
display: none !important
@media (prefers-color-scheme:dark)
.on-light-theme
display: none !important
@media (prefers-color-scheme:light)
.on-dark-theme
display: none !important
*
box-sizing: border-box
z-index: $foreground
@ -148,9 +155,17 @@ thead th
repeat: no-repeat
size: 400px 386px
.get-in-touch
display: flex
flex-direction: row
flex-wrap: wrap
justify-content: right
gap: 1.5em
margin: 2em 3em 2em 2em
.button, .button:hover
background-color: transparent
border: 2px solid #737475
border: 2px solid #ced4da
color: #333
padding: 7px 12px
display: block
@ -161,10 +176,16 @@ thead th
.button a
display: inline
text-decoration: none !important
color: #666
color: #333
.button:hover
background-color: #7f7f7f
background-color: #fefefe
.twitter-button, .email-button
padding 0px
> img
min-width: 16px
min-height: 16px
margin-bottom: 0px
.footer
text-align: center

6
themes/doublefourteen/layouts/partials/footer.html
View File

@ -1,4 +1,7 @@
<footer class="container footer">
<footer>
{{- partial "getintouch.html" . -}}
<div class="container footer">
<small>
&copy;
<time datetime="{{ now.UTC.Format "2006-01-02T15:04:05Z07:00" | safeHTML }}">
@ -9,4 +12,5 @@
CC BY-SA</a>.
</em>
</small>
</div>
</footer>

80
themes/doublefourteen/layouts/partials/getintouch.html Normal file
View File

@ -0,0 +1,80 @@
<div class="container get-in-touch">
<!-- twitter -->
<a class="button twitter-button"
title="Follow us on Twitter @1414codeforge"
href="https://twitter.com/1414codeforge">
<img class="on-light-theme"
src="{{ "/twitter-logo-blue-64.png" | relURL }}"
srcset="{{ "/twitter-logo-blue-128.png" | relURL }} 128w,
{{ "/twitter-logo-blue-120.png" | relURL }} 120w,
{{ "/twitter-logo-blue-114.png" | relURL }} 114w,
{{ "/twitter-logo-blue-110.png" | relURL }} 110w,
{{ "/twitter-logo-blue-72.png" | relURL }} 72w,
{{ "/twitter-logo-blue-64.png" | relURL }} 64w,
{{ "/twitter-logo-blue-57.png" | relURL }} 57w,
{{ "/twitter-logo-blue-48.png" | relURL }} 48w,
{{ "/twitter-logo-blue-32.png" | relURL }} 32w,
{{ "/twitter-logo-blue-16.png" | relURL }} 16w"
sizes="(min-width: 2000px) 128px,
(max-width: 2000px) and (min-width: 640px) 3vw,
10vw"
max-width="128px"
alt="Follow us on Twitter @1414codeforge">
<img class="on-dark-theme"
src="{{ "/twitter-logo-white-64.png" | relURL }}"
srcset="{{ "/twitter-logo-white-128.png" | relURL }} 128w,
{{ "/twitter-logo-white-120.png" | relURL }} 120w,
{{ "/twitter-logo-white-114.png" | relURL }} 114w,
{{ "/twitter-logo-white-110.png" | relURL }} 110w,
{{ "/twitter-logo-white-72.png" | relURL }} 72w,
{{ "/twitter-logo-white-64.png" | relURL }} 64w,
{{ "/twitter-logo-white-57.png" | relURL }} 57w,
{{ "/twitter-logo-white-48.png" | relURL }} 48w,
{{ "/twitter-logo-white-32.png" | relURL }} 32w,
{{ "/twitter-logo-white-16.png" | relURL }} 16w"
sizes="(min-width: 2000px) 128px,
(max-width: 2000px) and (min-width: 640px) 3vw,
10vw"
max-width="128px"
alt="Follow us on Twitter @1414codeforge">
</a>
<!-- email -->
<a class="button email-button"
title="Drop an email to info@doublefourteen.io"
href="mailto:The DoubleFourteen Staff<info@doublefourteen.io>">
<img class="on-light-theme"
src="{{ "/mail-gray-64.png" | relURL }}"
srcset="{{ "/mail-gray-128.png" | relURL }} 128w,
{{ "/mail-gray-120.png" | relURL }} 120w,
{{ "/mail-gray-114.png" | relURL }} 114w,
{{ "/mail-gray-110.png" | relURL }} 110w,
{{ "/mail-gray-72.png" | relURL }} 72w,
{{ "/mail-gray-64.png" | relURL }} 64w,
{{ "/mail-gray-57.png" | relURL }} 57w,
{{ "/mail-gray-48.png" | relURL }} 48w,
{{ "/mail-gray-32.png" | relURL }} 32w,
{{ "/mail-gray-16.png" | relURL }} 16w"
sizes="(min-width: 2000px) 128px,
(max-width: 2000px) and (min-width: 640px) 3vw,
10vw"
max-width="128px"
alt="Drop an email to info@doublefourteen.io">
<img class="on-dark-theme"
src="{{ "/mail-white-64.png" | relURL }}"
srcset="{{ "/mail-white-128.png" | relURL }} 128w,
{{ "/mail-white-120.png" | relURL }} 120w,
{{ "/mail-white-114.png" | relURL }} 114w,
{{ "/mail-white-110.png" | relURL }} 110w,
{{ "/mail-white-72.png" | relURL }} 72w,
{{ "/mail-white-64.png" | relURL }} 64w,
{{ "/mail-white-57.png" | relURL }} 57w,
{{ "/mail-white-48.png" | relURL }} 48w,
{{ "/mail-white-32.png" | relURL }} 32w,
{{ "/mail-white-16.png" | relURL }} 16w"
sizes="(min-width: 2000px) 128px,
(max-width: 2000px) and (min-width: 640px) 3vw,
10vw"
max-width="128px"
alt="Drop an email to info@doublefourteen.io">
</a>
</div>