1@media screen and (max-width: 480px) { 2 div.dokuwiki .bar-right { display: inline; float: none; } 3 #dw__search button { margin: 0px; margin-left: 1em; } 4 button { margin: 0px 8px 16px 8px; padding: 8px !important; } 5 button:first-of-type { margin-left: 0px; } 6 button.toolbutton { margin: 8px 8px !important; } 7 button:first-child, button.toolbutton:first-child { margin-left: 8px !important; } 8 button img { padding: 8px; } 9 div.dokuwiki #dw__toc ul { line-height: 2em; } 10 div.dokuwiki #dw__toc { font-size: 1em; } 11 div.dokuwiki #dw__toc ul li { margin: 0.35em 0px; } 12 div.dokuwiki div.breadcrumbs { padding: 1em; } 13 .page li, .page dd { margin: 0.85em 0px; } 14 15 /* rearrange elements * / 16 /* 17 https://webdesign.tutsplus.com/tutorials/a-few-different-css-methods-for-column-ordering--cms-27079 18 https://developer.mozilla.org/en-US/docs/Web/CSS/grid-template-columns 19 https://www.digitalocean.com/community/tutorials/css-css-grid-layout-fr-unit 20 */ 21 .maincontentrow { 22 display: grid !important; 23 grid-template-columns: repeat(1); 24 } 25 .right { order: 2; float: none !important; } 26 .left { order: 3; float: none !important; } 27 /* /////_______//// */ 28} 29 30/* media manager and config manager for mobile */ 31/* See more: https://gitlab.com/-/snippets/2071984 */ 32@media screen and (max-width: 480px){ 33 fieldset, 34 #mediamanager__page, 35 #mediamanager__page .filelist{ 36 max-width: 100%; min-width: unset; 37 } 38 #mediamanager__page .file, 39 #mediamanager__page .namespaces, 40 #mediamanager__page .panel { 41 width: 100%; clear: both; float: none; 42 } 43 44/* #mediamanager__page .namespaces { min-width: unset; } */ 45 46 /*.page li, .page dd { margin: 1.35em 0px !important; display: block; }*/ 47 #config__manager tr { } 48 #config__manager td { display: block; padding: 1.15em 0px; max-width: 75%; } 49 #config__manager fieldset { margin: 1em 0px; width: 100%; box-sizing: border-box; } 50 51 /* make <select> not exceed it's parent div's width */ 52 /* https://stackoverflow.com/q/44810056/337306 */ 53 div.input, label.nowrap { display: flex; } select { width: 100%; flex-shrink: 1; } 54 55 fieldset { width: unset; } 56 #config__manager fieldset td.value { width: unset; } 57 td.label { word-wrap: anywhere; } 58 59 #config__manager td .input, 60 #config__manager fieldset td.value, 61 input, textarea, 62 #config__manager td input.edit, 63 #config__manager td textarea.edit { 64 max-width: 100%; 65 width: auto; 66 } 67} 68