Changeset 803 in t29-www

Timestamp:

Jun 28, 2015, 1:09:51 AM (8 years ago)

Author:

sven

Message:

Vorschlag zur Gliederung der Robotik-Seite: Ein attraktives Titelbanner-Bild, mehrspaltiger Text, der von Bildern durchbrochen wird. Gliederung des Textes durch Überschriften, vor allem aber Umordnung nach interessanten oder aufeinander aufbauenden Inhalten: So interessiert der eigentliche Inhalt des Kurses mehr als die Vorraussetzungen und Preise.

Die Seitenleiste verbleibt für das Pressseecho, Anfahrt, den Hinweis auf die Schulen sowie weitere Bilder. Die Bilder auf der Seite könnte man auch noch auf volle Leistenbreite machen.

Die Änderungen wurden in der robotik/gegliederte-robotik.php (vs. robotik/index.php) gemacht, wobei die Änderungen in der robotik-ferienkurs.css die index.php unwesentlich beeinflussen.

Files:

• robotik/gegliederte-robotik.php (added)
• robotik/header-bild.jpg (added)
• robotik/wegskizze-bahnhof.png (added)
• shared/css-v6/pagestyles/robotik-ferienkurs.css (modified) (1 diff)

shared/css-v6/pagestyles/robotik-ferienkurs.css

@@ -6 +6 @@
         background-image: url("/shared/img-v6/banner.png");
 }
+
+/* Neues Design ab Juni 2015, Experiment-Styles */
+
+section.sidebar a.termine {
+        /* zugehoerig zur normalen Homepage */
+        display: none;
+}
+
+/* teaser, von devzone kopiert */
+header.teaser {
+        margin: -60px -40px 40px;
+        position: relative;
+        overflow: hidden;
+}
+
+header.teaser h2, #content header.teaser h2 {
+        border: none !important;
+        position: absolute;
+        bottom: 0; left: 0;
+        width: 100%;
+        padding: 0.3em 40px;
+        margin: 0;
+        background-color: rgba(255,255,255,.3);
+        color: white;
+        text-shadow: 1px 1px 5px #1C1C1C;
+        
+        font-size: 250%;
+        text-align: center;
+}
+
+header.teaser h2 span.subtext {
+        display: block;
+        font-size: 60%;
+        line-height: 100%;
+        text-shadow: 1px 1px 2px #282828;
+}
+
+
+header.teaser img {
+        width: 100%;
+}
+
+
+header.teaser::before {
+        /* css3 hack to get img inset box-shadow */
+        display:block;
+        content:'';
+        position:absolute;
+        width:100%;
+        height:100%;
+        box-shadow: 0 -20px 59px -4px rgba(0, 0, 0, 0.35) inset;
+}
+
+/* sidebar */
+section.sidebar div.text-block,
+section.sidebar div.bild-block {
+        margin-top: 2em;
+        margin-bottom: 2em;
+}
+
+section.sidebar div.text-block a,
+section.sidebar div.bild-block a {
+        display: inline !important;
+}
+
+section.sidebar div.text-block {
+        margin: -15px -25px 15px;
+        padding: 35px 25px;
+}
+
+section.sidebar div.bild-block img {
+        width: 100%;
+}
+
+section.sidebar div.bild-block .bildtext {
+        margin-top: .5em;
+}
+
+section.sidebar div.alertbox {
+        background-color: #edf0f2;
+        margin: -35px -25px 15px;
+}
+
+section.sidebar div.text-block li {
+        display: block;
+        margin: .4em 0;
+}
+
+
+
+/* Wie auf Startseite */
+#content h3 {
+    border: medium none;
+    color: #1a5160;
+    font-family: inherit;
+    font-size: 113%;
+    font-weight: bold;
+}