Standardize font sizes and heading tags (<h1>-<h6>) to be more consistent across the site. Changes: * Introduce font size CSS variables and start replacing hardcoded font sizes with standard sizes. * Change header tags to use only one <h1> per page. One <h1> per page is recommended for SEO purposes. Usually this is for the page title, like in forum threads or wiki pages. * Standardize on <h2> for section headers in sidebars and <h3> for smaller subsection headers. Don't use <h4>-<h6>. * In DText, make h1-h4 headers all the same size. Standard wiki style is to ignore h1-h3 and start at h4. * In DText, make h4-h6 the same size as the h1-h3 tags outside of DText. * In the tag list, change the <h1> and <h2> tag category headers to <h3>. * Make usernames in comments and forum posts smaller. Also change the <h4> tag for the commenter name to <div class="author-name">. * Make the tag list, paginator, and nav menu smaller on mobile. * Change h1#app-name-header to a#app-name-header.
64 lines
853 B
SCSS
64 lines
853 B
SCSS
@import "../base/000_vars.scss";
|
|
|
|
div#page {
|
|
overflow: visible;
|
|
margin: 0 20px;
|
|
padding: 0 10px;
|
|
|
|
aside#sidebar {
|
|
#options-box i.fa-bookmark {
|
|
margin-right: 0.25em;
|
|
}
|
|
}
|
|
|
|
aside#sidebar > section {
|
|
margin-bottom: 1em;
|
|
}
|
|
|
|
section#content {
|
|
overflow: visible;
|
|
}
|
|
}
|
|
|
|
footer#page-footer {
|
|
width: 100%;
|
|
margin-top: 1em;
|
|
text-align: center;
|
|
padding: 1em 0 1em;
|
|
border-top: var(--footer-border);
|
|
|
|
.social-icon img {
|
|
vertical-align: bottom;
|
|
margin: 0 0.1em;
|
|
height: 16px;
|
|
}
|
|
}
|
|
|
|
.sidebar-container {
|
|
display: flex;
|
|
|
|
#sidebar {
|
|
flex: 0;
|
|
min-width: 20em;
|
|
}
|
|
|
|
#content {
|
|
flex: 1;
|
|
padding-left: 1em;
|
|
min-width: 0;
|
|
}
|
|
|
|
@media (max-width: 660px) {
|
|
flex-direction: column;
|
|
|
|
#content {
|
|
order: 1;
|
|
padding: 0;
|
|
}
|
|
|
|
#sidebar {
|
|
order: 2;
|
|
}
|
|
}
|
|
}
|