blob: eb45ffb30efefe7b58bc4c420f6bb07772f488b7 (
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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
|
/*
theme-title: Blurple (light)
theme-description: Official light blurple theme
*/
:root {
/* Define our nice blurple palette */
--blurple1: #ebe6f8;
--blurple2: #d6cceb;
--blurple3: #c2b3e1;
--blurple4: #aa60ff;
--blurple5: #783d9f;
--blurple6: #2d2b55;
--blurple7: #1f1f41;
/* Override orange trim */
--orange2: #700000;
/* Restyle basic colors to use blurple */
--white1: var(--blurple2);
--white2: var(--blurple3);
--blue1: var(--blurple4);
--blue2: var(--blurple5);
--blue3: var(--blurple6);
/* Use hardcoded grey as gray get restyled in light mode */
--gray1: #2a2b2f;
--gray2: #35363b;
/* Basic page styling (background + foreground) */
--bg: var(--blurple1);
--bg-accent: var(--white2);
--fg: var(--gray1);
--fg-reduced: var(--gray2);
/* Profile page styling (light) */
--profile-bg: var(--white2);
/* Blurpleize buttons */
--button-bg: var(--blue2);
--button-fg: var(--white1);
/* Blurpleize statuses */
--status-bg: var(--white1);
--status-focus-bg: var(--white1);
--status-info-bg: var(--white2);
--status-focus-info-bg: var(--white2);
/* Used around statuses + other items */
--boxshadow-border: 0.08rem solid var(--blurple6);
}
/* Main page background */
body {
background: linear-gradient(var(--blurple1), white);
}
/* Scroll bar */
html, body {
scrollbar-color: var(--blurple5) var(--blurple2);
}
/* Profile fields */
.profile .about-user .fields .field {
border-bottom: 0.1rem solid var(--blurple6);
}
.profile .about-user .fields .field:first-child {
border-top: 0.1rem solid var(--blurple6);
}
/* Status media */
.status .media .media-wrapper {
border: 0.08rem solid var(--blurple6);
}
.status .media .media-wrapper details .unknown-attachment .placeholder {
color: var(--blue2);
}
.status .media .media-wrapper details video.plyr-video {
background: var(--blurple2);
}
/* Status polls */
.status .text .poll {
background-color: var(--white2);
}
.status .text .poll .poll-info {
background-color: var(--white1);
}
/* Code snippets */
pre, pre[class*="language-"],
code, code[class*="language-"] {
background-color: var(--blurple7);
color: var(--blurple2);
}
/* Block quotes */
blockquote {
background-color: var(--blurple1);
color: var(--blurple7);
}
|
