Many HTML / CSS / Template changes.

Added the grid_stat_head CSS class to Panel Debug.
Added the panel_plugin_meta CSS class to the Plugin Manager.
Added some missing panel_right_button classes to the buttons for the rows in the Plugin Manager.
Added some missing the_form CSS classes for Nox.
Added a missing phrase for an update button in panel_themes_menus_items.
Replaced a legacy float: right; in the User Manager with to_right.
Removed some superfluous legacy inline CSS in the User Manager.
Tweaked the amount of padding for the title in the Account Manager for Nox.
Tweaked the amount of padding for the title in the Control Panel for Nox.
Tweaked the padding for panel_right_button for Nox.
Fixed the UI for the Plugin Manager in Nox.
Tweaked the padding for the grid heads in Panel Debug for Nox.

Began work on a nicer looking User Manager in Nox.
This commit is contained in:
Azareal 2018-08-10 17:58:25 +10:00
parent d4db2aa2bb
commit 06d6715c47
7 changed files with 77 additions and 18 deletions

View File

@ -6,18 +6,18 @@
<div class="rowitem"><h1>{{lang "panel_debug_head"}}</h1></div> <div class="rowitem"><h1>{{lang "panel_debug_head"}}</h1></div>
</div> </div>
<div id="panel_debug" class="colstack_grid"> <div id="panel_debug" class="colstack_grid">
<div class="grid_item grid_stat"><span>{{lang "panel_debug_uptime_label"}}</span></div> <div class="grid_item grid_stat grid_stat_head"><span>{{lang "panel_debug_uptime_label"}}</span></div>
<div class="grid_item grid_stat"><span>{{lang "panel_debug_go_version_label"}}</span></div> <div class="grid_item grid_stat grid_stat_head"><span>{{lang "panel_debug_go_version_label"}}</span></div>
<div class="grid_item grid_stat"><span>{{lang "panel_debug_database_version_label"}}</span></div> <div class="grid_item grid_stat grid_stat_head"><span>{{lang "panel_debug_database_version_label"}}</span></div>
<div class="grid_item grid_stat"><span>{{.Uptime}}</span></div> <div class="grid_item grid_stat"><span>{{.Uptime}}</span></div>
<div class="grid_item grid_stat"><span>{{.GoVersion}}</span></div> <div class="grid_item grid_stat"><span>{{.GoVersion}}</span></div>
<div class="grid_item grid_stat"><span>{{.DBVersion}}</span></div> <div class="grid_item grid_stat"><span>{{.DBVersion}}</span></div>
<div class="grid_item grid_stat"><span>{{lang "panel_debug_open_database_connections_label"}}</span></div> <div class="grid_item grid_stat grid_stat_head"><span>{{lang "panel_debug_open_database_connections_label"}}</span></div>
<div class="grid_item grid_stat"><span>{{lang "panel_debug_adapter_label"}}</span></div> <div class="grid_item grid_stat grid_stat_head"><span>{{lang "panel_debug_adapter_label"}}</span></div>
<div class="grid_item grid_stat"><span>???</span></div> <div class="grid_item grid_stat grid_stat_head"><span>???</span></div>
<div class="grid_item grid_stat"><span>{{.OpenConns}}</span></div> <div class="grid_item grid_stat"><span>{{.OpenConns}}</span></div>
<div class="grid_item grid_stat"><span>{{.DBAdapter}}</span></div> <div class="grid_item grid_stat"><span>{{.DBAdapter}}</span></div>

View File

