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

11
src/routes/+layout.svelte
View File

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

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

@ -113,7 +113,7 @@
/> />
<div class="w-full flex items-center justify-between"> <div class="w-full flex items-center justify-between">
<button <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-purple'
: 'bg-accent-blue'}" : 'bg-accent-blue'}"
disabled={!files.ready} disabled={!files.ready}