diff --git a/README.md b/README.md index f72e34c..a055e49 100644 --- a/README.md +++ b/README.md @@ -85,6 +85,8 @@ summaryLength = 70 # number of words for article summaries plausibleScriptUrl = "https://something.com/..." plausibleDomain = "example.com" + enableShareOnFediverse = false # enable a button at the end of an article to share it on the fediverse + # WARNING: deprecated! Use [[menu.icons]] instead, look below # links = [ # ["GitLab", "https://gitlab.com/gabmus"], diff --git a/assets/scss/style.scss b/assets/scss/style.scss index 35a1500..49d53a5 100644 --- a/assets/scss/style.scss +++ b/assets/scss/style.scss @@ -499,6 +499,81 @@ a.discreteTag { @include buttonLikeLink; } +.shareBtn { + {{ if eq (site.Params.navType | default "standard") "circles" }} + @include buttonLikeLink; + {{ end }} + font-size: 1.2em; + cursor: pointer; +} + +input { + {{ if or (site.Params.discreteCards | default false) (eq (site.Params.navType | default "standard") "circles") }} + @include buttonLikeLink; + &:hover, &:focus, &:active { + background-color: $highlight_bg_color; + } + {{ end }} + background-color: $highlight_bg_color; + padding: 12px; + color: $fg_color; + border: 2px solid transparent; + transition: .15s border ease-in-out; + &:focus, &:active { + border: 2px solid $accent_color; + outline: none; + } +} + +#fediInstanceDialog { + display: none; + position: fixed; + top: 0; bottom: 0; left: 0; right: 0; + + .dialog { + position: absolute; + display: flex; flex-direction: column; + top: 24px; + left: 50%; transform: translateX(-50%); + z-index: 9999; + background-color: $bg_color; + width: 450px; + max-width: 100%; + padding: 24px; + {{ if site.Params.discreteCards }} + border-radius: $border_radius; + {{ end }} + h1, h2, h3, h4 { + margin: 0; + } + h2 { + margin-bottom: 24px; + } + input { + display: block; + } + .buttons { + margin: 12px 0; + display: flex; + flex-direction: row; + justify-content: end; + > * { + margin-left: 24px; + } + } + } + .bg { + z-index: 99; + position: absolute; + top: 0; bottom: 0; left: 0; right: 0; + background-color: rgba(0, 0, 0, .4); + cursor: pointer; + } + &.open { + display: block; + } +} + {{ if .Site.Params.mobileHamburgerNav | default false }} header { #hamburger-menu { diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 8ea3b99..8cb6586 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -26,6 +26,7 @@

{{ end }} {{- partial "inject/content-after.html" . -}} + {{- partial "share_on_fediverse.html" . -}} {{- partial "commento.html" . -}} {{- partial "cactus_chat.html" . -}} {{- partial "related_articles.html" . -}} diff --git a/layouts/partials/share_on_fediverse.html b/layouts/partials/share_on_fediverse.html new file mode 100644 index 0000000..b1c7b59 --- /dev/null +++ b/layouts/partials/share_on_fediverse.html @@ -0,0 +1,38 @@ +{{ if site.Params.enableShareOnFediverse | default false }} + Share on the Fediverse +
+
+
+

Enter your instance's address

+ +
+ + +
+
+
+ +{{ end }}