Design update. I'm trying to break the commits into more chunks to get a better idea of what's going on

Moved the topic_closed and topic_sticky classes to the topic_row element to make things more flexible.
Tweaked the padding in the account manager for Nox.
Removed some text which is immediately overwritten anyway in mod_floater.

Began work on bulk moderation for Nox.
This commit is contained in:
Azareal 2018-07-15 15:00:48 +10:00
parent 2a5ab2969c
commit 9c6af9dd01
9 changed files with 29 additions and 18 deletions

View File

@ -26,7 +26,7 @@
<div class="mod_floater auto_hide"> <div class="mod_floater auto_hide">
<form method="post"> <form method="post">
<div class="mod_floater_head"> <div class="mod_floater_head">
<span>{{lang "topic_list.what_to_do"}}</span> <span></span>
</div> </div>
<div class="mod_floater_body"> <div class="mod_floater_body">
<select class="mod_floater_options"> <select class="mod_floater_options">
@ -77,8 +77,8 @@
{{end}} {{end}}
{{end}} {{end}}
<div id="forum_topic_list" class="rowblock topic_list" aria-label="{{lang "forum_list_aria"}}"> <div id="forum_topic_list" class="rowblock topic_list" aria-label="{{lang "forum_list_aria"}}">
{{range .ItemList}}<div class="topic_row" data-tid="{{.ID}}"> {{range .ItemList}}<div class="topic_row{{if .Sticky}} topic_sticky{{else if .IsClosed}} topic_closed{{end}}" data-tid="{{.ID}}">
<div class="rowitem topic_left passive datarow {{if .Sticky}}topic_sticky{{else if .IsClosed}}topic_closed{{end}}"> <div class="rowitem topic_left passive datarow">
<span class="selector"></span> <span class="selector"></span>
<a href="{{.Creator.Link}}"><img src="{{.Creator.Avatar}}" height="64" alt="{{.Creator.Name}}'s Avatar" title="{{.Creator.Name}}'s Avatar" /></a> <a href="{{.Creator.Link}}"><img src="{{.Creator.Avatar}}" height="64" alt="{{.Creator.Name}}'s Avatar" title="{{.Creator.Name}}'s Avatar" /></a>
<span class="topic_inner_left"> <span class="topic_inner_left">
@ -100,7 +100,7 @@
<span class="likeCount">{{.LikeCount}}</span> <span class="likeCount">{{.LikeCount}}</span>
</div> </div>
</div> </div>
<div class="rowitem topic_right passive datarow {{if .Sticky}}topic_sticky{{else if .IsClosed}}topic_closed{{end}}"> <div class="rowitem topic_right passive datarow">
<div class="topic_right_inside"> <div class="topic_right_inside">
<a href="{{.LastUser.Link}}"><img src="{{.LastUser.Avatar}}" height="64" alt="{{.LastUser.Name}}'s Avatar" title="{{.LastUser.Name}}'s Avatar" /></a> <a href="{{.LastUser.Link}}"><img src="{{.LastUser.Avatar}}" height="64" alt="{{.LastUser.Name}}'s Avatar" title="{{.LastUser.Name}}'s Avatar" /></a>
<span> <span>

View File

@ -23,7 +23,7 @@
<div class="mod_floater auto_hide"> <div class="mod_floater auto_hide">
<form method="post"> <form method="post">
<div class="mod_floater_head"> <div class="mod_floater_head">
<span>{{lang "topic_list.what_to_do"}}</span> <span></span>
</div> </div>
<div class="mod_floater_body"> <div class="mod_floater_body">
<select class="mod_floater_options"> <select class="mod_floater_options">

View File

@ -1,5 +1,5 @@
<div class="topic_row" data-tid="{{.ID}}"> <div class="topic_row{{if .Sticky}} topic_sticky{{else if .IsClosed}} topic_closed{{end}}" data-tid="{{.ID}}">
<div class="rowitem topic_left passive datarow {{if .Sticky}}topic_sticky{{else if .IsClosed}}topic_closed{{end}}"> <div class="rowitem topic_left passive datarow">
<span class="selector"></span> <span class="selector"></span>
<a href="{{.Creator.Link}}"><img src="{{.Creator.Avatar}}" height="64" alt="{{.Creator.Name}}'s Avatar" title="{{.Creator.Name}}'s Avatar" /></a> <a href="{{.Creator.Link}}"><img src="{{.Creator.Avatar}}" height="64" alt="{{.Creator.Name}}'s Avatar" title="{{.Creator.Name}}'s Avatar" /></a>
<span class="topic_inner_left"> <span class="topic_inner_left">
@ -21,7 +21,7 @@
<span class="likeCount">{{.LikeCount}}</span> <span class="likeCount">{{.LikeCount}}</span>
</div> </div>
</div> </div>
<div class="rowitem topic_right passive datarow {{if .Sticky}}topic_sticky{{else if .IsClosed}} topic_closed{{end}}"> <div class="rowitem topic_right passive datarow">
<div class="topic_right_inside"> <div class="topic_right_inside">
<a href="{{.LastUser.Link}}"><img src="{{.LastUser.Avatar}}" height="64" alt="{{.LastUser.Name}}'s Avatar" title="{{.LastUser.Name}}'s Avatar" /></a> <a href="{{.LastUser.Link}}"><img src="{{.LastUser.Avatar}}" height="64" alt="{{.LastUser.Name}}'s Avatar" title="{{.LastUser.Name}}'s Avatar" /></a>
<span> <span>

