Move some classes from landing to general
This commit is contained in:
parent
68fe02948c
commit
a83c675f25
|
@ -18,6 +18,9 @@
|
|||
@general-search-form-background-image: none;
|
||||
@general-search-form-background-position: center bottom;
|
||||
|
||||
@general-download-from-border-radius: @global-border-radius;
|
||||
@general-download-from-background-color: @ciel-color;
|
||||
|
||||
@general-tab-featured-tab: @global-primary-background;
|
||||
|
||||
@general-number-card-border-width: 6px;
|
||||
|
@ -42,6 +45,15 @@ main {
|
|||
max-width: 500px;
|
||||
}
|
||||
|
||||
/* Special characters */
|
||||
.bullet:before {
|
||||
content: '\2022';
|
||||
}
|
||||
|
||||
.space:before {
|
||||
content: '\00A0';
|
||||
}
|
||||
|
||||
/* Visually hidden (for icons) */
|
||||
.visually-hidden {
|
||||
border: 0 !important;
|
||||
|
@ -56,12 +68,8 @@ main {
|
|||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
/* UsageCounts gradient color */
|
||||
.text-usage-counts:extend(.uk-text-background) {
|
||||
background-image: @usage-counts-icon-gradient;
|
||||
}
|
||||
.metrics-number:extend(.uk-text-background) {
|
||||
background-image: @usage-counts-number-gradient;
|
||||
background-image: @usage-counts-number-gradient;
|
||||
}
|
||||
|
||||
/* Number */
|
||||
|
@ -158,7 +166,7 @@ noscript, ol, section, table, tfoot, ul, video;
|
|||
}
|
||||
|
||||
each(@lines, {
|
||||
&.lines-@{value} > *{
|
||||
&.lines-@{value} > * {
|
||||
-webkit-line-clamp: @value;
|
||||
}
|
||||
});
|
||||
|
@ -190,7 +198,7 @@ noscript, ol, section, table, tfoot, ul, video;
|
|||
/* Search Form */
|
||||
.search-form, .generalSearchForm {
|
||||
background-color: @general-search-form-background;
|
||||
background-image: @general-search-form-background-image;
|
||||
background-image: @general-search-form-background-image;
|
||||
background-position: @general-search-form-background-position;
|
||||
}
|
||||
|
||||
|
@ -206,6 +214,22 @@ noscript, ol, section, table, tfoot, ul, video;
|
|||
}
|
||||
}
|
||||
|
||||
/* Download drop */
|
||||
|
||||
.download-drop {
|
||||
width: unset;
|
||||
|
||||
.download-drop-item {
|
||||
padding: 10px 20px;
|
||||
margin: 0 4px;
|
||||
border-radius: @general-download-from-border-radius;
|
||||
|
||||
&:hover {
|
||||
background: @general-download-from-background-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.uk-tab {
|
||||
& > li.uk-active > a.featuredTab, & > * > a.featuredTab {
|
||||
color: @general-tab-featured-tab !important;
|
||||
|
@ -246,6 +270,25 @@ noscript, ol, section, table, tfoot, ul, video;
|
|||
}
|
||||
}
|
||||
|
||||
/* General Icons */
|
||||
.open-access {
|
||||
color: @open-access-color;
|
||||
}
|
||||
|
||||
.closed-access {
|
||||
color: @close-access-color;
|
||||
}
|
||||
|
||||
.text-usage-counts:extend(.uk-text-background),
|
||||
a:hover .text-usage-counts-hover:extend(.uk-text-background) {
|
||||
background-image: @usage-counts-icon-gradient;
|
||||
}
|
||||
|
||||
.bip-icon, a:hover .bip-icon-hover {
|
||||
color: @bip-color;
|
||||
}
|
||||
|
||||
|
||||
/* Social buttons */
|
||||
.twitter {
|
||||
&, &:hover {
|
||||
|
|
|
@ -41,12 +41,6 @@
|
|||
@landing-tab-color-active: @landing-portal-color;
|
||||
@landing-tab-border-active: @landing-portal-color;
|
||||
|
||||
@landing-download-from-background: @global-background;
|
||||
@landing-download-from-border-width: @global-border-width;
|
||||
@landing-download-from-border: @global-border;
|
||||
@landing-download-from-border-radius: @global-border-radius;
|
||||
@landing-download-from-background-color: @ciel-color;
|
||||
|
||||
@landing-card-tab-border-radius: @global-border-radius;
|
||||
@landing-card-tab-border-width: 5px;
|
||||
|
||||
|
@ -60,9 +54,9 @@
|
|||
@landing-metrics-grip-gap: 80px;
|
||||
|
||||
.landing {
|
||||
#landing-center-content {
|
||||
min-height: @landing-sidebar-height;
|
||||
}
|
||||
#landing-center-content {
|
||||
min-height: @landing-sidebar-height;
|
||||
}
|
||||
|
||||
#landing-left-sidebar {
|
||||
width: @landing-left-sidebar-width;
|
||||
|
@ -170,101 +164,68 @@
|
|||
z-index: @landing-z-index + 1;
|
||||
}
|
||||
|
||||
.download-from > * {
|
||||
background-color: @landing-download-from-background;
|
||||
border: @landing-download-from-border-width solid @landing-download-from-border;
|
||||
border-radius: @landing-download-from-border-radius;
|
||||
}
|
||||
|
||||
.card-tab {
|
||||
border-radius: @landing-card-tab-border-radius;
|
||||
border-left: @landing-card-tab-border-width solid @landing-section-separator;
|
||||
}
|
||||
|
||||
.landing-action-bar {
|
||||
padding: @landing-action-bar-padding;
|
||||
border-radius: @landing-action-bar-border-radius;
|
||||
border: @landing-portal-color solid @landing-action-bar-border-width;
|
||||
.landing-action-bar-grid-gap {
|
||||
grid-gap: @landing-action-bar-grid-gap;
|
||||
}
|
||||
.landing-action-button-orcid {
|
||||
icon {
|
||||
color: @landing-action-button-orcid-color;
|
||||
}
|
||||
&.uk-disabled {
|
||||
color: @landing-action-button-orcid-disabled-color;
|
||||
icon {
|
||||
color: @landing-action-button-orcid-disabled-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.landing-action-bar {
|
||||
padding: @landing-action-bar-padding;
|
||||
border-radius: @landing-action-bar-border-radius;
|
||||
border: @landing-portal-color solid @landing-action-bar-border-width;
|
||||
|
||||
.landing-action-bar-divider {
|
||||
background: @disable-color;
|
||||
width: @landing-action-bar-divider-width;
|
||||
height: @landing-action-bar-divider-height;
|
||||
}
|
||||
.landing-action-bar-grid-gap {
|
||||
grid-gap: @landing-action-bar-grid-gap;
|
||||
}
|
||||
}
|
||||
|
||||
// TODO: when we get there
|
||||
.landing-action-bar-mobile {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: @global-z-index - 20;
|
||||
& > div {
|
||||
padding: 10px 20px;
|
||||
border-top: @landing-action-bar-border-width solid lightgrey;
|
||||
}
|
||||
}
|
||||
// ----------------------
|
||||
.landing-action-bar-divider {
|
||||
background: @disable-color;
|
||||
width: @landing-action-bar-divider-width;
|
||||
height: @landing-action-bar-divider-height;
|
||||
}
|
||||
|
||||
.download-drop {
|
||||
width: unset;
|
||||
.download-drop-item {
|
||||
padding: 10px 20px;
|
||||
margin: 0 4px;
|
||||
border-radius: @landing-download-from-border-radius;
|
||||
&:hover {
|
||||
background: @landing-download-from-background-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
// TODO: when we get there
|
||||
.landing-action-bar-mobile {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: @global-z-index - 20;
|
||||
|
||||
.landing-metrics-overview {
|
||||
grid-gap: @landing-metrics-grip-gap;
|
||||
}
|
||||
.landing-metrics-card {
|
||||
background-image: url("../metrics-bg.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
& > div {
|
||||
padding: 10px 20px;
|
||||
border-top: @landing-action-bar-border-width solid lightgrey;
|
||||
}
|
||||
}
|
||||
|
||||
// To be moved?
|
||||
.open-access {
|
||||
color: @open-access-color;
|
||||
}
|
||||
.bip-icon {
|
||||
color: @bip-color;
|
||||
}
|
||||
.landing-metrics-overview {
|
||||
grid-gap: @landing-metrics-grip-gap;
|
||||
}
|
||||
|
||||
.landing-metrics-card {
|
||||
background-image: url("../metrics-bg.svg");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
// rules for overriding styles of altmetrics embedded library
|
||||
.altmetric-embed {
|
||||
position: relative !important;
|
||||
z-index: 1 !important;
|
||||
}
|
||||
.altmetric-normal-legend {
|
||||
margin: 0 40px 0 0 !important;
|
||||
.altmetric-see-more-details {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
.altmetric-popover-content {
|
||||
background-color: unset !important;
|
||||
font-size: unset !important;
|
||||
font-family: unset !important;
|
||||
}
|
||||
// rules for overriding styles of altmetrics embedded library
|
||||
.altmetric-embed {
|
||||
position: relative !important;
|
||||
z-index: 1 !important;
|
||||
}
|
||||
|
||||
.altmetric-normal-legend {
|
||||
margin: 0 40px 0 0 !important;
|
||||
|
||||
.altmetric-see-more-details {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.altmetric-popover-content {
|
||||
background-color: unset !important;
|
||||
font-size: unset !important;
|
||||
font-family: unset !important;
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue