From bde26e62514fe971d15ba52518a8a2fd29803d8e Mon Sep 17 00:00:00 2001 From: "mb@mb" Date: Tue, 18 Dec 2018 23:19:48 +0100 Subject: [PATCH] first push to the transformations in-between-state of the website! --- content/pages/colophon.en.md | 16 +++ content/pages/colophon.nl.md | 16 +++ content/pages/header.en.md | 4 +- content/pages/infrastructure.en.md | 32 +++++ content/pages/stream.en.md | 4 - content/pages/stream.md | 16 +++ content/pages/stream.nl.md | 4 - themes/varia/static/css/main.css | 209 ++++++++++++++++++----------- themes/varia/templates/base.html | 38 +----- themes/varia/templates/index.html | 169 ++++++++++++----------- 10 files changed, 314 insertions(+), 194 deletions(-) create mode 100644 content/pages/colophon.en.md create mode 100644 content/pages/colophon.nl.md create mode 100644 content/pages/infrastructure.en.md delete mode 100644 content/pages/stream.en.md create mode 100644 content/pages/stream.md delete mode 100644 content/pages/stream.nl.md diff --git a/content/pages/colophon.en.md b/content/pages/colophon.en.md new file mode 100644 index 00000000..e79c890d --- /dev/null +++ b/content/pages/colophon.en.md @@ -0,0 +1,16 @@ +Title: colophon +Date: 2018-12-18 +Category: about +Slug: colophon +lang: en + +Varia
+Gouwstraat 3
+3082 BA
+Rotterdam
+[info@varia.zone](mailto:info@varia.zone) + +[mailinglist](https://we.lurk.org/postorius/lists/varia.we.lurk.org/)
+[RSS feed](feeds/all-en.rss.xml) + +[NL](/) / [EN](/en/){.active}
\ No newline at end of file diff --git a/content/pages/colophon.nl.md b/content/pages/colophon.nl.md new file mode 100644 index 00000000..8d2da714 --- /dev/null +++ b/content/pages/colophon.nl.md @@ -0,0 +1,16 @@ +Title: colophon +Date: 2018-12-18 +Category: about +Slug: colophon +lang: nl + +Varia
+Gouwstraat 3
+3082 BA
+Rotterdam
+[info@varia.zone](mailto:info@varia.zone) + +[mailinglijst](https://we.lurk.org/postorius/lists/varia.we.lurk.org/)
+[RSS feed](feeds/all-nl.rss.xml) + +[NL](/){.active} / [EN](/en/)
\ No newline at end of file diff --git a/content/pages/header.en.md b/content/pages/header.en.md index d910ac28..985ba425 100644 --- a/content/pages/header.en.md +++ b/content/pages/header.en.md @@ -4,4 +4,6 @@ Category: about Slug: header lang: en -*varia* (Gouwstraat 3, Rotterdam) is a space for developing collective approaches to everyday technology. *varia* is an [association](/en/pages/about.html#contact) whose members organize [events](/en/category/event.html) and collaborate in [work groups](/en/category/work-group.html). *varia* is [around 90m2](/en/pages/about.html#offline) and has a [100/35mbps connection](/en/pages/about.html#online). *varia* works with [free software](https://git.vvvvvvaria.org), provides [a set of tools](/en/pages/about.html). *varia* figures things out as she goes, tries to keep [notes](https://vvvvvvaria.org/archive), is [bilingual](/) and uses [info[@]varia.zone](mailto:info@varia.zone) to send and receive emails. +*varia* (Gouwstraat 3, Rotterdam) is a space for collective approaches to everyday technology. Through events and work groups, varia members facilitate [a social infrastructure](/en/pages/infrastructure.html) for questions, opinions, modifications, help and action. *varia* works with free software, is around 90m2 and has a 100/35mbps connection. *varia* figures things out as she goes, tries to keep notes, is [bilingual](/) and can be contacted via [info[@]varia.zone](mailto:info@varia.zone). + + diff --git a/content/pages/infrastructure.en.md b/content/pages/infrastructure.en.md new file mode 100644 index 00000000..78c8adfc --- /dev/null +++ b/content/pages/infrastructure.en.md @@ -0,0 +1,32 @@ +Title: infrastructure +Date: 2018-12-18 +Category: about +Slug: infrastructure +lang: en + +#Channels +varia experiments with tools for building physical and digital infrastructures of affinity. + +A conscious decision has been taken to be considerate about the channels that we use to communicate through: what kind of new interactions are made possible through the protocolary other? Its members use federated networks like XMPP group chats, Mastodon instances, RSS feeds or the unflinching mailing list. Fragmented spaces of sociality that self-determine how they connect to one another. + +We look for ways to stay connected by offering a locally-accessible [library](https://books.vvvvvvaria.org/)(accessible without login in Varia itself), etherpads, calendar and [git repositories](https://git.vvvvvvaria.org/). Similarly, we are working on developing a depot for electronic parts and workbenches, as well as printing facilities. + ++ archive mentioned somewhere + + +## online resources +*varia* hosts , , [etherpad](https://pad.vvvvvvaria.org/) and a [calender](https://cal.vvvvvvaria.org/). + +###XMPP +In addition to the above web services *varia* hosts a server for the federated chat protocol XMPP, supporting all the latest features. + + + IM observatory score + + + + +###RSS +Subscribe to our RSS feeds, available in [Dutch](http://varia.zone/feeds/all-nl.rss.xml) and [English](http://varia.zone/en/feeds/all-en.rss.xml). + +[Valid RSS] \ No newline at end of file diff --git a/content/pages/stream.en.md b/content/pages/stream.en.md deleted file mode 100644 index 51e42c26..00000000 --- a/content/pages/stream.en.md +++ /dev/null @@ -1,4 +0,0 @@ -Title: stream -Category: meta -Slug: stream -lang: en diff --git a/content/pages/stream.md b/content/pages/stream.md new file mode 100644 index 00000000..bd6c6489 --- /dev/null +++ b/content/pages/stream.md @@ -0,0 +1,16 @@ +Title: stream +Category: meta +Slug: stream + + +# 18 Dec 2018 +[![](https://vvvvvvaria.org/stream/fXQltIw8Ti2w4C0eYlQE5g.jpg)](https://vvvvvvaria.org/stream/fXQltIw8Ti2w4C0eYlQE5g.jpg){.container} + +--- + +# 12 Dec 2018 +XPPL is running! + +--- + + diff --git a/content/pages/stream.nl.md b/content/pages/stream.nl.md deleted file mode 100644 index c44f59d1..00000000 --- a/content/pages/stream.nl.md +++ /dev/null @@ -1,4 +0,0 @@ -Title: stream.nl -Category: meta -Slug: stream -lang: nl diff --git a/themes/varia/static/css/main.css b/themes/varia/static/css/main.css index 19fc33e4..2622b9d1 100644 --- a/themes/varia/static/css/main.css +++ b/themes/varia/static/css/main.css @@ -34,23 +34,21 @@ font-weight: bold; font-style: italic; } + body{ position: relative; - width: calc(100% - 50px); + width: calc(100% - 100px); min-width: 500px; top:0px; left:0px; - margin:0 auto 5em auto; - padding: 14px 15px; + margin:15px; + padding:0 10px; font-family: "main", monospace; font-size: 22px; line-height:1.65; background-color: rgba(238, 238, 238, 0.5); color:#164515; } -#content{ - margin-top:1em; -} /****************************/ /* general elements */ @@ -136,8 +134,9 @@ ul li{ } /* date */ .article-info .event-details{ - color:#7e5211; + color:#164515; } + /* featured image */ .article-info .featured-image img{ width:100%; @@ -174,94 +173,105 @@ ul li{ content:'→'; } +/****************************/ +/* streambot */ + +#background{ + display: block; + position: fixed; + top:0px; + left:0px; + width: 100%; + height: 100vh; + z-index: -1; + opacity: 0.15; + background-clip: padding-box; + background-position: center center; + background-size: cover; +} + +#stream{ + min-height: 200px; + font-size: 14px; + margin:2em 0 2em 0; + border:1px dotted; + min-height: 300px; +} + #stream .log{ + display: inline-block; + } + #stream a.container{ + background-clip: padding-box; + background-position: center center; + background-size: cover; + /*height: none;*/ + /*width: none;*/ + } + /* reset header img styles */ + #stream a.container img{ + min-width: none; + min-height: none; + width: 100px; + height: auto; + } + #stream a{ + display: block; + } +#stream.overview{ + width: 100%; +} +div#stream a:nth-child(odd) { + transform: skew(-2deg); +} +div#stream a:nth-child(even) { + transform: skew(2deg); +} + /****************************/ /* header & #translation */ header { - width:calc(100% - 50px); - margin-top:26px; - margin-bottom:5em; - padding-bottom:1em; + width:100%; + min-height: 230px; font-family: "header"; font-size: 17px; line-height: 1.6; letter-spacing: -0.03em; } - header img{ - width: 50px; - display: inline; - margin: 0; - vertical-align: calc(-2px); - } /* custom font size for index */ #content.index header{ font-size: 24px; line-height: 1.5; margin-top:0; } - header p{ - display: inline; - } - - #stream{ - position: absolute; - width: 100%; + header #about{ + display: inline-block; + width: calc(100% - 130px); } - #stream a .container{ - background-clip: padding-box; - background-position: center center; - background-size: cover; - height: 600px; - width: 100%; + header #about p{ + display: inline; } - /* reset header img styles */ - #stream a .container img{ - min-width: none; - min-height: none; - width: none; - height: none; - } - #stream a{ - display: block; - } - #stream.overview{ - width: 100%; - } - div#stream a:nth-child(odd) { - transform: skew(-2deg); - } - div#stream a:nth-child(even) { - transform: skew(2deg); - } - -.buttons{ - position: absolute; - font-size: 14px; - margin:0; - padding:0; -} - .buttons.top, .buttons.side{ - top:10px; - right:15px; - text-align: right; - } - .buttons.side{ - top:40px; + header #colophon{ + position: relative; + float: right; + margin:8px 0 10px 0; + padding:0; + width:100px; + text-align: center; + font-family: "main"; + font-size: 14px; + letter-spacing: 0em; } - .buttons.side li{ - display: block; + #colophon a.active{ + text-decoration: none; + } + #colophon a.active:hover{ + cursor: default; } - .buttons li{ - list-style: none; - display: inline-block; - padding-left: 3px; - } - .buttons li.active a{ - text-decoration: none; - } /****************************/ /* main/index overview page */ + #content #post-list{ width: 100%; } @@ -300,13 +310,14 @@ header { display: block; width: 100%; font-family: "kop"; - font-size: 185%; + font-size: 170%; font-weight: bold; line-height: 1.15; margin:0; } .hentry .article-info .entry-title a{ text-decoration: none; + color: #164515; } /* ascii art styling */ .hentry pre{ @@ -314,19 +325,49 @@ header { font-weight: normal; clear:both; /*to prevent the ascii to break up*/ } - /* double-blocks for super important categories */ - .hentry.current, .hentry.article, .hentry.artikel, .hentry.current .article-info, .hentry.current .featured-image img{ + + /* custom css for upcoming events */ + .hentry.current, .hentry.current .entry-title a, .hentry.current .summary .read_more a, .hentry.current .summary .read_more::before, .hentry.current .post-info a, .hentry.current .post-info .categories::before, .hentry.current .event-details{ + /*color:blue;*/ + } + .hentry.current .separator hr{ + /*border-top: 1px dotted blue;*/ + } + /* upcoming */ + .current .article-info .event-details::after{ + /*background-color:pink;*/ + content:'UPCOMING'; + font-size: 11px; + transform: rotate(0deg); + position: absolute; + padding: 5px; + border-radius: 100%; + margin-left: 1em; + -webkit-animation: 0.2s linear 1s infinite alternate blink; + animation: 0.2s linear 1s infinite alternate blink; + } + + /* double-blocks for articles */ + .hentry.article, .hentry.artikel { width: calc(400px + 1em); } - /* color background for articles */ + /* custom css for articles */ .hentry.article, .hentry.artikel{ padding:1.5em 1em 1em 1em; border:1px dashed #7e5211; border-radius:15px; } +/****************************/ +/* page */ + +div#page-content{ + margin-top:3em; +} + /****************************/ /* article */ + #content.body .entry-title{ display:inline-block; font-family: "kop"; @@ -341,6 +382,10 @@ header { width:200px; float: left; } + +/****************************/ +/* page + article */ + .entry-content-container, #page-content-container{ width: calc(100% - 260px); float: right; @@ -400,4 +445,12 @@ sup span{ } sup span p{ display: inline; - } \ No newline at end of file + } + + +/* animations */ +@-webkit-keyframes blink { from { opacity: 1; } to { opacity: 0.2; } } +@keyframes blink { from { opacity: 1; } to { opacity: 0.2; } + +@-webkit-keyframes wobble { from { transform: rotate(-15deg); } to { transform: rotate(15deg); } } +@keyframes wobble { from { transform: rotate(-15deg); } to { transform: rotate(15deg); } } diff --git a/themes/varia/templates/base.html b/themes/varia/templates/base.html index 6cb88061..dcea29c3 100644 --- a/themes/varia/templates/base.html +++ b/themes/varia/templates/base.html @@ -14,37 +14,11 @@ -
- {% if I18N_SUBSITES %} - {% for lang, url in I18N_SUBSITES.items() %} - {% if DEFAULT_LANG == 'nl' %} - {% if lang == 'nl' %} -
  • varia kent de volgende gedaantes:
    • -
  • mailinglijst
    • -
  • RSS feed
    • - -
  • Nederlands{% else %}>Nederlands{% endif %}
    • - English{% else %}>English{% endif %} - {% endif %} - {% endif %} - {% if DEFAULT_LANG == 'en' %} - {% if lang == 'en' %} -
  • varia comes in many forms:
    • -
  • mailinglist
    • -
  • RSS feed
    • - -
  • Nederlands{% else %}>Nederlands{% endif %}
    • - English{% else %}>English{% endif %} - {% endif %} - {% endif %} - {% endfor %} - {% endif %} -
    -
    -
    - -
    - {% block content %} - {% endblock %} + + + +
    + {% block content %} + {% endblock %} diff --git a/themes/varia/templates/index.html b/themes/varia/templates/index.html index d5ed1239..54128117 100644 --- a/themes/varia/templates/index.html +++ b/themes/varia/templates/index.html @@ -1,16 +1,35 @@ {% extends "base.html" %} {% block content %}
    -