artin/sourcegraph
1
0
Fork 0
mirror of https://github.com/sourcegraph/sourcegraph.git synced 2026-02-06 18:51:59 +00:00
Code Issues Packages Projects Releases Wiki Activity

refactor(svelte): Reduce logo complexity (#64274)

Browse Source 
There is no need to have a separate image file for dark mode. The SVG
file can handle color switching itself.


## Test plan

Switched theme in the user menu and in the browser dev tools.
This commit is contained in:
Felix Kling 2024-08-05 18:19:32 +02:00 committed by GitHub
parent 44d8512779
commit 4e5ea2a082
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 19 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
client/web-sveltekit/src/lib/assets/sourcegraph-logo.svg Normal file
View File

@ -0,0 +1,17 @@
<svg viewBox="0 0 304 52" fill="none" xmlns="http://www.w3.org/2000/svg">
<style>
:root {
--text-color: #000;
}
@media (prefers-color-scheme: dark) {
:root {
--text-color: #fff;
}
}
</style>
<path d="M30.8 51.8c-2.8.5-5.5-1.3-6-4.1L17.2 6.2c-.5-2.8 1.3-5.5 4.1-6s5.5 1.3 6 4.1l7.6 41.5c.5 2.8-1.4 5.5-4.1 6z" fill="#FF5543"/>
<path d="M10.9 44.7C9.1 45 7.3 44.4 6 43c-1.8-2.2-1.6-5.4.6-7.2L38.7 8.5c2.2-1.8 5.4-1.6 7.2.6 1.8 2.2 1.6 5.4-.6 7.2l-32 27.3c-.7.6-1.6 1-2.4 1.1z" fill="#A112FF"/>
<path d="M46.8 38.1c-.9.2-1.8.1-2.6-.2L4.4 23.8c-2.7-1-4.1-3.9-3.1-6.6 1-2.7 3.9-4.1 6.6-3.1l39.7 14.1c2.7 1 4.1 3.9 3.1 6.6-.6 1.8-2.2 3-3.9 3.3z" fill="#00CBEC"/>
<path d="M80 33.1c0-1-.4-1.8-1.1-2.4-.7-.6-1.6-1.2-2.7-1.7s-2.3-1-3.6-1.6c-1.3-.5-2.5-1.2-3.6-2s-2-1.8-2.7-3c-.7-1.2-1.1-2.7-1.1-4.5 0-1.6.3-3 .8-4.1.5-1.2 1.3-2.1 2.3-2.9 1-.8 2.1-1.3 3.5-1.7 1.3-.4 2.8-.6 4.5-.6 1.9 0 3.7.2 5.3.5 1.6.3 3.1.8 4.1 1.4l-2 5.3c-.7-.4-1.7-.8-3.1-1.1-1.4-.4-2.8-.5-4.4-.5-1.5 0-2.6.3-3.4.9-.8.6-1.2 1.4-1.2 2.4 0 .9.4 1.7 1.1 2.3.7.6 1.6 1.2 2.7 1.7s2.3 1.1 3.6 1.6c1.3.6 2.5 1.2 3.6 2s2 1.8 2.7 2.9c.7 1.2 1.1 2.6 1.1 4.3 0 1.7-.3 3.2-.9 4.5-.6 1.3-1.4 2.3-2.4 3.1-1 .8-2.3 1.5-3.8 1.9-1.5.4-3.1.6-4.9.6-2.3 0-4.4-.2-6.1-.7-1.8-.4-3.1-.9-3.9-1.3l2-5.4c.3.2.8.4 1.3.6.5.2 1.2.4 1.8.6.7.2 1.4.3 2.2.5.8.1 1.5.2 2.3.2 1.9 0 3.3-.3 4.3-1 1.2-.6 1.7-1.5 1.7-2.8zM89.1 30.2c0-3.9 1-7 2.9-9.1 1.9-2.1 4.6-3.2 8.1-3.2 1.9 0 3.5.3 4.8.9 1.4.6 2.5 1.4 3.4 2.5.9 1.1 1.6 2.4 2 3.9.4 1.5.7 3.2.7 5 0 3.9-1 7-2.9 9.1-1.9 2.1-4.6 3.2-8.1 3.2-1.9 0-3.5-.3-4.8-.9-1.4-.6-2.5-1.4-3.4-2.5-.9-1.1-1.6-2.4-2-3.9-.5-1.5-.7-3.2-.7-5zm6.2 0c0 1 .1 2 .3 2.8.2.9.5 1.6.8 2.3.4.7.9 1.2 1.5 1.5.6.4 1.3.5 2.2.5 1.6 0 2.8-.6 3.5-1.7.8-1.1 1.2-3 1.2-5.4 0-2.1-.4-3.9-1.1-5.2-.7-1.3-1.9-2-3.6-2-1.5 0-2.7.6-3.5 1.7-.9 1.1-1.3 2.9-1.3 5.5zM120.1 18.6v13.2c0 1.9.2 3.3.7 4.1.4.8 1.3 1.3 2.6 1.3 1.1 0 2.1-.3 2.9-1 .8-.7 1.3-1.5 1.7-2.5v-15h6v16.2c0 1.3.1 2.5.2 3.7.1 1.2.3 2.3.6 3.3h-4.6l-1.1-3.4h-.2c-.7 1.2-1.7 2.2-3 2.9-1.3.8-2.8 1.2-4.5 1.2-1.2 0-2.2-.2-3.2-.5-.9-.3-1.7-.8-2.3-1.5-.6-.7-1.1-1.7-1.4-2.9-.3-1.2-.5-2.8-.5-4.7V18.6h6.1zM151.5 24.2c-1-.3-1.8-.5-2.6-.5-1.1 0-2 .3-2.7.9-.7.6-1.2 1.3-1.5 2.2v15h-6V18.6h4.7l.7 3.1h.2c.5-1.1 1.2-2 2.1-2.7.9-.7 2-.9 3.2-.9.8 0 2.5.4 3.4.8l-1.5 5.3zM171.1 40.4c-.9.7-2.1 1.2-3.4 1.6-1.3.4-2.7.5-4.1.5-1.9 0-3.4-.3-4.7-.9-1.3-.6-2.3-1.4-3.1-2.5-.8-1.1-1.4-2.4-1.7-3.9-.4-1.5-.5-3.2-.5-5 0-3.9.9-7 2.7-9.1 1.8-2.1 4.3-3.2 7.7-3.2 1.7 0 3.1.1 4.1.4 1 .3 2 .6 2.8 1.1l-1.4 4.9c-.7-.3-1.4-.6-2.1-.8-.7-.2-1.5-.3-2.4-.3-1.7 0-2.9.6-3.8 1.7-.9 1.1-1.3 2.9-1.3 5.3 0 1 .1 1.9.3 2.7.2.8.5 1.6 1 2.2.4.6 1 1.1 1.7 1.5.7.4 1.5.5 2.4.5 1 0 1.9-.1 2.6-.4.7-.3 1.3-.6 1.9-1l1.3 4.7zM192.4 39.8c-.9.7-2.2 1.4-3.8 1.9-1.6.5-3.3.8-5.1.8-3.8 0-6.5-1.1-8.2-3.3-1.7-2.2-2.6-5.2-2.6-9 0-4.1 1-7.2 2.9-9.2 1.9-2 4.7-3.1 8.2-3.1 1.2 0 2.3.2 3.4.5s2.1.8 3 1.5c.9.7 1.6 1.7 2.1 2.9s.8 2.7.8 4.5c0 .7 0 1.3-.1 2.1-.1.7-.2 1.5-.3 2.3h-14c.1 2 .6 3.4 1.5 4.4.9 1 2.4 1.5 4.4 1.5 1.3 0 2.4-.2 3.4-.6 1-.4 1.8-.8 2.3-1.2l2.1 4zm-8.7-17.1c-1.6 0-2.8.5-3.5 1.4-.8.9-1.2 2.2-1.4 3.8h8.6c.1-1.7-.1-3-.8-3.9-.5-.8-1.5-1.3-2.9-1.3zM216.6 41.8c0 3.4-.9 5.9-2.7 7.5-1.8 1.6-4.4 2.4-7.7 2.4-2.2 0-4-.2-5.3-.5-1.3-.3-2.3-.6-2.9-1l1.3-4.8c.7.3 1.5.6 2.5.8 1 .2 2.1.4 3.5.4 2.1 0 3.5-.5 4.3-1.4.8-.9 1.1-2.2 1.1-3.8V40h-.2c-1.1 1.5-3 2.2-5.8 2.2-3 0-5.2-.9-6.7-2.8s-2.2-4.8-2.2-8.7c0-4.2 1-7.3 3-9.4 2-2.1 4.9-3.2 8.6-3.2 2 0 3.8.1 5.3.4 1.5.3 2.8.6 3.8 1l.1 22.3zm-10.2-4.5c1.2 0 2.1-.3 2.7-.8.6-.5 1.1-1.3 1.5-2.4V23.7c-1-.4-2.2-.6-3.6-.6-1.6 0-2.8.6-3.6 1.7-.9 1.2-1.3 3-1.3 5.6 0 2.3.4 4 1.1 5.2.7 1.2 1.8 1.7 3.2 1.7zM234.1 24.2c-1-.3-1.8-.5-2.6-.5-1.1 0-2 .3-2.7.9-.7.6-1.2 1.3-1.5 2.2v15h-6V18.6h4.7l.7 3.1h.2c.5-1.1 1.2-2 2.1-2.7.9-.7 2-.9 3.2-.9.8 0 1.7.2 2.7.5l-.8 5.6zM237 19.7c1.2-.6 2.1-.8 3.8-1.1 1.7-.3 3.5-.5 5.3-.5 1.6 0 3 .2 4 .6 1 .4 1.9.9 2.6 1.7.6.7 1.1 1.6 1.3 2.6.3 1 .4 2.1.4 3.3 0 1.4 0 2.7-.1 4.1-.1 1.4-.1 2.7-.2 4.1 0 1.3 0 2.6.1 3.9.1 1.3.3 2.4.7 3.6H250l-1-3.2c-.6 1-1.5 1.8-2.6 2.5s-2.5 1-4.3 1c-1.1 0-2.1-.2-2.9-.5-.9-.3-1.6-.8-2.2-1.4-.6-.6-1.1-1.3-1.4-2.1-.3-.8-.5-1.7-.5-2.8 0-1.4.3-2.6 1-3.6s1.5-1.8 2.7-2.4c1.2-.6 2.6-1 4.3-1.3 1.7-.3 3.5-.3 5.6-.2.2-1.7.1-3-.4-3.7-.5-.8-1.5-1.1-3.1-1.1-1.2 0-2.5.1-3.8.4-1.3.3-1.9.4-2.7.8l-1.7-4.7zm7.1 17.5c1.2 0 2.2-.3 2.9-.8.7-.5 1.2-1.1 1.6-1.7v-3c-1-.1-1.9-.1-2.8 0-.9.1-1.7.2-2.3.4-.6.2-1.2.5-1.6.9-.4.4-.6.9-.6 1.5 0 .9.3 1.5.8 2 .4.5 1.1.7 2 .7zM259.1 18.6h4.4l.7 2.8h.2c.8-1.2 1.8-2 2.9-2.6 1.1-.6 2.4-.8 4-.8 2.9 0 5.1.9 6.6 2.8s2.2 4.8 2.2 8.9c0 2-.2 3.8-.7 5.4-.5 1.6-1.2 3-2.1 4.1-.9 1.1-2 2-3.3 2.6-1.3.6-2.8.9-4.5.9-1 0-1.8-.1-2.4-.2-.6-.1-1.2-.4-1.9-.7v9.5h-6V18.6h-.1zm10.3 4.4c-1.2 0-2.1.3-2.8.9-.7.6-1.2 1.5-1.6 2.7v9.7c.4.3.9.6 1.4.8.5.2 1.2.3 2 .3 1.7 0 3-.6 3.9-1.8.9-1.2 1.3-3.2 1.3-6.1 0-2-.3-3.6-1-4.7-.6-1.2-1.7-1.8-3.2-1.8zM297.6 41.8V28.6c0-1.9-.3-3.3-.8-4.1-.5-.8-1.5-1.3-2.9-1.3-1 0-2 .3-2.8 1-.9.7-1.4 1.6-1.7 2.7v14.8h-6V9.3h6v11.9h.2c.7-1 1.7-1.8 2.7-2.4 1.1-.6 2.5-.9 4.1-.9 1.2 0 2.2.2 3.1.5.9.3 1.7.8 2.3 1.5.6.7 1.1 1.7 1.3 2.9.2 1.2.4 2.7.4 4.5v14.5h-5.9z" fill="var(--text-color)"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 5.0 KiB

3
client/web-sveltekit/src/lib/images.ts
View File

@ -1,3 +0,0 @@
export { default as logoLight } from '$root/client/web/dist/img/sourcegraph-logo-light.svg'
export { default as logoDark } from '$root/client/web/dist/img/sourcegraph-logo-dark.svg'
export { default as mark } from '$root/client/web/dist/img/sourcegraph-mark.svg'

5
client/web-sveltekit/src/routes/search/SearchHome.svelte
View File

@ -1,12 +1,11 @@
<script lang="ts">
import { onMount, setContext } from 'svelte'
import { logoDark, logoLight } from '$lib/images'
import logo from '$lib/assets/sourcegraph-logo.svg'
import SearchInput from '$lib/search/input/SearchInput.svelte'
import type { QueryStateStore } from '$lib/search/state'
import type { SearchPageContext } from '$lib/search/utils'
import { TELEMETRY_SEARCH_SOURCE_TYPE } from '$lib/shared'
import { isLightTheme } from '$lib/stores'
import { TELEMETRY_RECORDER } from '$lib/telemetry'
import SearchHomeNotifications from './SearchHomeNotifications.svelte'
@ -32,7 +31,7 @@
<section>
<div class="content">
<img class="logo" src={$isLightTheme ? logoLight : logoDark} alt="Sourcegraph Logo" />
<img class="logo" src={logo} alt="Sourcegraph Logo" />
<div class="search">
<SearchInput {queryState} autoFocus onSubmit={handleSubmit} />
<SearchHomeNotifications />