diff --git a/source/_data/diaspora.json b/source/_data/diaspora.json index 97c2d87..3e8d990 100644 --- a/source/_data/diaspora.json +++ b/source/_data/diaspora.json @@ -29,6 +29,10 @@ "descr": "The diaspora* project appeared in 2010, when a group of friends decided to create a social network that would return control to users. The project's mascot is dandelion, and diaspora* servers are called \"pods\". Information about the new network spread far and wide like dandelion's seeds in the wind, attracting newcomers, increasing the number of available pods. Today it's a community project with a stable userbase. Many people joined diaspora* in search of a macroblogging platform independent from corporations.", "communities": "", "connections": ["Friendica", "Hubzilla", "Socialhome", "GangGo"], + "screenshots": + [ + {"descr": "diaspora stream", "img": "diaspora-1.png"} + ], "features": [ "tag subscription", diff --git a/source/_data/friendica.json b/source/_data/friendica.json index ac05dbc..261bc9e 100644 --- a/source/_data/friendica.json +++ b/source/_data/friendica.json @@ -40,9 +40,17 @@ ], "mascot": [{"item": "Flaxy O'Hare", "imgNum": "1"}], "dwellers": "friends", - "communities": [{"title": "List of forums", "url": "https://dir.friendica.social/forums"}], - "descr": "Friendica aims at being a platform that suits everyone. Newcomers will feel right at home: the network's interface and functionality include common features of a mainstream social network. Being comparatively light on resources makes it attractive for administrators to host (Friendica's servers are called \"nodes\"). The community is good-natured and helpful. Friendica is well connected with the rest of Fediverse — its users can follow friends on most other federated networks.", + "communities": [ + {"title": "List of forums", "url": "https://dir.friendica.social/forums"}, + {"title": "Nodes by theme", "url": "https://gitlab.com/distributopia/friendica-world-overview"} + ], + "descr": "Friendica aims at being a platform that suits everyone. Newcomers will feel right at home: the network's interface and functionality include common features of a mainstream social network. Being comparatively light on resources makes it attractive for administrators to host (Friendica servers are called \"nodes\"). The community is good-natured and helpful. Friendica is well connected with the rest of Fediverse — its users can follow friends on most other federated networks.", "connections": ["diaspora*", "GangGo", "GNU Social", "Hubzilla", "Mastodon", "Osada", "Pleroma", "postActiv", "Socialhome"], + "screenshots": + [ + {"descr": "Default Friendica theme", "img": "friendica-1.png"}, + {"descr": "Green Friendica theme", "img": "friendica-2.png"} + ], "tracker": "https://github.com/friendica/friendica/issues", "bounty": "", "translating": "https://www.transifex.com/Friendica/friendica", diff --git a/source/_data/gnusocial.json b/source/_data/gnusocial.json index b985ee2..90a309a 100644 --- a/source/_data/gnusocial.json +++ b/source/_data/gnusocial.json @@ -37,6 +37,10 @@ "communities": [{"title": "List of groups", "url": "http://laemeur.sdf.org/gs/group-index.html"}], "descr": "GNU Social creators are the founding fathers of free libre microblogging networks. The platform has a significant userbase and multiple plugins.", "connections": ["Friendica", "Hubzilla", "Mastodon", "Pleroma", "postActiv"], + "screenshots": + [ + {"descr": "GNU Social interface", "img": "gnusocial-1.png"} + ], "tracker": "https://git.gnu.io/gnu/gnu-social/issues", "bounty": "", "translating": "https://www.transifex.com/gnu-social/gnu-social", diff --git a/source/_data/mastodon.json b/source/_data/mastodon.json index 831726b..2f7c5d8 100644 --- a/source/_data/mastodon.json +++ b/source/_data/mastodon.json @@ -61,14 +61,19 @@ {"id": "1", "url": "https://crossposter.masto.donte.com.br"}, {"id": "2", "url": "http://www.unmung.com/mastoview"}, - {"id": "4", "url": "https://fed.brid.gy"}, - {"id": "5", "url": "https://gitlab.com/chaica/feed2toot"} + {"id": "3", "url": "https://fed.brid.gy"}, + {"id": "4", "url": "https://gitlab.com/chaica/feed2toot"} ], "mascot": [{"item": "mastodon", "imgNum": "1"}, {"item": "trumpet", "imgNum": "2"}], "dwellers": "mastonauts", - "communities": [{"title": "List of servers by theme", "url": "https://github.com/distributopia/masto-world-overview"}], - "descr": "Mastodon network grew quickly and its development is still speedy. You'll find everything you want of a microblogging platform, and much more. There are numerous Mastodon servers (called \"instances\") created specifically for certain communities and dedicated to various interests, spheres of knowledge, regions and activities.", + "communities": [{"title": "List of servers by theme", "url": "https://gitlab.com/distributopia/masto-world-overview"}], + "descr": "Mastodon network grew quickly. You'll find everything you want of a microblogging platform, and much more. There are numerous Mastodon servers (called \"instances\") created specifically for certain communities and dedicated to various interests, spheres of knowledge, regions and activities.", "connections": ["Friendica", "GNU Social", "Hubzilla", "Misskey", "Osada", "PeerTube", "Pleroma", "postActiv"], + "screenshots": + [ + {"descr": "Default tweetdeck layout", "img": "mastodon-1.png"}, + {"descr": "Alternative Pinafore layout", "img": "mastodon-2.png"} + ], "features": [ "contact lists", @@ -82,7 +87,7 @@ ], "information": [ - "Direct messages (\"private messages\") will be delivered with limited visibility (non public) only between Mastodon users. Friends from other networks may get such \"direct messages\" as public (visible to all) because some networks (GNU Social) don't support DMs, and other projects don't know how to handle them and by default make them public (Friendica, Hubzilla, Osada). Keep that in mind when sharing something private via a DM." + "Direct messages (\"private messages\") are delivered with limited visibility (non public) only between Mastodon users. Friends from other networks may get such \"direct messages\" as public (visible to all) because some networks (GNU Social) don't support DMs, and other projects (Friendica, Hubzilla, Osada) by default make them public. Keep that in mind when sharing something private via a DM." ], "donate": "https://patreon.com/mastodon", "tracker": "https://github.com/tootsuite/mastodon/issues", diff --git a/source/_data/misskey.json b/source/_data/misskey.json index 02df4e5..70287c8 100644 --- a/source/_data/misskey.json +++ b/source/_data/misskey.json @@ -27,6 +27,10 @@ "communities": "", "descr": "Apart from mainstream microblogging features, this network has many nice additions. User profile can be customized to show less or more available widgets. The project is in active development, parts of its interface have not been fully translated to other languages (main language is Japanese) — anyone can contribute translations and improve the network.", "connections": ["Mastodon", "Pleroma"], + "screenshots": + [ + {"descr": "Misskey interface", "img": "misskey-1.png"} + ], "features": [ "polls", diff --git a/source/_data/peertube.json b/source/_data/peertube.json index d47bd79..c8fdafc 100644 --- a/source/_data/peertube.json +++ b/source/_data/peertube.json @@ -40,6 +40,10 @@ "communities": "", "descr": "Unlike centralized video platforms, PeerTube considers each user as a person, and not as a product to track and sell advertisements. PeerTube's goal is to create a network of small interconnected video hosting providers. Users are free to choose the hoster of their videos according to terms of service and moderation policy. There are no recommendation algorithms and no need to give away extended copyright to your work. PeerTube video broadcasting is peer-to-peer (through WebRTC): when other people watch a PeerTube video at the same time as you, as long as your tab remains open, your browser shares bits of that video and you participate in a healthier use of the Internet. Videos hosted on PeerTube can be viewed directly from Mastodon and (soon) other Fediverse networks.", "connections": ["Friendica", "Mastodon", "Pleroma"], + "screenshots": + [ + {"descr": "PeerTube interface", "img": "peertube-1.png"} + ], "donate": "https://soutenir.framasoft.org/en", "tracker": "https://github.com/Chocobozzz/PeerTube/issues", "bounty": "", diff --git a/source/_data/pixelfed.json b/source/_data/pixelfed.json index 848e7db..46083ac 100644 --- a/source/_data/pixelfed.json +++ b/source/_data/pixelfed.json @@ -28,6 +28,11 @@ "communities": "", "descr": "Pixelfed is an image sharing platform with modern user interface.", "connections": ["Friendica", "Mastodon", "Misskey", "Pleroma"], + "screenshots": + [ + {"descr": "Pixelfed interface", "img": "pixelfed-1.png"}, + {"descr": "Alternative MicroUI", "img": "pixelfed-2.png"} + ], "donate": "https://www.patreon.com/dansup", "tracker": "https://github.com/dansup/pixelfed/issues", "bounty": "", diff --git a/source/_data/pleroma.json b/source/_data/pleroma.json index b2522ef..1e3f47b 100644 --- a/source/_data/pleroma.json +++ b/source/_data/pleroma.json @@ -39,6 +39,10 @@ "communities": "", "descr": "Pleroma microblogging platform was quickly appreciated by the community for its low resource consumption. If you have a Raspberry Pi or similar single-board computer you can use it as Pleroma server for family and friends.", "connections": ["Friendica", "GNU Social", "Hubzilla", "Mastodon", "microblog.pub", "Misskey", "Peertube", "Pleroma", "Plume", "postActiv", "WriteFreely"], + "screenshots": + [ + {"descr": "Default Pleroma layout", "img": "pleroma-1.png"} + ], "tracker": "https://git.pleroma.social/pleroma/pleroma/issues", "bounty": "", "translating": "https://l10n.swecha.org/projects/pleroma/pleroma-fe", diff --git a/source/_data/socialhome.json b/source/_data/socialhome.json index 2548177..16265f3 100644 --- a/source/_data/socialhome.json +++ b/source/_data/socialhome.json @@ -28,6 +28,10 @@ "communities": "", "descr": "Socialhome's column grid layout makes it a perfect network for sharing image content or creating personal portfolio and delivering new posts to friends from other Fediverse platforms.", "connections": ["diaspora*", "Friendica", "Hubzilla", "GangGo"], + "screenshots": + [ + {"descr": "Socialhome grid layout", "img": "socialhome-1.png"} + ], "features": [ "pinned posts" diff --git a/source/img/aardwolf-bg.jpg b/source/img/aardwolf-bg.jpg deleted file mode 100644 index c29af4a..0000000 Binary files a/source/img/aardwolf-bg.jpg and /dev/null differ diff --git a/source/img/aardwolf.png b/source/img/aardwolf.png deleted file mode 100644 index 3fecda7..0000000 Binary files a/source/img/aardwolf.png and /dev/null differ diff --git a/source/img/ganggo-bg.jpg b/source/img/ganggo-bg.jpg deleted file mode 100644 index abc8463..0000000 Binary files a/source/img/ganggo-bg.jpg and /dev/null differ diff --git a/source/img/ganggo.png b/source/img/ganggo.png deleted file mode 100644 index c589b85..0000000 Binary files a/source/img/ganggo.png and /dev/null differ diff --git a/source/img/osada-bg.jpg b/source/img/osada-bg.jpg deleted file mode 100644 index fbb426c..0000000 Binary files a/source/img/osada-bg.jpg and /dev/null differ diff --git a/source/img/osada.png b/source/img/osada.png deleted file mode 100644 index 3286a07..0000000 Binary files a/source/img/osada.png and /dev/null differ diff --git a/source/img/postactiv-bg.jpg b/source/img/postactiv-bg.jpg deleted file mode 100644 index 17d43b4..0000000 Binary files a/source/img/postactiv-bg.jpg and /dev/null differ diff --git a/source/img/postactiv.png b/source/img/postactiv.png deleted file mode 100644 index 607de44..0000000 Binary files a/source/img/postactiv.png and /dev/null differ diff --git a/source/img/screenshots/diaspora-1.png b/source/img/screenshots/diaspora-1.png new file mode 100644 index 0000000..101ed67 Binary files /dev/null and b/source/img/screenshots/diaspora-1.png differ diff --git a/source/img/screenshots/friendica-1.png b/source/img/screenshots/friendica-1.png new file mode 100644 index 0000000..add2d27 Binary files /dev/null and b/source/img/screenshots/friendica-1.png differ diff --git a/source/img/screenshots/friendica-2.png b/source/img/screenshots/friendica-2.png new file mode 100644 index 0000000..28f6cd3 Binary files /dev/null and b/source/img/screenshots/friendica-2.png differ diff --git a/source/img/screenshots/funkwhale-1.png b/source/img/screenshots/funkwhale-1.png new file mode 100644 index 0000000..3bc657a Binary files /dev/null and b/source/img/screenshots/funkwhale-1.png differ diff --git a/source/img/screenshots/funkwhale-2.jpg b/source/img/screenshots/funkwhale-2.jpg new file mode 100644 index 0000000..2111b7a Binary files /dev/null and b/source/img/screenshots/funkwhale-2.jpg differ diff --git a/source/img/screenshots/gnusocial-1.png b/source/img/screenshots/gnusocial-1.png new file mode 100644 index 0000000..a4bce8b Binary files /dev/null and b/source/img/screenshots/gnusocial-1.png differ diff --git a/source/img/screenshots/mastodon-1.png b/source/img/screenshots/mastodon-1.png new file mode 100644 index 0000000..17dd6c3 Binary files /dev/null and b/source/img/screenshots/mastodon-1.png differ diff --git a/source/img/screenshots/mastodon-2.png b/source/img/screenshots/mastodon-2.png new file mode 100644 index 0000000..e327238 Binary files /dev/null and b/source/img/screenshots/mastodon-2.png differ diff --git a/source/img/screenshots/misskey-1.png b/source/img/screenshots/misskey-1.png new file mode 100644 index 0000000..c7fbc12 Binary files /dev/null and b/source/img/screenshots/misskey-1.png differ diff --git a/source/img/screenshots/peertube-1.png b/source/img/screenshots/peertube-1.png new file mode 100644 index 0000000..5ac468e Binary files /dev/null and b/source/img/screenshots/peertube-1.png differ diff --git a/source/img/screenshots/pixelfed-1.png b/source/img/screenshots/pixelfed-1.png new file mode 100644 index 0000000..09e5599 Binary files /dev/null and b/source/img/screenshots/pixelfed-1.png differ diff --git a/source/img/screenshots/pixelfed-2.png b/source/img/screenshots/pixelfed-2.png new file mode 100644 index 0000000..20108c0 Binary files /dev/null and b/source/img/screenshots/pixelfed-2.png differ diff --git a/source/img/screenshots/pleroma-1.png b/source/img/screenshots/pleroma-1.png new file mode 100644 index 0000000..47a7143 Binary files /dev/null and b/source/img/screenshots/pleroma-1.png differ diff --git a/source/img/screenshots/socialhome-1.png b/source/img/screenshots/socialhome-1.png new file mode 100644 index 0000000..3740095 Binary files /dev/null and b/source/img/screenshots/socialhome-1.png differ diff --git a/themes/starter/.stylelintrc.json b/themes/starter/.stylelintrc.json index 7791041..4d7de23 100644 --- a/themes/starter/.stylelintrc.json +++ b/themes/starter/.stylelintrc.json @@ -34,7 +34,6 @@ "selector-pseudo-element-colon-notation": "single", "string-no-newline": true, "string-quotes": "double", - "value-keyword-case": "lower", "value-no-vendor-prefix": true } } diff --git a/themes/starter/layout/_partial/world.ejs b/themes/starter/layout/_partial/world.ejs index 40ae315..8e89740 100644 --- a/themes/starter/layout/_partial/world.ejs +++ b/themes/starter/layout/_partial/world.ejs @@ -77,12 +77,23 @@

