autotopia: Enable html-only i11n. xsl: Add lang attribute passing to some tags.
This commit is contained in:
parent
23bdf8ce73
commit
b23a05d758
|
|
@ -2,20 +2,29 @@
|
|||
<!DOCTYPE page SYSTEM "http://www.c3d2.de/dtd/c3d2web.dtd">
|
||||
|
||||
<page pagetitle="Start" title="Autotopia">
|
||||
<input type="radio" id="lang-de" name="langselect" checked="" />
|
||||
<input type="radio" id="lang-en" name="langselect"/>
|
||||
<image class="vertical-header" title="Autotopia, Vertical Header" alt="Autotopia, Vertical Header">autotopia_vertical_header.svg</image>
|
||||
<div class="a-content">
|
||||
<p class="a-content-item" lang="en">
|
||||
The website is still under construction. For further information please visit our <link href="https://wiki.c3d2.de/GesellschaftMachtTechnik">Wiki</link>
|
||||
The website is still under construction.
|
||||
</p >
|
||||
<p class="a-content-item" lang="de-DE">
|
||||
Die Website ist zur Zeit im Aufbau. Nähere Infos im <link href="https://wiki.c3d2.de/GesellschaftMachtTechnik">Wiki</link>
|
||||
Die Website ist zur Zeit im Aufbau.
|
||||
</p >
|
||||
<div class="a-content-item" lang="en">
|
||||
<p> Beginning with the industrial revolution, and the massive impact it had far into the 20th century, we can see again and again how advances in automation provoke social upheaval. By means of technological progress, fueled by a globally connected economy, disruptive technologies impact our lives and communities more and more frequently.
|
||||
<div class="a-content-item">
|
||||
<p lang="en"> Beginning with the industrial revolution, and the massive impact it had far into the 20th century, we can see again and again how advances in automation provoke social upheaval. By means of technological progress, fueled by a globally connected economy, disruptive technologies impact our lives and communities more and more frequently.
|
||||
</p>
|
||||
<p> The discussion on so-called ’future trends’ often appears too simplified and shortsighted. In debates artificial intelligence, predictive policing/mass surveillance, Industry 4.0, high-frequency trading, automated warfare, etc. are often framed by marketing campaigns as an ’obvious necessity’.
|
||||
<p lang="de-DE">
|
||||
Gemessen an den Auswirkungen erscheint die gesellschaftliche Debatte zu sogenannten ”Zukunftstechnologien” oft vereinfachend oder rückwärtsgewandt.
|
||||
</p>
|
||||
<p>
|
||||
<p lang="en"> The discussion on so-called <q>future trends</q> often appears too simplified and shortsighted.
|
||||
In debates artificial intelligence, predictive policing/mass surveillance, Industry 4.0, high-frequency trading, automated warfare, etc. are often framed by marketing campaigns as an ’obvious necessity’.
|
||||
</p>
|
||||
<p lang="de-DE">
|
||||
Die Diskussion um Künstliche Intelligenz, Predictive Policing / Massenüberwachung, Industrie 4.0, Hochfrequenzhandel, autonome Kriegsführung und andere Phenomene suggeriert eine natürliche Notwendigkeit. Nicht wenige Menschen fühlen sich abgehängt und entmündigt.
|
||||
</p>
|
||||
<span lang="en">
|
||||
<ul>
|
||||
<li>Who profits from automation?</li>
|
||||
<li>Which longterm consequences arise from the wide-spread use of automation technologies?</li>
|
||||
|
|
@ -26,14 +35,30 @@
|
|||
<li>Which potential for emancipation and (re)organization may hide in this technological change?</li>
|
||||
<li>How do we decide how far technological systems (should) reach into our private lives?</li>
|
||||
</ul>
|
||||
</span>
|
||||
<span lang="de-DE">
|
||||
<ul>
|
||||
<li>Wem nützt Automatisierung?</li>
|
||||
<li>Welche langfristigen Veränderungen ergeben sich aus der (Teil-) Automatisierung aller
|
||||
Lebensbereiche?</li>
|
||||
<li>Wie wirkt sich die veränderte Arbeitswelt und die Automatisierung von Entscheidungsprozessen auf die Möglichkeiten demokratischer Mitbestimmung aus?</li>
|
||||
<li>Mit Hilfe welcher Konzepte können die Potentiale der nächsten Automatisierungswellenallen Mitgliedern der Gesellschaft zugute kommen?</li>
|
||||
<li>Welche Emanzipations- und Gestaltungsmöglichkeiten werden durch technische Umbrüche eröffnet?</li>
|
||||
<li>Wie können wir definieren welche und wie weit technische Systeme in unsere private Lebensführung eingreifen können?</li>
|
||||
</ul>
|
||||
</span>
|
||||
<p lang="en">
|
||||
The series Autotopia aims to discuss these question in various formats. We do not target any specific group; we invite makers, hackers, writers, artists and designers, scientists and journalists, enthusiasts and critics!
|
||||
</p>
|
||||
<p>
|
||||
The series Autotopia aims to discuss these question in various formats. We do not target any
|
||||
specific group; we invite makers, hackers, writers, artists and designers, scientists and journalists, enthusiasts and critics!
|
||||
<p lang="de-DE">
|
||||
Autotopia soll eine möglichst große Bandbreite dieser Fragen, aus unterschiedlichen Perspektiven diskutierbar und erfahrbar machen.
|
||||
</p>
|
||||
<p> At the moment we are looking for speakers and are going to lay down precise dates and formats
|
||||
in the next couple of weeks. We are planning to do talks, workshops, readings, film screenings
|
||||
and discussions. Is there someone you know, who we should absolutely ask?
|
||||
<p lang="en">
|
||||
At the moment we are looking for speakers and are going to lay down precise dates and formats.
|
||||
We are planning to do talks, workshops, readings, film screenings and discussions. Is there someone you know, who we should absolutely ask?
|
||||
</p>
|
||||
<p lang="de-DE">
|
||||
Egal ob nerdig oder allgemeinverständlich, künstlerisch oder wissenschaftlich... Wir würden uns sehr freuen wenn du einen Beitrag leisten könntest!
|
||||
</p>
|
||||
</div>
|
||||
<p class="a-content-item" lang="en">
|
||||
|
|
@ -45,12 +70,10 @@ and discussions. Is there someone you know, who we should absolutely ask?
|
|||
<news-list prefix="autotopia-de" details="all"/>
|
||||
</p>
|
||||
</div>
|
||||
<div class="a-content-panel">
|
||||
<p class="a-content-item" lang="en">
|
||||
deutsch
|
||||
</p>
|
||||
<p class="a-content-item" lang="de-DE">
|
||||
english
|
||||
<div class="a-panel a-content">
|
||||
<p class="a-content-item">
|
||||
<label for="lang-de" lang="en">deutsch</label>
|
||||
<label for="lang-en" lang="de-DE">english</label>
|
||||
</p>
|
||||
<div class="a-content-item">
|
||||
<p lang="en">contact</p>
|
||||
|
|
@ -64,7 +87,9 @@ and discussions. Is there someone you know, who we should absolutely ask?
|
|||
email: <link href="mailto:autotopia@c3d2.de">autotopia@c3d2.de</link>
|
||||
</p>
|
||||
<p>
|
||||
pgp: <link href="autotopia@c3d2.de.asc">public key</link> AA02 D6BC 2B6B 5264 E952 145C 54F8 77CE CBC2 D22E
|
||||
pgp: <span lang="en"><link href="autotopia@c3d2.de.asc">public key</link></span>
|
||||
<span lang="de-DE"><link href="autotopia@c3d2.de.asc">öffentlicher Schlüssel</link></span>
|
||||
AA02 D6BC 2B6B 5264 E952 145C 54F8 77CE CBC2 D22E
|
||||
</p>
|
||||
<p>
|
||||
mastodon: <link href="https://chaos.social/tags/autotopiadd">#AutotopiaDD</link> via <link href="https://chaos.social/@autotopia">@autotopia</link>
|
||||
|
|
@ -80,33 +105,58 @@ and discussions. Is there someone you know, who we should absolutely ask?
|
|||
<tr lang="en">
|
||||
<th>Date</th><th>Event</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<th>wann</th><th>was</th>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>tba</td><td>Book reading and discussion</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<td>tba</td><td>Lese- und Diskussionsabend</td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>tba</td><td>Talk/discussion on Predictive Policing</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>tba</td><td>Interactive workshop: <q>Critical making with the community</q></td>
|
||||
<tr lang="de-DE">
|
||||
<td>tba</td><td>Vortrag-/Diskussion zu <q>präventiver Polizeiarbeit</q></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="en">
|
||||
<td>tba</td><td>Interactive workshop <q>Critical making with the community</q></td>
|
||||
</tr>
|
||||
<tr lang="de-DE">
|
||||
<td>tba</td><td>Interaktiver Workshop <q>Critical making with the community</q></td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>01.05.</td><td>Movie screening and discussion</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<td>01.05.</td><td>Filmvorführung und Diskussion</td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>03.05.</td><td>Movie screening and discussion</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<td>03.05.</td><td>Filmvorführung und Diskussion</td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>04.05.</td><td>Talk: <q>Historische Krisenprozesse und Automatisierung als innerer Widerspruch des Kapitals</q></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<td>04.05.</td><td>Vortrag - <q>Historische Krisenprozesse und Automatisierung als innerer Widerspruch des Kapitals</q></td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>04.05.</td><td>Panel/Fishbowl discussion on <q>Socio-economic consequences and agency in the age of automation</q></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<tr lang="de-DE">
|
||||
<td>04.05.</td><td>Panel/Fishbowl-Diskussion zu <q>Sozio-ökonomische Konsequenzen und Handlungsmöglichkeiten des Automatisierungszeitalters</q></td>
|
||||
</tr>
|
||||
<tr lang="en">
|
||||
<td>11.05.</td><td>Talk/discussion on <q>Robot ethics</q></td>
|
||||
</tr>
|
||||
<tr lang="de-DE">
|
||||
<td>11.05.</td><td>Vortrag/Diskussion zu <q>Roboterethik</q></td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
<div class="a-content-item" lang="de-DE">
|
||||
</div>
|
||||
</div>
|
||||
</page>
|
||||
|
|
|
|||
|
|
@ -2,13 +2,17 @@
|
|||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
html {
|
||||
font-family: "URW Gothic l";
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
body {
|
||||
color: #111;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: #111;
|
||||
background: repeat url('autotopia_background_ornament.svg');
|
||||
background-size: 50%;
|
||||
font-family: "URW Gothic l";
|
||||
hyphens: auto;
|
||||
}
|
||||
|
||||
|
|
@ -35,19 +39,20 @@ max-width:90em;
|
|||
float:left;
|
||||
border-width: 2px;
|
||||
border-left-style:solid;
|
||||
font-size: larger;
|
||||
line-height: 150%;
|
||||
}
|
||||
|
||||
.a-content-panel{
|
||||
.a-panel{
|
||||
width:20%;
|
||||
min-width:20em;
|
||||
max-width:30em;
|
||||
float:left;
|
||||
min-width:25em;
|
||||
max-width:35em;
|
||||
padding-left: 4em;
|
||||
font-size: medium;
|
||||
border-left-style:none;
|
||||
}
|
||||
|
||||
.a-content-item{
|
||||
min-height: 1rlh;
|
||||
border-width: 2px;
|
||||
border-right-style:solid;
|
||||
border-bottom-style:solid;
|
||||
|
|
@ -57,10 +62,29 @@ background-color: rgba(240,240,250,0.6);
|
|||
text-align: justify;
|
||||
}
|
||||
|
||||
:lang(de-DE) {
|
||||
/* Language selection */
|
||||
|
||||
input[name=langselect] {
|
||||
position: absolute;
|
||||
top: -9999px;
|
||||
left: -9999px;
|
||||
/* For mobile, it's typically better to position checkbox on top of clickable
|
||||
area and turn opacity to 0 instead. */
|
||||
}
|
||||
|
||||
label {
|
||||
cursor: pointer;
|
||||
}
|
||||
input[id=lang-en]:checked ~ .a-content :lang(de-DE) {
|
||||
visibility: hidden;
|
||||
display:none;
|
||||
}
|
||||
input[id=lang-de]:checked ~ .a-content :lang(en) {
|
||||
visibility: hidden;
|
||||
display:none;
|
||||
}
|
||||
|
||||
/* Other tags */
|
||||
|
||||
td {
|
||||
vertical-align: top;
|
||||
|
|
|
|||
|
|
@ -174,6 +174,9 @@
|
|||
<xsl:if test="@class">
|
||||
<xsl:attribute name="class"><xsl:value-of select="@class"/></xsl:attribute>
|
||||
</xsl:if>
|
||||
<xsl:if test="@lang">
|
||||
<xsl:attribute name="lang"><xsl:value-of select="@lang"/></xsl:attribute>
|
||||
</xsl:if>
|
||||
<xsl:apply-templates/>
|
||||
</ul>
|
||||
</xsl:template>
|
||||
|
|
@ -226,6 +229,7 @@
|
|||
<xsl:if test="@id"><xsl:attribute name="id"><xsl:value-of select="@id"/></xsl:attribute></xsl:if>
|
||||
<xsl:if test="@class"><xsl:attribute name="class"><xsl:value-of select="@class"/></xsl:attribute></xsl:if>
|
||||
<xsl:if test="@style"><xsl:attribute name="style"><xsl:value-of select="@style"/></xsl:attribute></xsl:if>
|
||||
<xsl:if test="@lang"><xsl:attribute name="lang"><xsl:value-of select="@lang"/></xsl:attribute></xsl:if>
|
||||
<xsl:apply-templates/>
|
||||
</label>
|
||||
</xsl:template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue