gosora/themes/cosora/public/panel.css
Azareal 5b5b8339d6 Add instance disk usage to the Control Panel Dashboard.
Split the dashboard grid into two.
Add more analytics tables to the debug page.
Add flushes to the Control Panel Dashboard.
Fix some templates not transpiling properly.
Reduce duplication in the debug route.
Fix the link styling in the Control Panel Dashboard for Tempra Simple.

Transpile the Control Panel Dashboard.

Added the panel_dashboard_disk phrase.
Added the panel_dashboard_disk_desc phrase.
2019-06-03 15:26:27 +10:00

419 lines
8.7 KiB
CSS

#main {
max-width: inherit;
margin-left: 0px;
margin-right: 0px;
border-left: none;
border-right: none;
padding-left: 0px;
padding-bottom: 0px;
}
#back {
background-color: inherit;
padding-top: 0px;
}
.colstack_left {
width: 250px !important;
background-color: white;
margin-top: -18.5px;
margin-left: -0.5px;
border-top: 1px solid var(--element-border-color);
border-right: 1px solid var(--element-border-color);
}
.colstack_left .colstack_head {
margin-top: 6px;
margin-bottom: 8px;
margin-left: 16px;
padding-bottom: 12px;
padding-top: 12px;
padding-left: 8px;
border-bottom: 1px solid var(--element-border-color);
border-left: none;
border-right: none;
border-top: none;
width: fit-content;
}
.colstack_left .rowmenu {
padding-left: 18px !important;
}
.colstack_left .rowmenu .passive {
border: none;
font-size: 15px;
padding: 8px;
padding-top: 6px;
padding-bottom: 8px;
}
.colstack_left .rowmenu .passive:first-child {
border-top: none;
}
.colstack_left .rowmenu .passive:last-child {
border-bottom: 1px solid var(--element-border-color) !important;
width: 150px;
padding-bottom: 16px;
}
.submenu {
margin-left: 12px;
}
.submenu_fallback {
display: none;
}
.colstack_right {
margin-right: 14px;
/*margin-top: -4px;*/
margin-bottom: 14px;
}
.colstack_right .colstack_head .rowitem {
display: flex;
}
.colstack_right .colstack_head h1 + h2.hguide {
margin-left: auto;
color: var(--extra-lightened-primary-text-color);
}
.footer {
margin-top: 0px;
}
.colstack_right .colstack_head:not(:first-child) {
margin-top: 14px;
}
#panel_dashboard_right .colstack_head h1 {
font-size: 17px;
color: hsl(0,0%,40%);
}
/* TODO: Move these to panel.css */
#dash-version:before, #dash-cpu:before, #dash-ram:before, #dash-memused:before, #dash-totonline:before, #dash-gonline:before, #dash-uonline:before, #dash-reqs:before, #dash-postsperday:before, #dash-topicsperday:before {
display: inline-block;
background: var(--tinted-background-color);
font: normal normal normal 14px/1 FontAwesome;
font-size: 20px;
padding-left: 17px;
padding-top: 16px;
padding-right: 19px;
color: hsl(0,0%,20%);
}
#dash-version:before {
content: "\f126";
}
#dash-cpu:before, #dash-memused:before {
content: "\f2db";
}
#dash-ram:before {
content: "\f233";
}
#dash-totonline:before, #dash-gonline:before, #dash-uonline:before {
content: "\f007";
}
#dash-reqs:before {
content: "\f080";
}
#dash-postsperday:before, #dash-topicsperday:before {
content: "\f27b";
}
.grid2 {
margin-top: 16px;
}
#panel_debug .grid_stat:not(.grid_stat_head) {
margin-bottom: 8px;
}
.debug_page.colstack_right .colstack_sub_head {
margin-top: 6px;
}
.complex_rowlist {
background-color: inherit !important;
border: none !important;
}
.complex_rowlist .rowitem {
display: flex;
}
.panel_buttons, .panel_floater {
margin-left: auto;
display: flex;
}
.panel_buttons:before,
.panel_floater:before,
.edit_button:after,
.delete_button:after {
color: hsl(0,0%,65%);
}
.panel_buttons:before,
.panel_floater:before {
content: "";
border-left: 1px solid var(--element-border-color);
height: 15px;
margin-top: 2px;
margin-bottom: 0px;
margin-right: 0px;
}
#panel_users .panel_floater:before {
display: none;
}
#panel_users .panel_floater {
text-align: center;
flex-direction: column;
}
.edit_button:after, .delete_button:after {
font: normal normal normal 14px/1 FontAwesome;
padding-left: 12px;
height: 20px;
}
.edit_button:after {
content: "\f040";
}
.delete_button:after {
content: "\f014";
}
#panel_users .panel_floater:before,
#panel_forums .panel_floater:before,
#forum_quick_perms .panel_floater:before,
.panel_themes .panel_floater:before,
#panel_backups .panel_floater:before {
border-left: none;
}
#panel_forums_name_box {
order: 0;
}
#panel_users .panel_tag:not(.panel_right_button) {
display: none;
}
.panel_right_button + .panel_right_button {
margin-left: 3px;
}
.panel_group_perms .formitem a {
margin-top: 5px;
}
#panel_word_filters .itemSeparator:before {
content: "|";
padding-left: 5px;
padding-right: 5px;
color: var(--primary-link-color);
}
/* TODO: Should we be using .formrows in #forum_quick_perms? Can we normalize it? Would this break the other themes? */
.formlist:not(#forum_quick_perms),
.panel_themes .rowitem,
#panel_plugins .rowitem,
#forum_quick_perms .formitem {
padding: 12px;
margin-bottom: 8px;
background-color: var(--element-background-color);
border: 1px solid var(--element-border-color);
border-bottom: 2px solid var(--element-border-color);
}
.formlist .formrow {
padding: 0px !important;
margin: 0px;
}
.formlist .formitem {
padding: 8px;
}
.panel_theme_mobile, .panel_theme_tag {
display: none;
}
#panel_plugins .rowitem {
display: block;
}
#panel_users .rowitem .rowTitle {
border-bottom: 1px solid var(--lighter-text-color);
padding-bottom: 4px;
margin-bottom: 6px;
}
#panel_setting textarea, #panel_page_list textarea, #panel_page_edit textarea {
width: 100%;
height: 80px;
}
#panel_setting .formlabel {
display: none;
}
#panel_settings .panel_upshift {
border-bottom: 1px solid var(--element-border-color);
padding-bottom: 12px;
}
#panel_settings.rowlist.bgavatars .rowitem > a, #panel_settings.rowlist.bgavatars .rowitem > span {
margin-left: 0px;
margin-right: 0px;
}
#panel_settings .to_right {
float: none;
margin-top: auto;
padding-top: 14px;
word-break: break-all;
}
#panel_page_list textarea, #panel_page_edit textarea {
margin-top: 8px;
}
#forum_quick_perms .formitem {
display: flex;
}
#forum_quick_perms .formitem .edit_fields {
margin-left: 3px;
margin-top: 1px;
}
#forum_quick_perms .perm_preset {
margin-right: 6px;
}
.perm_preset_no_access:before {
content: "{{lang "panel_perms_no_access" . }}";
color: hsl(0,100%,20%);
}
.perm_preset_read_only:before, .perm_preset_can_post:before {
color: hsl(120,100%,20%);
}
.perm_preset_read_only:before {
content: "{{lang "panel_perms_read_only" . }}";
}
.perm_preset_can_post:before {
content: "{{lang "panel_perms_can_post" . }}";
}
.perm_preset_can_moderate:before {
content: "{{lang "panel_perms_can_moderate" . }}";
color: hsl(240,100%,20%);
}
.perm_preset_quasi_mod:before {
content: "{{lang "panel_perms_quasi_mod" . }}";
}
.perm_preset_custom:before {
content: "{{lang "panel_perms_custom" . }}";
color: hsl(0,0%,20%);
}
.perm_preset_default:before {
content: "{{lang "panel_perms_default" . }}";
}
.panel_submitrow .rowitem {
display: flex;
}
.panel_submitrow .rowitem *:first-child {
margin-left: auto;
}
.panel_submitrow .rowitem *:last-child {
margin-right: auto;
}
.panel_submitrow .rowitem button {
margin-top: 0px;
}
.colstack_graph_holder {
background-color: var(--element-background-color);
border: 1px solid var(--element-border-color);
border-bottom: 2px solid var(--element-border-color);
margin-left: 16px;
padding-top: 16px;
}
.colstack_graph_holder.scrolly {
overflow-x: scroll;
width: 800px;
}
.colstack_graph_holder.scrolly .ct_chart {
width: 1000px;
}
.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
stroke: hsl(359,98%,53%) !important;
}
.ct-series-a.ct-point {
stroke: hsl(359,98%,23%) !important;
}
.ct-series-a.ct-point:hover {
stroke: hsl(359,98%,30%) !important;
}
/*.ct-chart-line {
height: 300px !important;
}*/
/*.ct-label.ct-horizontal {
position: fixed;
justify-content: flex-end;
text-align: right;
transform-origin: 100% 0;
transform: translate(-100%) rotate(-90deg);
white-space: nowrap;
/*padding-right: 48px;/
top: 8px;
}*/
/*.ct-label.ct-horizontal {
white-space: nowrap;
}*/
/*.ct-label.ct-horizontal {
position: fixed;
justify-content: flex-end;
text-align: right;
transform-origin: 100% 0;
transform: translate(-100%) rotate(-45deg);
white-space: nowrap;
}*/
.ct-legend {
margin-top: 0px;
margin-bottom: 0px;
}
.analytics .colstack_head select {
margin-top: -5px;
}
.colstack_graph_holder + .rowlist {
margin-top: 8px;
}
.analytics .colstack_head h1 {
margin-top: 2px;
}
select + .timeRangeSelector {
margin-left: 8px;
}
/* Experimental header tweaks */
.colstack_head a {
font-size: 17px;
}
/*
#panel_analytics_views_table .rowlist .panel_compactrow {
padding: 14px;
font-size: 16px;
}
*/
.widget_normal {
display: flex;
width: 100%;
}
#widgetTmpl, .widget_disabled {
display: none;
}
.bg_red .widget_disabled {
display: inline;
}
.wtypes .formrow {
display: none;
}
.wtype_about .w_about, .wtype_simple .w_simple, .wtype_wol .w_wol, .wtype_default .w_default {
display: block;
}
.panel_widgets {
margin-bottom: 18px;
}
.pageset {
margin-left: 16px;
}
@media(max-width: 999px) {
.colstack_left {
margin-top: -14.5px;
}
}
@media(min-width: 1000px) {
.footBlock {
padding-left: 0px;
padding-right: 0px;
}
.footer {
max-width: none;
width: 100%;
margin-left: 0px;
margin-right: 0px;
}
}