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