github.com/Azareal/Gosora@v0.0.0-20210729070923-553e66b59003/themes/nox/public/panel.css (about) 1 #back { 2 padding: 0px; 3 } 4 #back, .footer .widget, #poweredByHolder { 5 border: none; 6 } 7 .left_of_nav, .nav, .right_of_nav, .sidebar { 8 display: none; 9 } 10 .footer .widget, #poweredByHolder { 11 background-color: #393939; 12 } 13 .submenu a:before { 14 content: "-"; 15 margin-right: 8px; 16 } 17 18 {{template "acc_panel_common.css" }} 19 .colstack_left .colstack_head { 20 font-size: 19px; 21 /*padding-top: 10px; 22 padding-bottom: 10px;*/ 23 padding-top: 12px; 24 padding-bottom: 12px; 25 } 26 .menu_stats { 27 margin-left: 4px; 28 } 29 .above_right { 30 background-color: rgb(62, 62, 62); 31 margin-top: -12px; 32 margin-left: -24px; 33 margin-right: -24px; 34 display: flex; 35 } 36 .above_right .left_bit { 37 padding-left: 20px; 38 margin-top: 16px; 39 font-size: 18px; 40 } 41 .above_right .left_bit a { 42 color: #bbbbbb; 43 } 44 .above_right .right_bit { 45 margin-left: auto; 46 display: flex; 47 background-color: rgb(72, 72, 72); 48 padding-top: 12px; 49 padding-bottom: 12px; 50 padding-right: 22px; 51 padding-left: 20px; 52 } 53 .above_right img { 54 border-radius: 24px; 55 } 56 .above_right span { 57 margin-left: 12px; 58 margin-top: 5px; 59 color: rgb(180, 180, 180); 60 } 61 62 .colstack_right { 63 background-color: #333333; 64 width: 90%; 65 padding-top: 12px; 66 padding-right: 24px; 67 padding-bottom: 24px; 68 padding-left: 24px; 69 } 70 .colstack_right .colstack_head { 71 margin-bottom: 5px; 72 } 73 .colstack_right .colstack_head + .colstack_head:not(:first-child) { 74 margin-top: 5px; 75 } 76 .colstack_right .colstack_head h1 { 77 font-size: 21px; 78 } 79 .colstack_right .colstack_head h1 + h2.hguide { 80 margin-left: auto; 81 font-size: 17px; 82 } 83 .colstack_right .colstack_item.the_form, .colstack_right .colstack_item:not(.colstack_head):not(.rowhead) .rowitem { 84 background-color: #444444; 85 } 86 .colstack_right .colstack_head.colstack_sub_head:not(:first-child) { 87 margin-top: 12px; 88 } 89 .colstack_head + .colstack_head.colstack_sub_head:not(:first-child) { 90 margin-top: 2px; 91 } 92 .alert { 93 margin-top: 18px; 94 } 95 .rowitem, .formitem.avataritem { 96 display: flex; 97 } 98 .formitem.avataritem { 99 flex-direction: column; 100 } 101 .avataritem .avatarbuttons { 102 margin-top: 7px; 103 margin-bottom: 3px; 104 } 105 106 .colstack_grid { 107 display: grid; 108 grid-gap: 8px; 109 grid-template-columns: repeat(3, 1fr); 110 } 111 .rowlist.bgavatars, .micro_grid { 112 grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); 113 } 114 .grid_item { 115 border-radius: 3px; 116 color: rgb(190,190,190); 117 background-color: rgb(68,68,68); 118 padding: 12px; 119 } 120 .grid_item a { 121 color: rgb(195,195,195); 122 } 123 .stat_green { 124 background-color: rgb(68,88,68); 125 } 126 .stat_orange { 127 background-color: rgb(88,78,68); 128 } 129 .stat_red { 130 background-color: rgb(88,68,68); 131 } 132 .grid2 { 133 margin-top: 12px; 134 } 135 136 .panel_buttons, .panel_floater { 137 margin-left: auto; 138 } 139 140 .colstack_right input, .colstack_right select, .colstack_right textarea, .formitem img { 141 padding: 4px; 142 padding-bottom: 3px; 143 padding-left: 6px; 144 padding-right: 6px; 145 } 146 147 #panel_users .rowitem { 148 padding-top: 20px; 149 padding-left: 4px; 150 padding-right: 4px; 151 padding-bottom: 18px; 152 } 153 button, .formbutton, .panel_right_button:not(.has_inner_button), #panel_users .profile_url { 154 background: rgb(100,100,200); 155 } 156 #panel_users .panel_tag:not(.panel_right_button) { 157 background: rgb(50,150,50); 158 } 159 .panel_right_button:not(.has_inner_button), 160 .panel_right_button button, 161 #panel_users .panel_tag:not(.panel_right_button), 162 #panel_users .profile_url { 163 margin-left: 2px; 164 padding: 5px; 165 padding-left: 6px; 166 padding-right: 6px; 167 } 168 #panel_users .panel_tag:not(.panel_right_button), #panel_users .profile_url { 169 color: rgb(250,250,250); 170 font-size: 15px; 171 text-align: center; 172 border-radius: 3px; 173 } 174 .edit_button:after { 175 content: "{{lang "panel_edit_button_text" . }}"; 176 } 177 .delete_button:after { 178 content: "{{lang "panel_delete_button_text" . }}"; 179 } 180 /*#themeSelector select { 181 background: rgb(90,90,90); 182 color: rgb(200,200,200); 183 }*/ 184 185 select + .timeRangeSelector { 186 margin-left: 8px; 187 } 188 189 .colstack_graph_holder { 190 background-color: #444444; 191 border-radius: 3px; 192 padding: 16px; 193 padding-bottom: 0px; 194 padding-left: 0px; 195 padding-right: 0px; 196 margin-bottom: 10px; 197 } 198 .colstack_graph_holder.scrolly { 199 overflow-x: scroll; 200 width: 800px; 201 } 202 .colstack_graph_holder.scrolly .ct_chart { 203 width: 1000px; 204 } 205 .colstack_graph_holder .ct-label { 206 color: rgb(195,195,195); 207 font-size: 13px; 208 white-space: nowrap; 209 } 210 .colstack_graph_holder .ct-horizontal { 211 margin-top: 3px; 212 } 213 .colstack_graph_holder .ct-grid { 214 stroke: rgb(125,125,125); 215 } 216 .ct-legend { 217 margin-left: 0px; 218 } 219 .ct-series-e .ct-bar, .ct-series-e .ct-line, .ct-series-e .ct-point, .ct-series-e .ct-slice-donut { 220 stroke: #c73eaf !important; 221 } 222 .ct-series-e.ct-point { 223 stroke: #c73eaf !important; 224 } 225 .ct-series-e.ct-point:hover { 226 stroke: #c73eaf !important; 227 } 228 .ct-legend .ct-series-4:before { 229 background-color: #c73eaf !important; 230 border-color: /*#ed4cd0*/#c73eaf !important; 231 } 232 233 /*.ct-series-f .ct-bar, .ct-series-f .ct-line, .ct-series-f .ct-point, .ct-series-f .ct-slice-donut { 234 stroke: darkred !important; 235 } 236 .ct-series-f.ct-point { 237 stroke: darkred !important; 238 } 239 .ct-series-f.ct-point:hover { 240 stroke: darkred !important; 241 } 242 .ct-legend .ct-series-5:before { 243 background-color: darkred !important; 244 border-color: darkred !important; 245 }*/ 246 .ct-legend .ct-series-7:before { 247 background-color: #6b0392 !important; 248 border-color: #6b0392 !important; 249 } 250 251 #panel_setting .formlabel { 252 display: none; 253 }/* 254 #panel_setting textarea { 255 width: 100%; 256 height: 80px; 257 } 258 259 .micro_grid .to_right, .micro_grid .panel_buttons { 260 margin-left: 0px; 261 } 262 #panel_settings .panel_upshift { 263 margin-bottom: 12px; 264 } 265 #panel_settings .to_right { 266 white-space: nowrap; 267 margin-top: auto; 268 padding-top: 10px; 269 background-color: #555555; 270 border-radius: 5px; 271 padding-left: 5px; 272 padding: 12px; 273 overflow: hidden; 274 text-overflow: ellipsis; 275 } 276 #panel_settings.rowlist.bgavatars.micro_grid, .micro_grid { 277 grid-gap: 24px; 278 grid-row-gap: 16px; 279 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 280 } 281 282 #panel_word_filters { 283 grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); 284 } 285 #panel_word_filters .filters_find { 286 margin-bottom: 1px; 287 } 288 #panel_word_filters .itemSeparator:before { 289 content: "{{lang "panel_word_filters_to" . }}"; 290 font-size: 17px; 291 margin-bottom: 1px; 292 } 293 #panel_word_filters .panel_buttons { 294 margin-top: 14px; 295 } 296 297 #panel_users .rowitem .to_right { 298 order: 0; 299 margin-right: auto; 300 } 301 #panel_users .rowitem .profile_url { 302 order: 1; 303 } 304 #panel_users .rowitem .panel_floater { 305 order: 2; 306 margin-top: 8px; 307 margin-right: auto; 308 } 309 .panel_group_promotions .formitem { 310 display: flex; 311 } 312 313 .perm_preset_no_access:before { 314 content: "{{lang "panel_perms_no_access" . }}"; 315 /*color: hsl(0,100%,20%);*/ 316 } 317 /*.perm_preset_read_only:before, .perm_preset_can_post:before { 318 color: hsl(120,100%,20%); 319 }*/ 320 .perm_preset_read_only:before { 321 content: "{{lang "panel_perms_read_only" . }}"; 322 } 323 .perm_preset_can_post:before { 324 content: "{{lang "panel_perms_can_post" . }}"; 325 } 326 .perm_preset_can_moderate:before { 327 content: "{{lang "panel_perms_can_moderate" . }}"; 328 /*color: hsl(240,100%,20%);*/ 329 } 330 .perm_preset_quasi_mod:before { 331 content: "{{lang "panel_perms_quasi_mod" . }}"; 332 } 333 .perm_preset_custom:before { 334 content: "{{lang "panel_perms_custom" . }}"; 335 /*color: hsl(0,0%,20%);*/ 336 } 337 .perm_preset_default:before { 338 content: "{{lang "panel_perms_default" . }}"; 339 } 340 341 .panel_submitrow { 342 margin-top: 8px; 343 } 344 .colstack_right .colstack_item:not(.colstack_head):not(.rowhead).panel_submitrow .rowitem { 345 padding-bottom: 14px; 346 } 347 .panel_submitrow .rowitem button:first-child { 348 margin-left: auto; 349 } 350 .panel_submitrow .rowitem button:last-child { 351 margin-right: auto; 352 } 353 354 /*.has_inner_button button { 355 margin-right: 8px; 356 }*/ 357 #forum_quick_perms .formitem, #forum_quick_perms .panel_floater { 358 display: flex; 359 } 360 #forum_quick_perms .edit_fields { 361 margin-left: 4px; 362 } 363 364 span.grip { 365 content: '....'; 366 width: 20px; 367 display: inline-block; 368 overflow: hidden; 369 line-height: 5px; 370 padding: 3px 4px; 371 cursor: move; 372 vertical-align: middle; 373 margin-top: -16px; 374 margin-right: 12px; 375 font-size: 12px; 376 font-family: sans-serif; 377 letter-spacing: -3px; 378 color: #888888; 379 text-shadow: 1px 0 1px black; 380 margin-left: -12px; 381 height: 100%; 382 font-size: 40px; 383 margin-bottom: -4px; 384 line-height: 8px; 385 } 386 span.grip::after { 387 content: '... ... ... ... ... ... ...'; 388 } 389 .forum_no_desc span.grip, .panel_menu_item span.grip { 390 height: 40px; 391 } 392 393 .panel_plugin_meta { 394 display: flex; 395 flex-direction: column; 396 } 397 .panel_plugin_meta br { 398 display: none; 399 } 400 .panel_plugin_meta small { 401 margin-left: 0px !important; 402 margin-top: 1px; 403 } 404 /* TODO: Switch out this hack for vertically aligning the buttons */ 405 /* margin-top: 10px; */ 406 #panel_plugins .to_right { 407 display: flex; 408 } 409 #panel_plugins .to_right .panel_right_button { 410 margin-top: auto; 411 margin-bottom: auto; 412 } 413 414 .widget_normal { 415 display: flex; 416 width: 100%; 417 } 418 .bg_red.in_edit.widget_item { 419 background-color: #444444 !important; 420 } 421 .widget_item .form_button_row .rowitem { 422 display: flex; 423 } 424 .widget_edit .form_button_row .formitem a { 425 display: inline; 426 } 427 .colstack_right .colstack_item.the_form, .colstack_right .colstack_item:not(.colstack_head):not(.rowhead) .rowitem.widget_new { 428 padding-top: 12px; 429 padding-bottom: 12px; 430 } 431 #widgetTmpl, .widget_disabled { 432 display: none; 433 } 434 .bg_red .widget_disabled { 435 display: inline; 436 } 437 .wtypes .formrow { 438 display: none; 439 } 440 .wtype_about .w_about, .wtype_simple .w_simple, .wtype_wol .w_wol, .wtype_default .w_default { 441 display: block; 442 } 443 .wtext, .rwtext { 444 width: 100%; 445 height: 80px; 446 } 447 448 #panel_reglogs .panel_compactrow { 449 flex-direction: column; 450 } 451 .logdetail { 452 display: flex; 453 width: 100%; 454 margin-top: 3px; 455 } 456 #panel_reglogs .logdetail small, #panel_reglogs .logdetails span { 457 font-size: 14px; 458 } 459 460 #panel_debug .grid_stat:not(.grid_stat_head) { 461 margin-bottom: 5px; 462 } 463 464 @media (max-width: 1000px) { 465 #panel_settings.rowlist.bgavatars.micro_grid, .micro_grid { 466 grid-gap: 12px; 467 grid-row-gap: 4px; 468 grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); 469 } 470 }