1@media screen and (max-width: 480px) { 2 ul, p { margin: 1em 0px; } 3 .page ul, .page ol { margin-left: 1em; } 4 li.user { display: block !important; float: none !important; } 5 li.profile { margin-left: 0px; } 6 .page li, .page dd { margin: 0.85em 0.35em; } 7 button { margin: 12px 8px; } 8 button img { padding: 5px; } 9 #dokuwiki__header .tools ul li { 10 display: inline-block; 11 margin: 0.35em 0.85em; 12 } 13} 14 15 16/* media manager and config manager for mobile */ 17@media screen and (max-width: 480px){ 18 fieldset, 19 #mediamanager__page, 20 #mediamanager__page .filelist{ 21 max-width: 100%; min-width: unset; 22 } 23 #mediamanager__page .file, 24 #mediamanager__page .namespaces, 25 #mediamanager__page .panel { 26 width: 100%; clear: both; float: none; 27 } 28 29/* #mediamanager__page .namespaces { min-width: unset; } */ 30 31 /*.page li, .page dd { margin: 1.35em 0px !important; display: block; }*/ 32 #config__manager tr { } 33 #config__manager td { display: block; padding: 1.15em 0px; max-width: 75%; } 34 #config__manager fieldset { margin: 1em 0px; width: 100%; box-sizing: border-box; } 35 36 /* make <select> not exceed it's parent div's width */ 37 /* https://stackoverflow.com/q/44810056/337306 */ 38 div.input, label.nowrap { display: flex; } select { width: 100%; flex-shrink: 1; } 39 40 fieldset { width: unset; } 41 #config__manager fieldset td.value { width: unset; } 42 td.label { word-wrap: anywhere; } 43 44 #config__manager td .input, 45 #config__manager fieldset td.value, 46 input, textarea, 47 #config__manager td input.edit, 48 #config__manager td textarea.edit { 49 max-width: 100%; 50 width: auto; 51 } 52} 53 54