<%= data.descr %>

+<% if (data.screenshots) { %> +
+ <% for (item in data.screenshots) { %> +
+
<%= data.screenshots[item].descr %>
+ <%= data.screenshots[item].descr %> +
+ <% } %> +
+<% } %> + <% if (data.features) { %>

<%- __('features') %>

-
<% } %> -
<%- partial('_partial/join') %>
@@ -125,7 +135,7 @@

<%- __('reading') %>

diff --git a/themes/starter/layout/crystalball.ejs b/themes/starter/layout/crystalball.ejs index b6cc6de..621e35f 100644 --- a/themes/starter/layout/crystalball.ejs +++ b/themes/starter/layout/crystalball.ejs @@ -3,7 +3,7 @@ layout: layout --- -
+
crystall ball

Hello, I'm Fediverse Crystal Ball

I can do one thing and do it well diff --git a/themes/starter/layout/tag.ejs b/themes/starter/layout/tag.ejs index 261247c..8ff5571 100644 --- a/themes/starter/layout/tag.ejs +++ b/themes/starter/layout/tag.ejs @@ -9,7 +9,7 @@ } %> -
+
<% site.tags.map(function(tag) { %> <%- partial('_partial/snowflake') %> class="tag--current" <% } %> ><%= tag.name %> diff --git a/themes/starter/layout/tags.ejs b/themes/starter/layout/tags.ejs index a6dbfb1..b7a55dd 100644 --- a/themes/starter/layout/tags.ejs +++ b/themes/starter/layout/tags.ejs @@ -3,7 +3,7 @@ layout: layout --- -
+
<% site.tags.map(function(tag) { %> <%- partial('_partial/snowflake') %><%= tag.name %>   diff --git a/themes/starter/source/assets/scss/modules/_chronicles.scss b/themes/starter/source/assets/scss/modules/_chronicles.scss index 9242a0a..8c05671 100644 --- a/themes/starter/source/assets/scss/modules/_chronicles.scss +++ b/themes/starter/source/assets/scss/modules/_chronicles.scss @@ -144,15 +144,6 @@ justify-content: space-between; } -svg.f-tag { - position: absolute; - width: 20px; - height: 20px; - right: .5em; - top: .5em; - fill: $golden; -} - .post__preview .oneliner:hover, .post__preview .oneliner:focus, .post__preview .oneliner:active { @@ -172,27 +163,6 @@ svg.f-tag { color: $golden; } -$taglist: (diaspora, $diaspora), - (friendica, $friendica), - (hubzilla, $hubzilla), - (gnusocial, $gnusocial), - (mastodon, $mastodon), - (socialhome, $socialhome), - (pleroma, $pleroma), - (ganggo, $ganggo), - (aardwolf, $aardwolf), - (postactiv, $postactiv), - (peertube, $peertube), - (misskey, $misskey), - (osada, $osada), - (pixelfed, $pixelfed); - -@each $tag, $color in $taglist { - svg.#{$tag} { - fill: $color; - } -} - @media screen and (max-width: $mq-large) { .chronicles .urgent { right: 9em; diff --git a/themes/starter/source/assets/scss/modules/_crystalball.scss b/themes/starter/source/assets/scss/modules/_crystalball.scss index 648e702..156ba80 100644 --- a/themes/starter/source/assets/scss/modules/_crystalball.scss +++ b/themes/starter/source/assets/scss/modules/_crystalball.scss @@ -1,8 +1,4 @@ -.ball { - min-height: 100vh; -} - .question { margin-top: 1em; } diff --git a/themes/starter/source/assets/scss/modules/_network.scss b/themes/starter/source/assets/scss/modules/_network.scss index 01383ab..eced202 100644 --- a/themes/starter/source/assets/scss/modules/_network.scss +++ b/themes/starter/source/assets/scss/modules/_network.scss @@ -40,13 +40,49 @@ img.mascot { margin: 0 .2em; } +.screens { + display: flex; + flex-direction: column; + margin: .4em 0; +} +.screen { + flex: 100% 0 0; + margin: .3em; +} + +.screen > img { + width: 70%; + border: 1px solid $grey; +} + +.screen figcaption { + text-align: center; + font-size: .85rem; + color: $asphalt; + opacity: .7; + margin-bottom: .7em; +} + +.features { + display: flex; + flex-wrap: wrap; +} + +.features > li { + flex: 50% 0 0; + padding: 0; +} @media screen and (max-width: $mq-small) { .network aside { display: none; } + .features > li { + flex: 100% 0 0; + } + .network .connections li:first-of-type { margin-top: 1em; } diff --git a/themes/starter/source/assets/scss/partials/_fonts.scss b/themes/starter/source/assets/scss/partials/_fonts.scss index 75ea9bf..e9147fe 100644 --- a/themes/starter/source/assets/scss/partials/_fonts.scss +++ b/themes/starter/source/assets/scss/partials/_fonts.scss @@ -1,5 +1,5 @@ -$font-primary: "primary", "Open Sans", "Helvetica Neue", "Roboto", sans-serif; +$font-primary: "primary", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica", "Lato", "Aria", sans-serif; $font-secondary: "secondary", "Georgia", sans-serif; [class^="icon-"], diff --git a/themes/starter/source/assets/scss/partials/_layout.scss b/themes/starter/source/assets/scss/partials/_layout.scss index 7d465f7..486c9b6 100644 --- a/themes/starter/source/assets/scss/partials/_layout.scss +++ b/themes/starter/source/assets/scss/partials/_layout.scss @@ -26,8 +26,8 @@ html { body { font-size: 1.05rem; - font-family: $font-primary, "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif; - line-height: 1.7; + font-family: $font-primary; + line-height: 1.6; overflow-x: hidden; color: $black; background-color: $black; @@ -350,8 +350,40 @@ dfn { border-radius: 50%; } -.article-list li:before { - background: $golden; +svg.f-tag { + position: absolute; + width: 20px; + height: 20px; + right: .5em; + top: .5em; + fill: $golden; +} + +$list: (diaspora, $diaspora), + (friendica, $friendica), + (hubzilla, $hubzilla), + (gnusocial, $gnusocial), + (mastodon, $mastodon), + (socialhome, $socialhome), + (pleroma, $pleroma), + (ganggo, $ganggo), + (aardwolf, $aardwolf), + (postactiv, $postactiv), + (peertube, $peertube), + (misskey, $misskey), + (osada, $osada), + (pixelfed, $pixelfed); + +@each $tag, $color in $list { + svg.#{$tag} { + fill: $color; + } +} + +@each $network, $color in $list { + .article-list > li.#{$network}:before { + background: $color; + } } .warning-list li:before { diff --git a/themes/starter/source/assets/scss/partials/_utils.scss b/themes/starter/source/assets/scss/partials/_utils.scss index 464e270..4ecc1a1 100644 --- a/themes/starter/source/assets/scss/partials/_utils.scss +++ b/themes/starter/source/assets/scss/partials/_utils.scss @@ -37,3 +37,7 @@ .u-center { text-align: center; } + +.u-height { + min-height: 100vh; +}