viewy 2.0.6

A web UI toolkit that combine the advantages of a design system and an ui library.
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
33

.avatar {
  background: var(--color-accent);
  color: var(--color-text-on-accent);
  border-radius: 50%;
  $font-size: 0.35;

  &--normal {
    width: sp(35);
    height: sp(35);
    line-height: sp(35);
    font-size: sp(35) * $font-size;
    text-align: center;
  }

  &--large {
    width: sp(50);
    height: sp(50);
    line-height: sp(50);
    font-size: sp(50) * $font-size;
    text-align: center;
  }

  &--x-large {
    width: sp(80);
    height: sp(80);
    line-height: sp(80);
    font-size: sp(80) * $font-size;
    text-align: center;
  }
  &.clickable:hover {
    background: var(--color-accent-lighter);
  }
}