View File

@ -870,7 +870,7 @@ textarea {
margin-left: 8px; margin-left: 8px;
} }
.topic_sticky { .topic_sticky .topic_left, .topic_sticky .topic_right {
border-bottom: 2px solid hsl(51, 60%, 70%); border-bottom: 2px solid hsl(51, 60%, 70%);
} }
.topic_selected .topic_left, .topic_selected .topic_right { .topic_selected .topic_left, .topic_selected .topic_right {
@ -1674,7 +1674,7 @@ textarea {
.topic_right_inside br, .topic_right_inside img { .topic_right_inside br, .topic_right_inside img {
display: none; display: none;
} }
.topic_right.topic_sticky { .topic_sticky .topic_right {
border-bottom: 2px solid var(--element-border-color); border-bottom: 2px solid var(--element-border-color);
} }
.topic_right_inside > span { .topic_right_inside > span {

View File

@ -38,7 +38,6 @@
.colstack_right { .colstack_right {
background-color: #444444; background-color: #444444;
width: 75%; width: 75%;
padding-top: 12px;
padding-right: 24px; padding-right: 24px;
padding-bottom: 24px; padding-bottom: 24px;
padding-left: 24px; padding-left: 24px;
@ -91,12 +90,17 @@ button, .formbutton {
/* end panel css copy */ /* end panel css copy */
.colstack_right {
padding-top: 16px;
}
.account_soon, .dash_security { .account_soon, .dash_security {
font-size: 14px; font-size: 14px;
} }
#account_dashboard .colstack_right .coldyn_block { #account_dashboard .colstack_right .coldyn_block {
display: flex; display: flex;
margin-top: 2px;
} }
#dash_left { #dash_left {
border-radius: 3px; border-radius: 3px;

View File

@ -247,6 +247,10 @@ h2 {
margin-right: 16px; margin-right: 16px;
margin-right: 18px; margin-right: 18px;
} }
.topic_list_title_block .pre_opt:before {
content: "{{index .Phrases "topics_click_topics_to_select"}}";
font-size: 14px;
}
.topic_list_title_block .opt a { .topic_list_title_block .opt a {
color: #afafaf; color: #afafaf;
margin-left: 8px; margin-left: 8px;
@ -279,14 +283,17 @@ h2 {
.topic_left { .topic_left {
margin-right: auto; margin-right: auto;
} }
.topic_left.topic_sticky { .topic_sticky .topic_left {
border-left: 3px solid rgb(215, 155, 0); border-left: 3px solid rgb(215, 155, 0);
border-radius: 3px; border-radius: 3px;
} }
.topic_left.topic_closed { .topic_closed .topic_left {
border-left: 3px solid grey; border-left: 3px solid grey;
border-radius: 3px; border-radius: 3px;
} }
.topic_closed {
background-color: #4b4b4b;
}
.new_item .topic_left { .new_item .topic_left {
border-left: 3px solid rgb(215, 215, 215); border-left: 3px solid rgb(215, 215, 215);
border-radius: 3px; border-radius: 3px;

View File

@ -800,7 +800,7 @@ input[type=checkbox]:checked + label.poll_option_label .sel {
padding: 0px; padding: 0px;
overflow: hidden; overflow: hidden;
} }
.topic_left.topic_sticky .topic_inner_left { .topic_sticky .topic_left .topic_inner_left {
border-top: 4px solid hsl(41, 100%, 50%); border-top: 4px solid hsl(41, 100%, 50%);
padding-left: 10px; padding-left: 10px;
padding-top: 10px; padding-top: 10px;

View File

@ -542,10 +542,10 @@ li a {
.topic_status_closed { .topic_status_closed {
margin-left: auto; margin-left: auto;
} }
.topic_sticky { .topic_sticky .topic_left, .topic_sticky .topic_right {
background-color: rgb(255,255,234); background-color: rgb(255,255,234);
} }
.topic_closed { .topic_closed .topic_left, .topic_closed .topic_right {
background-color: rgb(248,248,248); background-color: rgb(248,248,248);
} }

View File

@ -568,10 +568,10 @@ input, select {
font-size: 0.90em; font-size: 0.90em;
margin-bottom: -2px; margin-bottom: -2px;
} }
.topic_sticky { .topic_sticky .topic_left, .topic_sticky .topic_right {
background-color: rgb(255,255,234); background-color: rgb(255,255,234);
} }
.topic_closed { .topic_closed .topic_left, .topic_closed .topic_right {
background-color: rgb(248,248,248); background-color: rgb(248,248,248);
} }
.topic_sticky_head { .topic_sticky_head {