pstream is dead; long live pstream taciturnaxolotl.github.io/pstream-ng/
1
fork

Configure Feed

Select the types of activity you want to include in your feed.

add cobalt theme

replace skyrealm

Pas 647a4e82 36069f81

+340 -256
+1 -1
src/assets/locales/en.json
··· 1045 1045 "popsicle": "Popsicle", 1046 1046 "hulk": "Hulk", 1047 1047 "autumn": "Autumn", 1048 - "skyrealm": "SkyRealm", 1048 + "cobalt": "Cobalt", 1049 1049 "frost": "Frost", 1050 1050 "christmas": "Christmas" 1051 1051 },
+5 -5
src/pages/parts/settings/AppearancePart.tsx
··· 96 96 key: "settings.appearance.themes.spark", 97 97 }, 98 98 { 99 + id: "cobalt", 100 + selector: "theme-cobalt", 101 + key: "settings.appearance.themes.cobalt", 102 + }, 103 + { 99 104 id: "grape", 100 105 selector: "theme-grape", 101 106 key: "settings.appearance.themes.grape", ··· 124 129 id: "christmas", 125 130 selector: "theme-christmas", 126 131 key: "settings.appearance.themes.christmas", 127 - }, 128 - { 129 - id: "skyRealm", 130 - selector: "theme-skyrealm", 131 - key: "settings.appearance.themes.skyrealm", 132 132 }, 133 133 ]; 134 134
+2 -2
themes/all.ts
··· 17 17 import popsicle from "./list/popsicle"; 18 18 import hulk from "./list/hulk"; 19 19 import autumn from "./list/autumn"; 20 - import skyRealm from "./list/skyrealm"; 20 + import cobalt from "./list/cobalt"; 21 21 import frost from "./list/frost"; 22 22 import christmas from "./list/christmas"; 23 23 ··· 43 43 wolverine, 44 44 popsicle, 45 45 christmas, 46 - skyRealm, 46 + cobalt, 47 47 ];
+332
themes/list/cobalt.ts
··· 1 + import { createTheme } from "../types"; 2 + 3 + const tokens = { 4 + black: { 5 + c50: "#000000", 6 + c75: "#030303", 7 + c80: "#080808", 8 + c100: "#0d0d0d", 9 + c125: "#141414", 10 + c150: "#1a1a1a", 11 + c200: "#262626", 12 + c250: "#333333", 13 + }, 14 + white: "#FFFFFF", 15 + semantic: { 16 + red: { 17 + c100: "#F46E6E", 18 + c200: "#E44F4F", 19 + c300: "#D74747", 20 + c400: "#B43434", 21 + }, 22 + green: { 23 + c100: "#60D26A", 24 + c200: "#40B44B", 25 + c300: "#31A33C", 26 + c400: "#237A2B", 27 + }, 28 + silver: { 29 + c100: "#DEDEDE", 30 + c200: "#B6CAD7", 31 + c300: "#8EA3B0", 32 + c400: "#617A8A", 33 + }, 34 + yellow: { 35 + c100: "#80EAFF", 36 + c200: "#43DFFF", 37 + c300: "#00D4FF", 38 + c400: "#00B6E6", 39 + }, 40 + rose: { 41 + c100: "#80EAFF", 42 + c200: "#00B6E6", 43 + c300: "#00D4FF", 44 + c400: "#43DFFF", 45 + }, 46 + }, 47 + blue: { 48 + c50: "#ccccd6", 49 + c100: "#a2a2a2", 50 + c200: "#868686", 51 + c300: "#646464", 52 + c400: "#4e4e4e", 53 + c500: "#383838", 54 + c600: "#2e2e2e", 55 + c700: "#272727", 56 + c800: "#181818", 57 + c900: "#0f0f0f", 58 + }, 59 + purple: { 60 + c50: "#80EAFF", 61 + c100: "#43DFFF", 62 + c200: "#00D4FF", 63 + c300: "#00B6E6", 64 + c400: "#0099CC", 65 + c500: "#007CAD", 66 + c600: "#00668F", 67 + c700: "#004F6E", 68 + c800: "#00384D", 69 + c900: "#002A3A", 70 + }, 71 + ash: { 72 + c50: "#8d8d8d", 73 + c100: "#6b6b6b", 74 + c200: "#545454", 75 + c300: "#3c3c3c", 76 + c400: "#313131", 77 + c500: "#2c2c2c", 78 + c600: "#252525", 79 + c700: "#1e1e1e", 80 + c800: "#181818", 81 + c900: "#111111", 82 + }, 83 + shade: { 84 + c25: "#939393", 85 + c50: "#7c7c7c", 86 + c100: "#666666", 87 + c200: "#4f4f4f", 88 + c300: "#404040", 89 + c400: "#343434", 90 + c500: "#282828", 91 + c600: "#202020", 92 + c700: "#1a1a1a", 93 + c800: "#151515", 94 + c900: "#0e0e0e", 95 + }, 96 + }; 97 + 98 + export default createTheme({ 99 + name: "cobalt", 100 + extend: { 101 + colors: { 102 + themePreview: { 103 + primary: tokens.black.c80, 104 + secondary: tokens.purple.c400, 105 + ghost: tokens.purple.c100, 106 + }, 107 + 108 + pill: { 109 + background: tokens.black.c100, 110 + backgroundHover: tokens.black.c125, 111 + highlight: tokens.blue.c200, 112 + activeBackground: tokens.shade.c700, 113 + }, 114 + 115 + global: { 116 + accentA: tokens.purple.c200, 117 + accentB: tokens.purple.c300, 118 + }, 119 + 120 + lightBar: { 121 + light: tokens.purple.c800, 122 + }, 123 + 124 + buttons: { 125 + toggle: tokens.purple.c300, 126 + toggleDisabled: tokens.black.c200, 127 + danger: tokens.semantic.rose.c300, 128 + dangerHover: tokens.semantic.rose.c200, 129 + 130 + secondary: tokens.black.c100, 131 + secondaryText: tokens.semantic.silver.c300, 132 + secondaryHover: tokens.black.c150, 133 + primary: tokens.white, 134 + primaryText: tokens.black.c50, 135 + primaryHover: tokens.semantic.silver.c100, 136 + purple: tokens.purple.c600, 137 + purpleHover: tokens.purple.c400, 138 + cancel: tokens.black.c100, 139 + cancelHover: tokens.black.c150, 140 + }, 141 + 142 + background: { 143 + main: tokens.black.c75, 144 + secondary: tokens.black.c75, 145 + secondaryHover: tokens.black.c75, 146 + accentA: tokens.purple.c600, 147 + accentB: tokens.black.c100, 148 + }, 149 + 150 + modal: { 151 + background: tokens.shade.c800, 152 + }, 153 + 154 + type: { 155 + logo: tokens.purple.c100, 156 + emphasis: tokens.white, 157 + text: tokens.shade.c50, 158 + dimmed: tokens.shade.c50, 159 + divider: tokens.ash.c500, 160 + secondary: tokens.ash.c100, 161 + danger: tokens.semantic.red.c100, 162 + success: tokens.semantic.green.c100, 163 + link: tokens.purple.c100, 164 + linkHover: tokens.purple.c50, 165 + }, 166 + 167 + search: { 168 + background: tokens.black.c100, 169 + hoverBackground: tokens.shade.c900, 170 + focused: tokens.black.c125, 171 + placeholder: tokens.shade.c200, 172 + icon: tokens.shade.c500, 173 + text: tokens.white, 174 + }, 175 + 176 + mediaCard: { 177 + hoverBackground: tokens.shade.c900, 178 + hoverAccent: tokens.black.c250, 179 + hoverShadow: tokens.black.c50, 180 + shadow: tokens.shade.c800, 181 + barColor: tokens.ash.c200, 182 + barFillColor: tokens.purple.c100, 183 + badge: tokens.shade.c700, 184 + badgeText: tokens.ash.c100, 185 + }, 186 + 187 + largeCard: { 188 + background: tokens.black.c100, 189 + icon: tokens.purple.c400, 190 + }, 191 + 192 + dropdown: { 193 + background: tokens.black.c100, 194 + altBackground: tokens.black.c80, 195 + hoverBackground: tokens.black.c150, 196 + highlight: tokens.semantic.yellow.c400, 197 + highlightHover: tokens.semantic.yellow.c200, 198 + text: tokens.shade.c50, 199 + secondary: tokens.shade.c100, 200 + border: tokens.shade.c400, 201 + contentBackground: tokens.black.c50, 202 + }, 203 + 204 + authentication: { 205 + border: tokens.shade.c300, 206 + inputBg: tokens.black.c100, 207 + inputBgHover: tokens.black.c150, 208 + wordBackground: tokens.shade.c500, 209 + copyText: tokens.shade.c100, 210 + copyTextHover: tokens.ash.c50, 211 + errorText: tokens.semantic.rose.c100, 212 + }, 213 + 214 + settings: { 215 + sidebar: { 216 + activeLink: tokens.black.c100, 217 + badge: tokens.shade.c900, 218 + 219 + type: { 220 + secondary: tokens.shade.c200, 221 + inactive: tokens.shade.c50, 222 + icon: tokens.black.c200, 223 + iconActivated: tokens.purple.c200, 224 + activated: tokens.purple.c100, 225 + }, 226 + }, 227 + 228 + card: { 229 + border: tokens.shade.c700, 230 + background: tokens.black.c100, 231 + altBackground: tokens.black.c100, 232 + }, 233 + 234 + saveBar: { 235 + background: tokens.black.c50, 236 + }, 237 + }, 238 + 239 + utils: { 240 + divider: tokens.ash.c300, 241 + }, 242 + 243 + onboarding: { 244 + bar: tokens.shade.c400, 245 + barFilled: tokens.purple.c300, 246 + divider: tokens.shade.c200, 247 + card: tokens.shade.c800, 248 + cardHover: tokens.shade.c700, 249 + border: tokens.shade.c600, 250 + good: tokens.purple.c100, 251 + best: tokens.semantic.yellow.c100, 252 + link: tokens.purple.c100, 253 + }, 254 + 255 + errors: { 256 + card: tokens.black.c75, 257 + border: tokens.ash.c500, 258 + 259 + type: { 260 + secondary: tokens.ash.c100, 261 + }, 262 + }, 263 + 264 + about: { 265 + circle: tokens.black.c100, 266 + circleText: tokens.ash.c50, 267 + }, 268 + 269 + editBadge: { 270 + bg: tokens.ash.c500, 271 + bgHover: tokens.ash.c400, 272 + text: tokens.ash.c50, 273 + }, 274 + 275 + progress: { 276 + background: tokens.ash.c50, 277 + preloaded: tokens.ash.c50, 278 + filled: tokens.purple.c200, 279 + }, 280 + 281 + video: { 282 + buttonBackground: tokens.ash.c600, 283 + 284 + autoPlay: { 285 + background: tokens.ash.c800, 286 + hover: tokens.ash.c600, 287 + }, 288 + 289 + scraping: { 290 + card: tokens.black.c50, 291 + error: tokens.semantic.red.c200, 292 + success: tokens.semantic.green.c200, 293 + loading: tokens.purple.c200, 294 + noresult: tokens.black.c200, 295 + }, 296 + 297 + audio: { 298 + set: tokens.purple.c200, 299 + }, 300 + 301 + context: { 302 + background: tokens.black.c50, 303 + light: tokens.shade.c50, 304 + border: tokens.ash.c600, 305 + hoverColor: tokens.ash.c600, 306 + buttonFocus: tokens.ash.c500, 307 + flagBg: tokens.ash.c500, 308 + inputBg: tokens.black.c100, 309 + buttonOverInputHover: tokens.ash.c500, 310 + inputPlaceholder: tokens.ash.c200, 311 + cardBorder: tokens.ash.c700, 312 + slider: tokens.black.c200, 313 + sliderFilled: tokens.purple.c200, 314 + error: tokens.semantic.red.c200, 315 + 316 + buttons: { 317 + list: tokens.ash.c700, 318 + active: tokens.ash.c900, 319 + }, 320 + 321 + closeHover: tokens.ash.c800, 322 + 323 + type: { 324 + main: tokens.semantic.silver.c300, 325 + secondary: tokens.ash.c200, 326 + accent: tokens.purple.c200, 327 + }, 328 + }, 329 + }, 330 + }, 331 + }, 332 + });
-248
themes/list/skyrealm.ts
··· 1 - import { createTheme } from "../types"; 2 - 3 - const tokens = { 4 - petal: { 5 - c50: "#fff0f5", 6 - c100: "#ffdde9", 7 - c200: "#ffbbd1", 8 - c300: "#ff99bb", 9 - c400: "#ff77a5", 10 - c500: "#e65f8f", 11 - c600: "#cc4779", 12 - c700: "#b33263", 13 - c800: "#991e4d", 14 - c900: "#800f3a", 15 - }, 16 - dawn: { 17 - c25: "#f0e9f5", 18 - c50: "#e6d9f0", 19 - c100: "#d7c2e8", 20 - c200: "#c2a6dd", 21 - c300: "#ad8ad2", 22 - c400: "#9970c7", 23 - c500: "#8558b5", 24 - c600: "#6b4599", 25 - c700: "#52337d", 26 - c800: "#3a2361", 27 - c900: "#261547", 28 - }, 29 - silk: { 30 - c50: "#fdfdfd", 31 - c100: "#faf8f9", 32 - c200: "#f5f0f3", 33 - c300: "#ede5ec", 34 - c400: "#e6dae5", 35 - c500: "#dfd0de", 36 - c600: "#d0b8d0", 37 - c700: "#c29fc2", 38 - c800: "#b386b3", 39 - c900: "#a66ea6", 40 - }, 41 - nectar: { 42 - c50: "#fff9e6", 43 - c100: "#fff3cc", 44 - c200: "#ffe899", 45 - c300: "#ffdd66", 46 - c400: "#ffd233", 47 - c500: "#e6b800", 48 - c600: "#cca000", 49 - c700: "#b38900", 50 - c800: "#997100", 51 - c900: "#805a00", 52 - }, 53 - }; 54 - 55 - export default createTheme({ 56 - name: "skyRealm", 57 - extend: { 58 - colors: { 59 - themePreview: { 60 - primary: tokens.petal.c200, 61 - secondary: tokens.dawn.c50, 62 - }, 63 - 64 - pill: { 65 - background: tokens.dawn.c300, 66 - backgroundHover: tokens.dawn.c200, 67 - highlight: tokens.petal.c200, 68 - activeBackground: tokens.dawn.c300, 69 - }, 70 - 71 - global: { 72 - accentA: tokens.petal.c200, 73 - accentB: tokens.petal.c300, 74 - }, 75 - 76 - lightBar: { 77 - light: tokens.petal.c400, 78 - }, 79 - 80 - buttons: { 81 - toggle: tokens.nectar.c300, 82 - toggleDisabled: tokens.silk.c500, 83 - 84 - secondary: tokens.silk.c700, 85 - secondaryHover: tokens.silk.c600, 86 - purple: tokens.dawn.c500, 87 - purpleHover: tokens.dawn.c400, 88 - cancel: tokens.silk.c500, 89 - cancelHover: tokens.silk.c300, 90 - }, 91 - 92 - background: { 93 - main: tokens.dawn.c900, 94 - secondary: tokens.dawn.c600, 95 - secondaryHover: tokens.dawn.c400, 96 - accentA: tokens.nectar.c500, 97 - accentB: tokens.petal.c500, 98 - }, 99 - 100 - modal: { 101 - background: tokens.dawn.c800, 102 - }, 103 - 104 - type: { 105 - logo: tokens.nectar.c100, 106 - text: tokens.silk.c50, 107 - dimmed: tokens.silk.c50, 108 - divider: tokens.silk.c500, 109 - secondary: tokens.silk.c100, 110 - link: tokens.petal.c100, 111 - linkHover: tokens.petal.c50, 112 - }, 113 - 114 - search: { 115 - background: tokens.dawn.c500, 116 - hoverBackground: tokens.dawn.c600, 117 - focused: tokens.dawn.c400, 118 - placeholder: tokens.dawn.c100, 119 - icon: tokens.dawn.c100, 120 - }, 121 - 122 - mediaCard: { 123 - hoverBackground: tokens.dawn.c600, 124 - hoverAccent: tokens.dawn.c25, 125 - hoverShadow: tokens.dawn.c900, 126 - shadow: tokens.dawn.c700, 127 - barColor: tokens.silk.c200, 128 - barFillColor: tokens.petal.c100, 129 - badge: tokens.dawn.c700, 130 - badgeText: tokens.silk.c100, 131 - }, 132 - 133 - largeCard: { 134 - background: tokens.dawn.c600, 135 - icon: tokens.petal.c400, 136 - }, 137 - 138 - dropdown: { 139 - background: tokens.dawn.c600, 140 - altBackground: tokens.dawn.c700, 141 - hoverBackground: tokens.dawn.c500, 142 - text: tokens.silk.c50, 143 - secondary: tokens.dawn.c100, 144 - border: tokens.dawn.c400, 145 - contentBackground: tokens.dawn.c500, 146 - }, 147 - 148 - authentication: { 149 - border: tokens.dawn.c300, 150 - inputBg: tokens.dawn.c600, 151 - inputBgHover: tokens.dawn.c500, 152 - wordBackground: tokens.dawn.c500, 153 - copyText: tokens.dawn.c100, 154 - copyTextHover: tokens.silk.c50, 155 - }, 156 - 157 - settings: { 158 - sidebar: { 159 - activeLink: tokens.dawn.c600, 160 - badge: tokens.dawn.c900, 161 - type: { 162 - secondary: tokens.dawn.c200, 163 - inactive: tokens.dawn.c50, 164 - icon: tokens.dawn.c50, 165 - iconActivated: tokens.petal.c200, 166 - activated: tokens.petal.c50, 167 - }, 168 - }, 169 - card: { 170 - border: tokens.dawn.c400, 171 - background: tokens.dawn.c400, 172 - altBackground: tokens.dawn.c400, 173 - }, 174 - saveBar: { 175 - background: tokens.dawn.c800, 176 - }, 177 - }, 178 - 179 - utils: { 180 - divider: tokens.silk.c300, 181 - }, 182 - 183 - errors: { 184 - card: tokens.dawn.c800, 185 - border: tokens.silk.c500, 186 - type: { 187 - secondary: tokens.silk.c100, 188 - }, 189 - }, 190 - 191 - about: { 192 - circle: tokens.silk.c500, 193 - circleText: tokens.silk.c50, 194 - }, 195 - 196 - editBadge: { 197 - bg: tokens.silk.c500, 198 - bgHover: tokens.silk.c400, 199 - text: tokens.silk.c50, 200 - }, 201 - 202 - progress: { 203 - background: tokens.silk.c50, 204 - preloaded: tokens.silk.c50, 205 - filled: tokens.petal.c200, 206 - }, 207 - 208 - video: { 209 - buttonBackground: tokens.silk.c200, 210 - autoPlay: { 211 - background: tokens.silk.c700, 212 - hover: tokens.silk.c500, 213 - }, 214 - scraping: { 215 - card: tokens.dawn.c700, 216 - loading: tokens.petal.c200, 217 - noresult: tokens.silk.c100, 218 - }, 219 - audio: { 220 - set: tokens.petal.c200, 221 - }, 222 - context: { 223 - background: tokens.silk.c900, 224 - light: tokens.dawn.c50, 225 - border: tokens.silk.c600, 226 - hoverColor: tokens.silk.c600, 227 - buttonFocus: tokens.silk.c500, 228 - flagBg: tokens.silk.c500, 229 - inputBg: tokens.silk.c600, 230 - buttonOverInputHover: tokens.silk.c500, 231 - inputPlaceholder: tokens.silk.c200, 232 - cardBorder: tokens.silk.c700, 233 - slider: tokens.silk.c50, 234 - sliderFilled: tokens.petal.c200, 235 - buttons: { 236 - list: tokens.silk.c700, 237 - active: tokens.silk.c900, 238 - }, 239 - closeHover: tokens.silk.c800, 240 - type: { 241 - secondary: tokens.silk.c200, 242 - accent: tokens.petal.c200, 243 - }, 244 - }, 245 - }, 246 - }, 247 - }, 248 - });