matei/zeroone
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UPD: Less global rounding, more consistent

Browse Source
This commit is contained in:
Robert Kossessa
2024-02-05 02:24:18 +01:00
parent 15007e7dc7
commit 58c9dae65b
6 changed files with 14 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/common/HSVInput.vue
View File

@@ -1,8 +1,8 @@
<template>
<div>
<div
class="flex p-4 font-heading rounded-b-xl border-x border-b border-zinc-800"
:class="{'rounded-t-xl': roundedTop}"
class="flex p-4 font-heading rounded-b-lg border-x border-b border-zinc-800"
:class="{'rounded-t-lg': roundedTop}"
:style="{backgroundColor: color.hex()}">
<div
ref="colorFieldText" class="w-full flex opacity-70"

6
src/components/common/PaletteInput.vue
View File

@@ -3,11 +3,11 @@
class="px-4 py-2"
:style="{background: `linear-gradient(180deg, ${options[currentOption].color.hex()+'11'}, ${options[currentOption].color.hex()+'30'} 25%, ${options[currentOption].color.hex()+'30'} 40%, transparent 60%`}">
<div
class="flex font-heading rounded-t-xl overflow-hidden border-x border-t border-zinc-800">
class="flex font-heading rounded-t-lg overflow-hidden border-x border-t border-zinc-800 bg-zinc-900">
<button
v-for="(option, key) in options" :key="key"
class="flex-1 pt-2 items-center text-center"
:class="currentOption!==key ? 'hover:bg-zinc-800 text-muted-foreground bg-zinc-900' : 'text-black bg-zinc-300 hover:bg-zinc-200'"
class="flex-1 pt-2 items-center text-center rounded-lg"
:class="currentOption!==key ? 'hover:bg-zinc-800 text-muted-foreground' : 'text-black bg-zinc-300 hover:bg-zinc-200'"
@click="currentOption = key">
{{ $t(option.titleKey) }}
<span class="flex h-4 w-full mt-2" :style="{background: option.color.hex()}" />

2
src/components/common/TabSelect.vue
View File

@@ -1,6 +1,6 @@
<template>
<div class="p-2 border-solid border-0 border-b">
<div class="flex rounded-xl overflow-hidden border border-zinc-800">
<div class="flex rounded-lg overflow-hidden border border-zinc-800">
<TabSelectButton
v-for="(option, key) in options" :key="key"
:ref="(el) => buttons[key] = el"

2
src/components/common/TabSelectButton.vue
View File

@@ -1,6 +1,6 @@
<template>
<button
class="flex-1 flex flex-col items-center rounded-xl p-2 gap-2 font-heading transition-all"
class="flex-1 flex flex-col items-center rounded-lg p-2 gap-2 font-heading transition-all"
:class="{'text-black bg-zinc-300 hover:bg-zinc-200': selected,
'hover:bg-zinc-800 text-muted-foreground' : !selected}"
@click="$emit('select'); $refs.title.scramble()">