feat: feedback changes part 1

This commit is contained in:
Diex5 2024-09-27 12:14:49 +02:00
parent 5ed800eac3
commit dcf953862c
21 changed files with 115 additions and 39 deletions

View file

@ -81,6 +81,8 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
text-12px
leading-16px
lg:hidden
md:opacuty-100
opacity-70
>
{{ project.usecases?.join(', ') }}
</p>
@ -118,8 +120,11 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
>
<UnoIcon
i-ic-baseline-language
text="24px app-text-grey"
text="24px app-text-grey hover:app-white"
transition-all
duration-250
/>
</NuxtLink>
<NuxtLink
v-if="projectItem.label[1]"
@ -130,8 +135,10 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
>
<UnoIcon
i-mdi-github
text="24px app-text-grey"
text="24px app-text-grey hover:app-white"
text-27px
transition-all
duration-250
/>
</NuxtLink>
<NuxtLink
@ -143,7 +150,9 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
>
<UnoIcon
i-bi-twitter-x
text="24px app-text-grey"
text="24px app-text-grey hover:app-white"
transition-all
duration-250
/>
</NuxtLink>
</div>
@ -189,7 +198,10 @@ const projectItems: { label: string | string[], type: string, rating?: ProjectRa
<UnoIcon
i-iconoir-internet
text="24px"
text="20px"
md:opacity-100
opacity-70
hover:opacity="100"
/>
</NuxtLink>
<div

View file

@ -29,6 +29,9 @@ function onOptionSelected(value: string | number) {
<HeadlessListboxButton
:id="`headless-listbox-button-${name}`"
class="relative cursor-pointer py-6px px-14px text-left border-2px bg-app-white text-app-black text-xs sm:text-sm sm:leading-6"
hover="bg-app-black text-app-white"
transition="all"
duration-250
:class="{ 'text-app-danger!': isOptionSelected?.value === 'sunset' }"
>
<span class="block truncate mr-8px font">{{ isOptionSelected?.label }} <span

View file

@ -13,6 +13,7 @@
</div>
<div
p-24px
pb-8px
flex
items-center
>

View file

@ -98,6 +98,8 @@ defineExpose({
<ProjectCreateComponentsInput
v-model="description"
lg="w-1/2"
textarea
:textarea-rows="5"
label="Description"
text-area
required

View file

@ -58,6 +58,13 @@ defineExpose({
flex-col
gap-24px
>
<ProjectCreateComponentsSelect
v-model="assetType"
:options="assetCustodyData?.map(c => ({ label: c.name, value: c.id }))"
label="Asset custody type"
placeholder="Select custody type"
hint="How are users fund handled? (non-custody, multisig, pool,...)"
/>
<ProjectCreateComponentsToggle
v-model="openSource"
label="Open source"
@ -69,13 +76,7 @@ defineExpose({
hint="Are developers able to upgrade and change deployed contract?"
/>
</div>
<ProjectCreateComponentsSelect
v-model="assetType"
:options="assetCustodyData?.map(c => ({ label: c.name, value: c.id }))"
label="Asset custody type"
placeholder="Select custody type"
hint="How are users fund handled? (non-custody, multisig, pool,...)"
/>
<ProjectCreateComponentsCategoryDivider
w-full
title="ADDITIONAL INFO"

View file

@ -11,6 +11,7 @@ defineProps<{
justify-between
gap-8px
my-40px
mb-24px
lg="gap-32px"
>
<div

View file

@ -97,6 +97,7 @@ function addOption() {
</HeadlessComboboxLabel>
<div class="relative font-700 mt-2 bg-app-black">
<HeadlessComboboxButton
as="div"
class="relative w-full cursor-pointer p-8px text-left border-2px text-app-white bg-black sm:text-sm sm:leading-6"
:class="error ? 'border-app-danger/50' : 'border-white/30'"
@ -146,7 +147,7 @@ function addOption() {
>
<HeadlessComboboxOptions
lg="w-1/2"
class="w-full absolute z-100 max-h-60 divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white/30"
class="w-full absolute z-100 max-h-60 divide-y-2px border-2px border-t-0 overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm border-white"
>
<div
v-if="filteredOptions.length === 0 && query !== '' && props.canAddNew"

View file

@ -11,8 +11,8 @@ defineProps<{
flex
justify-between
gap-8px
lg:gap-32px
mt-36px
lg:gap-24px
mt-24px
>
<div
flex

View file

@ -12,7 +12,7 @@ const { switcher } = storeToRefs(useData())
const groupCollapsed = ref(false)
const shownProjectsCount = ref(15)
const shownProjectsCount = ref(10)
const shownProjects = computed(() => props.group.projects.slice(0, shownProjectsCount.value))
</script>
@ -41,7 +41,7 @@ const shownProjects = computed(() => props.group.projects.slice(0, shownProjects
/>
<button
type="button"
:class="[groupCollapsed ? 'i-ic-baseline-arrow-drop-up' : 'i-ic-baseline-arrow-drop-down']"
:class="[groupCollapsed ? 'i-ic-baseline-arrow-drop-down' : 'i-ic-baseline-arrow-drop-up']"
text="app-text-grey 24px"
@click="groupCollapsed = !groupCollapsed"
/>
@ -79,6 +79,8 @@ const shownProjects = computed(() => props.group.projects.slice(0, shownProjects
text="12px lg:14px"
leading="24px lg:32px"
font-bold
pt-16px
pb-24px
text-app-text-grey
@click="shownProjectsCount += 15"
>

View file

@ -34,6 +34,8 @@ const cardTitles = ref< { label: string, sortKey: string, togglable?: boolean }[
mb-16px
>
<div
py-8px
flex
items-center
gap-4px
@ -45,6 +47,8 @@ const cardTitles = ref< { label: string, sortKey: string, togglable?: boolean }[
text="12px lg:14px"
leading="16px lg:24px"
whitespace-nowrap
md:mt-0px
mt-4px
>
Project name
</p>
@ -87,6 +91,9 @@ const cardTitles = ref< { label: string, sortKey: string, togglable?: boolean }[
text="12px lg:14px "
leading="16px lg:24px"
whitespace-nowrap
hover="text-app-white"
transition-all
duration-250
>
{{ title.label }}
</p>

View file

@ -45,7 +45,6 @@ const logo = props.project?.logos?.at(0)?.url
relative
>
<NuxtImg
border="1px app-text-grey"
:src="logo ?? '/no-image-1-1.svg'"
class="bg-app-bg-grey object-cover h-full vertical-align[middle] block w-full h-[300px] "
/>
@ -84,7 +83,7 @@ const logo = props.project?.logos?.at(0)?.url
items-center
lg:items-start
justify-between
gap-y="lg:12px 24px"
gap-y="12px"
text-app-text-grey
w-full
>
@ -127,6 +126,8 @@ const logo = props.project?.logos?.at(0)?.url
Usecases:
</h2>
<p
mt-8px
mb-16px
text-app-white
col-span-9
>
@ -142,6 +143,8 @@ const logo = props.project?.logos?.at(0)?.url
order-3
lg:order-2
w-full
md:ml-0px
ml-18px
>
<div
flex
@ -205,11 +208,14 @@ const logo = props.project?.logos?.at(0)?.url
flex-col
lg:flex-row
gap-y-4px
items-center
md:items-center
items-start
>
<p
text="12px lg:16px"
leading="16px lg:24px"
md:ml-0
ml-10px
>
{{ rating.name }}:
</p>
@ -246,7 +252,7 @@ const logo = props.project?.logos?.at(0)?.url
text="16px lg:24px app-white"
leading="24px md:32px"
max-h-="32px md:40px"
max-w="84px"
max-w="md:84px 64px"
w-full
h-full
font-700

View file

@ -74,8 +74,11 @@ defineProps<{
>
Assets used
</h3>
<p leading="20px lg:24px">
{{ project.assets_used?.map((a) => a.toUpperCase()).join(', ') }}
<p
leading="20px lg:24px"
:class=" project.assets_used ? '' : 'opacity-50'"
>
{{ project.assets_used ? project.assets_used?.map((a) => a.toUpperCase()).join(', ') : 'N/A' }}
</p>
</div>
<div>
@ -86,7 +89,10 @@ defineProps<{
>
Native token
</h3>
<p leading="20px lg:24px">
<p
leading="20px lg:24px"
:class=" project.tokens?.length ? '' : 'opacity-50'"
>
{{ project.tokens?.length ? project.tokens[0]?.name : 'N/A' }}
</p>
</div>
@ -98,8 +104,11 @@ defineProps<{
>
Project launch day
</h3>
<p leading="20px lg:24px">
{{ project.product_launch_day || 'N/A'}}
<p
leading="20px lg:24px"
:class=" project.product_launch_day ? '' : 'opacity-50'"
>
{{ project.product_launch_day || 'N/A' }}
</p>
</div>
</div>

View file

@ -32,7 +32,7 @@ withDefaults(defineProps<{ items: ProjectRatingItem[], compact?: boolean }>(), {
>
<div
:class="[item.isValid ? 'i-ic-sharp-thumb-up' : 'i-ic-sharp-thumb-down']"
text-20px
text-16px
mt--4px
/>
{{ item.label }}

View file

@ -16,6 +16,7 @@ defineProps<{
py-12px
px-16px
bg-app-bg-audits-card
hover="brightness-120%"
>
<div
grid

View file

@ -27,6 +27,8 @@ const isSearchFocused = ref(false)
w-full
h-40px
hover:opacity-100
md:max-w-470px
:class="isSearchFocused ? 'opacity-100' : 'opacity-25'"
>
<div

View file

@ -54,7 +54,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
leave-to-class="opacity-0"
>
<HeadlessListboxOptions
class="absolute z-100 max-h-60 w-full divide-y-2px border-2px overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm"
class="absolute md: left--12 z-100 max-h-60 w-150px divide-y-2px border-2px overflow-auto bg-app-black text-app-white focus:outline-none sm:text-sm"
>
<HeadlessListboxOption
v-for="option in props.options"
@ -64,7 +64,7 @@ const selectedValue = useVModel(props, 'modelValue', emits)
:value="option.value"
>
<li
class="w-full relative cursor-pointer select-none py-8px p-16px text-xs sm:text-sm"
class="w-full relative cursor-pointer select-none py-8px p-16px text-sm"
:class="[active ? 'bg-#ffffff1a' : 'text-white']"
>
<span

View file

@ -51,7 +51,19 @@ watch([scrollY, top, y], (newValues, oldValues) => {
<div
app-container
mt-32px
relative
>
<div
md:hidden
block
absolute
z-5
class="bg-gradient-to-r from-transparent to-app-black "
w-50px
h-35px
top-14
right-0
/>
<div
flex
w-full
@ -81,6 +93,7 @@ watch([scrollY, top, y], (newValues, oldValues) => {
flex
items-center
gap-16px
relative
overflow-x-auto
pb-274px
mb--250px

View file

@ -18,6 +18,12 @@ watch(y, (newY, oldY) => {
w-full
>
<Navigation />
<slot />
<div
max-w-1160px
w-full
mx-auto
>
<slot />
</div>
</div>
</template>

View file

@ -274,7 +274,7 @@ const transitionDone = ref(false)
:model-value="selectedTab"
label="Choose category"
:options="tabs.map(t => ({ label: t.label, value: t.value }))"
:border-opacity="30"
:border-opacity="100"
w-full
lg:hidden
block
@ -299,13 +299,13 @@ const transitionDone = ref(false)
<div
border-t-2
class="border-app-white/30"
px-16px
py-24px
px-8px
py-8px
md:py-24px
>
<div
app-container
mb-170px
lg="mb-55px"
mb-55px
>
<ClientOnly>
<Transition
@ -333,7 +333,7 @@ const transitionDone = ref(false)
w-full
flex
flex-col
gap-24px
gap-8px
/>
<Button
v-if="selectedTab !== tabs[tabs.length - 1].value"
@ -351,10 +351,10 @@ const transitionDone = ref(false)
<div
flex
flex-col
gap-16px
gap-10px
justify-center
text-center
fixed
md:fixed
bottom-0
w-full
bg-app-bg-dark_grey

View file

@ -49,7 +49,10 @@ useSeoMeta({
<ProjectTechnology :project="project" />
<ProjectPrivacy :project="project" />
<ProjectSecurity :project="project" />
<ProjectHistory :project="project" />
<ProjectHistory
v-if="project.history"
:project="project"
/>
</div>
</div>
</div>

View file

@ -10,7 +10,7 @@ import { collections } from './unocss.config.collections'
export default defineConfig({
shortcuts: [
{
'app-container': 'px-12px sm:px-1.5rem max-w-1400px m-auto w-full',
'app-container': 'px-12px sm:px-1.5rem max-w-1140px 2xl:max-w-1400px m-auto w-full',
'custom-link': 'text-app-text-grey hover:underline underline-offset-4px text-18px font-400 leading-32px cursor-pointer',
},
{
@ -41,6 +41,12 @@ export default defineConfig({
}),
],
theme: {
extend: {
screens: {
'2xl': '1600px',
},
},
colors: {
app: {
white: '#fff',