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.
Auf den Verzeichnisnamen klicken, dies zeigt nur das Verzeichnis mit Inhalt an

(Beispiel Datei-Icons)

Auf das Icon klicken um den Quellcode anzuzeigen

responsive.css

Zuletzt modifiziert: 09.10.2024, 12:54 - Dateigröße: 9.60 KiB


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