Changeset 567 in t29-www

Timestamp:

Jun 5, 2014, 11:54:38 PM (9 years ago)

Author:

sven

Message:

Den Footer implementiert, der seit langem unter das Design
gehört.

Ausserdem: Beam-Navigation angetestet.

Files:

• lib/template.php (modified) (6 diffs)
• shared/css-v6/modules/13-footer.css (modified) (7 diffs)
• shared/img-v6/logo.footer.png (modified) (previous)
• shared/js-v6/modules/menu.js (modified) (2 diffs)

lib/template.php

@@ -399 +399 @@
                 $show_rel_prev = in_array('show-rel-prev', $this->current_link_classes);
                 
+                // Footer-String, um Footer je nach Footer-Menue "da" oder "nicht da" einbinden zu koennen
+                $footer_text = <<<FOOTER
+                
+FOOTER;
         ?>
     <footer class="in-sheet <?php if(!$print_footer_menu) print "empty-footer"; ?>">
@@ -404 +408 @@
                         <!-- hier wird nav.side die Liste per JS reinkopiert -->
                 </nav>
-                <nav class="rel clearfix">
+                <nav class="rel clearfix <?php if(!$print_footer_menu) print "empty"; ?>">
                 <ul>
                         <?php
@@ -424 +428 @@
                 </ul>
                 </nav>
+                <?php
+                        // packe Bigfooter bei leerem Footer-Menue in footer.in-sheet
+                        if(!$print_footer_menu)
+                                $this->print_footer_text();
+                ?>
                 <div class="right">
                         <!-- text der rechts unten steht -->
@@ -430 +439 @@
   </div> <!--! end of #container -->
   <footer class="attached">
-    <div class="legacy"><?php $p('footer-legacy-text'); ?></div>
-        <!--
-        <ul class="clearfix">
-        <li class="logo">
-                <a href="<?php $href($p('footer-legal-file')); ?>" class="img" title="technikum29 Logo">Logo</a>
-                <p><?php $p('footer-copyright-tag'); ?>
-                   <br><?php printf('<a href="%s">%s</a>', $href($_('footer-legal-file')), $_('footer-legal-link')); ?>
-                </p>
-        </li>
-        <li class="copy">
-                <a href="<?php $href($p('footer-legal-file')); ?>#image-copyright" class="img">CC</a>
-                <p>Viele Bilder können unter einer <a href="<?php $href($p('footer-legal-file')); ?>#image-copyright">CreativeCommons-Lizenz</a>
-                   verwendet werden. <a href="<?php $href($p('footer-legal-file')); ?>#image-copyright">Erkundigen Sie sich</a>.</p>
-        </li>
-        </ul>
-        -->
+    <!--<div class="legacy"><?php $p('footer-legacy-text'); ?></div>-->
         <?php
+                // packe Bigfooter bei gefuelltem footer.in-sheet nach footer.attached.
+                if($print_footer_menu)
+                        $this->print_footer_text();
+        
                 // pending log messages
                 if(!$this->log->is_empty()) {
@@ -455 +453 @@
         ?>
   </footer>
-</div><!-- end of div id="footer-background-container" helper -->
+<?php /*</div><!-- end of div id="footer-background-container" helper -->*/ // seems misplaced ?>
 
   <?php /* JavaScript at the bottom for fast page loading */ ?>
@@ -474 +472 @@
         } // function print_footer()
         
+        /**
+         * Den "Bigfooter"-Text ausgeben.
+         * Hilfsfunktion fuer print_footer().
+         * (Grund: Implementierung als langer String in print_footer() ist unbequem)
+         **/
+        private function print_footer_text() {
+                $p = $this->msg->get_shorthand_printer(); // t29Messages gettext printer
+                $_ = $this->msg->get_shorthand_returner(); // t29Messages gettext
+                $href = $this->conf['host']->get_shorthand_link_returner(); // t29Host link rewriter
+                
+                ?><div class="bigfooter">
+                    <ul class="clearfix">
+                        <li class="logo"><a href="<?php print $href($_('footer-legal-file')); ?>" class="clearfix"><!-- FIXME: clearfix should be semantically performed -->
+                                <i title="technikum29 Logo">Logo</i>
+                                <span class="p"><?php $p('footer-copyright-tag'); ?>
+                                <br><u><?php $p('footer-legal-link'); ?></u>
+                                </span>
+                        </a></li>
+                        <li class="copy"><a href="<?php print $href($_('footer-legal-file')); ?>#image-copyright" class="clearfix">
+                                <i>CC</i>
+                                <span class="p">Viele Bilder können unter einer <u>CreativeCommons-Lizenz</u>
+                                verwendet werden. <u>Erkundigen Sie sich</u>.</span>
+                        </a></li>
+                    </ul>
+                </div><?php
+        }
+        
         // Hilfsfunktionen
         private function relational_link_to_string($a) {

shared/css-v6/modules/13-footer.css

@@ -21 +21 @@
         background: transparent url("/shared/img-v6/line.header-footer.png") top left repeat-x;
         /* bgcolor was #f1f1f1  - transparent gesetzt um nur an einer stelle die farbe austauschen zu muessen */
+        
+        /* "Hacky" bugfix, um "Menue einblenden"-Button zu uebertuenchen: Doch farbe setzen */
+        background-color: #f7f7f7;
 }
 
@@ -115 +118 @@
 }
 