@ -9,15 +9,17 @@
<div id="panel_plugins" class="colstack_item complex_rowlist"> <div id="panel_plugins" class="colstack_item complex_rowlist">
{{range .ItemList}} {{range .ItemList}}
<div class="rowitem editable_parent"> <div class="rowitem editable_parent">
<a {{if .URL}}href="{{.URL}}" {{end}}class="editable_block" class="panel_upshift">{{.Name}}</a><br /> <span class="panel_plugin_meta">
<small style="margin-left: 2px;">{{lang "panel_plugins_author_prefix"}}{{.Author}}</small> <a {{if .URL}}href="{{.URL}}" {{end}}class="editable_block" class="panel_upshift">{{.Name}}</a><br />
<small style="margin-left: 2px;">{{lang "panel_plugins_author_prefix"}}{{.Author}}</small>
</span>
<span class="to_right"> <span class="to_right">
{{if .Settings}}<a href="/panel/settings/" class="panel_tag">{{lang "panel_plugins_settings"}}</a>{{end}} {{if .Settings}}<a href="/panel/settings/" class="panel_tag panel_plugin_settings panel_right_button">{{lang "panel_plugins_settings"}}</a>{{end}}
{{if .Active}}<a href="/panel/plugins/deactivate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag">{{lang "panel_plugins_deactivate"}}</a> {{if .Active}}<a href="/panel/plugins/deactivate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_plugin_deactivate panel_right_button">{{lang "panel_plugins_deactivate"}}</a>
{{else if .Installable}} {{else if .Installable}}
{{/** TODO: Write a custom template interpreter to fix this nonsense **/}} {{/** TODO: Write a custom template interpreter to fix this nonsense **/}}
{{if .Installed}}<a href="/panel/plugins/activate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag">{{lang "panel_plugins_activate"}}</a>{{else}}<a href="/panel/plugins/install/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag">{{lang "panel_plugins_install"}}</a>{{end}} {{if .Installed}}<a href="/panel/plugins/activate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_plugin_activate panel_right_button">{{lang "panel_plugins_activate"}}</a>{{else}}<a href="/panel/plugins/install/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_plugin_install panel_right_button">{{lang "panel_plugins_install"}}</a>{{end}}
{{else}}<a href="/panel/plugins/activate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag">{{lang "panel_plugins_activate"}}</a>{{end}} {{else}}<a href="/panel/plugins/activate/{{.UName}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_plugin_activate panel_right_button">{{lang "panel_plugins_activate"}}</a>{{end}}
</span> </span>
</div> </div>
{{end}} {{end}}

View File

@ -8,7 +8,7 @@
<div class="rowitem"><h1>{{lang "panel_themes_menus_edit_head"}}</h1></div> <div class="rowitem"><h1>{{lang "panel_themes_menus_edit_head"}}</h1></div>
</div> </div>
<form action="/panel/themes/menus/item/edit/submit/{{.Item.ID}}?session={{.CurrentUser.Session}}" method="post"> <form action="/panel/themes/menus/item/edit/submit/{{.Item.ID}}?session={{.CurrentUser.Session}}" method="post">
<div id="panel_themes_menu_item_edit" class="colstack_item"> <div id="panel_themes_menu_item_edit" class="colstack_item the_form">
{{/** TODO: Let an admin move a menu item from one menu to another? **/}} {{/** TODO: Let an admin move a menu item from one menu to another? **/}}
<div class="formrow"> <div class="formrow">
<div class="formitem formlabel"><a>{{lang "panel_themes_menus_name"}}</a></div> <div class="formitem formlabel"><a>{{lang "panel_themes_menus_name"}}</a></div>

View File

@ -16,14 +16,14 @@
</div>{{end}} </div>{{end}}
</div> </div>
<div class="colstack_item rowlist panel_submitrow"> <div class="colstack_item rowlist panel_submitrow">
<div class="rowitem"><button id="panel_menu_items_order_button" class="formbutton">Update</button></div> <div class="rowitem"><button id="panel_menu_items_order_button" class="formbutton">{{lang "panel_themes_menus_edit_update_button"}}</button></div>
</div> </div>
<div class="colstack_item colstack_head"> <div class="colstack_item colstack_head">
<div class="rowitem"><h1>{{lang "panel_themes_menus_create_head"}}</h1></div> <div class="rowitem"><h1>{{lang "panel_themes_menus_create_head"}}</h1></div>
</div> </div>
<form action="/panel/themes/menus/item/create/submit/?session={{.CurrentUser.Session}}" method="post"> <form action="/panel/themes/menus/item/create/submit/?session={{.CurrentUser.Session}}" method="post">
<input name="mid" value="{{.MenuID}}" type="hidden" /> <input name="mid" value="{{.MenuID}}" type="hidden" />
<div id="panel_themes_menu_item_create" class="colstack_item"> <div id="panel_themes_menu_item_create" class="colstack_item the_form">
{{/** TODO: Let an admin move a menu item from one menu to another? **/}} {{/** TODO: Let an admin move a menu item from one menu to another? **/}}
<div class="formrow"> <div class="formrow">
<div class="formitem formlabel"><a>{{lang "panel_themes_menus_name"}}</a></div> <div class="formitem formlabel"><a>{{lang "panel_themes_menus_name"}}</a></div>

View File

