From fda17bc450a93400ebd070ff358b2b19a936ecae Mon Sep 17 00:00:00 2001 From: "konstantina.galouni" Date: Wed, 12 Jul 2023 17:22:45 +0300 Subject: [PATCH 1/3] [Library & common-assets | develop]: [WIP] dataProvider.component.html & project.component.html & resultLanding.component.html: Removed "uk-card uk-card-secondary" classes from metrics box and commented badge icon | metrics-badge.svg: Changed badge color to white (used to be orange - Explore specific) | landing.less: Updated class ".landing-metrics-card" to use background-blend-mode: color-dodge for svgs in landing metrics box. --- less/landing.less | 17 +++++++++++++---- metrics-badge.svg | 4 ++-- 2 files changed, 15 insertions(+), 6 deletions(-) diff --git a/less/landing.less b/less/landing.less index 130daeb..540c81f 100644 --- a/less/landing.less +++ b/less/landing.less @@ -54,6 +54,9 @@ @landing-action-bar-border-radius: @global-small-border-radius; @landing-metrics-grip-gap: 80px; +@landing-metrics-color: @global-inverse-color; +@landing-metrics-background-color: @secondary-color; +@landing-metrics-background-svg: ' '; .landing { #landing-center-content { @@ -205,10 +208,16 @@ grid-gap: @landing-metrics-grip-gap; } - .landing-metrics-card { - background-image: url("../metrics-bg.svg"); - background-repeat: no-repeat; - background-size: cover; + .landing-metrics-card:extend(.uk-card) { + background-repeat: no-repeat, no-repeat; + @svg: escape(replace(@landing-metrics-background-svg, "@landing-metrics-background-color", @landing-metrics-background-color)); + background-image: url("../metrics-badge.svg"), url("data: image/svg+xml, @{svg}"); + background-position: bottom right, center; + background-blend-mode: color-dodge; + background-size: auto, cover; + background-color: unset; + + color: @landing-metrics-color; } // rules for overriding styles of altmetrics embedded library diff --git a/metrics-badge.svg b/metrics-badge.svg index 067b2a0..906e447 100644 --- a/metrics-badge.svg +++ b/metrics-badge.svg @@ -1,8 +1,8 @@ - - + + From 2fd57843f85125e54adfb95b35776755037ea359 Mon Sep 17 00:00:00 2001 From: "k.triantafyllou" Date: Wed, 12 Jul 2023 18:27:41 +0300 Subject: [PATCH 2/3] Landing: Update metrics box in order to have always light mode and fix position of metrics icon. --- less/landing.less | 9 +++------ 1 file changed, 3 insertions(+), 6 deletions(-) diff --git a/less/landing.less b/less/landing.less index 540c81f..f52031a 100644 --- a/less/landing.less +++ b/less/landing.less @@ -54,8 +54,7 @@ @landing-action-bar-border-radius: @global-small-border-radius; @landing-metrics-grip-gap: 80px; -@landing-metrics-color: @global-inverse-color; -@landing-metrics-background-color: @secondary-color; +@landing-metrics-background-color: @global-secondary-background; @landing-metrics-background-svg: ' '; .landing { @@ -208,16 +207,14 @@ grid-gap: @landing-metrics-grip-gap; } - .landing-metrics-card:extend(.uk-card) { + .landing-metrics-card:extend(.uk-card):extend(.uk-card-secondary all) { background-repeat: no-repeat, no-repeat; @svg: escape(replace(@landing-metrics-background-svg, "@landing-metrics-background-color", @landing-metrics-background-color)); background-image: url("../metrics-badge.svg"), url("data: image/svg+xml, @{svg}"); - background-position: bottom right, center; + background-position: calc(100% - @card-body-padding-vertical) calc(100% - @card-body-padding-horizontal), center; background-blend-mode: color-dodge; background-size: auto, cover; background-color: unset; - - color: @landing-metrics-color; } // rules for overriding styles of altmetrics embedded library From d18e0a7e43e5ab74649481ecbf352ba49893c66f Mon Sep 17 00:00:00 2001 From: "konstantina.galouni" Date: Mon, 21 Aug 2023 13:59:20 +0300 Subject: [PATCH 3/3] [Library & common-assets | develop]: Minor updates in mobile screens in icons/ paddings in landing pages. 1. resultLanding.component.html & project.component.html & dataProvider.component.html & organization.component.html: In mobile (small) screens, change ratio of icons in bottom action bar from 2 to 1.4. 2. showIdentifiers.component.ts: In mobile (small) screens, added in fs-modal classTitle="uk-tile-default uk-border-bottom". 3. landing.less: Added variable @landing-action-bar-mobile-border: @global-border; to use it in border-top of landing-action-bar-mobile > div | Changed padding of landing-action-bar-mobile > div to 8px in top and bottom. --- less/landing.less | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/less/landing.less b/less/landing.less index f52031a..3d8cfd3 100644 --- a/less/landing.less +++ b/less/landing.less @@ -57,6 +57,8 @@ @landing-metrics-background-color: @global-secondary-background; @landing-metrics-background-svg: ' '; +@landing-action-bar-mobile-border: @global-border; + .landing { #landing-center-content { min-height: @landing-sidebar-height; @@ -198,8 +200,8 @@ z-index: @global-z-index - 20; & > div { - padding: 10px 20px; - border-top: @landing-action-bar-border-width solid lightgrey; + padding: 8px 20px; + border-top: @landing-action-bar-border-width solid @landing-action-bar-mobile-border; } }