+/* Guide-Nav Juni 2014 revisited: Mittlerweile hat sich so viel geaendert, dass 
+ * ein paar Anpassungen/Ausblendungen noetig sind. Moeglicherweise ist das hier nicht
+ * ganz sauber sondern sollte im CSS gemacht werden:
+ */
+nav.guide li.button-box {
+        display: none;
+}
+
 /*nav.guide .current > a > .text { color: #40a8e2; }*/
 
@@ -122 +133 @@
         margin: 26px 70px 0;
         width: 800px;
+}
+
+nav.rel.empty {
+        /* Do not take space - bigfooter will take it  */
+        display: none;
 }
 
@@ -240 +256 @@
         /* @embed */ background: #307588 url("/shared/img-v6/bg-v2.body-footer.png") top left repeat-x;
         margin-top: -122px;
-        padding: 122px 122px 10px;
+        padding: 130px 0 30px;
         
         color: white;
@@ -252 +268 @@
 }
 
-footer.attached ul {
-        width: 1170px;
-        margin: 10px auto 20px;
+footer.attached div.bigfooter {
+        max-width: 1200px;
+        margin: 0 auto;
+}
+
+footer.attached div.bigfooter ul {
+        padding-left: 40px;
+}
+
+footer.in-sheet div.bigfooter {
+        padding-left: 30px;
+        padding-top: 20px; /* sheet: 40px padding */
+}
+
+div.bigfooter {
+        /* body ist 13, #content 15 */
+        font-size: 14px;
+}
+
+/* Bigfooter, der wahlweise nach footer.attached oder footer.in-sheet kommt */
+
+footer div.bigfooter ul {
+        /*width: 1170px;*/
+        /*margin: 10px auto 20px;*/
         /* padding: 0 20px; *//* ueberfluessig, Breite allein reguliert schon */
 }
 
-footer.attached li {
-        width: 370px;
+footer div.bigfooter li {
+        width: 390px;
         margin-right: 10px;
         float: left;
 }
 
-footer.attached a:link, footer.attached a:visited {
+footer div.bigfooter a {
+        display: block;
+        padding: 10px;
+        
+        /* optionaler Effekt: Beim Hovern nicht ueber "ganze Breite" gehen */
+        display: inline-block;
+}
+
+footer div.bigfooter a:link, footer div.bigfooter a:visited {
+        text-decoration: none;
+        color: inherit;
+}
+
+footer.attached div.bigfooter a:hover {
+        background-color: rgba(255,255,255,.1);
+        /* ganz subtiler Schatten */
+        box-shadow: 0 3px 10px rgba(255, 255, 255, 0.05);
+}
+
+footer.in-sheet div.bigfooter a:hover {
+        background-color: white;
+}
+
+footer.attached div.bigfooter a:link u, footer.attached div.bigfooter a:visited u {
         color: #BAF1FF;
 }
 
-footer.attached a:hover {
+footer.in-sheet div.bigfooter a:link u, footer.in-sheet div.bigfooter a:visited u {
+        color: #205B6B;
+}
+
+footer.attached div.bigfooter a:hover u, footer.attached div.bigfooter a:focus u {
         color: #3DD8FF;
 }
 
-footer.attached a.img {
+footer.in-sheet div.bigfooter a:hover u, footer.in-sheet div.bigfooter a:focus u {
+        color: #882224;
+}
+
+footer div.bigfooter i {
         display: block;
         float: left;
@@ -278 +346 @@
 }
 
-footer.attached p {
+footer div.bigfooter span.p {
+        display: block;
         margin-left: 80px;
         margin-top: 0px;
@@ -285 +354 @@
 
 
-footer.attached li.logo a.img {
-        background-image: url("/shared/img-v6/logo.footer.png");
-        width: 46px; height: 59px;
-}
-footer.attached li.logo p { margin-left: 60px; }
-
-footer.attached li.copy a.img {
-        background-image: url("/shared/img-v6/cc-icon2.png");
+footer div.bigfooter li.logo i {
+        /* @embed */ background-image: url("/shared/img-v6/logo.footer.png");
+        width: 36px; height: 46px;
+}
+footer.in-sheet div.bigfooter li.logo i {
+        /* @embed */ background-image: url("/shared/img-v6/logo-dark.footer.png");
+}
+
+footer div.bigfooter li.logo span.p {
+        margin-left: 47px;
+        margin-top: 7px;
+}
+
+footer div.bigfooter li.copy {
+        width: 510px;
+}
+
+footer div.bigfooter li.copy i {
+        /* @embed */ background-image: url("/shared/img-v6/cc-icon2.png");
         width: 100px; height: 42px;
-}
-footer.attached li.copy p { margin-left: 110px; }
+        opacity: .4; /* Todo: Unauffaelligeres Logo finden */
+}
+footer div.bigfooter li.copy span.p {
+        margin-left: 110px;
+        margin-top: 5px;
+}
 
 

shared/js-v6/modules/menu.js

@@ -329 +329 @@
         // Beam nur anzeigen wenn auf Seite, die auch in der Beamnavigation drin ist,
         // sprich Seitenleiste.
-        if(t29.conf['seite_in_nav'] != t29.menu.side.attr('class'))
-                return;
+        if(!t29.menu.side.hasClass( t29.conf['seite_in_nav'] ))
+                return false;
 
         // Zentraler Hauptschritt: Das Menue ab oberster Ebene klonen und im Footer dranhaengen,
@@ -338 +338 @@
         g.find("ul").show(); // durch t29.menu.collapse.setup wurden die .u3er auf hide gesetzt. Revert!
         g.find(".geraete").remove(); // geraete-Links nicht anzeigen
+        g.find("ul.u2 > li > a").remove(); // Ueberschriften entfernen