source: t29-www/shared/css-v6/modules/12-sidebar.css @ 275

Last change on this file since 275 was 275, checked in by sven, 12 years ago

Geraete-Seiten von altem SSI ins neue PHP konvertiert und Einbindung in navigation.xml gestaltet.

  • alle /de-v6/geraete/* sowie /de-v6/details: SSI durch PHP ersetzt, UTF-8-Zeichencode, zum Teil kleinere Korrekturen im HTML-Code. Evventuelle Verschiebungen von CSS und JavaScript nach extern.
  • /de-v6/navigation.xml: Extraseiten einsortiert
  • Alle moeglichen Seiten unter /de-v6/: Links zu Extraseiten korrigiert (.php statt .shtm-Dateiendung)

Verbesserungen am System:

  • cache.php: Debugging-Verbesserungen
  • logging.php: Neu, um besser Loggen zu können. Logging-Ausgaben sollten abgefangen werden und oben auf eine Seite gepackt werden. Ist noch nicht designt und funktioniert auch nicht 100%ig.
  • menu.php: Tests eingearbeitet, damit die Seitenanzeige nicht fehlschlägt wenn das navigation.xml-File kaputt ist.
  • technikum29.php: title und titel-Variablen sollten gleichen Wert haben
  • template.php: Logging-object eingebaut

Ressourcen (CSS/JavaScript)-Veränderungen:

  • 12-sidebar.css: Darstellung fuer .geraete-Links. Sollen spaeter nicht mehr dargestellt werden
  • pagestyles: Einzelne Styles für Extraseiten korrigiert, ebenso Seitenscripts
  • smoothscroll.js: Unabhängig von den Extraseiten: Scrolling zu Ankern basismäßig implementiert.
  • Property svn:keywords set to Id
File size: 5.0 KB
Line 
1/**
2 * t29v6 Design sidebar.css
3 * $Id: 12-sidebar.css 275 2012-07-07 16:25:45Z sven $
4 * In dieser Datei:
5 *
6 *   section.sidebar = Sidebar-Bereiche (.top, .botom)
7 *   nav.side = Inhaltsnavigation (Tour),
8 *              JavaScript-Menue (static, fixed, stick-*, ...),
9 *              Sidebar-Buttons
10 *
11 **/
12
13/* Rechtsnavi */
14section.sidebar {
15        width: 210px;
16        padding: 25px; padding-top: 35px;
17        /*background-color: #dfeaf0;*/  /* Die uebernimmt der Container*/
18        float: left;
19}
20
21/* Navigationsleiste */
22nav.side .guide-only { display: none; } /* Nur in nav.guide anzeigen */
23
24nav.side .u1 > li > a {
25        /*font: 18px "Futura Std Book";*/
26        font-size: 21px; font-weight: bold;
27        text-transform: uppercase;
28        /*color: #124b6b;*/
29        margin: 0 -25px;
30        padding: 5px 25px;
31}
32
33nav.side .u2 {
34        margin: 0 0 20px 0;
35}
36
37nav.side .u2 > li > a {
38        text-transform: uppercase;
39        font-size: 15px;
40        margin: 0 -25px;
41        padding: 5px 25px;
42}
43
44nav.side .u2 > li.active > a {
45        color: #E90015; /* hellblau:  #40a8e2; */
46        font-weight: bold;
47}
48
49nav.side .u3 {
50        margin-left: 12px;
51        margin-bottom: 12px;
52}
53
54nav.side .u3 { display: none; }
55nav.side .u2 > li.active .u3 { display: block; }
56
57nav.side .u3 > li > a {
58        font-size: 14px;
59        margin: 0 -25px 0 -40px;
60        padding: 1px 25px 1px 40px;
61        opacity: .9;
62        text-transform: uppercase;
63}
64
65nav.side .u3 > li.active > a,
66nav.side .u4 > li.active > a {
67        color: #e90015;
68        font-weight: bold;
69}
70
71/* 4. Ebene, wird derzeit nicht aktiv verwendet (nur fuer .u4.geraete) */
72nav.side .u4 {
73        margin-left: 8px;
74        margin-bottom: 8px;
75}
76
77nav.side .u4 > li > a {
78        font-size: 12px;
79        margin: 0 -32px 0 -48px;
80        padding: 1px 32px 1px 48px;
81}
82
83/* nav.side .geraete-Listen */
84nav.side .geraete a {
85        text-transform: none !important;
86        opacity: .5 !important;
87}
88
89nav a:hover, nav ul.rich-text li:hover a, nav a:focus, nav ul.rich-text li:focus a {
90        color: #A12A40;
91        background-color: white;
92}
93
94/* Nav-Hover-Transistions */
95nav a, nav a:link, nav a:visited, nav a:hover, nav a:focus {
96        /*-webkit-transition: color,background-color .18s cubic-bezier(0.420, 0.000, 0.580, 1.000);
97        -moz-transition: color,background-color .25s cubic-bezier(0.420, 0.000, 0.580, 1.000);
98        -ms-transition: color,background-color .25s cubic-bezier(0.420, 0.000, 0.580, 1.000);
99        -o-transition: color,background-color .25s cubic-bezier(0.420, 0.000, 0.580, 1.000);
100        transition: color,background-color .25s cubic-bezier(0.420, 0.000, 0.580, 1.000);
101        */
102}
103
104
105/* Scroll-Zustände der Navigationsleiste
106 * Siehe Script, es gibt:
107 *   html.no-js             - Ausgangslage ohne Javascript
108 *   html.static-menu       - Default mit Javascript
109 *   html.fixed-menu        - Umgeschaltet auf fix
110 *   html.stick-top-menu    - Zwischensituation wenn fix und ganz hochgescrollt (wie static-menu)
111 *   html.stick-bottom-menu - Zwischensituation wenn fix und ganz runtergescrollt (absolut positioniert)
112 */
113html.static-menu nav.side, html.stick-top-menu nav.side {
114        /* Ein/Ausblendeffekt fuer .get-menu-Button erzeugen  */
115        /* http://www.colorzilla.com/gradient-editor */
116        background: -moz-linear-gradient(top,  rgba(223,234,240,1) 0%, rgba(223,234,240,1) 82%, rgba(223,234,240,0) 100%); /* FF3.6+ */
117        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(223,234,240,1)), color-stop(82%,rgba(223,234,240,1)), color-stop(100%,rgba(223,234,240,0))); /* Chrome,Safari4+ */
118        background: -webkit-linear-gradient(top,  rgba(223,234,240,1) 0%,rgba(223,234,240,1) 82%,rgba(223,234,240,0) 100%); /* Chrome10+,Safari5.1+ */
119        background: -o-linear-gradient(top,  rgba(223,234,240,1) 0%,rgba(223,234,240,1) 82%,rgba(223,234,240,0) 100%); /* Opera 11.10+ */
120        background: -ms-linear-gradient(top,  rgba(223,234,240,1) 0%,rgba(223,234,240,1) 82%,rgba(223,234,240,0) 100%); /* IE10+ */
121        background: linear-gradient(top,  rgba(223,234,240,1) 0%,rgba(223,234,240,1) 82%,rgba(223,234,240,0) 100%); /* W3C */
122        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dfeaf0', endColorstr='#00dfeaf0',GradientType=0 ); /* IE6-9 */
123
124        padding-bottom: 200%; /* sic! die 82% aus dem gradient muessen unterhalb der Navi anfangen*/
125        position: relative; z-index: 10;
126}
127
128html.fixed-menu nav.side {
129        position: fixed;
130        width: 210px;
131        top: 15px;
132}
133
134html.stick-bottom-menu nav.side {
135        position: absolute;
136        width: 210px;
137        /* Top-Wert durch JS gesetzt. */
138}
139
140/* Buttons in Navigationsleiste */
141section.sidebar .button {
142        display: block;
143        cursor: pointer;
144
145        /*font: 14px "Myriad Pro Light";*/
146        font-size: 14px;
147        text-transform: uppercase;
148        color: #a07f60;
149        font-weight: bold;
150}
151
152section.sidebar .button:hover {
153        background-color: white;
154}
155
156section.sidebar .button.get-menu {
157        /* Menü-runterhol-Button */
158        position: fixed; z-index: 1;
159        bottom: 0; margin: 0 -25px;
160        padding: 15px 25px;
161        text-align: center; width: 210px;
162}
163
164section.sidebar .button.collapse-menu {
165        /* Ein/Ausklapp-Button */
166        margin: 3em -25px 0 -25px;
167        padding: 5px 25px;
168}
169
170section.sidebar.bottom {
171        position: absolute;
172        bottom: 0; left: 0;
173}
174
175section.sidebar.bottom .button.get-menu {
176        position: static;
177        margin-bottom: -25px;
178}
179
180html.button-stick-bottom section.sidebar.top .button.get-menu {
181        display: none;
182}
Note: See TracBrowser for help on using the repository browser.
© 2008 - 2013 technikum29 • Sven Köppel • Some rights reserved
Powered by Trac
Expect where otherwise noted, content on this site is licensed under a Creative Commons 3.0 License