From 66822d929b48c93e44acb2c73a542417549335ac Mon Sep 17 00:00:00 2001 From: Armand Philippot Date: Tue, 1 Feb 2022 23:26:27 +0100 Subject: chore: move pagination cursor title in a separate div The progress bar will be clearer for everyone if the information about the number of loaded articles is printed without hovering the progress bar. --- src/components/PaginationCursor/PaginationCursor.module.scss | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) (limited to 'src/components/PaginationCursor/PaginationCursor.module.scss') diff --git a/src/components/PaginationCursor/PaginationCursor.module.scss b/src/components/PaginationCursor/PaginationCursor.module.scss index 17e46ac..542584c 100644 --- a/src/components/PaginationCursor/PaginationCursor.module.scss +++ b/src/components/PaginationCursor/PaginationCursor.module.scss @@ -1,12 +1,14 @@ @use "@styles/abstracts/functions" as fun; .wrapper { - margin: var(--spacing-sm) auto var(--spacing-md); width: max-content; + margin: var(--spacing-sm) auto var(--spacing-md); + text-align: center; .bar[value] { display: block; - width: 30ch; + width: clamp(25ch, 20vw, 30ch); + max-width: 100%; height: fun.convert-px(13); appearance: none; background: var(--color-bg-tertiary); @@ -34,3 +36,8 @@ } } } + +.info { + margin-bottom: var(--spacing-2xs); + font-size: var(--font-size-sm); +} -- cgit v1.2.3