bcaa646f68
The profile route is now compiled again. A custom struct is now used for it instead of the generic Page struct. Added the group list to the Control Panel. Tweaked the navbar CSS. Non-mods can no longer post in locked topics. Locked topics now have a gray background on the topic view header, the forum view, and the topiclist, The reply content box no longer shows up on topics which don't have any replies.
409 lines
6.3 KiB
CSS
409 lines
6.3 KiB
CSS
* {
|
|
box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
-webkit-box-sizing: border-box;
|
|
}
|
|
|
|
body
|
|
{
|
|
font-family: arial;
|
|
}
|
|
|
|
@font-face {
|
|
font-family: 'EmojiFont';
|
|
src: url('https://github.com/Ranks/emojione/raw/master/assets/fonts/emojione-svg.woff2') format('woff2'),
|
|
url('https://github.com/Ranks/emojione/raw/master/assets/fonts/emojione-svg.woff') format('woff'), local("arial");
|
|
}
|
|
|
|
@supports (-ms-ime-align:auto) {
|
|
.user_content
|
|
{
|
|
font-family: EmojiFont, arial;
|
|
}
|
|
}
|
|
@-moz-document url-prefix() {
|
|
.user_content
|
|
{
|
|
font-family: EmojiFont, arial;
|
|
}
|
|
}
|
|
|
|
/*.move_left{float: left;position: relative;left: 50%;}
|
|
.move_right{float: left;position: relative;left: -50%;}*/
|
|
ul
|
|
{
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
height: 28px;
|
|
list-style-type: none;
|
|
border: 1px solid #ccc;
|
|
}
|
|
li
|
|
{
|
|
height: 26px;
|
|
padding-left: 10px;
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
li:hover { background: rgb(250,250,250); }
|
|
li a
|
|
{
|
|
text-decoration: none;
|
|
color: #515151;
|
|
}
|
|
/*li a:hover { color: #7a7a7a; }*/
|
|
.menu_left
|
|
{
|
|
float: left;
|
|
border-right: 1px solid #ccc;
|
|
padding-right: 10px;
|
|
}
|
|
.menu_right
|
|
{
|
|
float: right;
|
|
border-left: 1px solid #ccc;
|
|
padding-right: 10px;
|
|
}
|
|
|
|
.container
|
|
{
|
|
width: 90%;
|
|
padding: 0px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.rowblock
|
|
{
|
|
border: 1px solid #ccc;
|
|
width: 100%;
|
|
padding: 0px;
|
|
padding-top: 0px;
|
|
}
|
|
.rowblock:empty
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
.colblock_left
|
|
{
|
|
border: 1px solid #ccc;
|
|
padding: 0px;
|
|
padding-top: 0px;
|
|
width: 30%;
|
|
float: left;
|
|
margin-right: 8px;
|
|
}
|
|
.colblock_right
|
|
{
|
|
border: 1px solid #ccc;
|
|
padding: 0px;
|
|
padding-top: 0px;
|
|
width: 65%;
|
|
overflow: hidden;
|
|
word-wrap: break-word;
|
|
}
|
|
.colblock_left:empty
|
|
{
|
|
display: none;
|
|
}
|
|
.colblock_right:empty
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
.rowitem
|
|
{
|
|
width: 100%;
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
padding-top: 17px;
|
|
padding-bottom: 12px;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
.rowitem.passive
|
|
{
|
|
font-weight: normal;
|
|
text-transform: none;
|
|
}
|
|
.rowitem:not(:last-child)
|
|
{
|
|
border-bottom: 1px dotted #ccc;
|
|
}
|
|
.rowitem a
|
|
{
|
|
text-decoration: none;
|
|
color: black;
|
|
}
|
|
.rowitem a:hover
|
|
{
|
|
color: silver;
|
|
}
|
|
|
|
.col_left
|
|
{
|
|
width: 30%;
|
|
float: left;
|
|
}
|
|
.col_right
|
|
{
|
|
width: 69%;
|
|
overflow: hidden;
|
|
}
|
|
.colitem
|
|
{
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
padding-top: 17px;
|
|
padding-bottom: 12px;
|
|
font-weight: bold;
|
|
text-transform: uppercase;
|
|
}
|
|
.colitem.passive
|
|
{
|
|
font-weight: normal;
|
|
text-transform: none;
|
|
}
|
|
.colitem a
|
|
{
|
|
text-decoration: none;
|
|
color: black;
|
|
}
|
|
.colitem a:hover
|
|
{
|
|
color: silver;
|
|
}
|
|
|
|
.formrow
|
|
{
|
|
/*height: 40px;*/
|
|
width: 100%;
|
|
}
|
|
|
|
/*Clearfix*/
|
|
.formrow:before,
|
|
.formrow:after {
|
|
content: " ";
|
|
display: table;
|
|
}
|
|
|
|
.formrow:after {
|
|
clear: both;
|
|
}
|
|
|
|
.formrow:not(:last-child)
|
|
{
|
|
border-bottom: 1px dotted #ccc;
|
|
}
|
|
|
|
.formitem
|
|
{
|
|
float: left;
|
|
padding-left: 8px;
|
|
padding-right: 8px;
|
|
padding-top: 13px;
|
|
padding-bottom: 8px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.formitem:first-child
|
|
{
|
|
font-weight: bold;
|
|
}
|
|
|
|
.formitem:not(:last-child)
|
|
{
|
|
border-right: 1px dotted #ccc;
|
|
}
|
|
|
|
.formitem.invisible_border
|
|
{
|
|
border: none;
|
|
}
|
|
|
|
/* Mostly for textareas */
|
|
.formitem:only-child
|
|
{
|
|
width: 97%;
|
|
}
|
|
.formitem textarea
|
|
{
|
|
width: 100%;
|
|
height: 100px;
|
|
}
|
|
.formitem:has-child()
|
|
{
|
|
margin: 0 auto;
|
|
float: none;
|
|
}
|
|
|
|
button
|
|
{
|
|
background: white;
|
|
border: 1px solid #8e8e8e;
|
|
}
|
|
|
|
/* Topics */
|
|
.topic_status
|
|
{
|
|
text-transform: none;
|
|
margin-left: 8px;
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
background-color: #E8E8E8; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */
|
|
color: #505050; /* 80,80,80 */
|
|
border-radius: 2px;
|
|
}
|
|
|
|
.topic_status:empty
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
.username
|
|
{
|
|
text-transform: none;
|
|
margin-left: 0px;
|
|
padding-left: 4px;
|
|
padding-right: 4px;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
color: #505050; /* 80,80,80 */
|
|
background-color: #FFFFFF;
|
|
border-style: dotted;
|
|
border-color: #505050; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */
|
|
border-width: 1px;
|
|
font-size: 15px;
|
|
}
|
|
button.username
|
|
{
|
|
position: relative;
|
|
top: -0.25px;
|
|
}
|
|
.tag-mini
|
|
{
|
|
text-transform: none;
|
|
margin-left: 0px;
|
|
padding-left: 3px;
|
|
padding-right: 3px;
|
|
padding-top: 1.5px;
|
|
padding-bottom: 0px;
|
|
color: #505050; /* 80,80,80 */
|
|
background-color: #FFFFFF;
|
|
border-style: dotted;
|
|
border-color: #505050; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */
|
|
border-width: 1px;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.show_on_edit
|
|
{
|
|
display: none;
|
|
}
|
|
|
|
.alert
|
|
{
|
|
display: block;
|
|
padding: 5px;
|
|
margin-bottom: 10px;
|
|
border: 1px solid #ccc;
|
|
}
|
|
.alert_success
|
|
{
|
|
display: block;
|
|
padding: 5px;
|
|
border: 1px solid A2FC00;
|
|
margin-bottom: 10px;
|
|
background-color: DAF7A6;
|
|
}
|
|
.alert_error
|
|
{
|
|
display: block;
|
|
padding: 5px;
|
|
border: 1px solid #FF004B;
|
|
margin-bottom: 8px;
|
|
background-color: #FEB7CC;
|
|
}
|
|
|
|
@media (max-width: 880px) {
|
|
li
|
|
{
|
|
height: 25px;
|
|
font-size: 15px;
|
|
padding-left: 7px;
|
|
}
|
|
ul { height: 26px; margin-top: 8px; }
|
|
.menu_left { padding-right: 7px; }
|
|
.menu_right { padding-right: 7px; }
|
|
body { padding-left: 4px; padding-right: 4px; margin: 0px !important; width: 100% !important; height: 100% !important; overflow-x: hidden; }
|
|
.container { width: auto; }
|
|
}
|
|
|
|
@media (max-width: 810px) {
|
|
li
|
|
{
|
|
font-weight: normal;
|
|
text-transform: none;
|
|
}
|
|
.rowitem
|
|
{
|
|
text-transform: none;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 620px) {
|
|
li
|
|
{
|
|
padding-left: 5px;
|
|
padding-top: 2px;
|
|
padding-bottom: 2px;
|
|
height: 23px;
|
|
}
|
|
ul { height: 24px; }
|
|
.menu_left { padding-right: 5px; }
|
|
.menu_right { padding-right: 5px; }
|
|
.menu_create_topic { display: none;}
|
|
.hide_on_mobile { display: none; }
|
|
}
|
|
|
|
@media (max-width: 470px) {
|
|
.menu_overview { display: none; }
|
|
.menu_profile { display: none; }
|
|
.hide_on_micro { display: none; }
|
|
.post_container {
|
|
overflow: visible !important;
|
|
}
|
|
.post_item {
|
|
background-position: 0px 2px !important;
|
|
background-size: 64px 64px !important;
|
|
padding-left: 2px !important;
|
|
min-height: 96px;
|
|
position: relative !important;
|
|
}
|
|
.post_item > .user_content {
|
|
margin-left: 75px !important;
|
|
width: 100% !important;
|
|
}
|
|
.post_item > .mod_button {
|
|
float: right !important;
|
|
margin-left: 2px !important;
|
|
position: relative;
|
|
top: -14px;
|
|
}
|
|
.post_item > .real_username {
|
|
position: absolute;
|
|
top: 70px;
|
|
float: left;
|
|
margin-top: 0px;
|
|
padding-top: 3px !important;
|
|
margin-right: 2px;
|
|
width: 60px;
|
|
font-size: 15px;
|
|
}
|
|
.container { width: 100% !important; }
|
|
} |