forked from didirus/AstralRinth
ff4c7f47b2
* Begin work on worlds backend * Finish implementing get_profile_worlds and get_server_status (except pinning) * Create TS types and manually copy unparsed chat components * Clippy fix * Update types.d.ts * Initial worlds UI work * Fix api::get_profile_worlds to take in a relative path * sanitize & security update * Fix sanitizePotentialFileUrl * Fix sanitizePotentialFileUrl (for real) * Fix empty motd causing error * Finally actually fix world icons * Fix world icon not being visible on non-Windows * Use the correct generics to take in AppHandle * Implement start_join_singleplayer_world and start_join_server for modern versions * Don't error if server has no cached icon * Migrate to own server pinging * Ignore missing server hidden field and missing saves dir * Update world list frontend * More frontend work * Server status player sample can be absent * Fix refresh state * Add get_profile_protocol_version * Add protocol_version column to database * SQL INTEGER is i64 in sqlx * sqlx prepare * Cache protocol version in database * Continue worlds UI work * Fix motds being bold * Remove legacy pinging and add a 30-second timeout * Remove pinned for now and match world (and server) parsing closer to spec * Move type ServerStatus to worlds.ts * Implement add_server_to_profile * Fix pack_status being ignored when joining from launcher * Make World path field be relative * Implement rename_world and reset_world_icon * Clippy fix * Fix rename_world * UI enhancements * Implement backup_world, which returns the backup size in bytes * Clippy fix * Return index when adding servers to profile * Fix backup * Implement delete_world * Implement edit_server_in_profile and remove_server_from_profile * Clippy fix * Log server joins * Add edit and delete support * Fix ts errors * Fix minecraft font * Switch font out for non-monospaced. * Fix font proper * Some more world cleanup, handle play state, check quickplay compatibility * Clear the cached protocol version when a profile's game version is changed * Fix tint colors in navbar * Fix server protocol version pinging * UI fixes * Fix protocol version handler * Fix MOTD parsing * Add worlds_updated profile event * fix pkg * Functional home screen with worlds * lint * Fix incorrect folder creation * Make items clickable * Add locked field to SingleplayerWorld indicating whether the world is locked by the game * Implement locking frontend * Fix locking condition * Split worlds_updated profile event into servers_updated and world_updated * Fix compile error * Use port from resolve SRV record * Fix serialization of ProfilePayload and ProfilePayloadType * Individual singleplayer world refreshing * Log when worlds are perceived to be updated * Push logging + total refresh lock * Unlisten fixes * Highlight current world when clicked * Launcher logs refactor (#3444) * Switch live log to use STDOUT * fix clippy, legacy logs support * Fix lint * Handle non-XML log messages in XML logging, and don't escape log messages into XML --------- Co-authored-by: Josiah Glosson <soujournme@gmail.com> * Update incompatibility text * Home page fixes, and unlock after close * Remove logging * Add join log database migration * Switch server join timing to being in the database instead of in a separate log file * Create optimized get_recent_worlds function that takes in a limit * Update dependencies and fix Cargo.lock * temp disable overflow menus * revert home page changes * Enable overflow menus again * Remove list * Revert * Push dev tools * Remove default filter * Disable debug renderer * Fix random app errors * Refactor * Fix missing computed import * Fix light mode issues * Fix TS errors * Lint * Fix bad link in change modpack version modal * fix lint * fix intl --------- Co-authored-by: Josiah Glosson <soujournme@gmail.com> Co-authored-by: Jai A <jaiagr+gpg@pm.me> Co-authored-by: Jai Agrawal <18202329+Geometrically@users.noreply.github.com>
277 lines
8.1 KiB
SCSS
277 lines
8.1 KiB
SCSS
.light-properties {
|
|
--color-bg: #e5e7eb;
|
|
--color-raised-bg: #ffffff;
|
|
--color-super-raised-bg: #e9e9e9;
|
|
--color-button-bg: hsl(220, 13%, 91%);
|
|
--color-button-border: rgba(161, 161, 161, 0.35);
|
|
--color-scrollbar: #96a2b0;
|
|
|
|
--color-divider: #babfc5;
|
|
--color-divider-dark: #c8cdd3;
|
|
|
|
--color-base: hsl(221, 39%, 11%);
|
|
--color-secondary: #6b7280;
|
|
--color-contrast: #1a202c;
|
|
--color-accent-contrast: #ffffff;
|
|
|
|
--color-red: #cb2245;
|
|
--color-orange: #e08325;
|
|
--color-green: #00af5c;
|
|
--color-blue: #1f68c0;
|
|
--color-purple: #8e32f3;
|
|
--color-gray: #595b61;
|
|
|
|
--color-red-highlight: rgba(203, 34, 69, 0.25);
|
|
--color-orange-highlight: rgba(224, 131, 37, 0.25);
|
|
--color-green-highlight: rgba(0, 175, 92, 0.25);
|
|
--color-blue-highlight: rgba(31, 104, 192, 0.25);
|
|
--color-purple-highlight: rgba(142, 50, 243, 0.25);
|
|
--color-gray-highlight: rgba(89, 91, 97, 0.25);
|
|
|
|
--color-red-bg: rgba(203, 34, 69, 0.1);
|
|
--color-orange-bg: rgba(224, 131, 37, 0.1);
|
|
--color-green-bg: rgba(0, 175, 92, 0.1);
|
|
--color-blue-bg: rgba(31, 104, 192, 0.1);
|
|
--color-purple-bg: rgba(142, 50, 243, 0.1);
|
|
|
|
--color-brand: var(--color-green);
|
|
--color-brand-highlight: var(--color-green-highlight);
|
|
--color-brand-shadow: rgba(0, 175, 92, 0.7);
|
|
|
|
--shadow-inset-lg: inset 0px -2px 2px hsla(221, 39%, 91%, 0.1);
|
|
--shadow-inset: inset 0px -2px 2px hsla(221, 39%, 91%, 0.05);
|
|
--shadow-inset-sm: inset 0px -1px 2px hsla(221, 39%, 91%, 0.15);
|
|
|
|
--shadow-raised-lg: 0px 2px 4px hsla(221, 39%, 11%, 0.2);
|
|
--shadow-raised: 0.3px 0.5px 0.6px hsl(var(--shadow-color) / 0.15),
|
|
1px 2px 2.2px -1.7px hsl(var(--shadow-color) / 0.12),
|
|
4.4px 8.8px 9.7px -3.4px hsl(var(--shadow-color) / 0.09);
|
|
--shadow-floating: hsla(0, 0%, 0%, 0) 0px 0px 0px 0px, hsla(0, 0%, 0%, 0) 0px 0px 0px 0px,
|
|
hsla(0, 0%, 0%, 0.1) 0px 4px 6px -1px, hsla(0, 0%, 0%, 0.1) 0px 2px 4px -1px;
|
|
|
|
--shadow-card: rgba(50, 50, 100, 0.1) 0px 2px 4px 0px;
|
|
|
|
--brand-gradient-bg: linear-gradient(
|
|
0deg,
|
|
rgba(68, 182, 138, 0.175) 0%,
|
|
rgba(58, 250, 112, 0.125) 100%
|
|
);
|
|
--brand-gradient-strong-bg: linear-gradient(
|
|
270deg,
|
|
rgba(68, 182, 138, 0.175) 0%,
|
|
rgba(36, 225, 91, 0.12) 100%
|
|
);
|
|
--brand-gradient-button: rgba(255, 255, 255, 0.5);
|
|
--brand-gradient-border: rgba(32, 64, 32, 0.15);
|
|
--brand-gradient-fade-out-color: linear-gradient(to bottom, rgba(213, 235, 224, 0), #d0ece0 70%);
|
|
|
|
--color-button-bg-selected: var(--color-brand);
|
|
--color-button-text-selected: var(--color-accent-contrast);
|
|
|
|
--loading-bar-gradient: linear-gradient(to right, var(--color-brand) 0%, #00af5c 100%);
|
|
|
|
--color-platform-fabric: #8a7b71;
|
|
--color-platform-quilt: #8b61b4;
|
|
--color-platform-forge: #5b6197;
|
|
--color-platform-neoforge: #dc895c;
|
|
--color-platform-liteloader: #4c90de;
|
|
--color-platform-bukkit: #e78362;
|
|
--color-platform-bungeecord: #c69e39;
|
|
--color-platform-folia: #6aa54f;
|
|
--color-platform-paper: #e67e7e;
|
|
--color-platform-purpur: #7763a3;
|
|
--color-platform-spigot: #cd7a21;
|
|
--color-platform-velocity: #4b98b0;
|
|
--color-platform-waterfall: #5f83cb;
|
|
--color-platform-sponge: #c49528;
|
|
|
|
--hover-brightness: 0.9;
|
|
}
|
|
|
|
html {
|
|
@extend .light-properties;
|
|
--dark-color-base: #b0bac5;
|
|
--dark-color-contrast: #ecf9fb;
|
|
|
|
--gap-xs: 0.25rem;
|
|
--gap-sm: 0.5rem;
|
|
--gap-md: 0.75rem;
|
|
--gap-lg: 1rem;
|
|
--gap-xl: 1.5rem;
|
|
|
|
--radius-xs: 0.25rem;
|
|
--radius-sm: 0.5rem;
|
|
--radius-md: 0.75rem;
|
|
--radius-lg: 1rem;
|
|
--radius-xl: 1.25rem;
|
|
--radius-max: 999999999px;
|
|
|
|
--color-tooltip-text: var(--dark-color-contrast);
|
|
--color-tooltip-bg: #000;
|
|
|
|
--color-ad: rgba(125, 75, 162, 0.2);
|
|
--color-ad-raised: rgba(190, 140, 243, 0.5);
|
|
--color-ad-contrast: black;
|
|
--color-ad-highlight: var(--color-purple);
|
|
}
|
|
|
|
.light-mode,
|
|
.light {
|
|
@extend .light-properties;
|
|
}
|
|
|
|
.dark-mode,
|
|
.dark,
|
|
:root[data-theme='dark'] {
|
|
--color-bg: #16181c;
|
|
--color-raised-bg: #26292f;
|
|
--color-super-raised-bg: #40434a;
|
|
--color-button-bg: hsl(222, 13%, 30%);
|
|
--color-button-border: rgba(193, 190, 209, 0.12);
|
|
--color-scrollbar: var(--color-button-bg);
|
|
|
|
--color-divider: var(--color-button-bg);
|
|
--color-divider-dark: #646c75;
|
|
|
|
--color-base: var(--dark-color-base);
|
|
--color-secondary: #96a2b0;
|
|
--color-contrast: var(--dark-color-contrast);
|
|
--color-accent-contrast: #000000;
|
|
|
|
--color-red: #ff496e;
|
|
--color-orange: #ffa347;
|
|
--color-green: #1bd96a;
|
|
--color-blue: #4f9cff;
|
|
--color-purple: #c78aff;
|
|
--color-gray: #9fa4b3;
|
|
|
|
--color-red-highlight: rgba(255, 73, 110, 0.25);
|
|
--color-orange-highlight: rgba(255, 163, 71, 0.25);
|
|
--color-green-highlight: rgba(27, 217, 106, 0.25);
|
|
--color-blue-highlight: rgba(79, 156, 255, 0.25);
|
|
--color-purple-highlight: rgba(199, 138, 255, 0.25);
|
|
--color-gray-highlight: rgba(159, 164, 179, 0.25);
|
|
|
|
--color-red-bg: rgba(255, 73, 110, 0.2);
|
|
--color-orange-bg: rgba(255, 163, 71, 0.2);
|
|
--color-green-bg: rgba(27, 217, 106, 0.2);
|
|
--color-blue-bg: rgba(79, 156, 255, 0.2);
|
|
--color-purple-bg: rgba(199, 138, 255, 0.2);
|
|
|
|
--color-brand: var(--color-green);
|
|
--color-brand-highlight: rgba(27, 217, 106, 0.25);
|
|
--color-brand-shadow: rgba(27, 217, 106, 0.7);
|
|
|
|
--shadow-inset-lg: inset 0px -2px 2px hsla(221, 39%, 11%, 0.1);
|
|
--shadow-inset: inset 0px -2px 2px hsla(221, 39%, 11%, 0.05);
|
|
--shadow-inset-sm: inset 0px -1px 1px hsla(221, 39%, 11%, 0.25);
|
|
|
|
--shadow-raised-lg: 0px 2px 4px hsla(221, 39%, 11%, 0.2);
|
|
--shadow-raised: 0px -2px 4px hsla(221, 39%, 11%, 0.1);
|
|
--shadow-floating: hsla(0, 0%, 0%, 0) 0px 0px 0px 0px, hsla(0, 0%, 0%, 0) 0px 0px 0px 0px,
|
|
hsla(0, 0%, 0%, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
|
|
|
|
--shadow-card: rgba(0, 0, 0, 0.25) 0px 2px 4px 0px;
|
|
|
|
--brand-gradient-bg: linear-gradient(0deg, rgba(14, 35, 19, 0.2) 0%, rgba(55, 137, 73, 0.1) 100%);
|
|
--brand-gradient-strong-bg: linear-gradient(270deg, #09110d 10%, #131f17 100%);
|
|
--brand-gradient-button: rgba(255, 255, 255, 0.08);
|
|
--brand-gradient-border: rgba(155, 255, 160, 0.08);
|
|
--brand-gradient-fade-out-color: linear-gradient(to bottom, rgba(24, 30, 31, 0), #171d1e 80%);
|
|
|
|
--color-button-bg-selected: var(--color-brand-highlight);
|
|
--color-button-text-selected: var(--color-brand);
|
|
|
|
--loading-bar-gradient: linear-gradient(to right, var(--color-brand) 0%, #1ffa9a 100%);
|
|
|
|
--color-platform-fabric: #dbb69b;
|
|
--color-platform-quilt: #c796f9;
|
|
--color-platform-forge: #959eef;
|
|
--color-platform-neoforge: #f99e6b;
|
|
--color-platform-liteloader: #7ab0ee;
|
|
--color-platform-bukkit: #f6af7b;
|
|
--color-platform-bungeecord: #d2c080;
|
|
--color-platform-folia: #a5e388;
|
|
--color-platform-paper: #eeaaaa;
|
|
--color-platform-purpur: #c3abf7;
|
|
--color-platform-spigot: #f1cc84;
|
|
--color-platform-velocity: #83d5ef;
|
|
--color-platform-waterfall: #78a4fb;
|
|
--color-platform-sponge: #f9e580;
|
|
|
|
--hover-brightness: 1.25;
|
|
}
|
|
|
|
.oled-mode {
|
|
@extend .dark-mode;
|
|
--color-bg: #000000;
|
|
--color-raised-bg: #101013;
|
|
--color-button-bg: #222329;
|
|
|
|
--color-ad: #0d1828;
|
|
|
|
--brand-gradient-bg: linear-gradient(
|
|
0deg,
|
|
rgba(22, 66, 51, 0.15) 0%,
|
|
rgba(55, 137, 73, 0.1) 100%
|
|
);
|
|
--brand-gradient-strong-bg: linear-gradient(
|
|
270deg,
|
|
rgba(9, 18, 14, 0.6) 10%,
|
|
rgba(19, 31, 23, 0.5) 100%
|
|
);
|
|
}
|
|
|
|
.retro-mode {
|
|
--brand-gradient-strong-bg: #3a3b38;
|
|
}
|
|
|
|
.experimental-styles-within {
|
|
--color-link: var(--color-blue) !important;
|
|
--color-link-hover: var(--color-blue) !important; // DEPRECATED, use filters in future
|
|
--color-link-active: var(--color-blue) !important; // DEPRECATED, use filters in future
|
|
}
|
|
|
|
.light-experiments {
|
|
--color-bg: #ebebeb;
|
|
--color-raised-bg: #ffffff;
|
|
--color-button-bg: #f5f5f5;
|
|
--color-base: #2c2e31;
|
|
--color-secondary: #484d54;
|
|
--color-accent-contrast: #ffffff;
|
|
}
|
|
|
|
.light-mode,
|
|
.light {
|
|
.experimental-styles-within,
|
|
&.experimental-styles-within {
|
|
@extend .light-experiments;
|
|
}
|
|
}
|
|
|
|
.experimental-styles-within {
|
|
.light-mode,
|
|
.light {
|
|
@extend .light-experiments;
|
|
}
|
|
}
|
|
|
|
.dark-experiments {
|
|
--color-button-bg: #33363d;
|
|
}
|
|
|
|
.dark-mode:not(.oled-mode),
|
|
.dark:not(.oled-mode) {
|
|
.experimental-styles-within,
|
|
&.experimental-styles-within {
|
|
@extend .dark-experiments;
|
|
}
|
|
}
|
|
|
|
.experimental-styles-within {
|
|
.dark-mode:not(.oled-mode),
|
|
.dark:not(.oled-mode) {
|
|
@extend .dark-experiments;
|
|
}
|
|
}
|