f8f46b3c48
Added the Account Dashboard and merged a few account views into it. BREAKING CHANGE: We now use config/config.json instead of config/config.go, be sure to setup one of these files, you can config_default.json as an example of what a config.json should look like. If you don't have an existing installation, you can just rely on the installer to do this for you. CSS Changes (does not include Nox Theme): Sidebar should no longer show up in the account manager in some odd situations or themes. Made a few CSS rules more generic. Forms have a new look in Cosora now. Config Changes: Removed the DefaultRoute config field. Added the DefaultPath config field. Added the MaxRequestSizeStr config field to make it easier for users to input custom max request sizes without having to use a calculator or figure out how many bytes there are in a megabyte. Removed the CacheTopicUser config field. Added the UserCache config field. Added the TopicCache config field Phrases: Removed ten english phrases. Added 21 english phrases. Changed eleven english phrases. Removed some duplicate indices in the english phrase pack. Removed some old benchmark code. Tweaked some things to make the linter happy. Added comments for all the MemoryUserCache and MemoryTopicCache methods. Added a comment for the null caches, consult the other caches for further information on the methods. Added a client-side check to make sure the user doesn't upload too much data in a single post. The server already did this, but it might be a while before feedback arrives from it. Simplified a lot of the control panel route code with the buildBasePage function. Renamed /user/edit/critical/ to /user/edit/password/ Renamed /user/edit/critical/submit/ to /user/edit/password/submit/ Made some small improvements to SEO with a couple of meta tags. Renamed some of the control panel templates so that they use _ instead of -. Fixed a bug where notices were being moved to the wrong place in some areas in Cosora. Added the writeJsonError function to help abstract writing json errors. Moved routePanelUsers to panel.Users Moved routePanelUsersEdit to panel.UsersEdit Moved routePanelUsersEditSubmit to panel.UsersEditSubmit Renamed routes.AccountEditCritical to routes.AccountEditPassword Renamed routes.AccountEditCriticalSubmit to routes.AccountEditPasswordSubmit Removed the routes.AccountEditAvatar and routes.AccountEditUsername routes. Fixed a data race in MemoryTopicCache.Add which could lead to the capacity limit being bypassed. Tweaked MemoryTopicCache.AddUnsafe under the assumption that it's not going to be safe anyway, but we might as-well try in case this call is properly synchronised. Fixed a data race in MemoryTopicCache.Remove which could lead to the length counter being decremented twice. Tweaked the behaviour of MemoryTopicCache.RemoveUnsafe to mirror that of Remove. Fixed a data race in MemoryUserCache.Add which could lead to the capacity limit being bypassed. User can no longer change their usernames to blank. Made a lot of progress on the Nox theme. Added modified FA5 SVGs as a dependency for Nox. Be sure to run the patcher or update script and don't forget to create a customised config/config.json file.
1883 lines
38 KiB
CSS
1883 lines
38 KiB
CSS
:root {
|
|
--header-border-color: hsl(0,0%,80%);
|
|
--element-border-color: hsl(0,0%,85%);
|
|
--element-background-color: white;
|
|
--replies-lang-string: "{{index .Phrases "topics_replies_suffix"}}";
|
|
--topics-lang-string: "{{index .Phrases "forums_topics_suffix"}}";
|
|
--likes-lang-string: "{{index .Phrases "topics_gap_likes_suffix"}}";
|
|
--primary-link-color: hsl(0,0%,40%);
|
|
--primary-text-color: hsl(0,0%,20%);
|
|
--lightened-primary-text-color: hsl(0,0%,30%);
|
|
--extra-lightened-primary-text-color: hsl(0,0%,40%);
|
|
--inverse-primary-text-color: white;
|
|
--light-text-color: hsl(0,0%,55%);
|
|
--lighter-text-color: hsl(0,0%,65%);
|
|
|
|
/*background-color: hsl(0,0%,97%);*/
|
|
--tinted-background-color: hsl(0,0%,98%);
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'FontAwesome';
|
|
src: url('../font-awesome-4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0');
|
|
src: url('../font-awesome-4.7.0/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0') format('embedded-opentype'), url('../font-awesome-4.7.0/fonts/fontawesome-webfont.woff2?v=4.7.0') format('woff2'), url('../font-awesome-4.7.0/fonts/fontawesome-webfont.woff?v=4.7.0') format('woff'), url('../font-awesome-4.7.0/fonts/fontawesome-webfont.ttf?v=4.7.0') format('truetype'), url('../font-awesome-4.7.0/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular') format('svg');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
body {
|
|
font-size: 16px;
|
|
font-family: arial;
|
|
margin: 0px;
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
a {
|
|
text-decoration: none;
|
|
color: var(--primary-link-color);
|
|
}
|
|
|
|
body, #main {
|
|
background-color: var(--tinted-background-color);
|
|
}
|
|
#back {
|
|
padding: 8px;
|
|
padding-top: 0px;
|
|
display: flex;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
padding-bottom: 0px;
|
|
}
|
|
.footBlock {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
.container {
|
|
background-color: var(--element-background-color);
|
|
}
|
|
|
|
#main {
|
|
width: 100%;
|
|
padding-top: 14px;
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
padding-bottom: 14px;
|
|
}
|
|
.sidebar {
|
|
width: 200px;
|
|
display: none;
|
|
}
|
|
.nav {
|
|
padding-top: 16px;
|
|
border-bottom: 1.5px solid var(--header-border-color);
|
|
}
|
|
|
|
li {
|
|
margin-right: 12px;
|
|
}
|
|
.menu_left:not(:last-child):after, .menu_alerts:after {
|
|
content: "";
|
|
margin-left: 11px;
|
|
width: 1px;
|
|
display: inline-block;
|
|
height: 15px;
|
|
position: relative;
|
|
top: 2px;
|
|
border-right: 1px solid var(--header-border-color);
|
|
}
|
|
|
|
#menu_overview {
|
|
font-size: 22px;
|
|
margin-right: 12px;
|
|
letter-spacing: 1px;
|
|
}
|
|
#menu_overview:after {
|
|
margin-right: 5px !important;
|
|
height: 20px !important;
|
|
}
|
|
|
|
#menu_forums a:before, .menu_topics a:before, .alert_bell:before, .menu_account a:before, .menu_profile a:before, .menu_panel a:before, .menu_logout a:before {
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
}
|
|
|
|
#menu_forums a:before {
|
|
content: "\f03a";
|
|
margin-right: 6px;
|
|
}
|
|
.menu_topics a:before {
|
|
margin-right: 4px;
|
|
content: "\f27b";
|
|
position: relative;
|
|
top: -2px;
|
|
}
|
|
.menu_alerts {
|
|
color: var(--primary-link-color);
|
|
display: flex;
|
|
}
|
|
.alert_bell:before {
|
|
content: "\f01c";
|
|
}
|
|
.menu_alerts:not(.has_alerts) .alert_counter {
|
|
display: none;
|
|
}
|
|
.alert_counter {
|
|
width: 4px;
|
|
height: 4px;
|
|
overflow: hidden;
|
|
background-color: red;
|
|
opacity: 0.7;
|
|
border-radius: 30px;
|
|
position: relative;
|
|
top: 2px;
|
|
left: -1px;
|
|
}
|
|
.alert_aftercounter:before {
|
|
content: "{{index .Phrases "menu_alerts"}}";
|
|
margin-left: 4px;
|
|
}
|
|
|
|
.menu_account a:before {
|
|
content: "\f2c3";
|
|
margin-right: 6px;
|
|
}
|
|
.menu_profile a:before {
|
|
content: "\f2c0";
|
|
margin-right: 5px;
|
|
position: relative;
|
|
top: -1px;
|
|
font-size: 14px;
|
|
}
|
|
.menu_panel a:before {
|
|
margin-right: 6px;
|
|
content: "\f108";
|
|
}
|
|
.menu_logout a:before {
|
|
content: "\f08b";
|
|
margin-right: 3px;
|
|
}
|
|
|
|
ul {
|
|
display: flex;
|
|
list-style-type: none;
|
|
padding: 0px;
|
|
margin-left: 14px;
|
|
margin-bottom: 12px;
|
|
margin-top: 0px;
|
|
}
|
|
.menu_alerts:not(.selectedAlert) .alertList {
|
|
display: none;
|
|
}
|
|
.alertList {
|
|
position: fixed;
|
|
top: 54px;
|
|
left: 0px;
|
|
background: var(--element-background-color);
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
.alertList .alertItem {
|
|
padding: 12px;
|
|
}
|
|
.alertItem.withAvatar {
|
|
background-image: none !important;
|
|
padding-left: 12px;
|
|
font-size: 15px;
|
|
display: flex;
|
|
}
|
|
.alertItem.withAvatar .text {
|
|
margin-top: 8px;
|
|
}
|
|
.alertItem.withAvatar:not(:last-child) .text {
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
padding-bottom: 16px;
|
|
}
|
|
.alertItem .bgsub {
|
|
width: 32px;
|
|
height: 32px;
|
|
border-radius: 30px;
|
|
margin-right: 12px;
|
|
}
|
|
.alertItem.withAvatar:not(:first-child) {
|
|
padding-top: 0px;
|
|
}
|
|
|
|
.rowblock, .colstack_head {
|
|
margin-bottom: 12px;
|
|
border: 1px solid var(--header-border-color);
|
|
border-bottom: 2px solid var(--header-border-color);
|
|
margin-left: 12px;
|
|
}
|
|
/* TODO: Reduce the number of nots */
|
|
/* TODO: Apply the property to the rowitem on the colstack_head rather than the container itself */
|
|
.rowblock:not(.topic_list):not(.forum_list):not(.post_container):not(.topic_reply_container), .colstack_head, .topic_row .rowitem, .forum_list .rowitem {
|
|
background-color: var(--element-background-color);
|
|
}
|
|
.rowblock {
|
|
margin-right: 12px;
|
|
}
|
|
.colstack_right {
|
|
padding-right: 12px;
|
|
}
|
|
|
|
.rowhead, .opthead, .colstack_head {
|
|
padding: 13px;
|
|
padding-top: 14px;
|
|
padding-bottom: 14px;
|
|
}
|
|
.rowhead:not(:first-child), .opthead:not(:first-child), .colstack_head:not(:first-child) {
|
|
margin-top: 8px;
|
|
}
|
|
.rowhead h1, .opthead h1, .colstack_head h1 {
|
|
font-size: 19px;
|
|
font-weight: normal;
|
|
color: var(--lightened-primary-text-color);
|
|
display: inline-block;
|
|
}
|
|
.colstack_head a h1 {
|
|
color: var(--primary-link-color);
|
|
}
|
|
.colstack_head.menuhead a h1 {
|
|
font-size: 16px;
|
|
}
|
|
.colstack_head h1 {
|
|
font-size: 18px;
|
|
}
|
|
h1, h3 {
|
|
-webkit-margin-before: 0;
|
|
-webkit-margin-after: 0;
|
|
margin-block-start: 0;
|
|
margin-block-end: 0;
|
|
margin-top: 0px;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
.rowmsg.rowitem {
|
|
padding: 12px;
|
|
}
|
|
.topic_list .rowmsg.rowitem,
|
|
.forum_list .rowmsg.rowitem {
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
|
|
.colstack {
|
|
display: flex;
|
|
}
|
|
.colstack:not(#profile_container) .colstack_left {
|
|
width: 300px;
|
|
}
|
|
.colstack:not(#profile_container) .colstack_right {
|
|
width: 100%;
|
|
}
|
|
|
|
.extra_little_row_avatar {
|
|
height: 38px;
|
|
width: 38px;
|
|
margin-right: 8px;
|
|
}
|
|
.little_row_avatar {
|
|
height: 48px;
|
|
width: 48px;
|
|
}
|
|
.extra_little_row_avatar, .little_row_avatar {
|
|
border-radius: 30px;
|
|
}
|
|
|
|
.mod_floater {
|
|
position: fixed;
|
|
bottom: 15px;
|
|
right: 15px;
|
|
width: 200px;
|
|
height: 115px;
|
|
background-color: var(--inverse-primary-text-color);
|
|
border: 1px solid var(--header-border-color);
|
|
border-bottom: 2px solid var(--header-border-color);
|
|
z-index: 9999;
|
|
animation: fadein 0.8s;
|
|
}
|
|
.mod_floater_head {
|
|
display: flex;
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
margin-left: 16px;
|
|
margin-right: 16px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.mod_floater_head span {
|
|
color: hsl(0,0%,55%);
|
|
font-size: 14px;
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
}
|
|
.mod_floater_body {
|
|
display: flex;
|
|
}
|
|
.mod_floater_body select {
|
|
margin-left: auto;
|
|
border-bottom: 1px solid var(--header-border-color);
|
|
outline: none;
|
|
}
|
|
.mod_floater_body button {
|
|
margin-left: 10px;
|
|
margin-right: auto;
|
|
outline: none;
|
|
padding-left: 10px;
|
|
background: hsl(9, 97%, 56%);
|
|
border-radius: 2px;
|
|
padding-right: 10px;
|
|
padding-top: 6px;
|
|
padding-bottom: 6px;
|
|
color: var(--inverse-primary-text-color);
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
margin-top: -2px;
|
|
}
|
|
|
|
.modal_pane {
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
background-color: var(--inverse-primary-text-color);
|
|
border: 1px solid var(--header-border-color);
|
|
border-bottom: 2px solid var(--header-border-color);
|
|
/*padding: 8px;*/
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
z-index: 9999;
|
|
animation: fadein 0.8s;
|
|
}
|
|
.pane_header {
|
|
color: hsl(0,0%,55%);
|
|
padding-top: 16px;
|
|
padding-bottom: 12px;
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
margin-bottom: 2px;
|
|
}
|
|
.pane_header h3 {
|
|
font-size: 14px;
|
|
font-weight: normal;
|
|
}
|
|
|
|
.pane_row {
|
|
color: var(--light-text-color);
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
font-size: 13px;
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
margin-bottom: 3px;
|
|
cursor: pointer;
|
|
}
|
|
.pane_selected {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.pane_buttons {
|
|
padding-top: 12px;
|
|
padding-bottom: 16px;
|
|
}
|
|
|
|
@keyframes fadein {
|
|
from { opacity: 0; }
|
|
to { opacity: 1; }
|
|
}
|
|
|
|
.topic_list_title_block {
|
|
display: flex;
|
|
}
|
|
.topic_list_title_block .pre_opt {
|
|
border-left: 1px solid var(--element-border-color);
|
|
padding-left: 11px;
|
|
height: 20px;
|
|
color: var(--light-text-color);
|
|
margin-right: 9px;
|
|
}
|
|
.topic_list_title_block .pre_opt:before {
|
|
content: "{{index .Phrases "topics_click_topics_to_select"}}";
|
|
font-size: 14px;
|
|
}
|
|
.topic_list_title, .forum_title {
|
|
margin-right: auto;
|
|
}
|
|
|
|
.mod_opt .moderate_link {
|
|
border-left: 1px solid var(--element-border-color);
|
|
padding-left: 12px;
|
|
height: 20px;
|
|
color: hsl(0,0%,65%);
|
|
}
|
|
.mod_opt .moderate_link:hover {
|
|
color: var(--light-text-color);
|
|
}
|
|
.mod_opt .moderate_link:before {
|
|
content: "\f0e3";
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
font-size: 18px;
|
|
}
|
|
.mod_opt .moderate_open {
|
|
display: none;
|
|
}
|
|
|
|
.topic_create_form {
|
|
display: flex !important;
|
|
padding-bottom: 12px;
|
|
}
|
|
.topic_create_form .main_form {
|
|
width: 100%;
|
|
margin-right: 25px;
|
|
}
|
|
.topic_create_form.selectedInput .main_form {
|
|
margin-right: 50px;
|
|
margin-left: 18px;
|
|
}
|
|
.topic_create_form .topic_meta {
|
|
display: flex;
|
|
}
|
|
|
|
.topic_create_form img {
|
|
display: inline-block;
|
|
margin-top: 12px;
|
|
margin-left: 8px;
|
|
}
|
|
.topic_board_row, .topic_create_form .quick_button_row {
|
|
display: none;
|
|
}
|
|
.topic_name_row {
|
|
margin-top: 20px;
|
|
margin-left: 12px;
|
|
width: 100%;
|
|
}
|
|
#forum_topic_create_form.selectedInput .topic_name_row {
|
|
margin-left: 20px;
|
|
}
|
|
.topic_content_row {
|
|
display: none;
|
|
margin-left: 12px;
|
|
width: 100%;
|
|
min-width: 0;
|
|
}
|
|
.selectedInput .topic_board_row {
|
|
display: inline-block;
|
|
margin-top: 16px;
|
|
margin-left: 12px;
|
|
}
|
|
.selectedInput .topic_name_row {
|
|
margin-top: 16px;
|
|
margin-bottom: 8px;
|
|
margin-left: 8px;
|
|
}
|
|
.selectedInput .topic_content_row {
|
|
display: inline-block;
|
|
}
|
|
.topic_create_form.selectedInput .quick_button_row {
|
|
display: inline-block;
|
|
width: 100%;
|
|
}
|
|
|
|
.topic_board_row select {
|
|
height: 27px;
|
|
width: 100px;
|
|
margin-left: 10px;
|
|
}
|
|
.topic_name_row input, .ip_search_input {
|
|
width: 100%;
|
|
display: inline-block;
|
|
padding-left: 8px;
|
|
}
|
|
input, select {
|
|
border: none;
|
|
border-bottom: 1px solid var(--header-border-color);
|
|
outline: none;
|
|
}
|
|
.topic_content_row textarea {
|
|
min-height: 80px;
|
|
width: 100%;
|
|
}
|
|
|
|
input[type=checkbox] {
|
|
display: none;
|
|
}
|
|
input[type=checkbox] + label {
|
|
display: inline-block;
|
|
width: 12px;
|
|
height: 12px;
|
|
margin-bottom: -2px;
|
|
border: 1px solid var(--element-border-color);
|
|
background-color: var(--element-background-color);
|
|
}
|
|
input[type=checkbox]:checked + label .sel {
|
|
display: inline-block;
|
|
width: 5px;
|
|
height: 5px;
|
|
background: var(--element-border-color);
|
|
}
|
|
.poll_content_row {
|
|
padding-left: 20px;
|
|
padding-top: 4px;
|
|
padding-bottom: 2px;
|
|
}
|
|
.poll_content_row .formitem {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.pollinput:not(:only-child):not(:first-child) {
|
|
margin-bottom: 5px;
|
|
}
|
|
.auto_hide, .show_on_edit {
|
|
display: none;
|
|
}
|
|
|
|
input[type=checkbox] + label.poll_option_label {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
input[type=checkbox]:checked + label.poll_option_label .sel {
|
|
display: inline-block;
|
|
width: 10px;
|
|
height: 10px;
|
|
margin-left: 3px;
|
|
background: var(--element-border-color);
|
|
}
|
|
/*.poll_option {
|
|
margin-bottom: 3px;
|
|
}*/
|
|
.poll_option_text {
|
|
display: inline-block;
|
|
margin-left: 3px;
|
|
font-size: 15px;
|
|
/*font-weight: bold;*/
|
|
position: relative;
|
|
top: -1px;
|
|
color: var(--light-text-color);
|
|
}
|
|
#poll_option_text_0 {
|
|
color: #d70206;
|
|
}
|
|
#poll_option_text_1 {
|
|
color: #f05b4f;
|
|
}
|
|
.poll_buttons {
|
|
display: flex;
|
|
margin-top: 8px;
|
|
}
|
|
.poll_buttons button {
|
|
margin-right: 5px;
|
|
}
|
|
.topic_reply_form .pollinput {
|
|
margin-left: 16px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.formbutton {
|
|
margin-top: 12px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.quick_button_row .formitem {
|
|
display: flex;
|
|
margin-left: 2px;
|
|
}
|
|
.quick_button_row button, .quick_button_row label, .ip_search_search, .formbutton, button {
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
padding-top: 6px;
|
|
padding-bottom: 6px;
|
|
color: var(--inverse-primary-text-color);
|
|
font-size: 13px;
|
|
font-weight: bold;
|
|
border-width: initial;
|
|
border-style: none;
|
|
border-color: initial;
|
|
border-image: initial;
|
|
outline: none;
|
|
background: hsl(209, 97%, 56%);
|
|
border-radius: 2px;
|
|
}
|
|
.quick_button_row button, .quick_button_row label, .ip_search_search {
|
|
margin-right: 0px;
|
|
}
|
|
.quick_button_row button, .quick_button_row label {
|
|
margin-left: 10px;
|
|
margin-top: 8px;
|
|
}
|
|
.quick_button_row #add_poll_button {
|
|
background: hsl(209, 47%, 56%);
|
|
}
|
|
.quick_button_row .add_file_button {
|
|
background: hsl(129, 57%, 56%);
|
|
}
|
|
.quick_button_row .close_form {
|
|
background: hsl(9, 0%, 56%);
|
|
}
|
|
|
|
.quick_button_row #upload_file_dock {
|
|
display: flex;
|
|
}
|
|
label.uploadItem {
|
|
background-size: 25px 30px;
|
|
background-repeat: no-repeat;
|
|
padding-left: 33px;
|
|
}
|
|
|
|
select, input, textarea {
|
|
background: var(--element-background-color);
|
|
padding: 5px;
|
|
color: hsl(0,0%,30%);
|
|
}
|
|
input, select {
|
|
color: var(--primary-text-color);
|
|
}
|
|
input:not(:focus):not([type="submit"]), select:not(:focus) {
|
|
color: var(--light-text-color);
|
|
}
|
|
textarea {
|
|
outline: none;
|
|
border: 1px solid var(--header-border-color);
|
|
}
|
|
|
|
.topic_reply_container {
|
|
display: flex;
|
|
border: 0;
|
|
}
|
|
.topic_reply_form {
|
|
margin: 0px;
|
|
width: 100%;
|
|
height: min-content;
|
|
}
|
|
.topic_reply_form .formrow {
|
|
padding: 0px !important;
|
|
}
|
|
.topic_reply_form .trumbowyg-button-pane:after {
|
|
display: none;
|
|
}
|
|
.topic_reply_form .trumbowyg-box {
|
|
min-height: auto;
|
|
}
|
|
.topic_reply_form .trumbowyg-editor {
|
|
border-left: none;
|
|
border-right: none;
|
|
min-height: 103px;
|
|
max-height: 200px;
|
|
overflow-y: scroll;
|
|
}
|
|
.topic_reply_form .quick_button_row {
|
|
margin-bottom: 7px;
|
|
}
|
|
|
|
#prevFloat, #nextFloat {
|
|
display: none;
|
|
}
|
|
|
|
.topic_list {
|
|
border: none;
|
|
}
|
|
.topic_list .topic_row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.topic_list .topic_row:last-child .rowitem {
|
|
margin-bottom: 0px;
|
|
}
|
|
#forum_topic_list .topic_inner_left .starter {
|
|
display: inline-block;
|
|
width: 200px;
|
|
}
|
|
|
|
.rowlist .rowitem, .topic_left, .topic_right {
|
|
margin-bottom: 8px;
|
|
padding: 4px;
|
|
display: flex;
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
.topic_middle {
|
|
display: none;
|
|
}
|
|
.rowlist .rowitem {
|
|
background-color: var(--element-background-color);
|
|
padding: 12px;
|
|
}
|
|
.rowlist.bgavatars {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
grid-template-columns: repeat(auto-fill, 150px);
|
|
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
|
|
grid-gap: 6px 12px;
|
|
border: none;
|
|
background: none !important;
|
|
}
|
|
.rowlist .rowitem {
|
|
display: flex;
|
|
}
|
|
.bgavatars .rowitem {
|
|
background-image: none !important;
|
|
}
|
|
.rowlist.bgavatars .rowitem {
|
|
flex-direction: column;
|
|
}
|
|
.rowlist.bgavatars .rowitem {
|
|
padding-top: 16px;
|
|
padding-bottom: 10px;
|
|
}
|
|
.bgavatars .bgsub {
|
|
border-radius: 30px;
|
|
height: 48px;
|
|
width: 48px;
|
|
margin-top: 8px;
|
|
margin-left: 4px;
|
|
}
|
|
.rowlist.bgavatars .bgsub {
|
|
height: 80px;
|
|
width: 80px;
|
|
border-radius: 48px;
|
|
margin-top: 4px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.rowlist.bgavatars .bgsub, .rowlist.bgavatars .rowitem > a, .rowlist.bgavatars .rowitem > span {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.rowlist .rowTitle {
|
|
font-size: 20px;
|
|
margin-bottom: 3px;
|
|
}
|
|
.rowlist .panel_compactrow {
|
|
padding: 16px;
|
|
}
|
|
|
|
.topic_list .rowtopic {
|
|
font-size: 16px;
|
|
margin-right: 1px;
|
|
white-space: nowrap;
|
|
display: inline-block;
|
|
}
|
|
.topic_list .rowtopic span {
|
|
max-width: 162px;
|
|
overflow: hidden;
|
|
color: var(--primary-text-color);
|
|
}
|
|
.topic_list .rowsmall {
|
|
font-size: 15px;
|
|
}
|
|
|
|
.topic_list .rowsmall.starter:before {
|
|
content: "\f007";
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
margin-right: 5px;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.topic_list .lastReplyAt {
|
|
font-size: 14px;
|
|
}
|
|
.topic_list .topic_status_e {
|
|
display: none;
|
|
}
|
|
|
|
.topic_left {
|
|
flex: 1 1 calc(100% - 380px);
|
|
border-right: none;
|
|
}
|
|
.topic_inner_right {
|
|
margin-left: 15%;
|
|
margin-right: auto;
|
|
font-size: 17px;
|
|
}
|
|
|
|
.rowsmall {
|
|
font-size: 14px;
|
|
}
|
|
.topic_inner_right.rowsmall {
|
|
margin-top: 15px;
|
|
}
|
|
|
|
/* Experimenting here */
|
|
.topic_inner_right {
|
|
margin-top: 12px;
|
|
}
|
|
.topic_inner_right span {
|
|
font-size: 16px;
|
|
}
|
|
.topic_inner_right span:after {
|
|
font-size: 13.5px;
|
|
}
|
|
/* End Experiment */
|
|
|
|
.topic_inner_right .replyCount:after {
|
|
content: var(--replies-lang-string);
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
.topic_inner_right .topicCount:after {
|
|
content: var(--topics-lang-string);
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
.topic_inner_right .likeCount:after {
|
|
content: var(--likes-lang-string);
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
.parent_forum {
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
|
|
.topic_right {
|
|
flex: 1 1 0px;
|
|
border-left: none;
|
|
}
|
|
.topic_right_inside {
|
|
display: flex;
|
|
}
|
|
|
|
.topic_left img {
|
|
border-radius: 30px;
|
|
height: 48px;
|
|
width: 48px;
|
|
margin-top: 8px;
|
|
margin-left: 4px;
|
|
}
|
|
.topic_right_inside img {
|
|
border-radius: 30px;
|
|
height: 42px;
|
|
width: 42px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.topic_left .topic_inner_left {
|
|
margin-top: 12px;
|
|
margin-left: 8px;
|
|
margin-bottom: 14px;
|
|
width: 220px;
|
|
}
|
|
.topic_right_inside > span {
|
|
margin-top: 12px;
|
|
margin-left: 8px;
|
|
}
|
|
|
|
.topic_sticky {
|
|
border-bottom: 2px solid hsl(51, 60%, 70%);
|
|
}
|
|
.topic_selected .topic_left, .topic_selected .topic_right {
|
|
background-color: hsl(81, 60%, 95%);
|
|
}
|
|
|
|
@element .topic_left .rowtopic and (min-width: 160px) {
|
|
$this, $this span, $this + .parent_forum {
|
|
float: left;
|
|
}
|
|
$this + .parent_forum {
|
|
margin: 2px;
|
|
margin-left: 3px;
|
|
}
|
|
$this:after {
|
|
content: "...";
|
|
float: left;
|
|
}
|
|
}
|
|
|
|
@element .topic_list and (min-width: 738px) {
|
|
.topic_left .topic_inner_left {
|
|
width: calc(240px + 1%);
|
|
}
|
|
}
|
|
|
|
@element .topic_list and (min-width: 875px) {
|
|
.topic_left .topic_inner_left {
|
|
width: calc(240px + 10%);
|
|
}
|
|
}
|
|
|
|
.forum_list, .post_container {
|
|
border: none;
|
|
}
|
|
.forum_list .rowitem {
|
|
display: flex;
|
|
margin-bottom: 8px;
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
padding: 14px;
|
|
}
|
|
.forum_list .forum_nodesc {
|
|
font-style: italic;
|
|
}
|
|
.forum_right {
|
|
display: flex;
|
|
}
|
|
.forum_right span {
|
|
margin-top: 1px;
|
|
}
|
|
.shift_right {
|
|
margin-left: auto;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.topic_item {
|
|
display: flex;
|
|
}
|
|
.topic_item .topic_name_input {
|
|
width: 100%;
|
|
padding-left: 12px;
|
|
margin-right: 12px;
|
|
}
|
|
.topic_item .formbutton {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.postImage {
|
|
width: 100%;
|
|
max-width: 150px;
|
|
}
|
|
.post_item {
|
|
display: flex;
|
|
margin-bottom: 16px;
|
|
}
|
|
.userinfo, .content_container {
|
|
background-color: var(--element-background-color);
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
.userinfo {
|
|
margin-right: 16px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 30px;
|
|
padding-left: 42px;
|
|
padding-right: 42px;
|
|
padding-bottom: 18px;
|
|
height: min-content;
|
|
/*overflow: hidden;
|
|
text-overflow: ellipsis;*/
|
|
}
|
|
.content_container {
|
|
width: 100%;
|
|
padding: 17px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
.avatar_item {
|
|
border-radius: 50px;
|
|
width: 84px;
|
|
height: 84px;
|
|
margin-bottom: 12px;
|
|
background-size: 120px;
|
|
}
|
|
.the_name, .userinfo .tag_block {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.the_name {
|
|
font-size: 18px;
|
|
color: var(--lightened-primary-text-color);
|
|
}
|
|
.action_item .userinfo {
|
|
display: none;
|
|
}
|
|
.action_item .content_container {
|
|
display: flex;
|
|
flex-direction: row;
|
|
}
|
|
.action_item .action_icon {
|
|
display: none;
|
|
}
|
|
.userinfo .tag_block {
|
|
color: var(--extra-lightened-primary-text-color);
|
|
}
|
|
.post_item .user_content {
|
|
margin-bottom: 10px;
|
|
}
|
|
.button_container {
|
|
margin-top: auto;
|
|
display: flex;
|
|
}
|
|
.action_button {
|
|
margin-right: 5px;
|
|
color: var(--light-text-color);
|
|
font-size: 14px;
|
|
display: inline-block;
|
|
}
|
|
.action_button_right {
|
|
display: inline-flex;
|
|
margin-left: auto;
|
|
}
|
|
.like_count {
|
|
display: none;
|
|
}
|
|
.has_likes .like_count {
|
|
display: block;
|
|
}
|
|
.like_count:after {
|
|
content: "{{index .Phrases "topic_like_count_suffix"}}";
|
|
margin-right: 6px;
|
|
}
|
|
|
|
.post_item .add_like:after, .post_item .remove_like:after,
|
|
.created_at:before,
|
|
.ip_item:before {
|
|
border-left: 1px solid var(--element-border-color);
|
|
content: "";
|
|
margin-top: 1px;
|
|
margin-bottom: 1px;
|
|
}
|
|
.created_at:before, .ip_item:before {
|
|
margin-right: 10px;
|
|
}
|
|
.post_item .add_like:after, .post_item .remove_like:after {
|
|
margin-left: 10px;
|
|
margin-right: 5px;
|
|
}
|
|
/* TODO: Use a less bold bold */
|
|
.post_item .remove_like:before {
|
|
font-weight: bold;
|
|
}
|
|
.created_at {
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.add_like:before, .remove_like:before {
|
|
content: "{{index .Phrases "topic_plus_one"}}";
|
|
}
|
|
.button_container .open_edit:after, .edit_item:after{
|
|
content: "{{index .Phrases "topic_edit_button_text"}}";
|
|
}
|
|
.delete_item:after {
|
|
content: "{{index .Phrases "topic_delete_button_text"}}";
|
|
}
|
|
.ip_item_button:after {
|
|
content: "{{index .Phrases "topic_ip_button_text"}}";
|
|
}
|
|
.lock_item:after {
|
|
content: "{{index .Phrases "topic_lock_button_text"}}";
|
|
}
|
|
.unlock_item:after {
|
|
content: "{{index .Phrases "topic_unlock_button_text"}}";
|
|
}
|
|
.pin_item:after {
|
|
content: "{{index .Phrases "topic_pin_button_text"}}";
|
|
}
|
|
.unpin_item:after {
|
|
content: "{{index .Phrases "topic_unpin_button_text"}}";
|
|
}
|
|
.report_item:after {
|
|
content: "{{index .Phrases "topic_report_button_text"}}";
|
|
}
|
|
|
|
#ip_search_container .rowlist .rowitem {
|
|
padding-top: 16px;
|
|
padding-bottom: 10px;
|
|
}
|
|
.ip_search_block .rowitem {
|
|
padding: 8px;
|
|
padding-left: 12px;
|
|
padding-right: 12px;
|
|
}
|
|
.ip_search_input {
|
|
margin-right: 12px;
|
|
}
|
|
|
|
.ip_search_block .rowitem,
|
|
#profile_left_pane .topBlock {
|
|
display: flex;
|
|
}
|
|
#profile_left_lane {
|
|
margin-left: 8px;
|
|
margin-right: 4px;
|
|
}
|
|
#profile_left_pane .topBlock {
|
|
flex-direction: column;
|
|
padding-bottom: 12px;
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
background-color: var(--element-background-color);
|
|
}
|
|
#profile_left_pane .avatarRow {
|
|
padding: 28px;
|
|
padding-bottom: 4px;
|
|
padding-top: 22px;
|
|
}
|
|
#profile_left_pane .avatar {
|
|
border-radius: 80px;
|
|
height: 100px;
|
|
width: 100px;
|
|
}
|
|
#profile_left_pane .nameRow {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
#profile_left_pane .nameRow .username {
|
|
text-align: center;
|
|
}
|
|
#profile_left_pane .profileName {
|
|
font-size: 19px;
|
|
}
|
|
.rowmenu .passive {
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
background-color: var(--element-background-color);
|
|
margin-top: 6px;
|
|
padding: 12px;
|
|
padding-top: 10px;
|
|
padding-bottom: 10px;
|
|
}
|
|
.colstack:not(#profile_container) .rowmenu {
|
|
padding-left: 12px;
|
|
}
|
|
.colstack:not(#profile_container) .rowmenu .passive {
|
|
margin-top: 0px;
|
|
border-bottom: none;
|
|
}
|
|
.colstack:not(#profile_container) .rowmenu .passive:last-child {
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
#profile_left_pane .passiveBlock .passive {
|
|
padding-left: 12px;
|
|
}
|
|
|
|
#profile_right_lane {
|
|
width: 100%;
|
|
margin-right: 12px;
|
|
}
|
|
.colstack_right .colstack_item:not(.rowlist):not(#profile_comments),
|
|
#profile_comments .comment, .alert {
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
background-color: var(--element-background-color);
|
|
}
|
|
.alert {
|
|
padding: 12px;
|
|
margin-top: -3px;
|
|
margin-bottom: 8px;
|
|
margin-left: 12px;
|
|
margin-right: 12px;
|
|
}
|
|
.colstack_right .alert {
|
|
margin-left: 16px;
|
|
margin-right: 0px;
|
|
}
|
|
.colstack_right .colstack_item, .colstack_right .colstack_grid {
|
|
margin-left: 16px;
|
|
}
|
|
#profile_right_lane .topic_reply_form {
|
|
width: auto;
|
|
}
|
|
#profile_comments .topRow {
|
|
display: flex;
|
|
}
|
|
#profile_comments .topRow .controls {
|
|
padding-top: 16px;
|
|
padding-right: 16px;
|
|
}
|
|
#profile_comments .content_column {
|
|
margin-bottom: 16px;
|
|
}
|
|
#profile_comments button {
|
|
background: inherit;
|
|
color: var(--lighter-text-color);
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
cursor: pointer;
|
|
}
|
|
#profile_comments button:hover {
|
|
color: var(--light-text-color);
|
|
}
|
|
#profile_comments button.edit_item:after,
|
|
#profile_comments button.delete_item:after,
|
|
#profile_comments button.report_item:after {
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
}
|
|
#profile_comments button.edit_item:after {
|
|
content: "\f040";
|
|
}
|
|
#profile_comments button.delete_item:after {
|
|
content: "\f1f8";
|
|
}
|
|
#profile_comments button.report_item:after {
|
|
content: "\f024";
|
|
}
|
|
#profile_comments_head {
|
|
margin-top: 6px;
|
|
}
|
|
#profile_comments {
|
|
margin-bottom: 12px;
|
|
}
|
|
#profile_comments:empty {
|
|
display: none !important;
|
|
}
|
|
#profile_comments .rowitem {
|
|
background-image: none !important;
|
|
}
|
|
#profile_comments .comment:not(:last-child) {
|
|
margin-bottom: 8px;
|
|
}
|
|
#profile_comments .comment .userbit {
|
|
display: flex;
|
|
margin-left: 14px;
|
|
margin-top: 14px;
|
|
margin-bottom: 8px;
|
|
}
|
|
#profile_comments .comment img {
|
|
width: 40px;
|
|
height: 40px;
|
|
border-radius: 62px;
|
|
margin-right: 8px;
|
|
}
|
|
#profile_comments .comment .nameAndTitle {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-top: 2px;
|
|
}
|
|
#profile_comments .comment .nameAndTitle .user_tag {
|
|
font-size: 15px;
|
|
}
|
|
#profile_comments .comment .content_column {
|
|
padding-left: 14px;
|
|
padding-right: 14px;
|
|
display: flex;
|
|
width: 100%
|
|
}
|
|
#profile_comments .comment .controls {
|
|
margin-left: auto;
|
|
}
|
|
#profile_comments_form .topic_reply_form {
|
|
border-top: 1px solid var(--element-border-color) !important;
|
|
}
|
|
|
|
/*.colstack_item .formrow {
|
|
display: flex;
|
|
}
|
|
.colstack_right .formrow {
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
padding-bottom: 4px;
|
|
border-right: 1px solid var(--element-border-color);
|
|
}
|
|
.colstack_right .formrow:first-child {
|
|
padding-top: 16px;
|
|
}
|
|
.colstack_right .formrow .formlabel {
|
|
padding-top: 5px;
|
|
}
|
|
.colstack_right .formrow:last-child {
|
|
padding-bottom: 16px;
|
|
}
|
|
.colstack_item:not(#profile_right_lane) .formrow .formlabel {
|
|
width: 40%;
|
|
margin-right: 12px;
|
|
white-space: nowrap;
|
|
}*/
|
|
.formitem:only-child {
|
|
width: 100%;
|
|
display: flex;
|
|
}
|
|
.the_form .formitem:only-child button {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.quick_reply_form, .topic_reply_form, .the_form {
|
|
background: var(--element-background-color);
|
|
}
|
|
.formrow {
|
|
border-right: none !important;
|
|
}
|
|
|
|
.to_right {
|
|
float: right;
|
|
margin-left: auto;
|
|
}
|
|
|
|
#account_edit_avatar .avatar_box {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
#create_topic_page .close_form, #create_topic_page .formlabel, #login_page .formlabel {
|
|
display: none;
|
|
}
|
|
.formrow:not(:first-child):not(:last-child) {
|
|
margin-top: 4px;
|
|
}
|
|
.formrow:not(:first-child) {
|
|
padding-top: 3px;
|
|
}
|
|
.formrow {
|
|
padding: 16px;
|
|
}
|
|
.formrow:not(:last-child) {
|
|
padding-bottom: 4px;
|
|
}
|
|
#login_page .formrow:not(:last-child) {
|
|
padding-bottom: 0px;
|
|
}
|
|
.formlabel {
|
|
display: block;
|
|
font-size: 15px;
|
|
}
|
|
.quick_create_form .formrow {
|
|
padding: 0px;
|
|
}
|
|
#register_page .register_button_row {
|
|
padding: 12px !important;
|
|
padding-top: 0px !important;
|
|
margin-top: -2px !important;
|
|
}
|
|
#register_page .register_button_row .formbutton {
|
|
margin-left: 2px;
|
|
}
|
|
|
|
/* TODO: Add a generic button_row class and add this to them all? */
|
|
.login_button_row {
|
|
display: flex;
|
|
}
|
|
.dont_have_account {
|
|
color: var(--primary-link-color);
|
|
font-size: 12px;
|
|
margin-left: auto;
|
|
margin-top: 23px;
|
|
}
|
|
|
|
/* TODO: Highlight the one we're currently on? */
|
|
.pageset {
|
|
display: flex;
|
|
margin-left: 14px;
|
|
}
|
|
.pageitem {
|
|
padding: 8px;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
background: var(--element-background-color);
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
border-left: none;
|
|
border-right: none;
|
|
}
|
|
.pageitem:first-child {
|
|
border-left: 1px solid var(--element-border-color);
|
|
}
|
|
.pageitem:last-child {
|
|
border-right: 1px solid var(--element-border-color);
|
|
}
|
|
|
|
/* TODO: Make widget_about's CSS less footer centric */
|
|
.footerBit, .footer .widget {
|
|
border-top: 1px solid var(--element-border-color);
|
|
padding: 12px;
|
|
padding-top: 10px;
|
|
padding-bottom: 10px;
|
|
margin-left: -8px;
|
|
margin-right: -8px;
|
|
background-color: var(--element-background-color);
|
|
display: flex;
|
|
}
|
|
#poweredByHolder {
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
.about, #poweredBy {
|
|
font-size: 17px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
#poweredBy {
|
|
margin-right: auto;
|
|
}
|
|
#poweredBy span {
|
|
font-size: 16px;
|
|
}
|
|
#aboutTitle {
|
|
font-size: 17px;
|
|
margin: 8px;
|
|
margin-bottom: 4px;
|
|
}
|
|
#poweredByName {
|
|
font-size: 17px;
|
|
margin: 4px;
|
|
}
|
|
#aboutDesc {
|
|
margin-left: 8px;
|
|
margin-top: 8px;
|
|
width: 60%;
|
|
font-size: 16px;
|
|
}
|
|
#aboutDesc p {
|
|
-webkit-margin-before: 12px;
|
|
-webkit-margin-after: 12px;
|
|
}
|
|
#aboutDesc p:last-child {
|
|
-webkit-margin-after: 8px;
|
|
}
|
|
#aboutDesc p:first-child {
|
|
-webkit-margin-before: 0px;
|
|
}
|
|
#poweredByDash, #poweredByMaker {
|
|
display: none;
|
|
}
|
|
#themeSelectorSelect {
|
|
padding: 3px;
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.colstack_grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, 1fr);
|
|
grid-gap: 8px;
|
|
}
|
|
.grid_item {
|
|
background: var(--element-background-color);
|
|
border: 1px solid var(--element-border-color);
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
margin: 0px;
|
|
padding: 16px;
|
|
padding-left: 0px;
|
|
display: flex;
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
padding-right: 10px;
|
|
}
|
|
.grid_item span {
|
|
margin-top: 16px;
|
|
margin-bottom: 16px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
text-align: center;
|
|
}
|
|
/* TODO: Move these to panel.css */
|
|
#dash-version:before, #dash-cpu:before, #dash-ram: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 {
|
|
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";
|
|
}
|
|
|
|
@media(min-width: 1000px) {
|
|
.footer {
|
|
margin-left: -8px;
|
|
margin-right: -8px;
|
|
}
|
|
.footerBit, .footer .widget {
|
|
border-top: 1px solid var(--header-border-color);
|
|
border-left: 1px solid var(--header-border-color);
|
|
border-right: 1px solid var(--header-border-color);
|
|
}
|
|
#poweredByHolder {
|
|
border-bottom: 2px solid var(--header-border-color);
|
|
}
|
|
#main {
|
|
max-width: 1000px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.footer {
|
|
max-width: 1000px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
#main {
|
|
padding-top: 18px;
|
|
padding-left: 16px;
|
|
padding-right: 16px;
|
|
border-left: 1px solid hsl(20,0%,95%);
|
|
border-right: 1px solid hsl(20,0%,95%);
|
|
}
|
|
.footer {
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
}
|
|
#back, .footer, .footBlock {
|
|
background-color: hsl(0,0%,95%);
|
|
}
|
|
#back:not(.zone_panel) .footBlock {
|
|
display: flex;
|
|
}
|
|
}
|
|
|
|
@media(min-width: 721px) {
|
|
.hide_on_big {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
@media(max-width: 720px) {
|
|
.menu_profile, .ip_item {
|
|
display: none;
|
|
}
|
|
.like_count {
|
|
margin-right: 1px;
|
|
}
|
|
.like_count:after {
|
|
margin-right: 6px;
|
|
}
|
|
.created_at:before, .ip_item:before {
|
|
margin-right: 6px;
|
|
}
|
|
}
|
|
|
|
@media(max-width: 670px) {
|
|
.topic_inner_right {
|
|
display: none;
|
|
}
|
|
}
|
|
@media(max-width: 620px) {
|
|
.userinfo .avatar_item {
|
|
width: 72px;
|
|
height: 72px;
|
|
}
|
|
}
|
|
@media(max-width: 610px) {
|
|
.userinfo {
|
|
padding-top: 24px;
|
|
padding-left: 34px;
|
|
padding-right: 34px;
|
|
padding-bottom: 14px;
|
|
}
|
|
.userinfo .avatar_item {
|
|
height: 64px;
|
|
width: 64px;
|
|
/*background-size: 82px;*/
|
|
}
|
|
}
|
|
@media(max-width: 590px) {
|
|
#main {
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
}
|
|
.post_item {
|
|
margin-bottom: 12px;
|
|
}
|
|
.userinfo {
|
|
margin-right: 12px;
|
|
padding-top: 20px;
|
|
padding-left: 24px;
|
|
padding-right: 24px;
|
|
padding-bottom: 12px;
|
|
}
|
|
.userinfo .avatar_item {
|
|
width: 52px;
|
|
height: 52px;
|
|
margin-bottom: 10px;
|
|
background-size: 72px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.post_tag {
|
|
font-size: 15px;
|
|
}
|
|
.content_container {
|
|
padding: 15px;
|
|
}
|
|
}
|
|
@media(max-width: 550px) {
|
|
.nav {
|
|
border-bottom: 1px solid var(--header-border-color);
|
|
}
|
|
.menu_profile {
|
|
display: block;
|
|
}
|
|
#menu_overview {
|
|
font-size: 18px;
|
|
background-color: hsl(0,0%,97%);
|
|
margin-top: -16px;
|
|
margin-bottom: -11px;
|
|
margin-left: -14px;
|
|
margin-right: 16px;
|
|
padding-top: 16px;
|
|
padding-left: 14px;
|
|
padding-right: 4px;
|
|
}
|
|
#menu_overview::after {
|
|
height: 16px !important;
|
|
}
|
|
.menu_left a:after {
|
|
content: "" !important;
|
|
}
|
|
.menu_left:not(:last-child):after, .menu_alerts:after {
|
|
margin-left: 4px;
|
|
border-right: none;
|
|
}
|
|
.menu_alerts {
|
|
margin-right: 16px;
|
|
}
|
|
.alert_bell {
|
|
position: relative;
|
|
bottom: -1px;
|
|
}
|
|
.alert_bell:before {
|
|
font-size: 17px;
|
|
}
|
|
.alert_aftercounter {
|
|
display: none;
|
|
}
|
|
|
|
#back {
|
|
padding-top: 0px;
|
|
}
|
|
.rowhead h1, .opthead h1, .colstack_head h1 {
|
|
font-size: 18px;
|
|
}
|
|
main > .rowhead, #main > .rowhead {
|
|
border: none;
|
|
border-bottom: 2px solid var(--header-border-color);
|
|
}
|
|
#main {
|
|
padding-top: 0px;
|
|
}
|
|
main > .rowhead, #main > .rowhead, main > .opthead, #main > .opthead {
|
|
margin-left: -3px;
|
|
margin-right: -3px;
|
|
}
|
|
|
|
.topic_list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
.topic_list .topic_row {
|
|
display: block;
|
|
width: calc(50% - 6px);
|
|
float: left;
|
|
}
|
|
.topic_list .topic_row:nth-child(odd) {
|
|
margin-right: 12px;
|
|
}
|
|
.topic_left {
|
|
margin-bottom: 0px;
|
|
border-bottom: none;
|
|
border-right: 1px solid var(--element-border-color);
|
|
}
|
|
.topic_left .parent_forum {
|
|
display: none;
|
|
}
|
|
.topic_right.rowitem {
|
|
border-top: none;
|
|
border-left: 1px solid var(--element-border-color);
|
|
background-color: hsl(0,0%,95%);
|
|
}
|
|
.topic_right_inside br, .topic_right_inside img {
|
|
display: none;
|
|
}
|
|
.topic_right.topic_sticky {
|
|
border-bottom: 2px solid var(--element-border-color);
|
|
}
|
|
.topic_right_inside > span {
|
|
margin-top: 6px;
|
|
margin-bottom: 6px;
|
|
}
|
|
|
|
.button_container {
|
|
border-top: 1px solid var(--element-border-color);
|
|
}
|
|
.action_button {
|
|
padding-bottom: 15px;
|
|
padding-left: 10px;
|
|
padding-right: 8px;
|
|
padding-top: 15px;
|
|
font-size: 12px;
|
|
}
|
|
.action_button:not(.add_like):not(.remove_like) {
|
|
font: normal normal normal 14px/1 FontAwesome;
|
|
}
|
|
.has_likes .action_button_right {
|
|
margin-left: 0px;
|
|
width: 100%;
|
|
}
|
|
.like_item {
|
|
background-color: hsl(0,0%,97%);
|
|
}
|
|
.post_item:not(.top_post) .like_item {
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
}
|
|
.post_item .add_like:after, .post_item .remove_like:after {
|
|
border-left: none;
|
|
margin: inherit;
|
|
}
|
|
.content_container {
|
|
padding: 0px;
|
|
}
|
|
.user_content {
|
|
padding: 12px;
|
|
}
|
|
.button_container .open_edit:after, .edit_item:after{
|
|
content: "\f040";
|
|
}
|
|
.delete_item:after {
|
|
content: "\f014";
|
|
}
|
|
.ip_item_button:after {
|
|
content: "\f0ac";
|
|
}
|
|
.lock_item:after {
|
|
content: "\f023";
|
|
}
|
|
.unlock_item:after {
|
|
content: "\f09c";
|
|
}
|
|
.pin_item:after, .unpin_item:after {
|
|
content: "\f08d";
|
|
}
|
|
.report_item:not(.profile_menu_item):after {
|
|
content: "\f024";
|
|
}
|
|
.unpin_item, .unlock_item {
|
|
background-color: hsl(80,50%,97%);
|
|
}
|
|
.like_count, .like_count:before {
|
|
font-family: arial;
|
|
}
|
|
.like_count:after {
|
|
content: "";
|
|
}
|
|
.like_count:before {
|
|
content: "{{index .Phrases "topic_plus"}}";
|
|
font-weight: normal;
|
|
}
|
|
.created_at {
|
|
margin-left: auto;
|
|
}
|
|
.created_at:before {
|
|
border-left: none;
|
|
margin: inherit;
|
|
}
|
|
|
|
.topic_reply_form .trumbowyg-editor {
|
|
padding: 15px;
|
|
}
|
|
.trumbowyg-editor[contenteditable=true]:empty:not(:focus)::before {
|
|
font-size: 15px;
|
|
}
|
|
.trumbowyg-button-pane .trumbowyg-button-group:first-child {
|
|
margin-left: 0px !important;
|
|
}
|
|
.trumbowyg-button-pane .trumbowyg-button-group:after,
|
|
.trumbowyg-button-pane .trumbowyg-button-group:first-child:before {
|
|
margin: inherit !important;
|
|
border: none !important;
|
|
}
|
|
}
|
|
@media(min-width: 521px) {
|
|
.button_menu {
|
|
display: none;
|
|
}
|
|
}
|
|
@media(max-width: 520px) {
|
|
.edit_item, .button_container .open_edit, .delete_item, .pin_item, .unpin_item, .lock_item, .unlock_item, .ip_item_button, .report_item:not(.profile_menu_item) {
|
|
display: none;
|
|
}
|
|
.button_menu:after {
|
|
content: "\f013";
|
|
}
|
|
.button_menu_pane {
|
|
display: flex;
|
|
flex-direction: column;
|
|
background-color: var(--element-background-color);
|
|
border: 2px solid var(--element-border-color);
|
|
position: fixed;
|
|
left: 50%;
|
|
top: 110px;
|
|
width: 300px;
|
|
transform: translateX(-50%);
|
|
z-index: 200;
|
|
}
|
|
.button_menu_pane > *:not(:last-child) {
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
}
|
|
.button_menu_pane .userinfo {
|
|
display: flex;
|
|
flex-direction: row;
|
|
width: 100%;
|
|
padding-top: 12px;
|
|
}
|
|
.button_menu_pane .avatar_item {
|
|
width: 42px;
|
|
height: 42px;
|
|
background-size: 62px;
|
|
margin-left: 0px;
|
|
margin-right: 10px;
|
|
margin-bottom: 0px;
|
|
}
|
|
.button_menu_pane .userinfo .the_name {
|
|
margin-right: 0px;
|
|
}
|
|
|
|
/* TODO: Make this grid more flexible so that plugins can add new items more easily */
|
|
.button_menu_pane .buttonGrid {
|
|
display: grid;
|
|
grid-template-columns: repeat(8, 1fr);
|
|
border-left: 1px solid var(--element-border-color);
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
}
|
|
.button_menu_pane .action_button {
|
|
display: flex;
|
|
margin: 0px;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
background-color: var(--element-background-color);
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
width: 42px;
|
|
height: 42px;
|
|
font-size: 15px;
|
|
border-right: 1px solid var(--element-border-color);
|
|
border-bottom: 1px solid var(--element-border-color);
|
|
}
|
|
.button_menu_pane .action_button:nth-child(8n) {
|
|
border-right: none;
|
|
}
|
|
.button_menu_pane .action_button:nth-last-child(-n+8) {
|
|
border-bottom: none;
|
|
}
|
|
.button_menu_pane .action_button:after, .button_menu_pane .add_like:before, .button_menu_pane .remove_like:before {
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
.button_menu_pane .open_edit:after {
|
|
content: "\f040";
|
|
}
|
|
.button_menu_pane .gridFiller {
|
|
background-color: var(--tinted-background-color);
|
|
}
|
|
}
|
|
@media(max-width: 450px) {
|
|
.topic_list .topic_row {
|
|
display: block;
|
|
width: 100%;
|
|
float: none;
|
|
}
|
|
.topic_list .topic_row:nth-child(odd) {
|
|
margin-right: 0px;
|
|
}
|
|
}
|
|
@media(max-width: 440px) {
|
|
#main {
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
}
|
|
.userinfo {
|
|
padding-left: 18px;
|
|
padding-right: 18px;
|
|
margin-right: 10px;
|
|
}
|
|
.the_name {
|
|
font-size: 17px;
|
|
}
|
|
} |