Verzeichnisstruktur phpBB-3.1.0
- Veröffentlicht
- 27.10.2014
So funktioniert es
|
|
Auf das letzte Element klicken. Dies geht jeweils ein Schritt zurück |
Auf das Icon klicken, dies öffnet das Verzeichnis. Nochmal klicken schließt das Verzeichnis. |
|
|
(Beispiel Datei-Icons)
|
Auf das Icon klicken um den Quellcode anzuzeigen |
responsive.css
001 /* Responsive Design
002 ---------------------------------------- */
003
004 .responsive-hide { display: none !important; }
005 .responsive-show { display: block !important; }
006 .responsive-show-inline { display: inline !important; }
007 .responsive-show-inline-block { display: inline-block !important; }
008
009 /* Content wrappers
010 ----------------------------------------*/
011 html {
012 height: auto;
013 }
014
015 body {
016 padding: 0;
017 }
018
019 #wrap {
020 border: none;
021 border-radius: 0;
022 margin: 0;
023 min-width: 290px;
024 padding: 0 5px;
025 }
026
027 /* Common block wrappers
028 ----------------------------------------*/
029 .headerbar, .navbar, .forabg, .forumbg, .post, .panel {
030 border-radius: 0;
031 margin-left: -5px;
032 margin-right: -5px;
033 }
034
035 #cp-main .forabg, #cp-main .forumdb, #cp-main .post, #cp-main .panel {
036 border-radius: 7px;
037 }
038
039 /* Logo block
040 ----------------------------------------*/
041 #site-description {
042 float: none;
043 width: auto;
044 text-align: center;
045 }
046
047 .logo {
048 /* change display value to inline-block to show logo */
049 display: none;
050 float: none;
051 padding: 10px;
052 }
053
054 #site-description h1, #site-description p {
055 text-align: inherit;
056 float: none;
057 margin: 5px;
058 line-height: 1.2em;
059 overflow: hidden;
060 text-overflow: ellipsis;
061 }
062
063 #site-description p, .search-header {
064 display: none;
065 }
066
067 /* Navigation
068 ----------------------------------------*/
069 .headerbar + .navbar {
070 margin-top: -5px;
071 }
072
073 /* Search
074 ----------------------------------------*/
075 .responsive-search { display: block !important; }
076 .responsive-search a {
077 display: block;
078 width: 16px;
079 height: 22px;
080 text-indent: 99px;
081 overflow: hidden;
082 background-position: 50% 50%;
083 background-repeat: no-repeat;
084 text-decoration: none;
085 }
086
087 /* .topiclist lists
088 ----------------------------------------*/
089 li.header dt {
090 text-align: center;
091 text-transform: none;
092 line-height: 1em;
093 font-size: 1.2em;
094 padding-bottom: 4px;
095 }
096
097 ul.topiclist li.header dt, ul.topiclist li.header dt .list-inner {
098 margin-right: 0 !important;
099 padding-right: 0;
100 }
101
102 ul.topiclist li.header dd {
103 display: none !important;
104 }
105
106 ul.topiclist dt, ul.topiclist dt .list-inner,
107 ul.topiclist.missing-column dt, ul.topiclist.missing-column dt .list-inner,
108 ul.topiclist.two-long-columns dt, ul.topiclist.two-long-columns dt .list-inner,
109 ul.topiclist.two-columns dt, ul.topiclist.two-columns dt .list-inner {
110 margin-right: 0;
111 }
112
113 ul.topiclist dt .list-inner.with-mark {
114 padding-right: 34px;
115 }
116
117 ul.topiclist dt .list-inner {
118 min-height: 28px;
119 }
120
121 ul.topiclist li.header dt .list-inner {
122 min-height: 0;
123 }
124
125 ul.topiclist dd {
126 display: none;
127 }
128 ul.topiclist dd.mark {
129 display: block;
130 }
131
132 /* Forums and topics lists
133 ----------------------------------------*/
134 ul.topiclist.forums dt {
135 margin-right: -250px;
136 }
137 ul.topiclist.forums dt .list-inner {
138 margin-right: 250px;
139 }
140
141 ul.topiclist.forums dd.lastpost {
142 display: block;
143 }
144
145 ul.topiclist dd.mark {
146 display: block;
147 position: absolute;
148 right: 5px;
149 top: 0;
150 margin: 0;
151 width: auto;
152 min-width: 0;
153 text-align: left;
154 }
155
156 ul.topiclist.forums dd.topics dfn, ul.topiclist.topics dd.posts dfn {
157 position: relative;
158 left: 0;
159 width: auto;
160 display: inline;
161 font-weight: normal;
162 }
163
164 @media only screen and (max-width: 550px), only screen and (max-device-width: 550px) {
165 ul.topiclist.forums dt {
166 margin-right: 0;
167 }
168
169 ul.topiclist.forums dt .list-inner {
170 margin-right: 0;
171 }
172
173 ul.topiclist.forums dd.lastpost {
174 display: none;
175 }
176 }
177
178 li.row .responsive-show strong {
179 font-weight: bold;
180 color: inherit;
181 }
182
183 ul.topiclist li.row dt a.subforum {
184 display: inline-block;
185 vertical-align: bottom;
186 overflow: hidden;
187 text-overflow: ellipsis;
188 max-width: 100px;
189 }
190
191 /* Notifications list
192 ----------------------------------------*/
193 @media only screen and (max-width: 350px), only screen and (max-device-width: 350px) {
194 .dropdown-extended .dropdown-contents {
195 width: auto;
196 }
197 }
198
199 /* Pagination
200 ----------------------------------------*/
201 .pagination > ul {
202 margin: 5px 0 0;
203 }
204
205 .row .pagination .ellipsis + li {
206 display: none !important;
207 }
208
209 /* Responsive tables
210 ----------------------------------------*/
211 table.responsive, table.responsive tbody, table.responsive tr, table.responsive td {
212 display: block;
213 }
214
215 table.responsive thead, table.responsive th {
216 display: none;
217 }
218
219 table.responsive.show-header thead, table.responsive.show-header th:first-child {
220 display: block;
221 width: auto !important;
222 text-align: left !important;
223 }
224
225 table.responsive.show-header th:first-child span.rank-img {
226 display: none;
227 }
228
229 table.responsive tr {
230 margin: 2px 0;
231 }
232
233 table.responsive td {
234 width: auto !important;
235 text-align: left !important;
236 padding: 4px;
237 }
238
239 table.responsive td.empty {
240 display: none !important;
241 }
242
243 table.responsive td > dfn {
244 display: inline-block !important;
245 }
246
247 table.responsive td > dfn:after {
248 content: ':';
249 padding-right: 5px;
250 }
251
252 table.responsive span.rank-img {
253 float: none;
254 padding-right: 5px;
255 }
256
257 table.responsive#memberlist td:first-child input[type="checkbox"] {
258 float: right;
259 }
260
261 /* Forms
262 ----------------------------------------*/
263 fieldset dt, fieldset.fields1 dt, fieldset.fields2 dt {
264 width: auto;
265 float: none;
266 }
267
268 fieldset dd, fieldset.fields1 dd, fieldset.fields2 dd {
269 margin-left: 20px;
270 }
271
272 textarea, dd textarea, #message-box textarea {
273 width: 100%;
274 -moz-box-sizing: border-box;
275 box-sizing: border-box;
276 }
277
278 dl.pmlist dt {
279 width: auto !important;
280 margin-bottom: 5px;
281 }
282
283 dl.pmlist dd {
284 display: inline-block;
285 margin-left: 0 !important;
286 }
287
288 dl.pmlist dd:first-of-type {
289 padding-left: 20px;
290 }
291
292 #smiley-box, #message-box {
293 float: none;
294 width: auto;
295 }
296
297 #smiley-box {
298 margin-top: 5px;
299 }
300
301 .bbcode-status {
302 display: none;
303 }
304
305 .colour-palette, .colour-palette tbody, .colour-palette tr {
306 display: block;
307 }
308
309 .colour-palette td {
310 display: inline-block;
311 margin-right: 2px;
312 }
313
314 .horizontal-palette td:nth-child(2n), .vertical-palette tr:nth-child(2n) {
315 display: none;
316 }
317
318 .colour-palette a {
319 display: inline-block !important;
320 }
321
322 fieldset.quick-login label {
323 display: block;
324 margin-bottom: 5px;
325 white-space: normal;
326 }
327
328 fieldset.quick-login label > span {
329 display: inline-block;
330 min-width: 100px;
331 }
332
333 fieldset.quick-login input.inputbox {
334 width: 85%;
335 max-width: 300px;
336 margin-left: 20px;
337 }
338
339 fieldset.quick-login label[for="autologin"] {
340 display: inline-block;
341 text-align: right;
342 min-width: 50%;
343 }
344
345 @media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
346 dd label {
347 white-space: normal;
348 }
349
350 select, .inputbox {
351 max-width: 260px;
352 }
353
354 .captcha-panel dd.captcha {
355 margin-left: 0;
356 }
357
358 .captcha-panel dd.captcha-image img {
359 width: 100%;
360 }
361
362 #recaptcha_challenge_image,
363 #recaptcha_response_field,
364 .recaptchatable #recaptcha_image {
365 width: 100% !important;
366 height: auto !important;
367 }
368
369 .recaptchatable tr td:last-child {
370 display: none;
371 }
372
373 .captcha-panel .recaptcha-responsive {
374 display: inline-block !important;
375 margin-top: 10px;
376 vertical-align: middle;
377 }
378 }
379
380 @media only screen and (max-width: 430px), only screen and (max-device-width: 430px) {
381 .section-viewtopic .search-box .inputbox {
382 width: 110px;
383 }
384 }
385
386 @media only screen and (max-width: 320px), only screen and (max-device-width: 320px) {
387 select, .inputbox {
388 max-width: 240px;
389 }
390 }
391
392 /* User profile
393 ----------------------------------------*/
394 .column1, .column2, .left-box.profile-details {
395 float: none;
396 width: auto;
397 }
398
399 @media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
400 dl.details dt, dl.details dd {
401 width: auto;
402 float: none;
403 text-align: left;
404 }
405
406 dl.details dd {
407 margin-left: 20px;
408 }
409 }
410
411 /* Polls
412 ----------------------------------------*/
413 fieldset.polls dt {
414 width: 90%;
415 }
416
417 fieldset.polls dd.resultbar {
418 padding-left: 20px;
419 }
420
421 fieldset.polls dd.poll_option_percent {
422 width: 20%;
423 }
424
425 fieldset.polls dd.resultbar, fieldset.polls dd.poll_option_percent {
426 margin-top: 5px;
427 }
428
429 /* Post
430 ----------------------------------------*/
431 .postbody {
432 position: inherit;
433 }
434
435 .postprofile, .postbody, .search .postbody {
436 display: block;
437 width: auto;
438 float: none;
439 padding: 0;
440 min-height: 0;
441 }
442
443 .post .postprofile {
444 width: auto;
445 border-width: 0 0 1px 0;
446 padding-bottom: 5px;
447 margin: 0;
448 margin-bottom: 5px;
449 min-height: 40px;
450 overflow: hidden;
451 }
452
453 .postprofile dd {
454 display: none;
455 }
456
457 .postprofile dt, .postprofile dd.profile-rank, .search .postprofile dd {
458 display: block;
459 margin: 0;
460 }
461
462 .postprofile .has-avatar .avatar-container {
463 margin: 0;
464 overflow: inherit;
465 }
466
467 .postprofile .avatar-container:after {
468 clear: none;
469 }
470
471 .postprofile .avatar {
472 margin-right: 5px;
473 }
474
475 .postprofile .avatar img {
476 width: auto !important;
477 height: auto !important;
478 max-height: 32px;
479 }
480
481 .has-profile .postbody h3 {
482 margin-left: 0 !important;
483 margin-right: 0 !important;
484 }
485
486 .has-profile .post-buttons {
487 right: 20px;
488 top: 15px;
489 }
490
491 .online {
492 background-size: 40px;
493 }
494
495 /* Misc stuff
496 ----------------------------------------*/
497 h2 {
498 margin-top: .5em;
499 }
500
501 p {
502 margin-bottom: .5em;
503 overflow: hidden;
504 }
505
506 p.rightside {
507 margin-bottom: 0;
508 }
509
510 fieldset.display-options label {
511 display: block;
512 clear: both;
513 margin-bottom: 5px;
514 }
515
516 dl.mini dd.pm-legend {
517 float: left;
518 min-width: 200px;
519 }
520
521 #topicreview {
522 margin: 0 -5px;
523 padding: 0 5px;
524 }
525
526 fieldset.display-actions {
527 white-space: normal;
528 }
529
530 .phpbb_alert {
531 width: auto;
532 margin: 0 5px;
533 }
534
535 .attach-comment dfn {
536 width: 100%;
537 }
538
539 @media only screen and (max-width: 500px), only screen and (max-device-width: 500px) {
540 p.responsive-center {
541 float: none;
542 text-align: center;
543 margin-bottom: 5px;
544 }
545
546 .action-bar > div {
547 margin-bottom: 5px;
548 }
549
550 .action-bar > .pagination {
551 float: none;
552 clear: both;
553 padding-bottom: 1px;
554 text-align: center;
555 }
556
557 .action-bar > .pagination li.page-jump {
558 margin: 0 2px;
559 }
560
561 p.jumpbox-return {
562 display: none;
563 }
564
565 .display-options > label:nth-child(1) {
566 display: block;
567 margin-bottom: 5px;
568 }
569
570 .attach-controls {
571 margin-top: 5px;
572 width: 100%;
573 }
574 }
575