this repo has no description
1:root {
2 --moonbase-bg: #222034;
3 --moonbase-fg: #fffba6;
4}
5
6.moonbase-settings > :first-child {
7 margin-top: 0px;
8}
9
10.moonbase-retry-button {
11 padding: 8px;
12 margin-right: 8px;
13}
14
15textarea.moonbase-resizeable {
16 resize: vertical;
17}
18
19.moonbase-link-buttons {
20 border-bottom: 2px solid var(--background-modifier-accent);
21 margin-bottom: -2px;
22 margin-left: 0 !important;
23 padding-right: 20px;
24 gap: 1rem;
25}
26
27.moonbase-speen {
28 animation: moonbase-speen-animation 0.25s linear infinite;
29}
30
31@keyframes moonbase-speen-animation {
32 from {
33 transform: rotate(0deg);
34 }
35 to {
36 transform: rotate(360deg);
37 }
38}
39
40/* Update notice at the top of the client */
41.moonbase-updates-notice {
42 background-color: var(--moonbase-bg);
43 color: var(--moonbase-fg);
44 --custom-notice-text: var(--moonbase-fg);
45 line-height: unset;
46 height: 36px;
47}
48
49.moonbase-updates-notice button {
50 color: var(--moonbase-fg);
51 border-color: var(--moonbase-fg);
52}
53
54.moonbase-updates-notice_text-wrapper {
55 display: inline-flex;
56 align-items: center;
57 line-height: 36px;
58 gap: 2px;
59}
60
61/* Help messages in Moonbase UI */
62.moonbase-help-message {
63 display: flex;
64 flex-direction: row;
65 justify-content: space-between;
66}
67
68.moonbase-help-message-sticky {
69 position: sticky;
70 top: 24px;
71 z-index: 10;
72 background-color: var(--background-primary);
73}
74
75.moonbase-extension-update-section {
76 margin-top: 15px;
77}
78
79.moonbase-update-section {
80 background-color: var(--moonbase-bg);
81 --info-help-foreground: var(--moonbase-fg);
82 border: none !important;
83 color: var(--moonbase-fg);
84}
85
86.moonbase-update-section button {
87 --info-help-foreground: var(--moonbase-fg);
88 color: var(--moonbase-fg);
89 background-color: transparent;
90 border-color: var(--moonbase-fg);
91}
92
93.moonbase-help-message-buttons {
94 display: flex;
95 flex-direction: row;
96 gap: 8px;
97 align-items: center;
98}
99
100.moonbase-update-divider {
101 margin: 32px 0;
102}
103
104.moonlight-card-info-header {
105 margin-bottom: 0.25rem;
106}
107
108.moonlight-card-badge {
109 border-radius: 0.1875rem;
110 padding: 0 0.275rem;
111 margin-right: 0.4em;
112 background-color: var(--badge-color, var(--bg-mod-strong));
113}
114
115/* Crash screen */
116.moonbase-crash-wrapper > [class^="buttons_"] {
117 gap: 1rem;
118}
119
120.moonbase-crash-wrapper {
121 display: flex;
122 flex-direction: column;
123 align-items: center;
124 gap: 1rem;
125 height: 50%;
126 width: 50vw;
127 max-height: 50%;
128 max-width: 50vw;
129}
130
131.moonbase-crash-tabs {
132 width: 100%;
133}
134
135.moonbase-crash-details-wrapper {
136 overflow-y: scroll;
137 color: var(--text-normal);
138 background: var(--background-secondary);
139 border: 1px solid var(--background-tertiary);
140 border-radius: 4px;
141 padding: 0.5em;
142
143 &::-webkit-scrollbar {
144 width: 8px;
145 height: 8px;
146 }
147
148 &::-webkit-scrollbar-thumb {
149 background-clip: padding-box;
150 border: 2px solid transparent;
151 border-radius: 4px;
152 background-color: var(--scrollbar-thin-thumb);
153 min-height: 40px;
154 }
155
156 &::-webkit-scrollbar-track {
157 border: 2px solid var(--scrollbar-thin-track);
158 background-color: var(--scrollbar-thin-track);
159 border-color: var(--scrollbar-thin-track);
160 }
161}
162
163.moonbase-crash-details {
164 box-sizing: border-box;
165 padding: 0;
166 font-family: var(--font-code);
167 font-size: 0.75rem;
168 line-height: 1rem;
169 margin: 6px;
170 white-space: pre-wrap;
171 background-clip: border-box;
172
173 & > code {
174 font-size: 0.875rem;
175 line-height: 1.125rem;
176 text-indent: 0;
177 white-space: pre-wrap;
178 text-size-adjust: none;
179 display: block;
180 user-select: text;
181 }
182}
183
184.moonbase-crash-extensions {
185 overflow-y: scroll;
186 display: grid;
187 grid-auto-columns: 25vw;
188 gap: 8px;
189
190 &::-webkit-scrollbar {
191 width: 8px;
192 height: 8px;
193 }
194
195 &::-webkit-scrollbar-thumb {
196 background-clip: padding-box;
197 border: 2px solid transparent;
198 border-radius: 4px;
199 background-color: var(--scrollbar-thin-thumb);
200 min-height: 40px;
201 }
202
203 &::-webkit-scrollbar-track {
204 border: 2px solid var(--scrollbar-thin-track);
205 background-color: var(--scrollbar-thin-track);
206 border-color: var(--scrollbar-thin-track);
207 }
208}
209
210.moonbase-crash-extensionCard {
211 color: var(--text-normal);
212 background: var(--background-secondary);
213 border: 1px solid var(--background-tertiary);
214 border-radius: 4px;
215 padding: 0.5em;
216 display: flex;
217}
218
219.moonbase-crash-extensionCard-meta {
220 display: flex;
221 flex-direction: column;
222 flex-grow: 1;
223}
224
225.moonbase-crash-extensionCard-title {
226 color: var(--text-normal);
227 font-family: var(--font-primary);
228 font-size: 16px;
229 line-height: 1.25;
230 font-weight: 600;
231}
232
233.moonbase-crash-extensionCard-version {
234 color: var(--text-muted);
235 font-family: var(--font-primary);
236 font-size: 14px;
237 line-height: 1.286;
238 font-weight: 400;
239}
240
241/* About page */
242.moonbase-wordmark {
243 width: 100%;
244}
245
246.moonbase-devs {
247 width: 100%;
248 display: flex;
249 justify-content: center;
250 gap: 0rem 0.5rem;
251 padding-top: 0.5rem;
252}
253
254.moonbase-dev {
255 height: 4rem;
256}
257
258.moonbase-dev-avatar {
259 width: 2rem;
260 border-radius: 50%;
261}
262
263.moonbase-gap {
264 gap: 0.5rem;
265}
266
267.moonbase-about-page {
268 gap: 1rem;
269}