the browser-facing portion of osu!
1// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
2// See the LICENCE file in the repository root for full licence text.
3
4.beatmapset-stats {
5 font-size: 12px;
6
7 &__elapsed-bar {
8 position: absolute;
9 bottom: 0;
10 left: 0;
11
12 width: calc(var(--progress) * 100%);
13
14 background-color: @yellow;
15 height: 3px;
16 }
17
18 &__icon {
19 width: 15px;
20 height: 15px;
21
22 background-size: contain;
23
24 margin-right: 5px;
25 }
26
27 &__rating-chart {
28 height: 25px;
29 }
30
31 &__rating-header {
32 text-align: center;
33 padding-bottom: 5px;
34 }
35
36 &__rating-values {
37 display: flex;
38 padding-bottom: 10px;
39 justify-content: space-between;
40 }
41
42 &__row {
43 .reset-input();
44 background-color: hsla(var(--hsl-b4), 0.8);
45 margin-top: 1px;
46 padding: 7.5px 15px;
47 display: flex;
48 flex-direction: column;
49 width: 100%;
50
51 &--basic {
52 padding-top: 10px;
53 padding-bottom: 10px;
54 }
55
56 &--preview {
57 .link-plain();
58 .link-white();
59 display: flex;
60 align-items: center;
61 justify-content: center;
62 --progress: 0;
63 font-size: 18px; // icon size
64 padding: 10px;
65 cursor: pointer;
66 position: relative;
67
68 &:hover {
69 background-color: hsla(var(--hsl-b6), 0.75);
70 }
71 }
72
73 &--rating {
74 padding-top: 10px;
75 padding-bottom: 0;
76 }
77 }
78}