Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: Button and Coloring QoLs and hovering problems #24

Merged
merged 8 commits into from
Jan 7, 2024
Merged

fix: Button and Coloring QoLs and hovering problems #24

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
a10dd96
fix: Colors of text and cards failure, found config bugs
MasterLegend2772 Jan 6, 2024
00467f0
feat: Add color and themes to site and fix theme bugs
MasterLegend2772 Jan 6, 2024
67daae9
feat: css bases, themes
TerrifiedPigeon Jan 6, 2024
5687ff1
css base
TerrifiedPigeon Jan 6, 2024
37a9f52
feat: sidebar icon colors
TerrifiedPigeon Jan 6, 2024
4ac94f2
fix: Wording of import export buttons in settings
TerrifiedPigeon Jan 7, 2024
dd8deaa
fix: Button and Coloring QoLs and hovering problems
TerrifiedPigeon Jan 7, 2024
f70caa8
Merge branch 'main' into colors
MasterLegend2772 Jan 7, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions src/lib/components/ui/button/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,16 @@ const buttonVariants = tv({
base: 'inline-flex items-center rounded-md text-sm font-medium whitespace-nowrap ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group',
variants: {
variant: {
default: 'justify-center bg-primary text-primary-foreground hover:bg-primary/90',
default: 'justify-center bg-primary text-primary-foreground hover:bg-fill/20',
destructive:
'justify-center bg-destructive text-destructive-foreground hover:bg-destructive/90',
'justify-center bg-destructive text-destructive-foreground hover:bg-fill/20',
outline:
'justify-center border border-input bg-background hover:bg-accent hover:text-accent-foreground',
secondary: 'justify-center bg-secondary text-secondary-foreground hover:bg-secondary/80',
'justify-center border border-input bg-background hover:bg-accent hover:bg-fill/20',
secondary: 'justify-center bg-secondary text-secondary-foreground hover:bg-fill/20',
ghost: 'justify-center hover:bg-accent hover:text-accent-foreground',
link: 'justify-center text-primary underline-offset-4 hover:underline',
link: 'justify-center text-primary underline-offset-4 hover:bg-fill/20',
sidebar:
'bg-sidebar justify-center ml-0 text-sidebarText lg:justify-start lg:ml-8 hover:text-white hover:bg-primary/90 w-full',
'bg-sidebar justify-center ml-0 text-sidebarText lg:justify-start lg:ml-8 hover:text-white hover:bg-fill/20 w-full',
activeSidebar:
'bg-activeSidebar justify-center ml-0 text-sidebarText/110 lg:justify-start lg:ml-8 hover:text-white hover:bg-primary/90 w-full',
headerSidebar:
Expand All @@ -26,7 +26,7 @@ const buttonVariants = tv({
default: 'h-10 px-4 py-2',
sm: 'h-9 rounded-md px-3',
lg: 'h-11 rounded-md px-8',
icon: 'h-10 w-10'
icon: 'h-10 w-10',
}
},
defaultVariants: {
Expand Down
24 changes: 23 additions & 1 deletion src/routes/+page.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1 +1,23 @@
src/routes/homepage/+page.svelte
<script lang="ts">
import * as Card from '$lib/components/ui/card';
import { Button } from '$lib/components/ui/button';
import { settings } from '$lib/store/global_state';
import { get } from 'svelte/store';
import { type Settings, Convert as SettingsConvertor } from '$lib/structs/settings';
</script>

<div class="col-span-2 row-span-2">
<Card.Root class="size-full text-white flex flex-col">
<Card.Header>
<!--TODO: Replace this with i18n key-->
<Card.Title>Changelog:</Card.Title>
</Card.Header>
<Card.Content class="flex-1">
<p class="whitespace-pre-line">Changelog TXT</p>
</Card.Content>
<Card.Footer class="flex-1 items-end justify-end">
<Button variant="default" class="rounded-xl border-2 border-gray-600">More</Button>
<Button variant="link" class="rounded-xl border-2 border-gray-600 ml-5">Hide</Button>
</Card.Footer>
</Card.Root>
</div>
28 changes: 14 additions & 14 deletions tailwind.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { createThemes } from 'tw-colors';
/* eslint-disable @typescript-eslint/naming-convention */
/** @type {import('tailwindcss').Config} */
const config = {
darkMode: ['class'],
darkMode: ['class'],
content: ['./src/**/*.{html,js,svelte,ts}'],
corePlugins: {
preflight: true
Expand All @@ -27,8 +27,8 @@ const config = {
},
fontFamily: {
sans: [...fontFamily.sans]
}
}
}
},
},
plugins: [
createThemes(
Expand All @@ -45,22 +45,22 @@ const config = {
},
t1: {
border: '#000000',
text: '#ffffff',
background: '#304b42',
foreground: '#13644d',
text: '#FFFFFF',
background: '#304B42',
foreground: '#13644D',
activeSidebar: '#000000',
sidebarText: '#97c9a1',
fill: '#b7e4c7',
sidebar: '#081c15'
sidebarText: '#97C9A1',
fill: '#B7E4C7',
sidebar: '#081C15'
},
t2: {
border: '#000000',
text: '#000000',
background: '#cdab4a',
foreground: '#d2b45e',
activeSidebar: '#c09b28',
sidebarText: '#27200b',
sidebar: '#9e812c'
background: '#CDAB4A',
foreground: '#D2B45E',
activeSidebar: '#C09B28',
sidebarText: '#27200B',
sidebar: '#9E812C'
}
},
{
Expand Down