diff --git a/content/static/datenspuren/2012/images/battery.png b/content/static/datenspuren/2012/images/battery.png
new file mode 100644
index 000000000..580b60e55
Binary files /dev/null and b/content/static/datenspuren/2012/images/battery.png differ
diff --git a/content/static/datenspuren/2012/images/btn.svg b/content/static/datenspuren/2012/images/btn.svg
new file mode 100644
index 000000000..75f8aaefb
--- /dev/null
+++ b/content/static/datenspuren/2012/images/btn.svg
@@ -0,0 +1,103 @@
+
+
diff --git a/content/static/datenspuren/2012/images/c3d2_wlan.png b/content/static/datenspuren/2012/images/c3d2_wlan.png
new file mode 100644
index 000000000..079a292e8
Binary files /dev/null and b/content/static/datenspuren/2012/images/c3d2_wlan.png differ
diff --git a/content/static/datenspuren/2012/images/calendar.svg b/content/static/datenspuren/2012/images/calendar.svg
new file mode 100644
index 000000000..9a6e9ceca
--- /dev/null
+++ b/content/static/datenspuren/2012/images/calendar.svg
@@ -0,0 +1,127 @@
+
+
diff --git a/content/static/datenspuren/2012/images/feed.svg b/content/static/datenspuren/2012/images/feed.svg
new file mode 100644
index 000000000..b32514942
--- /dev/null
+++ b/content/static/datenspuren/2012/images/feed.svg
@@ -0,0 +1,18 @@
+
+
+
diff --git a/content/static/datenspuren/2012/images/filmstrip.svg b/content/static/datenspuren/2012/images/filmstrip.svg
new file mode 100644
index 000000000..b666c48bd
--- /dev/null
+++ b/content/static/datenspuren/2012/images/filmstrip.svg
@@ -0,0 +1,102 @@
+
+
+
+
diff --git a/content/static/datenspuren/2012/images/map.svg b/content/static/datenspuren/2012/images/map.svg
new file mode 100644
index 000000000..7041215dd
--- /dev/null
+++ b/content/static/datenspuren/2012/images/map.svg
@@ -0,0 +1,621 @@
+
+
diff --git a/content/static/datenspuren/2012/images/marker.svg b/content/static/datenspuren/2012/images/marker.svg
new file mode 100644
index 000000000..febaa9b54
--- /dev/null
+++ b/content/static/datenspuren/2012/images/marker.svg
@@ -0,0 +1,112 @@
+
+
+
diff --git a/content/static/datenspuren/2012/images/osm.png b/content/static/datenspuren/2012/images/osm.png
new file mode 100644
index 000000000..c444b5550
Binary files /dev/null and b/content/static/datenspuren/2012/images/osm.png differ
diff --git a/content/static/datenspuren/2012/images/osm.svg b/content/static/datenspuren/2012/images/osm.svg
new file mode 100644
index 000000000..2919c1441
--- /dev/null
+++ b/content/static/datenspuren/2012/images/osm.svg
@@ -0,0 +1,3336 @@
+
+
+
diff --git a/content/static/datenspuren/2012/images/video.svg b/content/static/datenspuren/2012/images/video.svg
new file mode 100644
index 000000000..bde1641d7
--- /dev/null
+++ b/content/static/datenspuren/2012/images/video.svg
@@ -0,0 +1,135 @@
+
+
diff --git a/content/static/datenspuren/2012/style/style.css b/content/static/datenspuren/2012/style/style.css
index 51b338fa8..3f0b34b3c 100644
--- a/content/static/datenspuren/2012/style/style.css
+++ b/content/static/datenspuren/2012/style/style.css
@@ -1,357 +1,120 @@
+
+/* placement */
body {
- font-family: sans-serif;
- margin: 12pt auto;
- background: white;
+ display: table;
+ width: 100%;
}
-#cloudy {
- background: url("../images/cloudy.png");
- position: relative;
- height: 231px;
- width: 264px;
- margin-right: -44.400000000000006pt;
- margin-top: -60pt;
- float: right;
-}
-#cloudy-sun {
- background-color: #eec73e;
- opacity: 0;
- -webkit-transition-property: opacity;
- -webkit-transition-duration: 0.5s;
- -moz-transition-property: opacity;
- -moz-transition-duration: 0.5s;
- -ms-transition-property: opacity;
- -ms-transition-duration: 0.5s;
- -o-transition-property: opacity;
- -o-transition-duration: 0.5s;
- transition-property: opacity;
- transition-duration: 0.5s;
- width: 200px;
- height: 200px;
- margin-right: 3px;
- margin-left: auto;
- border-radius: 100%;
- cursor: pointer;
-}
-#cloudy-sun:hover {
- opacity: 0.6;
- -webkit-transition-property: opacity;
- -webkit-transition-duration: 2s;
- -moz-transition-property: opacity;
- -moz-transition-duration: 2s;
- -ms-transition-property: opacity;
- -ms-transition-duration: 2s;
- -o-transition-property: opacity;
- -o-transition-duration: 2s;
- transition-property: opacity;
- transition-duration: 2s;
-}
-#aussicht {
- background: url("../images/aussicht.png");
- height: 63px;
- width: 191px;
- display: inline-block;
-}
-#aussicht * {
- display: none;
-}
-#header {
- text-align: center;
-}
-#content {
- border: 12pt solid #65b8ff;
- border-radius: 24pt;
- background: rgba(255,255,255,0.65);
- min-height: 400px;
- display: inline-block;
-}
-#ct0, #ct1, #ct2 {
- display: table-cell;
-}
-#ct0 {
- width: 50%;
-}
-#ct1 {
- width: auto;
-}
-#ct2 {
- width: 50%;
-}
-.leftSideBar {
- float: left;
- border-right: 12pt solid #65b8ff;
- border-bottom: 12pt solid #65b8ff;
- border-radius: 0 0 24pt 0;
- margin: 0 24pt 24pt 0;
-}
-.leftSideBar > div {
- margin: 12pt;
-}
-.leftSideBar > div > h2 {
- font-size: 12pt;
- margin-bottom: 0;
-}
-.leftSideBar > div > ul {
- margin-top: 0;
- list-style-type: none;
- padding: 0;
- font-size: 9.600000000000001pt;
-}
-a {
- color: #980101;
- font-weight: bold;
- text-decoration: none;
-}
-.feedlinks {
- font-size: 8pt;
- font-weight: bold;
- color: #888;
-}
-#bodyText {
- padding: 0 24pt 24pt;
-}
-#bodyText > div {
- min-width: 800px;
-}
-#bodyText > .schedule {
- width: auto;
-}
-h1, h2, h3, dt {
- font-weight: bolder;
-}
-h3.summary {
- margin-top: 2em;
-}
-.date {
- padding-left: 12pt;
- font-size: x-small;
- font-weight: normal;
- color: #888;
-}
-.notice.feed {
- font-size: 9.600000000000001pt;
-}
-.url {
- text-decoration: underline;
-}
-#footer {
- text-align: center;
- margin-top: 6pt;
- font-size: 9.600000000000001pt;
-}
-#oldds {
- margin: 0;
-}
-#oldds > li {
- display: inline;
- margin: 0 0.3em;
+body > * {
+ display: table-cell;
}
-dl dt {
- font-weight: bold;
- margin-top: 1em;
- font-size: 110%;
+#device {
+ width: 800px;
+ padding: 5pt;
}
-dl dd {
- margin-left: 2em;
+#nav {
+ float: left;
+ margin-right: 0.5em;
}
+#screen {
+ margin-top: 1em;
+ margin-bottom: 45pt;
+}
+#content, #device-2 {
+ padding: 0.5em;
+}
+/**/
-#solar {
- background-image: url('../images/sun.svg');
- z-index: -1000;
- overflow: hidden;
- clip: auto;
- position: absolute;
- top: -3900px;
- right: -3900px;
- width: 8000px;
- height: 8000px;
- -webkit-animation: rotate 230s infinite linear;
- -moz-animation: rotate 230s infinite linear;
- -o-animation: rotate 230s infinite linear;
- -ms-animation: rotate 230s infinite linear;
- animation: rotate 230s infinite linear;
+/* borders */
+#device {
+ border: 0pt solid #CCC;
+ border-radius: 3.5em;
}
-@-webkit-keyframes rotate {
- 0% {
- -webkit-transform:rotate(0deg);
- }
- 100% {
- -webkit-transform:rotate(-360deg);
- }
+#device-2 {
+ border: 10pt solid black;
+ border-radius: 3em;
}
-@-moz-keyframes rotate {
- 0% {
- -moz-transform:rotate(0deg);
- }
- 100% {
- -moz-transform:rotate(-360deg);
- }
+#screen {
+ border: 2pt solid black;
}
-@-o-keyframes rotate {
- 0% {
- -o-transform:rotate(0deg);
- }
- 100% {
- -o-transform:rotate(-360deg);
- }
-}
-@-ms-keyframes rotate {
- 0% {
- -ms-transform:rotate(0deg);
- }
- 100% {
- -ms-transform:rotate(-360deg);
- }
-}
-@keyframes rotate {
- 0% {
- transform:rotate(0deg);
- }
- 100% {
- transform:rotate(-360deg);
- }
+#nav {
+ margin: 0.5em;
+ padding: 0em 0.5em 0em 0em;
+ border-right: 1pt solid black;
+ border-bottom: 1pt solid black;
}
+/**/
-.backgroundcloud {
- position: absolute;
- width: 72px;
- height: 40px;
- z-index: -7;
+/* font */
+* {
+ font-family: sans-serif;
}
-.backgroundflash {
- position: absolute;
- z-index: -5;
+#head > * {
+ text-align: center;
}
-.backgroundraindrop {
- position: absolute;
- z-index: -8;
- color: #65b8ff;
+#head h1, #head h2 {
+ margin: 0px;
+}
+/**/
+
+/* menu */
+#menu {
+ display: table;
+ width: 100%;
+}
+#menu > * {
+ display: table-cell;
+ padding: 5pt;
+ vertical-align: top;
+}
+#battery, #c3d2 { width: 25%; }
+#c3d2 { text-align: right; }
+#buttons { text-align: center; }
+#buttons > * { display: inline; }
+/**/
+
+/* polish */
+#device {
+ background: #bbb;
+ box-shadow: 0em -0.1em 0.4em #CCC;
+}
+#device-2 {
+ background: #222;
+ background: -moz-linear-gradient(
+ 20deg,
+ rgb(10, 8, 9) 0%,
+ rgb(26, 30, 26) 79.9%,
+ rgb(110, 119, 116) 80%,
+ rgb(174, 188, 191) 100%)
+ repeat scroll 0% 0% transparent;
+}
+#screen { background: white; }
+#nav * {
font-family: monospace;
- font-size: 50%;
- font-weight: bold;
-}
-
-/* -- Schedule -- */
-.scheduletitle:nth-child(1) {
- margin-top: 130px;
-}
-.schedule {
- border-radius: 30px;
- background-color: #65B8FF;
- border-spacing: 2px;
- width: 610px;
-}
-.schedule .schedulehead {
- color: white;
- padding: 0.2em 0;
- font-weight: bold;
-}
-.schedule .timeslot {
- color: white;
- padding: 0.2em 0.8em 0.2em 1em;
text-align: right;
+ list-style: none;
+ padding-left: 0px;
}
-.schedule .timeslot.odd {
- font-size: 9.600000000000001pt;
+.date { float: right; }
+#content p { text-align: justify; }
+a {
+ text-decoration: none;
+ color: #335;
}
-.schedule td.event {
- border-radius: 15px;
- background-color: white;
- padding: 1em 0.5em;
+#head > * {
+ color: #CCC;
+ font-weight: 300;
}
-.schedule ul {
- display: block;
- margin: 0;
- padding: 0;
- list-style-type: none;
- font-size: 9.600000000000001pt;
-}
-.schedule ul li {
+/**/
+
+/* footer */
+#footer { text-align: center; }
+#oldds { padding-left: 0px; }
+#oldds li {
+ list-style: none;
display: inline;
- padding-right: 1em;
}
-/* -- Video Resource -- */
-
-.resource {
- display: inline-block;
- margin: 2px 2px;
- width: 392px;
- text-align: center;
- position: relative;
- background-color: #65B8FF;
- border-top-right-radius: 12pt;
- border-top-left-radius: 12pt;
- border-bottom-right-radius: 24pt;
- border-bottom-left-radius: 24pt;
- padding: 0.2em 0;
-}
-
-.resource h4 {
- font-weight: bold;
- margin: 0 auto;
- vertical-align: bottom;
-}
-.resource h4 a {
- color: white;
-}
-
-.resource img, .resource video {
- width: 384px;
- border-radius: 2px;
-}
-.resource .video-js-box {
- margin: 0 auto;
- padding: 0;
- background-color: black;
- border-radius: 2px;
-}
-.resource .video-js-box div.vjs-big-play-button {
- /* We use autoplay */
- display: none !important;
-}
-.resource ul {
- list-style-type: none;
- font-size: 90%;
- margin: 0 auto;
- padding: 0;
-}
-.resource li {
- display: inline-block;
- margin: 0 0.5em;
-}
-.resource li .size {
- padding-left: 0.5em;
- font-size: 75%;
- color: #333;
-}
-.resource .play {
- position: absolute;
- text-align: center;
- right: 0;
- left: 0;
- top: 35%;
- bottom: 50%;
- font-size: 400%;
- font-weight: bold;
- color: white;
- text-shadow: black 2px 2px 0;
- z-index: 10;
- margin: 0;
-}
-.resource .play:hover {
- color: #ffff7f;
- text-shadow: black 2px 2px 0;
- opacity: 0;
- -webkit-transition: opacity 2s ease-in;
- -moz-transition: opacity 2s ease-in;
- -o-transition: opacity 2s ease-in;
- -ms-transition: opacity 2s ease-in;
- transition: opacity 2s ease-in;
-}
-.resource img, .resource .play {
- cursor: pointer;
-}
-.resource .feedback {
- display: block;
-}
+/* debug */
+nothing { display: none; }
+nothing { border: 1px solid red; }
\ No newline at end of file
diff --git a/xsl/datenspuren/xhtml5.xsl b/xsl/datenspuren/xhtml5.xsl
index 4f20ae20c..6398a5e81 100644
--- a/xsl/datenspuren/xhtml5.xsl
+++ b/xsl/datenspuren/xhtml5.xsl
@@ -35,30 +35,104 @@