RomanNum3ral
/
vert
mirror of https://github.com/VERT-sh/VERT.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update accent colours & mobile logo

This commit is contained in:
JovannMC 2025-02-05 18:21:04 +03:00
parent 4723f864dd
commit a6cbdefc40
No known key found for this signature in database
3 changed files with 18 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/app.scss
View File

@ -30,17 +30,17 @@
@mixin light {
// general
--accent-pink: hsl(303, 73%, 81%);
--accent-red: hsl(348, 71%, 81%);
--accent-purple: hsl(264, 71%, 81%);
--accent-blue: hsl(220, 73%, 81%);
--accent-pink: hsl(302, 100%, 76%);
--accent-red: hsl(348, 100%, 80%);
--accent-purple: hsl(264, 100%, 81%);
--accent-blue: hsl(220, 100%, 78%);
--accent: var(--accent-pink);
// foregrounds
--fg: hsl(0, 0%, 0%);
--fg-muted: hsla(0, 0%, 0%, 0.6);
--fg-on-accent: hsl(0, 0%, 0%);
--fg-on-badge: hsl(0, 0%, 100%);
--fg-on-badge: hsl(0, 0%, 0%);
// backgrounds
--bg: hsl(0, 0%, 95%);
@ -83,7 +83,7 @@
--bg-panel-accented: hsl(0, 0%, 92%);
--bg-separator: hsl(0, 0%, 88%);
--bg-button: var(--bg-panel-accented);
--bg-badge: hsl(0, 0%, 0%);
--bg-badge: var(--accent-pink);
--bg-input: #e0e0e0;
--shadow-panel: 0 2px 4px 0 hsla(0, 0%, 0%, 0.15);
@ -91,10 +91,10 @@
@mixin dark {
// general
--accent-pink: hsl(303, 73%, 81%);
--accent-red: hsl(348, 71%, 81%);
--accent-purple: hsl(264, 71%, 81%);
--accent-blue: hsl(220, 73%, 81%);
--accent-pink: hsl(302, 100%, 76%);
--accent-red: hsl(348, 100%, 80%);
--accent-purple: hsl(264, 100%, 81%);
--accent-blue: hsl(220, 100%, 78%);
--accent: var(--accent-pink);
// foregrounds
@ -144,7 +144,7 @@
--bg-panel-accented: color-mix(in srgb, var(--accent) 12%, transparent);
--bg-separator: hsl(220, 4%, 28%);
--bg-button: hsl(220, 6%, 28%);
--bg-badge: hsl(0, 0%, 100%);
--bg-badge: var(--accent-pink);
--shadow-panel: 0 4px 6px 0 hsla(0, 0%, 0%, 0.15);

11
src/routes/+layout.svelte
View File

@ -132,17 +132,18 @@
<div>
<!-- Mobile logo -->
<div class="flex md:hidden justify-center items-center p-8">
<div
class="flex items-center justify-center w-36 h-20 bg-panel p-4 rounded-2xl"
<a
class="flex items-center justify-center w-36 h-[72px] bg-panel p-4 rounded-[20px] shadow-panel"
href="/"
>
<div
class="w-[120px] h-14 bg-accent rounded-xl flex items-center justify-center"
class="h-14 bg-accent rounded-[14px] flex items-center justify-center"
>
<div class="h-5 w-full">
<div class="w-[128px] h-5">
<Logo />
</div>
</div>
</div>
</a>
</div>
<!-- Desktop navbar -->

2
src/routes/convert/+page.svelte
View File

@ -113,7 +113,7 @@
/>
<div class="w-full flex items-center justify-between">
<button
class="btn p-0 w-14 h-14 {isAudio
class="btn p-0 w-14 h-14 text-black {isAudio
? 'bg-accent-purple'
: 'bg-accent-blue'}"
disabled={!files.ready}