/**
* @file styles/objects/article_details.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 Styles applying to a view of an article with all details
* @link templates/frontend/objects/article_details.tpl
*/
.obj_article_details {
> .page_title {
margin: 0;
}
> .subtitle {
margin: 0;
font-size: @font-base;
line-height: @line-lead;
font-weight: @normal;
}
.row {
margin-top: @triple;
}
.item {
padding-top: @double;
padding-bottom: @double;
> *:first-child {
margin-top: 0;
}
> *:last-child {
margin-bottom: 0;
}
> h2 + p {
margin-top: 0;
}
}
.sub_item {
margin-bottom: @double;
&:last-child {
margin-bottom: 0;
}
}
.main_entry {
.item {
.label {
margin: 0 0 @double;
font-family: @font-heading;
font-size: @font-bump;
font-weight: @bold;
}
&.doi .label,
&.keywords .label {
display: inline;
font-size: @font-base;
}
}
.sub_item {
.label {
font-size: @font-base;
}
}
}
.authors {
&:extend(.pkp_unstyled_list);
li {
margin-bottom: @base;
}
.name {
font-weight: bold;
display: block;
}
.userGroup {
display: block;
}
.orcid {
display: block;
font-size: @font-sml;
line-height: @double;
a {
vertical-align: middle;
}
}
.orcid_icon {
width: @double;
height: @double;
}
.affiliation {
font-size: @font-sml;
color: @text-light;
}
}
.author_bios {
.sub_item {
.label {
margin-bottom: 0;
}
.value > p:first-child {
margin-top: 0;
}
}
}
.item.doi,
.item.keywords {
padding-top: 0;
}
.galleys_links {
&:extend(.pkp_unstyled_list);
display: flex;
flex-flow: row nowrap;
justify-content: start;
li {
margin-inline-end: 1rem;
}
}
.supplementary_galleys_links {
&:extend(.pkp_unstyled_list);
margin-top: @base;
}
.copyright {
font-size: @font-sml;
line-height: @line-sml;
a[rel="license"] + p {
margin-top: 0;
}
}
.entry_details {
margin-left: -@double;
margin-right: -@double;
border-top: @bg-border;
.item {
padding: @double;
border-bottom: @bg-border;
word-wrap: break-word;
&:last-child {
border-bottom: none;
}
.label {
margin: 0;
font-family: @font-heading;
font-size: @font-sml;
font-weight: @normal;
color: @text-light;
}
}
}
.categories {
.pkp_unstyled_list;
}
.versions ul {
margin: 0;
padding: 0;
list-style: none;
}
.citation_display {
.value {
font-size: @font-sml;
}
// Hide the bibliography number produced by some CSL styles
.csl-left-margin {
display: none;
}
[aria-hidden="true"] {
display: none;
}
.citation_formats {
margin-top: 1em;
border: @form-border;
border-radius: @radius;
}
.citation_formats_button {
position: relative;
background: transparent;
border: none;
border-bottom-left-radius: 0;
border-bottom-right-radius: 0;
box-shadow: none;
padding: 0 1em;
width: 100%;
font-family: @font-heading;
font-weight: @normal;
color: @text-light;
text-align: left;
&:after {
.fa();
content: @fa-var-caret-down;
position: absolute;
top: 50%;
right: 1em;
transform: translateY(-50%);
}
&[aria-expanded="true"] {
&:after {
content: @fa-var-caret-up;
}
}
&:focus {
background: @bg-shade;
outline: 0;
}
}
.citation_formats_styles {
.pkp_unstyled_list;
a {
display: block;
padding: 0.5em 1em;
border-bottom: @bg-border;
text-decoration: none;
&:focus {
background: @bg-shade;
outline: 0;
}
}
li:last-child a {
border-bottom: none;
}
}
.citation_formats_list .label {
padding: 1em 1em 0.25em 1em;
}
.citation_formats_styles + .label {
border-top: @bg-border;
}
span {
margin-right: 0.5em;
}
}
@media(min-width: @screen-phone) {
.entry_details {
margin-left: -@triple;
margin-right: -@triple;
}
}
@media(min-width: @screen-tablet) {
.row {
margin-left: -@double;
margin-right: -@double;
border-top: @bg-border;
border-bottom: @bg-border;
}
.main_entry {
float: left;
width: @screen-tablet-container - @sidebar-width;
border-right: @bg-border;
}
.item {
padding: @double;
.label {
margin: 0 0 @double;
font-family: @font-heading;
font-size: @font-bump;
font-weight: @bold;
}
&.doi .label,
&.keywords .label {
display: inline;
font-size: @font-base;
}
}
.entry_details {
float: left;
width: @sidebar-width;
margin: 0 0 0 -1px; // border overlap with main content
border-top: none;
border-left: @bg-border;
.item {
margin-right: -1px; // border reach out to edge
border-bottom: @bg-border;
&:last-child {
border-bottom: none;
}
}
}
}
@media(min-width: @screen-desktop) {
.row {
margin-left: -@triple;
margin-right: -@triple;
}
.main_entry {
width: @screen-desktop-container - (@sidebar-width * 2);
}
.item {
padding: @triple;
}
}
@media(min-width: @screen-lg-desktop) {
.main_entry {
width: @screen-lg-desktop-container - (@sidebar-width * 2);
}
}
}
|