this repo has no description
DRY the gradients
+7
-6
+7
-6
src/components/status.css
+7
-6
src/components/status.css
···
7
7
--post-gradient-angle: -160deg;
8
8
--post-gradient-chip-angle: 20deg;
9
9
}
10
+
--post-gradient-height: min(160px, 50%);
10
11
}
11
12
12
13
.status-reblog {
13
14
background: linear-gradient(
14
15
var(--post-gradient-angle),
15
16
var(--reblog-faded-color),
16
-
transparent min(160px, 50%)
17
+
transparent var(--post-gradient-height)
17
18
);
18
19
}
19
20
.status-group {
20
21
background: linear-gradient(
21
22
var(--post-gradient-angle),
22
23
var(--group-faded-color),
23
-
transparent min(160px, 50%)
24
+
transparent var(--post-gradient-height)
24
25
);
25
26
}
26
27
.status-followed-tags {
27
28
background: linear-gradient(
28
29
var(--post-gradient-angle),
29
30
var(--hashtag-faded-color),
30
-
transparent min(160px, 50%)
31
+
transparent var(--post-gradient-height)
31
32
);
32
33
33
34
.timeline-item-container:not(.timeline-item-container-start) & {
34
35
background: radial-gradient(
35
36
ellipse at 0 1.2em,
36
37
var(--hashtag-faded-color),
37
-
transparent max(160px, 50%)
38
+
transparent var(--post-gradient-height)
38
39
);
39
40
background-size: 100% 3em;
40
41
background-repeat: no-repeat;
···
44
45
background: linear-gradient(
45
46
var(--post-gradient-angle),
46
47
var(--reply-to-faded-color),
47
-
transparent min(160px, 50%)
48
+
transparent var(--post-gradient-height)
48
49
);
49
50
}
50
51
:is(.status-reblog, .status-group, .status-followed-tags) .status-reply-to {
51
52
background: linear-gradient(
52
53
var(--post-gradient-chip-angle),
53
54
var(--reply-to-faded-color),
54
-
transparent min(160px, 50%)
55
+
transparent var(--post-gradient-height)
55
56
);
56
57
}
57
58
.visibility-direct {