Kanonische Links über _canonical realisiert
[website] / less / screen / layout.less
1 /** Seite gesamt (Abmessungen, Aussenabstände etc.) */
2
3 body
4 {
5   padding: 0;
6   overflow-y: scroll; /** Die vertikale Scroll-Leiste stets anzeigen */
7 }
8 #page
9 {
10   margin: 0 auto; /** Seiteninhalte zentrieren, wenn max-width des Inhalts (s.u.) erreicht ist */
11 }
12
13
14 /** Seitenaufteilung mit Menü (Zweispaltig) */
15
16 body
17 {
18   padding: 0 3em 0 5em;
19 }
20 .content
21 {
22   position: relative;
23   padding: 0 27em 7.1875em 0; /** Unten: 115px (gemessene Gesamthöhe des Footers - mit Abstand und Margin) */
24 }
25 .content > .main
26 {
27   float: left;
28   min-height: 1em;
29   position: relative;
30   width: 100%;
31 }
32 .content > .marginal
33 {
34   float: left;
35   margin: 0 -27em 0 2.625em;
36   padding: 0 2em 1.0625em 2em;
37   position: relative;
38   width: 20.375em;
39   background-color: @heller;
40 }
41
42 /** Anpassungen für Seiten ohne Menü (Einspaltig) */
43
44 .nomenu .content > .marginal
45 {
46   padding-top: 2em;
47   background-color: @sehrhell;
48 }
49
50
51 /** Seitenkopf positionieren */
52
53 #header
54 {
55   margin-left: -2.125em;
56   padding-bottom: 2em;
57 }
58 #header > hr.h
59 {
60   display: none;
61 }
62
63
64 /** Bereichsauswahl positionieren und stylen */
65
66 #nav > hr.n
67 {
68   display: none;
69 }
70 #nav
71 {
72   position: relative;
73   top: auto;
74   right: auto;
75   width: 22.375em; /** 358px = 326px + 32px*/
76 }
77 #menu
78 {
79   position: relative;
80   width: 200%;
81   top: -9em; /** 136px */
82   right: 100%;
83   text-align: right;
84   list-style-type: none;
85   margin: 0 0 -2.125em 0; /** 0 0 -34px 0 */
86   padding: 0;
87   border-style: none;
88 }
89 .nomenu #menu
90 {
91   top: -11em; /** 2em mehr wegen 2em margin-top der Marginalspalte auf .nomenu-Seiten */
92 }
93 #menu > li.m
94 {
95   display: inline-block;
96   padding: 0 0 0 4em;
97 }
98 #menu > li.m > .m
99 {
100   font-size: 250%; /** 40px */
101   color: @normal;
102 }
103 #menu > li.m > a.m
104 {
105   border-color: @normal;
106 }
107 #menu > li.m > a.m:hover
108 {
109   border-color: @dunkler;
110 }
111 #menu > li.m > a.m:hover,
112 #menu > li.m > strong.m
113 {
114   border-style: solid;
115 }
116 #menu > li.m > a.m.selected
117 {
118   color: @normal;
119 }
120 #menu > li.m > a.m:hover
121 {
122   color: @dunkler;
123 }
124 #menu > li.m > a.m:hover:before,
125 #menu > li.m > a.m.selected:before,
126 #menu > li.m > strong.m:before
127 {
128   content: '> ';
129   margin-left: -.92em;
130 }
131
132
133 /** Breadcrump positionieren */
134
135 #breadcrumb
136 {
137   position: absolute;
138   top: 8.375em;
139   left: 6.9em;
140   z-index: 3;
141 }
142 #breadcrumb > a.hide
143 {
144   position: absolute;
145 }
146 #breadcrumb > hr.b
147 {
148   display: none;
149 }
150
151
152 /** Footer positionieren */
153
154 #footer
155 {
156   padding: 2em 0;
157 }
158 #footer > hr.f
159 {
160   display: none;
161 }
162
163
164 /** Marginal-Inhalte anpassen... */
165
166 .content > .marginal h1,
167 .content > .marginal h2,
168 .content > .marginal h3,
169 .content > .marginal h4
170 {
171   color: @hintergrund;
172 }
173 .content > .marginal h1:first-child,
174 .content > .marginal h2:first-child,
175 .content > .marginal h3:first-child,
176 .content > .marginal h4:first-child
177 {
178   margin-top: 0;
179 }