From 21adf22d8b2613f90ed664b81d80be459cc4f458 Mon Sep 17 00:00:00 2001 From: lostinlight Date: Mon, 4 Jun 2018 17:30:53 +0300 Subject: [PATCH] Update styles, add author to featured post --- ...works.md => why-use-federated-networks.md} | 16 ++++--- .../banner.jpg | Bin source/img/authors/default-avatar.png | Bin 0 -> 3386 bytes themes/starter/layout/_partial/featured.ejs | 15 +++++-- themes/starter/layout/_partial/heroheader.ejs | 14 ++++++ .../assets/scss/modules/_chronicles.scss | 41 +++++++++++++++--- .../assets/scss/modules/_heroheader.scss | 9 +++- .../source/assets/scss/modules/_index.scss | 1 + .../source/assets/scss/partials/_layout.scss | 2 +- 9 files changed, 78 insertions(+), 20 deletions(-) rename source/_posts/{Why-use-federated-networks.md => why-use-federated-networks.md} (62%) rename source/_posts/{Why-use-federated-networks => why-use-federated-networks}/banner.jpg (100%) create mode 100644 source/img/authors/default-avatar.png diff --git a/source/_posts/Why-use-federated-networks.md b/source/_posts/why-use-federated-networks.md similarity index 62% rename from source/_posts/Why-use-federated-networks.md rename to source/_posts/why-use-federated-networks.md index 4dc1465..1fc62e5 100644 --- a/source/_posts/Why-use-federated-networks.md +++ b/source/_posts/why-use-federated-networks.md @@ -1,24 +1,26 @@ --- layout: "post" -title: "Why use federated networks (WIP)" +title: "Why use federated networks (updated)" date: 2018-02-27 tags: - fediverse preview: - "This article is a stub. You can help the Fediverse wiki by expanding it. Anyone welcome to contribute. It may be a less technical article, for your friend and your grandma. Explaining with vivid examples why privacy is important, how corporate entities are misusing their capabilities, etc." -url: "/en/post/Why-use-federated-networks" + "This article is a stub. You can help the Fediverse website by expanding it. Anyone welcome to contribute. It may be a less technical article, for your friend and your grandma. Explaining with examples why privacy is important, how corporate entities are misusing their capabilities, etc." +url: "/en/post/why-use-federated-networks" lang: en -banner: "banner.jpg" featured: true +banner: "banner.jpg" +authors: + - Jane Doe --- -This article is a stub. You can help the Fediverse wiki by expanding it. Anyone welcome to contribute. +This article is a stub. You can help the Fediverse website by expanding it. Anyone welcome to contribute. It may be a less technical article, for your friend and your grandma. Explaining with vivid examples why privacy is important, how corporate entities are misusing their capabilities, etc. See [this article](https://signal.org/blog/the-ecosystem-is-moving) by M. Marlinspike elaborating on why federation *is not* the future. -There are few articles about the strong points of federated / decentralized networks on the net. Some of those are research papers using obscure scientific language. Would be nice to have a thorough writing on why Moxy didn't get the point of federation. May be its point is not about providing same smooth experience for everyone (which, really, is quite hard). May be its point is in promoting a new concept, users expecting to lose certain convenient features of centralized systems in exchange for benefits that a centralized system can not guarantee. Singling out these benefits, as well as describing weak points of centralized systems is desirable. Add facts / links to many recent data breaches, misuse of centralized networks, etc... +There are few articles about the strong points of federated / decentralized networks on the net. Some of those are research papers using obscure scientific language. Would be nice to have a thorough writing on why Moxy didn't get the point of federation. May be its point is not about providing same smooth experience for everyone (which, really, is quite hard). May be its point is in promoting a new concept, users expecting to lose certain convenient features of centralized systems in exchange for benefits that a centralized system can not guarantee. Singling out these benefits, as well as describing weak points of centralized systems is desirable. Add facts / links to many recent data breaches, misuse of centralized networks, etc. -I'll add some links to research papers on decentralization later. Please, don't hesitate to join and help writing this article. +Please, join and [contribute](https://gitlab.com/fediverse/fediverse.gitlab.io/blob/master/CONTRIBUTING.md) to complete this article. diff --git a/source/_posts/Why-use-federated-networks/banner.jpg b/source/_posts/why-use-federated-networks/banner.jpg similarity index 100% rename from source/_posts/Why-use-federated-networks/banner.jpg rename to source/_posts/why-use-federated-networks/banner.jpg diff --git a/source/img/authors/default-avatar.png b/source/img/authors/default-avatar.png new file mode 100644 index 0000000000000000000000000000000000000000..5053ea11b48cc15a028f3f6588b80ac6b7d9ca93 GIT binary patch literal 3386 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
@@ -9,16 +17,15 @@ featured post image + author
-

+

<%- post.title %>

<%- post.preview %>

<%= date %> - - <% post.tags.map(function(tag) { %>#<%= tag.name %> <% }) %> - + by <% post.authors.map(function(author) { %><%= author %> <% }) %>

diff --git a/themes/starter/layout/_partial/heroheader.ejs b/themes/starter/layout/_partial/heroheader.ejs index 1a48290..8372719 100644 --- a/themes/starter/layout/_partial/heroheader.ejs +++ b/themes/starter/layout/_partial/heroheader.ejs @@ -1,7 +1,21 @@ +<% + let avatarPath =""; + + if (page.avatar) { + avatarPath = page.avatar; + } else { + avatarPath = "default-avatar.png"; + } +%> +

<%= page.title %>

<%= page.subtitle || "" %>

+ <% if (page.authors) { %> +

Author: <% page.authors.map(function(author) { %><%= author %> <% }) %>

+ author + <% } %>
diff --git a/themes/starter/source/assets/scss/modules/_chronicles.scss b/themes/starter/source/assets/scss/modules/_chronicles.scss index c8ebdbb..550c67a 100644 --- a/themes/starter/source/assets/scss/modules/_chronicles.scss +++ b/themes/starter/source/assets/scss/modules/_chronicles.scss @@ -11,6 +11,7 @@ .chronicles .links { width: 150px; height: 150px; + margin-bottom: 2em; } .chronicles .section-title h4 { @@ -32,7 +33,7 @@ } .post__preview { - padding: .5em 1.5em; + padding: .8em 1.5em; border: 1px solid $grey; border-radius: 10px; position: relative; @@ -56,7 +57,7 @@ .post__preview:not(.wanted):not(.featured) { flex: 32% 0 0; - height: 240px; + height: 270px; } .post__preview:not(.wanted):not(.featured) .post__meta { @@ -84,11 +85,16 @@ .post__preview.featured { border: none; display: flex; - justify-content: space-around; + justify-content: space-between; flex-wrap: wrap; - margin: 2em 0 3em; + margin: 3em 0; max-height: 300px; - overflow: hidden; + &:hover, + &:active, + &:focus { + color: inherit; + opacity: .85; + } } .post__preview.featured p { @@ -99,14 +105,31 @@ line-height: 1; } -.post__preview.featured img, +.post__preview.featured > img:first-child, .post__preview.featured .post__content { flex: 45% 0 0; } +.post__preview.featured > img:first-child { + border-radius: 10px; +} + +.post__avatar { + position: absolute; + right: 50%; + top: -30px; + width: 85px; + height: 85px; + text-align: center; + border-radius: 50%; + border: 10px solid $white; + background: $white; +} + .post__preview.featured .post__content { display: flex; flex-direction: column; + overflow: hidden; } .post__content > .post__text { @@ -178,7 +201,11 @@ $taglist: (diaspora, $diaspora), max-height: inherit; } - .post__preview.featured img, + .post__avatar { + right: 0%; + } + + .post__preview.featured > img:first-child, .post__preview.featured .post__content { flex: 100% 0 0; margin-bottom: 2em; diff --git a/themes/starter/source/assets/scss/modules/_heroheader.scss b/themes/starter/source/assets/scss/modules/_heroheader.scss index 393edae..36bffc5 100644 --- a/themes/starter/source/assets/scss/modules/_heroheader.scss +++ b/themes/starter/source/assets/scss/modules/_heroheader.scss @@ -4,7 +4,7 @@ top: 0; left: 0; width: 100%; - height: 550px; + height: 500px; background-size: cover; color: $white; text-align: center; @@ -16,3 +16,10 @@ .hero-header .heading { flex: 0 1 auto; } + +.heading__avatar { + margin-top: .5em; + border: 2px solid $white; + background: $white; + border-radius: 50%; +} diff --git a/themes/starter/source/assets/scss/modules/_index.scss b/themes/starter/source/assets/scss/modules/_index.scss index 6ffec4f..7dea4bc 100644 --- a/themes/starter/source/assets/scss/modules/_index.scss +++ b/themes/starter/source/assets/scss/modules/_index.scss @@ -43,6 +43,7 @@ height: 80px; flex: 40% 0 0; border: 3px solid $white; + background: $white; border-radius: 50%; } diff --git a/themes/starter/source/assets/scss/partials/_layout.scss b/themes/starter/source/assets/scss/partials/_layout.scss index 2ca11a0..271be22 100644 --- a/themes/starter/source/assets/scss/partials/_layout.scss +++ b/themes/starter/source/assets/scss/partials/_layout.scss @@ -86,7 +86,7 @@ h6 { } h1 { - font-size: 3rem; + font-size: 2.5rem; } h3 {