nomad/alaskar.dev
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Website: Logo colors

Browse source
This commit is contained in:
nomadics9 2025-01-09 18:09:38 +03:00
parent 43a78b96ec
commit 46e5c3d313
3 changed files with 10 additions and 14 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/lib/components/atoms/Logo.svelte
View file

@ -92,7 +92,7 @@
} }
} }
.logo path { .logo path {
fill: #303e35; fill: var(--color--logo-fill);
stroke-width: 7px; stroke-width: 7px;
stroke: var(--color--text); stroke: var(--color--text);
} }

6
src/lib/scss/_themes.scss
View file

@ -25,6 +25,9 @@
@include define-color('post-page-background', #F3FBFC); // Slightly darker for content @include define-color('post-page-background', #F3FBFC); // Slightly darker for content
@include define-color('card-background', #FFFFFF); // Card background @include define-color('card-background', #FFFFFF); // Card background
// Logo
@include define-color('logo-fill', #1C1E26); // Slightly darker for content
// Callout component // Callout component
@include define-color('callout-background', #F4F8FB); // Neutral light background @include define-color('callout-background', #F4F8FB); // Neutral light background
@include define-color('callout-background--info', #D8EFFF); // Info callout background @include define-color('callout-background--info', #D8EFFF); // Info callout background
@ -75,6 +78,9 @@
@include define-color('post-page-background', #181A1B); // Darker for content areas @include define-color('post-page-background', #181A1B); // Darker for content areas
@include define-color('card-background', #24282A); // Cards background @include define-color('card-background', #24282A); // Cards background
// Logo
@include define-color('logo-fill', #00000000); // Darker for content areas
// Callout Backgrounds & Accents // Callout Backgrounds & Accents
@include define-color('callout-background', #181A1B); // Neutral dark background @include define-color('callout-background', #181A1B); // Neutral dark background
@include define-color('callout-background--info', #125A75); // Info callout (cool blue) @include define-color('callout-background--info', #125A75); // Info callout (cool blue)

16
src/routes/(blog-article)/+layout.svelte
View file

@ -78,7 +78,7 @@
</div> </div>
</article> </article>
<div id="branding"> <div id="branding">
<div class="circle-container"> <div>
<svg <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
class="logo" class="logo"
@ -210,16 +210,6 @@
align-items: center; align-items: center;
position: relative; position: relative;
// .circle-container {
// position: relative;
// width: 120px;
// height: 120px;
// background-color: #f0f0f0;
// border-radius: 50%;
// display: flex;
// justify-content: center;
// align-items: center;
// }
.logo { .logo {
display: flex; display: flex;
align-items: center; align-items: center;
@ -228,9 +218,9 @@
height: 250px; height: 250px;
} }
.logo path { .logo path {
stroke: white; stroke: var(--color--text);
stroke-width: 4px; stroke-width: 4px;
fill: black; fill: var(--color--logo-fill);
} }
} }
</style> </style>