1 2 3ul.settingstree_explorer{ 4 list-style-type: none; 5 margin: 0; 6 padding: 0; 7} 8.settingstree_explorer_root{ 9 font-size: 90%; 10 width: 100%; 11 margin: 1em 0; 12 min-height: 300px; 13 max-height: 800px; 14 float: left; 15 overflow: auto; 16 border: 1px solid #ccc; 17 text-align: left; 18} 19 20.settingstree_explorer_root .folder > .li > a:before, 21.settingstree_explorer_root.folder > .li > a:before{ 22 content: ""; 23 display: inline-block; 24 width: 9px; height: 9px; 25 margin-right: 5px; 26} 27.settingstree_explorer_root .folder.open> .li > a:before, 28.settingstree_explorer_root.folder.open> .li > a:before{ 29 background: url('../../images/minus.gif'); 30} 31.settingstree_explorer_root .folder.closed> .li > a:before, 32.settingstree_explorer_root.folder.closed> .li > a:before{ 33 background: url('../../images/plus.gif'); 34} 35.settingstree_explorer_root .folder.closed> ul.settingstree_explorer, 36.settingstree_explorer_root.folder.closed> ul.settingstree_explorer{ 37 display: none; 38} 39.settingstree_explorer_root .folder.open.loading> .li:after, 40.settingstree_explorer_root.folder.open.loading> .li:after{ 41 content: "Loading..."; 42 margin-left: 10px; 43 display: block; 44} 45 46.settingstree_explorer_selected{ 47 font-weight: bold; 48} 49/* settingstree and the hierarchy history goes to left column (25%) */ 50.settingstree_left{ 51 float: left; 52 width: 25%; 53 margin: 0; 54 box-sizing: border-box; 55} 56.settingstree_left_column{ 57 clear: left; 58} 59/* explorertree takes 25%, this takes the rest */ 60.settingstree_right{ 61 float: right; 62 width: 75%; 63 margin: 0; 64 box-sizing: border-box; 65} 66 67.settingstree_area #config__manager table tr td .input_area input, 68.settingstree_area #config__manager table tr td .input_area textarea, 69.settingstree_area #config__manager table tr td .input_area select, 70.settingstree_area #config__manager table tr td .input_area div.input 71{ 72 width: 100%; 73 margin: 0; 74} 75.settingstree_area #config__manager td.label{ 76 position: relative; 77 padding: 1.2em 1em 0.6em 1em; 78} 79.settingstree_area #config__manager td.label span.outkey{ 80 margin: 0; 81 top: 1px; 82 left: 2px; 83 position: absolute; 84} 85 86.settingstree_area #config__manager table tr .input_area{ 87 padding: 2px; 88} 89.settingstree_area #config__manager table tr .protect_area.changed, 90.settingstree_area #config__manager table tr .input_area.changed{ 91 background: wheat; 92} 93.settingstree_area #config__manager table tr .protect_area { 94 width: 150px; 95} 96.settingstree_area #config__manager table tr .protect_area label{ 97 margin-right: 1em; 98} 99.settingstree_area #config__manager table tr.protected .protect_area label{ 100 color: #888; 101} 102 103.settingstree_area .settingstree_buttons{ 104 padding: 10px; 105 text-align: right; 106} 107.settingstree_area .settingstree_buttons button{ 108 border-radius: 5px; 109 font-size: 120%; 110 margin: 0 0.5em; 111 padding: 0.3em 0.6em; 112} 113.settingstree_area .settingstree_buttons #settingstree_save_button, 114.settingstree_area .settingstree_buttons #settingstree_export_button{ 115 background: lightgreen; 116} 117.settingstree_area .settingstree_buttons #settingstree_cancel_button, 118.settingstree_area .settingstree_buttons #settingstree_close_button{ 119 background: lightgrey; 120} 121.settingstree_area .settingstree_error_area{ 122 margin: 0 1em; 123} 124.settingstree_area .settingstree_error_area >.error *{ 125 clear: none; 126} 127 128ul.settings_hierarchy_history li > span > code, 129.settingstree_area .error code{ 130 padding: 1px 4px 1px; 131} 132.settingstree_area button.settingstree_button_show_hierarchy{ 133 position: absolute; 134 font-size: 70%; 135 top: 1px; 136 right: 2px; 137 display: block; 138 background-color: #fff; 139 color: #000; 140 padding: 1px; 141 z-index: 1; 142} 143 144.settingstree_left_column ul.settings_hierarchy_history li.highlighted_level > b{ 145 background: lightyellow; 146} 147.settingstree_left_column ul.settings_hierarchy_history > li.title{ 148 color: #000; 149} 150.settingstree_left_column ul.settings_hierarchy_history > li.title >b{ 151 display: inline; 152 font-weight: bold; 153} 154 155.settingstree_left_column ul.settings_hierarchy_history li > b{ 156 display: block; 157 color: #555; 158 x-font-weight: normal; 159 padding: 0 2px; 160 margin-left: -2px; 161} 162 163.settingstree_left_column ul.settings_hierarchy_history li > b.value{ 164 color: #000; 165} 166.settingstree_left_column ul.settings_hierarchy_history li > b.protect{ 167 color: #000; 168} 169/*.settingstree_left_column ul.settings_hierarchy_history li > b.value:before{ 170 content: '+v '; 171 color: blue; 172} 173.settingstree_left_column ul.settings_hierarchy_history li > b.protect:before{ 174 content: '+p '; 175 color: red; 176} 177.settingstree_left_column ul.settings_hierarchy_history li > b.protect.value:before{ 178 content: '+vp '; 179 color: red; 180}*/ 181 182.settingstree_left_column ul.settings_hierarchy_history{ 183 font-size: 90%; 184 padding: 0.3em; 185 border: 1px solid #ccc; 186 list-style-type:none; 187 188} 189.settingstree_left_column ul.settings_hierarchy_history li > span{ 190 color: #333; 191 display: block; 192} 193.settingstree_left_column ul.settings_hierarchy_history li > span._d{ 194 color: #3a3; 195} 196.settingstree_left_column ul.settings_hierarchy_history li > span._v{ 197 color: #33a; 198} 199.settingstree_left_column ul.settings_hierarchy_history li > span._v > i._i{ 200 color: #a33; 201 font-style: normal; 202 font-size: 90%; 203} 204.settingstree_left_column ul.settings_hierarchy_history li > span._p{ 205 color: #a33; 206} 207 208.settingstree_left_column ul.settings_hierarchy_history li{ 209 margin-left: 0.8em; 210} 211.settingstree_left_column ul.settings_hierarchy_history li ul{ 212 list-style-type:none; 213} 214 215body > #settingstree_grayout{ /* background-grayout covering the whole screen, and fixed to prevent scrollout*/ 216 position: fixed; 217 z-index: 1000; 218 top: 0; left: 0; right: 0; bottom: 0; 219 background: rgba(0,0,0,0.3); 220 221} 222#settingstree_grayout > #settingstree_export_popup_container{ /* container helper to positioning */ 223 position: relative; 224 width: 0px; 225 margin: 0 auto; 226 height: 100%; 227 box-sizing: border-box; 228} 229 230#settingstree_export_popup_container > .settingstree_export_popup_layer{ /* box that contains the popup contents. negative margin to force centered layout and automatic scrolling inside because the it is fixed.*/ 231 position: absolute; 232 padding: 2px; 233 max-height: 100%; 234 overflow: auto; 235 border: 1px solid #888; 236 box-shadow: 2px 1px 4px #000; 237 background: #fff; 238 z-index: 1; 239} 240#settingstree_export_popup_container > .settingstree_export_popup_close_button:after{ /* button at the top right corner of the layer.*/ 241 position: absolute; 242 z-index: 2; 243 top: 0px; 244 line-height: 18px; 245 font-size: 20px; 246 content: "x"; 247 font-weight: bold; 248 text-align: center; 249 margin-top: -15px; 250 margin-left: -15px; 251 cursor: pointer; 252 width: 20px; 253 height: 20px; 254 background: #fff; 255 border: 2px solid black; 256 border-radius: 50%; 257 padding: 2px; 258 box-shadow: 1px 0px 2px #000; 259} 260 261@media (max-width:799px){ 262 body > #settingstree_grayout{ 263 padding: 30px 0; 264 } 265 #settingstree_export_popup_container > .settingstree_export_popup_layer{ 266 margin: 0 -288px; 267 width: 570px; 268 } 269 #settingstree_export_popup_container > .settingstree_export_popup_close_button:after{ 270 left: 288px; 271 } 272 273} 274@media (min-width: 800px) and (max-width:1024px){ 275 body > #settingstree_grayout{ 276 padding: 70px 0; 277 } 278 #settingstree_export_popup_container > .settingstree_export_popup_layer{ 279 margin: 0 -388px; 280 width: 770px; 281 } 282 #settingstree_export_popup_container > .settingstree_export_popup_close_button:after{ 283 left: 388px; 284 } 285} 286@media (min-width: 1025px){ 287 body > #settingstree_grayout{ 288 padding: 100px 0; 289 } 290 #settingstree_export_popup_container > .settingstree_export_popup_layer{ 291 margin: 0 -488px; 292 width: 970px; 293 } 294 #settingstree_export_popup_container > .settingstree_export_popup_close_button:after{ 295 left: 488px; 296 } 297} 298 299 300.tpl_dokuwiki #dokuwiki__pagetools { 301 z-index: 3; /* this is needed, because we use absolute positioned buttons, and it looks crappy with default template... other templates should include this for their static positioned parts anyway... */ 302} 303