e47450d372
You can now switch between themes in the Control Panel. The Alternate Post Layout teased in various screenshots and bits of inaccessible code is now the Tempra Conflux theme, while the original post layout is the Tempa Simple theme. Dramatically increased the speed at which the static files are served. Added a benchmark for static files. Eliminated the name parameter in various custom page structs. Added the TopicsPage struct for the /topics/ route. Added the ForumPage struct for the /forum/{id} route. Added the ForumsPage struct for the /forums/ route. The static file route now serves 404s when a file doesn't exist instead of nearly crashing the server. Reduced the number of unnecessary allocations on some of the routes. Added gradients to Tempra Conflux. Added position: sticky; to the userinfo blocks in Tempra Conflux. Added a notice on the generated template files.
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; }
|
|
} |