import { useIntl } from 'react-intl'; import styles from './PaginationCursor.module.scss'; const PaginationCursor = ({ current, total, }: { current: number; total: number; }) => { const intl = useIntl(); return (
{intl.formatMessage( { defaultMessage: '{articlesCount, plural, =0 {# loaded articles} one {# loaded article} other {# loaded articles}} out of a total of {total}', description: 'PaginationCursor: loaded articles count message', }, { articlesCount: current, total } )}
); }; export default PaginationCursor; The frontend of my personal website.Armand Philippot
aboutsummaryrefslogtreecommitdiffstats
path: root/src/styles/abstracts/placeholders/_list.scss
blob: 85e8386fef2ddb4b2d5ffdcd58a57d2a5023b261 (plain) 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

/// List Reset
%reset-list {
  list-style-type: none;
  margin: 0;
  padding: 0;

  li {
    margin-bottom: 0;
  }
}

/// Ordered List Reset
%reset-ordered-list {
  @extend %reset-list;

  li {
    display: list-item;
    counter-increment: none;

    &::before {
      display: none;
    }
  }
}

/// Display an inline list with flexbox
%flex-list {
  @extend %reset-list;

  display: flex;
  flex-flow: row wrap;
}