Move some classes from landing to general

This commit is contained in:
Konstantinos Triantafyllou 2023-02-17 19:20:39 +02:00
parent 68fe02948c
commit a83c675f25
2 changed files with 105 additions and 101 deletions

View File

@ -18,6 +18,9 @@
@general-search-form-background-image: none; @general-search-form-background-image: none;
@general-search-form-background-position: center bottom; @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-tab-featured-tab: @global-primary-background;
@general-number-card-border-width: 6px; @general-number-card-border-width: 6px;
@ -42,6 +45,15 @@ main {
max-width: 500px; max-width: 500px;
} }
/* Special characters */
.bullet:before {
content: '\2022';
}
.space:before {
content: '\00A0';
}
/* Visually hidden (for icons) */ /* Visually hidden (for icons) */
.visually-hidden { .visually-hidden {
border: 0 !important; border: 0 !important;
@ -56,12 +68,8 @@ main {
white-space: nowrap !important; 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) { .metrics-number:extend(.uk-text-background) {
background-image: @usage-counts-number-gradient; background-image: @usage-counts-number-gradient;
} }
/* Number */ /* Number */
@ -158,7 +166,7 @@ noscript, ol, section, table, tfoot, ul, video;
} }
each(@lines, { each(@lines, {
&.lines-@{value} > *{ &.lines-@{value} > * {
-webkit-line-clamp: @value; -webkit-line-clamp: @value;
} }
}); });
@ -190,7 +198,7 @@ noscript, ol, section, table, tfoot, ul, video;
/* Search Form */ /* Search Form */
.search-form, .generalSearchForm { .search-form, .generalSearchForm {
background-color: @general-search-form-background; 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; 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 { .uk-tab {
& > li.uk-active > a.featuredTab, & > * > a.featuredTab { & > li.uk-active > a.featuredTab, & > * > a.featuredTab {
color: @general-tab-featured-tab !important; 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 */ /* Social buttons */
.twitter { .twitter {
&, &:hover { &, &:hover {

View File

@ -41,12 +41,6 @@
@landing-tab-color-active: @landing-portal-color; @landing-tab-color-active: @landing-portal-color;
@landing-tab-border-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-radius: @global-border-radius;
@landing-card-tab-border-width: 5px; @landing-card-tab-border-width: 5px;
@ -60,9 +54,9 @@
@landing-metrics-grip-gap: 80px; @landing-metrics-grip-gap: 80px;
.landing { .landing {
#landing-center-content { #landing-center-content {
min-height: @landing-sidebar-height; min-height: @landing-sidebar-height;
} }
#landing-left-sidebar { #landing-left-sidebar {
width: @landing-left-sidebar-width; width: @landing-left-sidebar-width;
@ -170,101 +164,68 @@
z-index: @landing-z-index + 1; 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 { .card-tab {
border-radius: @landing-card-tab-border-radius; border-radius: @landing-card-tab-border-radius;
border-left: @landing-card-tab-border-width solid @landing-section-separator; border-left: @landing-card-tab-border-width solid @landing-section-separator;
} }
.landing-action-bar { .landing-action-bar {
padding: @landing-action-bar-padding; padding: @landing-action-bar-padding;
border-radius: @landing-action-bar-border-radius; border-radius: @landing-action-bar-border-radius;
border: @landing-portal-color solid @landing-action-bar-border-width; 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-divider { .landing-action-bar-grid-gap {
background: @disable-color; grid-gap: @landing-action-bar-grid-gap;
width: @landing-action-bar-divider-width; }
height: @landing-action-bar-divider-height; }
}
// TODO: when we get there .landing-action-bar-divider {
.landing-action-bar-mobile { background: @disable-color;
position: fixed; width: @landing-action-bar-divider-width;
bottom: 0; height: @landing-action-bar-divider-height;
left: 0; }
right: 0;
z-index: @global-z-index - 20;
& > div {
padding: 10px 20px;
border-top: @landing-action-bar-border-width solid lightgrey;
}
}
// ----------------------
.download-drop { // TODO: when we get there
width: unset; .landing-action-bar-mobile {
.download-drop-item { position: fixed;
padding: 10px 20px; bottom: 0;
margin: 0 4px; left: 0;
border-radius: @landing-download-from-border-radius; right: 0;
&:hover { z-index: @global-z-index - 20;
background: @landing-download-from-background-color;
}
}
}
.landing-metrics-overview { & > div {
grid-gap: @landing-metrics-grip-gap; padding: 10px 20px;
} border-top: @landing-action-bar-border-width solid lightgrey;
.landing-metrics-card { }
background-image: url("../metrics-bg.svg"); }
background-repeat: no-repeat;
background-size: cover;
}
// To be moved? .landing-metrics-overview {
.open-access { grid-gap: @landing-metrics-grip-gap;
color: @open-access-color; }
}
.bip-icon {
color: @bip-color;
}
.landing-metrics-card {
background-image: url("../metrics-bg.svg");
background-repeat: no-repeat;
background-size: cover;
}
// rules for overriding styles of altmetrics embedded library // rules for overriding styles of altmetrics embedded library
.altmetric-embed { .altmetric-embed {
position: relative !important; position: relative !important;
z-index: 1 !important; z-index: 1 !important;
} }
.altmetric-normal-legend {
margin: 0 40px 0 0 !important; .altmetric-normal-legend {
.altmetric-see-more-details { margin: 0 40px 0 0 !important;
display: none !important;
} .altmetric-see-more-details {
} display: none !important;
.altmetric-popover-content { }
background-color: unset !important; }
font-size: unset !important;
font-family: unset !important; .altmetric-popover-content {
} background-color: unset !important;
font-size: unset !important;
font-family: unset !important;
}
} }