CHIEFSOFT\ameye
183 lines
3.1 KiB
Plaintext
183 lines
3.1 KiB
Plaintext
/**
|
|
* @file plugins/themes/default/styles/body.less
|
|
*
|
|
* Copyright (c) 2014-2021 Simon Fraser University
|
|
* Copyright (c) 2003-2021 John Willinsky
|
|
* Distributed under the GNU GPL v3. For full terms see the file docs/COPYING.
|
|
*
|
|
* @brief Classes for site-wide elements and layout scaffolding
|
|
*/
|
|
|
|
html,
|
|
body {
|
|
font-family: @font;
|
|
font-size: @rem;
|
|
line-height: @line-base;
|
|
color: @text;
|
|
background: @bg;
|
|
}
|
|
|
|
a {
|
|
color: @primary;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
color: @primary-lift;
|
|
}
|
|
}
|
|
|
|
|
|
// Page container widths
|
|
.pkp_site_name_wrapper,
|
|
.pkp_navigation_primary_wrapper,
|
|
.pkp_navigation_user,
|
|
.pkp_search_mobile,
|
|
.pkp_structure_content,
|
|
.pkp_structure_footer {
|
|
.pkp_helpers_clear;
|
|
position: relative;
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
padding-left: @base;
|
|
padding-right: @base;
|
|
|
|
@media( min-width: @screen-tablet ) {
|
|
width: @screen-tablet-container;
|
|
padding: 0;
|
|
}
|
|
|
|
@media( min-width: @screen-desktop ) {
|
|
width: @screen-desktop-container;
|
|
}
|
|
|
|
@media( min-width: @screen-lg-desktop ) {
|
|
width: @screen-lg-desktop-container;
|
|
}
|
|
}
|
|
|
|
.has_site_logo {
|
|
|
|
.pkp_site_name,
|
|
.pkp_navigation_primary_wrapper {
|
|
width: auto;
|
|
}
|
|
|
|
.pkp_head_wrapper {
|
|
.pkp_helpers_clear;
|
|
position: relative;
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
padding-right: @base;
|
|
|
|
@media( min-width: @screen-tablet ) {
|
|
width: @screen-tablet-container;
|
|
padding-left: 0;
|
|
padding-right: 0;
|
|
}
|
|
|
|
@media( min-width: @screen-desktop ) {
|
|
width: @screen-desktop-container;
|
|
}
|
|
|
|
@media( min-width: @screen-lg-desktop ) {
|
|
width: @screen-lg-desktop-container;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Layout scaffold for content and sidebars
|
|
.pkp_structure_main {
|
|
padding: @base;
|
|
}
|
|
|
|
@media( min-width: @screen-phone ) {
|
|
|
|
.pkp_structure_main {
|
|
padding: @double;
|
|
}
|
|
}
|
|
|
|
@media( min-width: @screen-tablet ) {
|
|
|
|
// Full-height borders wrapping primary content column
|
|
.pkp_structure_main {
|
|
|
|
&:before,
|
|
&:after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
bottom: 0;
|
|
width: 1px;
|
|
background: @bg-border-color;
|
|
}
|
|
|
|
&:after {
|
|
left: @screen-tablet-container;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media( min-width: @screen-desktop ) {
|
|
|
|
.pkp_structure_content {
|
|
padding-top: @triple;
|
|
}
|
|
|
|
.pkp_structure_sidebar {
|
|
float: right;
|
|
width: @sidebar-width;
|
|
}
|
|
|
|
.pkp_structure_main {
|
|
float: left;
|
|
padding: 0 @triple (@triple * 3);
|
|
width: @screen-desktop-container - @sidebar-width;
|
|
|
|
&:after {
|
|
left: @screen-desktop-container - @sidebar-width;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media( min-width: @screen-lg-desktop ) {
|
|
|
|
.pkp_structure_main {
|
|
width: @screen-lg-desktop-container - @sidebar-width;
|
|
|
|
&:after {
|
|
left: @screen-lg-desktop-container - @sidebar-width;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Center the content panel when no sidebar is present
|
|
.pkp_structure_main:first-child:last-child {
|
|
|
|
@media(min-width: @screen-desktop) {
|
|
float: none;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
margin-top: @quadruple;
|
|
|
|
// Aligns the left and right borders
|
|
@no-sidebar-margins: @sidebar-width / 2;
|
|
&:before {
|
|
left: @no-sidebar-margins;
|
|
}
|
|
|
|
&:after {
|
|
left: auto;
|
|
right: @no-sidebar-margins;
|
|
}
|
|
}
|
|
}
|
|
|
|
// Lock in images so they don't run outside their container
|
|
img {
|
|
max-width: 100%;
|
|
width: auto;
|
|
height: auto;
|
|
}
|