220 lines
6.4 KiB
CSS
220 lines
6.4 KiB
CSS
@media (min-width: 992px)and (max-width: 1199px) {
|
|
|
|
body{ border-top-color: #0F9;}
|
|
|
|
/* Global Containers
|
|
---------------------------------------- */
|
|
|
|
/* Add a small margin */
|
|
.body-layout-Boxed #wrap {
|
|
padding: 0 15px;
|
|
width: auto;
|
|
}
|
|
|
|
/* Sidebar Adjustments
|
|
----------------------------*/
|
|
|
|
/* Hide left sidebar on tiny screens */
|
|
#leftcolumn {
|
|
display: none;
|
|
}
|
|
|
|
/* Clear center column padding */
|
|
#contentcolumn {
|
|
padding-left: 0;
|
|
}
|
|
|
|
/* Expand center column to fill empty gap */
|
|
#contentcolumn {
|
|
margin-left: 0;
|
|
}
|
|
|
|
/* Grid Forumlist
|
|
---------------------------------------- */
|
|
|
|
/* Turn 3 columns into 2 */
|
|
.forumlist_grid li.row {
|
|
width: 50%;
|
|
}
|
|
|
|
/* Forumlist Colums
|
|
---------------------------------------- */
|
|
|
|
/* Remove the 'last post' column */
|
|
body.sidebar-both .forabg dd.lastpost,
|
|
body.sidebar-both .forumbg dd.lastpost,
|
|
body.sidebar-right-only .forabg dd.lastpost,
|
|
body.sidebar-right-only .forumbg dd.lastpost {
|
|
display: none;
|
|
}
|
|
|
|
/* Increase the other margins to account for the (now missing) 300px */
|
|
body.sidebar-both ul.topiclist.forums dt,
|
|
body.sidebar-right-only ul.topiclist.forums dt,
|
|
body.sidebar-both ul.topiclist.topics dt,
|
|
body.sidebar-right-only ul.topiclist.topics dt{
|
|
margin-right: -195px;
|
|
}
|
|
|
|
body.sidebar-both ul.topiclist dt .list-inner,
|
|
body.sidebar-right-only ul.topiclist dt .list-inner {
|
|
margin-right: 195px;
|
|
}
|
|
|
|
body.sidebar-both li.header dt,
|
|
body.sidebar-right-only li.header dt {
|
|
margin-right: -235px;
|
|
}
|
|
|
|
|
|
|
|
/* UCP Columns
|
|
---------------------------------------- */
|
|
|
|
/* For the UCP columns, we need to override this */
|
|
body.sidebar-both ul.topiclist.pmlist dt, body.sidebar-right-only ul.topiclist.pmlist dt {
|
|
margin-right: -95px;
|
|
}
|
|
|
|
/* Same again... */
|
|
body.sidebar-both ul.topiclist.pmlist dt .list-inner, body.sidebar-right-only ul.topiclist.pmlist dt .list-inner {
|
|
margin-right: 95px;
|
|
}
|
|
|
|
/* UCP Two long columns */
|
|
body.sidebar-both ul.two-long-columns dt .list-inner {
|
|
margin-right: 0;
|
|
}
|
|
body.sidebar-both ul.two-long-columns dd.lastpost {
|
|
display: none;
|
|
}
|
|
|
|
|
|
/* MCP Columns
|
|
---------------------------------------- */
|
|
|
|
/* Manually enabling the responsive layout. First, we remove the second column */
|
|
body.sidebar-both.body-layout-Boxed .missing-column dd,
|
|
body.sidebar-both.body-layout-Fluid .missing-column dd,
|
|
body.sidebar-right-only.body-layout-Boxed .missing-column dd,
|
|
body.sidebar-right-only.body-layout-Fluid .missing-column dd {
|
|
display: none;
|
|
}
|
|
|
|
/* But we still want the mark column, so re-enable that */
|
|
body.sidebar-both.body-layout-Boxed .missing-column dd.mark,
|
|
body.sidebar-both.body-layout-Fluid .missing-column dd.mark,
|
|
body.sidebar-right-only.body-layout-Boxed .missing-column dd.mark,
|
|
body.sidebar-right-only.body-layout-Fluid .missing-column dd.mark {
|
|
display: block;
|
|
}
|
|
|
|
/* Reduce the left column margin to 95px, just enough for the mark box */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt,
|
|
body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt {
|
|
margin-right: -95px;
|
|
}
|
|
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column dt .list-inner,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column dt .list-inner,
|
|
body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column dt .list-inner,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column dt .list-inner {
|
|
margin-right: 95px;
|
|
}
|
|
|
|
/* Then enable the extra info below */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column .responsive-show,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column .responsive-show,
|
|
body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column .responsive-show,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column .responsive-show {
|
|
display: block !important;
|
|
}
|
|
|
|
/* Hacky bookmark fix */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.missing-column li.header dt,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.missing-column li.header dt,
|
|
body.sidebar-right-only.body-layout-Boxed ul.topiclist.missing-column li.header dt,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.missing-column li.header dt {
|
|
margin-right: -125px; /* 95px + 30px padding */
|
|
}
|
|
|
|
|
|
/* Manually enabling the responsive layout. First, we remove the second column header */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dd,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dd,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dd {
|
|
display: none;
|
|
}
|
|
|
|
/* Increase the left column width to 100% */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns dt,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns dt,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns dt .list-inner {
|
|
margin-right: 0;
|
|
}
|
|
|
|
/* Then enable the extra info below */
|
|
body.sidebar-both.body-layout-Boxed ul.topiclist.two-long-columns .responsive-show,
|
|
body.sidebar-both.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show,
|
|
body.sidebar-right-only.body-layout-Fluid ul.topiclist.two-long-columns .responsive-show {
|
|
display: block !important;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* Custom Login Page
|
|
---------------------------------------- */
|
|
|
|
/* Clear the veritcal alignment. Make it wider for larger screens */
|
|
.login_container {
|
|
width: 900px;
|
|
}
|
|
|
|
/* For ACP Auth (and login_body.html...probably), reduce container width to 450px */
|
|
.auth-page-admin .login_container {
|
|
width: 450px;
|
|
}
|
|
|
|
/* Split the columns down */
|
|
.login_container_left, .login_container_right {
|
|
width: 50%;
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* Min height for left column content, so that it's taller than the registration box */
|
|
.login_container_left_section_content {
|
|
min-height: 400px;
|
|
}
|
|
|
|
/* For ACP Auth (and login_body.html...probably), remove min-height */
|
|
.auth-page-admin .login_container_left_section_content {
|
|
min-height: 0;
|
|
}
|
|
|
|
/* Subforums in column
|
|
---------------------------------------- */
|
|
ul.sub-list {
|
|
width: 100%;
|
|
}
|
|
|
|
/* responsive logo
|
|
---------------------------------------- */
|
|
|
|
/* override the dynamic inline width so that we can relatively resize logo below */
|
|
#site-description {
|
|
width: 100% !important;
|
|
}
|
|
|
|
#site-description img {
|
|
max-width: 85%;
|
|
}
|
|
|
|
|
|
|
|
} |