diff --git a/assets/js/main.js b/assets/js/main.js index b96fe4a..3d98ef6 100644 --- a/assets/js/main.js +++ b/assets/js/main.js @@ -1,7 +1,3 @@ -/** - * Utils - */ - // Throttle // const throttle = (callback, limit) => { @@ -63,6 +59,23 @@ const toggleMobileMenu = () => { } } +// Social Share Toggle +// +let shareMenuVisible = false; +const shareMobileMenu = () => { + let shareMenu = document.getElementById('share-links'); + if (shareMenuVisible == false) { + shareMenu.style.animationName = 'bounceInRight'; + shareMenu.style.webkitAnimationName = 'bounceInRight'; + shareMenu.style.display = 'block'; + shareMenuVisible = true; + } else { + shareMenu.style.animationName = 'bounceOutRight'; + shareMenu.style.webkitAnimationName = 'bounceOutRight' + shareMenuVisible = false; + } +} + // Featured Image Toggle // const showImg = () => { @@ -82,6 +95,7 @@ const toggleToc = () => { if (header !== null) { listen('#menu-btn', "click", toggleMobileMenu); + listen('#share-btn', "click", shareMobileMenu); listen('#toc-btn', "click", toggleToc); listen('#img-btn', "click", showImg); listen('.bg-img', "click", hideImg); @@ -98,5 +112,8 @@ if (header !== null) { if (mobileMenuVisible == true) { toggleMobileMenu(); } + if (shareMenuVisible == true) { + shareMobileMenu(); + } }, 250)); } \ No newline at end of file diff --git a/assets/scss/_socialshare.scss b/assets/scss/_socialshare.scss new file mode 100644 index 0000000..07733bb --- /dev/null +++ b/assets/scss/_socialshare.scss @@ -0,0 +1,31 @@ +#share-links { + position: fixed; + bottom: 7.0em; + right: 0.5em; + display: none; + padding: .6em 0.5em; + z-index: 1; + box-sizing: border-box; + box-shadow: -1px -2px 3px 0px rgba(0, 0, 0, 0.45); + background-color: $midnightblue; + + ul { + list-style: none; + margin: 0; + padding: 0; + line-height: 2; + font-size: 1.2em; + a { + color: $highlight-grey; + &:hover,&:active,&:focus{ + color: $text; + } + } + } +} +@media (max-width: 520px) { + #share-links { + right: 0.2em; + bottom: 8.0em; + } +} \ No newline at end of file diff --git a/assets/scss/style.scss b/assets/scss/style.scss index 39d45db..422d553 100644 --- a/assets/scss/style.scss +++ b/assets/scss/style.scss @@ -5,6 +5,7 @@ @import "_scroll.scss"; @import "_admonition.scss"; @import "_mathjax.scss"; +@import "_socialshare.scss"; /* Webkit Scrollbar Customize */ ::-webkit-scrollbar { @@ -299,7 +300,7 @@ table { #mobile-menu { position: fixed; bottom: 4.8em; - right: 1.5em; + right: 4.5em; display: none; padding: .6em 1.8em; z-index: 1; @@ -904,7 +905,7 @@ a.footnote-ref { } #mobile-menu { - right: 1.2em; + right: 4.2em; } #home-subtitle { font-size: 0.5em; diff --git a/hugo.toml b/hugo.toml index 1b48c01..380c790 100644 --- a/hugo.toml +++ b/hugo.toml @@ -65,7 +65,7 @@ enableEmoji = true # bgImg = "" # gitUrl = "https://github.com/1bl4z3r/hermit-V2/tree/staging" - justifyContent = true + justifyContent = false relatedPosts = true code_copy_button = true @@ -76,6 +76,7 @@ enableEmoji = true readTime = true readTimeSeparator = "\u2026 \u23F2 Reading Time:" # legacyLayout = false + shareSocial = true [[params.socialLinks]] name = "mastodon" diff --git a/i18n/en.toml b/i18n/en.toml index e68038a..7e0c4dc 100644 --- a/i18n/en.toml +++ b/i18n/en.toml @@ -34,5 +34,8 @@ other = "Older" [menu] other = "Menu" +[share] +other = "Share" + [featuredImage] other = "Featured Image" diff --git a/i18n/es.toml b/i18n/es.toml index 6e5410e..7b167f6 100644 --- a/i18n/es.toml +++ b/i18n/es.toml @@ -34,5 +34,8 @@ other = "Previo" [menu] other = "Menú" +[share] +other = "Cuota" + [featuredImage] other = "Imagen Presentada" diff --git a/i18n/fr.toml b/i18n/fr.toml index 1623093..33a63f2 100644 --- a/i18n/fr.toml +++ b/i18n/fr.toml @@ -34,5 +34,8 @@ other = "Précédent" [menu] other = "Menu" +[share] +other = "Partager" + [featuredImage] other = "Image sélectionnée" diff --git a/i18n/it.toml b/i18n/it.toml index 25445ba..5a80e3d 100644 --- a/i18n/it.toml +++ b/i18n/it.toml @@ -31,5 +31,8 @@ other = "Precedente" [menu] other = "Menu" +[share] +other = "Condividere" + [featuredImage] other = "Immagine in primo piano" diff --git a/i18n/zh-hans.toml b/i18n/zh-hans.toml index b9c064a..59b80c9 100644 --- a/i18n/zh-hans.toml +++ b/i18n/zh-hans.toml @@ -34,5 +34,8 @@ other = "旧" [menu] other = "菜单" +[share] +other = "分享" + [featuredImage] other = "特色图片" diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 18a19e6..da5ce02 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -14,10 +14,11 @@ {{- end }} {{- with .Params.toc -}} - {{- end }} + {{- end -}} {{- with .Site.Params.socialLinks -}} {{ partialCached "social-icons.html" . }} {{- end -}} + {{- if and (not (eq .Site.Params.shareSocial nil)) (.Site.Params.shareSocial) -}}{{- partial "social-share.html" . -}}{{- end -}} diff --git a/layouts/partials/social-share.html b/layouts/partials/social-share.html new file mode 100644 index 0000000..a4239c2 --- /dev/null +++ b/layouts/partials/social-share.html @@ -0,0 +1,21 @@ + + + \ No newline at end of file diff --git a/layouts/partials/svg.html b/layouts/partials/svg.html index 0d4ad7b..61333e8 100644 --- a/layouts/partials/svg.html +++ b/layouts/partials/svg.html @@ -51,7 +51,7 @@ {{- else if (eq .name "author") -}} {{- else if (eq .name "scrollup") -}} - + {{- else if (eq .name "discord") -}} {{- else if (eq .name "admonition_note") -}} @@ -78,6 +78,8 @@ {{- else if (eq .name "posts_single_tags") -}} +{{- else if (eq .name "share") -}} + {{- else -}} {{- end -}}