@ -12,7 +12,7 @@
<img class="bgsub" src="{{.Avatar}}" alt="{{.Name}}'s Avatar" /> <img class="bgsub" src="{{.Avatar}}" alt="{{.Name}}'s Avatar" />
<a class="rowTitle editable_block"{{if $.CurrentUser.Perms.EditUser}} href="/panel/users/edit/{{.ID}}?session={{$.CurrentUser.Session}}"{{end}}>{{.Name}}</a> <a class="rowTitle editable_block"{{if $.CurrentUser.Perms.EditUser}} href="/panel/users/edit/{{.ID}}?session={{$.CurrentUser.Session}}"{{end}}>{{.Name}}</a>
<a href="{{.Link}}" class="tag-mini profile_url">{{lang "panel_users_profile"}}</a> <a href="{{.Link}}" class="tag-mini profile_url">{{lang "panel_users_profile"}}</a>
{{if (.Tag) and (.IsSuperMod)}}<span style="float: right;"><span class="panel_tag" style="margin-left 4px;">{{.Tag}}</span></span>{{end}} {{if (.Tag) and (.IsSuperMod)}}<span class="to_right"><span class="panel_tag">{{.Tag}}</span></span>{{end}}
<span class="panel_floater"> <span class="panel_floater">
{{if .IsBanned}}<a href="/users/unban/{{.ID}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_right_button ban_button">{{lang "panel_users_unban"}}</a>{{else if not .IsSuperMod}}<a href="/user/{{.ID}}#ban_user" class="panel_tag panel_right_button ban_button">{{lang "panel_users_ban"}}</a>{{end}} {{if .IsBanned}}<a href="/users/unban/{{.ID}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_right_button ban_button">{{lang "panel_users_unban"}}</a>{{else if not .IsSuperMod}}<a href="/user/{{.ID}}#ban_user" class="panel_tag panel_right_button ban_button">{{lang "panel_users_ban"}}</a>{{end}}
{{if not .Active}}<a href="/users/activate/{{.ID}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_right_button">{{lang "panel_users_activate"}}</a>{{end}} {{if not .Active}}<a href="/users/activate/{{.ID}}?session={{$.CurrentUser.Session}}" class="panel_tag panel_right_button">{{lang "panel_users_activate"}}</a>{{end}}

View File

@ -43,7 +43,7 @@
padding-left: 24px; padding-left: 24px;
} }
.colstack_right .colstack_head { .colstack_right .colstack_head {
margin-bottom: 4px; margin-bottom: 6px;
} }
.colstack_right .colstack_head h1 { .colstack_right .colstack_head h1 {
font-size: 21px; font-size: 21px;

View File

@ -55,7 +55,7 @@
padding-left: 24px; padding-left: 24px;
} }
.colstack_right .colstack_head { .colstack_right .colstack_head {
margin-bottom: 4px; margin-bottom: 5px;
} }
.colstack_right .colstack_head h1 { .colstack_right .colstack_head h1 {
font-size: 21px; font-size: 21px;
@ -123,6 +123,9 @@ button, .formbutton, .panel_right_button {
} }
.panel_right_button { .panel_right_button {
margin-left: 2px; margin-left: 2px;
padding: 5px;
padding-left: 6px;
padding-right: 6px;
} }
.edit_button:after { .edit_button:after {
content: "{{index .Phrases "panel_edit_button_text"}}"; content: "{{index .Phrases "panel_edit_button_text"}}";
@ -154,6 +157,31 @@ button, .formbutton, .panel_right_button {
stroke: rgb(125,125,125); stroke: rgb(125,125,125);
} }
.rowlist.bgavatars {
display: grid;
grid-gap: 16px;
grid-row-gap: 0px;
grid-template-columns: repeat(3, 1fr);
}
.rowlist.bgavatars .rowitem {
display: flex;
flex-direction: column;
width: 180px;
}
.rowlist.bgavatars .bgsub, .rowlist.bgavatars .rowTitle {
margin-left: auto;
margin-right: auto;
}
.rowlist.bgavatars .bgsub {
border-radius: 32px;
height: 64px;
width: 64px;
}
.rowlist.bgavatars .rowTitle {
font-size: 18px;
margin-top: 4px;
}
#panel_setting .formlabel { #panel_setting .formlabel {
display: none; display: none;
} }
@ -161,3 +189,32 @@ button, .formbutton, .panel_right_button {
width: 100%; width: 100%;
height: 80px; height: 80px;
} }
.panel_submitrow {
margin-top: 8px;
}
.panel_plugin_meta {
display: flex;
flex-direction: column;
}
.panel_plugin_meta br {
display: none;
}
.panel_plugin_meta small {
margin-left: 0px !important;
margin-top: 1px;
}
/* TODO: Switch out this hack for vertically aligning the buttons */
/* margin-top: 10px; */
#panel_plugins .to_right {
display: flex;
}
#panel_plugins .to_right .panel_right_button {
margin-top: auto;
margin-bottom: auto;
}
#panel_debug .grid_stat:not(.grid_stat_head) {
margin-bottom: 5px;
}